.tail_wrapper{margin-top: 0 !important;} .w100p {width: 100%;} html { scroll-padding-top: 140px; scroll-behavior: smooth; /* 부드러운 스크롤 효과 */ } #wrap{ overflow-x: hidden;} .ebookinfo {border-bottom: 1px solid #dddddd;} .ebook_menu > div {margin:auto; max-width: 1400px; } .ebook_menu div a {font-size: 18px; text-align: center;} .ebook_slide1 {position: relative;} .ebook_slide1 li {position: relative; background-position: center; height: 500px;} .ebook_slide1 .btn {width: 410px; text-align: center;} .ebook_slide1 .btn a {display: inline-block; border: 1px #ffffff solid; border-radius: 50px; background-color: #ffffff; color: #1a213a; font-size: 13px; padding: 6px 22px; margin: 20px 10px; text-decoration: none; transition: background 0.2s ease-in-out 0s; } .ebook_slide1 .btn a:hover {background-color: #14273c; color: #ffffff; border: 1px solid #ffffff; } .ebook_menu { border-bottom: #dddddd solid 1px; } .ebook_menu ul {max-width: 1400px; margin: auto; display: flex; justify-content: space-around; align-items: center; } .ebook_menu ul li {display: inline-block; text-align: center;} .ebook_menu ul li a {font-size: 18px; padding: 20px 0 18px; display: inline-block; font-family: 'Pretendard', sans-serif; font-weight: 600; position: relative; } .ebook_menu ul li a:hover{color: #391de5;} .ebook_menu ul li a::after {content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 3px; background-color: #391de5; transition: all 0.2s ease;} .ebook_menu ul li a:hover::after{width: 100%;} .ebook_slide1 .inner {width: 100%; max-width: 1400px; margin: auto; padding: 50px 15px; text-align: left; } .ebook_slide1 .inner h3 {font-size: 45px;font-weight: 700; font-family: 'Paperlogy'; line-height: 60px; margin: 10px 0 10px -5px;} .ebook_slide1 .inner h3 span {font-size: 0.8em;} .ebook_slide1 .inner h4 {font-size: 35px; margin: 20px 0 0; color: #ffffff;} .ebook_slide1 .text_white , .ebook_slide1 .text_white p {color: #ffffff;} .ebook_slide1 .inner .bar {width: 80%; max-width: 600px; height: 2px; margin: 10px 0 20px; } .ebook_slide1 .inner .tag {margin-bottom: 10px;} .ebook_slide1 .inner .tag span {font-size: 18px; margin-right: 10px; font-family: 'Paperlogy';} .ebook_slide1 .inner p {font-size:18px; padding-top: 10px; } .ebook_slide1 .text_white .bar {background-color: #ffffff;} .ebook_slide1 .inner a {display: inline-block; margin-top: 20px; margin-right: 20px; padding: 4px 22px; border-radius: 50px; font-size: 16px; box-shadow: 1px 5px 5px #00000040;} .ebook_slide1 .inner a.color1 {background-color: #4e4962 ; color: #ffffff;} .ebook_slide1 .inner a.color1:hover {background-color: #4e4962 } .ebook_slide1 .inner a.color2 {background-color: #4c85e2 ; color: #ffffff;} .ebook_slide1 .inner a.color2:hover {background-color: #3466b7 } .ebook_slide1 .inner a.color3 {background-color: #475c5e ; color: #ffffff;} .ebook_slide1 .inner a.color3:hover {background-color: #274042 } #section1 {position:relative; max-width: 1400px; margin: 0px auto; text-align: left; padding: 100px 0; } #section1 h3 {font-size: 40px; font-family: 'Pretendard', sans-serif; font-weight: 700; margin: 0; } #section1 p.tag {padding: 10px 0;} #section1 p.tag span {font-size: 18px; margin-right: 10px; color: #555555; } #section1 .ebook_slide2 {width: 100%; margin-top: 50px; position: relative; } #section1 .ebook_slide2::after{display:block; position: absolute; width: 1000px; height: 500px; background-color: #ffffff; content: ""; top: -30px; right: 101%; z-index: 100;} #section1 .ebook_slide2 .swiper-slide {aspect-ratio: 1; position: relative; border: 1px solid #dddddd; border-radius: 30px; overflow: hidden; transition: all 0.3s ease; } #section1 .ebook_slide2 .swiper-slide img {width: 100%;} #section1 .ebook_slide2 .swiper-slide .tit {background-color: #ffffff; color: #222222; padding: 30px 0 0 30px; width: 100%; height: 130px; font-size:30px; font-weight: 600; border-bottom: 1px solid #dddddd; font-family: 'Pretendard', sans-serif; transition: all 0.2s ease;} #section1 .ebook_slide2 .swiper-slide .tit p{ font-size: 20px; font-weight: 400; font-family: 'Pretendard', sans-serif;margin-top: 10px;} #section1 .ebook_slide2 .swiper-slide:hover{box-shadow: 1px 4px 12px 7px #00000020;} #section1 .ebook_slide2 .swiper-slide:hover .tit {background-color: #7e36f9; color: #ffffff; } #section1 .ebook_slide2 .swiper-slide:hover .tit p { color: #ffffff; } #section1 .ebook_slide2 .slide2-button-next {width: 40px; background: #7e36f9 url(/images/icon/icon_triangle_next.svg) 10px center no-repeat; background-size: 60%; aspect-ratio: 1; padding: 10px; border-radius: 30px; cursor: pointer; position: absolute; right: 0px; top: -120px;} #section1 .ebook_slide2 .slide2-button-prev {width: 40px; background: #7e36f9 url(/images/icon/icon_triangle_prev.svg) 6px center no-repeat; background-size: 60%; aspect-ratio: 1; padding: 10px; border-radius: 30px; cursor: pointer; position: absolute; right: 50px; top: -120px;} #section1 .ebook_slide2 .slide2-button-next img, #section1 .ebook_slide2 .slide2-button-prev img{width: 100%;} #section1 a.btn_ebookportfolio { display: block; width: fit-content; margin: 50px auto; padding: 8px 24px; color: #ffffff; font-size: 20px; background: linear-gradient(to right, #4783ff, #5615e1); border: none; text-align: center; text-decoration: none; border-radius: 50px; box-shadow: 1px 4px 12px 7px #00000020; } #section2 {background-color: #f6f3fb; padding: 100px 0; } #section2 h3 {font-size: 40px; font-family: 'Pretendard', sans-serif; font-weight: 700; } #section2 h3 span{display:inline-block; position: relative;} #section2 h3 span::after{content: ""; width: 100%; height: 15px; background-color: #e4cefd; position: absolute; left: 0; bottom: 0; z-index: 0; mix-blend-mode: multiply; } #section2 > p{font-size: 14px; text-align: center;margin-bottom: 50px;} .funtion_icon {display: grid; gap: 20px 0; max-width: 1400px; min-width: 1100px; margin: auto; grid-template-columns: repeat(10, 1fr); /* 한 줄에 10개 아이콘 */ grid-template-rows: repeat(2, auto); /* 2줄로 설정 */ } .funtion_icon .tab{ text-align: center; height: 80px; /* 섬네일의 높이 */ object-fit: cover; /* 이미지가 섬네일에 맞게 잘리도록 */ background-size: 50px; background-position: center top; background-repeat: no-repeat; cursor: pointer; padding-top: 60px; font-size: 16px; font-weight: 500; font-family: 'Pretendard', sans-serif; } .funtion_icon .tab01 {background-image: url(/images/ebookinfo/icon_01.png); } .funtion_icon .tab01.on, .funtion_icon .tab01:hover, .funtion_icon .tab01.active{background-image:url(/images/ebookinfo/iconover_01.png); } .funtion_icon .tab02 {background-image: url(/images/ebookinfo/icon_03.png);} .funtion_icon .tab02.on, .funtion_icon .tab02:hover, .funtion_icon .tab02.active {background-image: url(/images/ebookinfo/iconover_03.png);} .funtion_icon .tab03 {background-image: url(/images/ebookinfo/icon_05.png);} .funtion_icon .tab03.on, .funtion_icon .tab03:hover, .funtion_icon .tab03.active {background-image: url(/images/ebookinfo/iconover_05.png);} .funtion_icon .tab04 {background-image: url(/images/ebookinfo/icon_20.png);} .funtion_icon .tab04.on, .funtion_icon .tab04:hover, .funtion_icon .tab04.active {background-image: url(/images/ebookinfo/iconover_20.png);} .funtion_icon .tab05 {background-image: url(/images/ebookinfo/icon_06.png);} .funtion_icon .tab05.on, .funtion_icon .tab05:hover, .funtion_icon .tab05.active {background-image: url(/images/ebookinfo/iconover_06.png);} .funtion_icon .tab06 {background-image: url(/images/ebookinfo/icon_07.png);} .funtion_icon .tab06.on, .funtion_icon .tab06:hover, .funtion_icon .tab06.active {background-image: url(/images/ebookinfo/iconover_07.png);} .funtion_icon .tab07 {background-image: url(/images/ebookinfo/icon_10.png);} .funtion_icon .tab07.on, .funtion_icon .tab07:hover, .funtion_icon .tab07.active {background-image: url(/images/ebookinfo/iconover_10.png);} .funtion_icon .tab08 {background-image: url(/images/ebookinfo/icon_09.png);} .funtion_icon .tab08.on, .funtion_icon .tab08:hover, .funtion_icon .tab08.active {background-image: url(/images/ebookinfo/iconover_09.png);} .funtion_icon .tab09 {background-image: url(/images/ebookinfo/icon_13.png);} .funtion_icon .tab09.on, .funtion_icon .tab09:hover, .funtion_icon .tab09.active {background-image: url(/images/ebookinfo/iconover_13.png);} .funtion_icon .tab10 {background-image: url(/images/ebookinfo/icon_21.png);} .funtion_icon .tab10.on, .funtion_icon .tab10:hover, .funtion_icon .tab10.active {background-image: url(/images/ebookinfo/iconover_21.png);} .funtion_icon .tab11 {background-image: url(/images/ebookinfo/icon_22.png);} .funtion_icon .tab11.on, .funtion_icon .tab11:hover, .funtion_icon .tab11.active {background-image: url(/images/ebookinfo/iconover_22.png);} .funtion_icon .tab12 {background-image: url(/images/ebookinfo/icon_02.png);} .funtion_icon .tab12.on, .funtion_icon .tab12:hover, .funtion_icon .tab12.active {background-image: url(/images/ebookinfo/iconover_02.png);} .funtion_icon .tab13 {background-image: url(/images/ebookinfo/icon_04.png);} .funtion_icon .tab13.on, .funtion_icon .tab13:hover, .funtion_icon .tab13.active {background-image: url(/images/ebookinfo/iconover_04.png);} .funtion_icon .tab14 {background-image: url(/images/ebookinfo/icon_23.png);} .funtion_icon .tab14.on, .funtion_icon .tab14:hover, .funtion_icon .tab14.active {background-image: url(/images/ebookinfo/iconover_23.png);} .funtion_icon .tab15 {background-image: url(/images/ebookinfo/icon_11.png);} .funtion_icon .tab15.on, .funtion_icon .tab15:hover, .funtion_icon .tab15.active {background-image: url(/images/ebookinfo/iconover_11.png);} .funtion_icon .tab16 {background-image: url(/images/ebookinfo/icon_08.png);} .funtion_icon .tab16.on, .funtion_icon .tab16:hover, .funtion_icon .tab16.active {background-image: url(/images/ebookinfo/iconover_08.png);} .funtion_icon .tab17 {background-image: url(/images/ebookinfo/icon_12.png);} .funtion_icon .tab17.on, .funtion_icon .tab17:hover, .funtion_icon .tab17.active {background-image: url(/images/ebookinfo/iconover_12.png);} .funtion_icon .tab18 {background-image: url(/images/ebookinfo/icon_14.png);} .funtion_icon .tab18.on, .funtion_icon .tab18:hover, .funtion_icon .tab18.active {background-image: url(/images/ebookinfo/iconover_14.png);} .funtion_icon .tab19 {background-image: url(/images/ebookinfo/icon_24.png);} .funtion_icon .tab19.on, .funtion_icon .tab19:hover, .funtion_icon .tab19.active {background-image: url(/images/ebookinfo/iconover_24.png);} .funtion_icon .tab20 {background-image: url(/images/ebookinfo/icon_18.png);} .funtion_icon .tab20.on, .funtion_icon .tab20:hover, .funtion_icon .tab20.active {background-image: url(/images/ebookinfo/iconover_18.png);} .funtion_slide_wrap { max-width: 1400px; min-width: 1100px; margin: auto; gap: 10px 30px; display: flex; position: relative; justify-content: space-between; align-items: center; } .funtion_slide_wrap > div {overflow: hidden; } .funtion_slide1{border: 25px solid #5a5a5c; border-radius: 30px; width: 830px; margin: 30px 0; aspect-ratio: 83 / 47; position: relative; } .funtion_slide2 {background-color: #ffffff; box-shadow: 1px 5px 5px 2px #7e36f920; border-radius: 30px; text-align: left; width: 500px; aspect-ratio: 50 / 47; padding: 50px 10px 30px 35px; box-sizing: border-box;} .funtion_slide1, .funtion_slide2{overflow: hidden; } .funtion_slide1 .swiper-slide {background-color: #ffffff;} .funtion_slide2 .swiper-slide {background-color: #ffffff;} .funtion_slide1 .swiper-slide img {width: 100%;} .funtion_slide2 h4 {font-size: 20px; font-weight: 600; font-family: 'Pretendard', sans-serif; margin: 0;} .funtion_slide2 p{ font-family: 'Pretendard', sans-serif; font-size: 20px; line-height: 1.5em;} .funtion_slide2 p.subtit_funtion {font-size: 30px; font-weight: 700; margin-bottom: 20px; } .funtion_slide2 a {display: inline-block; width: fit-content; margin-top: 10px; padding: 6px 18px 8px 25px; color: #ffffff; font-size: 18px; background: linear-gradient(to right, #4783ff, #9957ff); text-align: center; border-radius: 50px; } .funtion_slide2 a span {display: inline-block; width: 20px; aspect-ratio: 1 / 1; background: url(/images/chevron-rightw.svg) no-repeat; background-size: 100%; margin-top: 4px; margin-left: 5px; vertical-align: top;} .funtion_slide_wrap .funtion-button-prev {position: absolute; left: -19px; top: calc(50% - 25px); width: 50px; aspect-ratio: 1 / 1; padding: 5px; background: #ffffff; border-radius: 30px; z-index: 100; cursor: pointer; box-shadow: 1px 5px 5px 2px #34343420; } .funtion_slide_wrap .funtion-button-next {position: absolute; left: 57%; top: calc(50% - 25px); width: 50px; aspect-ratio: 1 / 1; padding: 5px; background: #ffffff; border-radius: 30px; z-index: 100; cursor: pointer; box-shadow: 1px 5px 5px 2px #34343420; } .funtion_slide_wrap .funtion-button-prev img, .funtion_slide_wrap .funtion-button-next img {width: 100%;} #section3 {background: #ffffff; padding: 100px 0; max-width: 1400px; min-width: 1100px; text-align: center;} #section3 h3 {font-size: 40px; font-weight: 700; font-family: 'Pretendard', sans-serif; margin: 0; text-align: center; color: #333333;} #section3 h3 span {color: #9829ea;} #section3 img {width: 90%; max-width: 1200px; } #section4 {background: linear-gradient(to bottom, #f3eafd, #eceefd); padding: 120px 0 150px; } #section4 .inner { max-width: 1400px; min-width: 1100px; margin: auto; text-align: left; } #section4 h3 {font-size: 40px; font-weight: 700; font-family: 'Pretendard', sans-serif; margin-bottom: 50px;} #section4 ul { display: flex; justify-content: space-between; align-items: center; gap : 30px; position: relative;} #section4 ul::after {position: absolute; content: ""; width: 90%; height: 3px; background-color: #ffffff; left: 0; top: 50%; z-index: 0; } #section4 ul li {flex: 1; background-color: #ffffff; box-shadow: 1px 5px 5px 2px #1d1d1d10; border-radius: 12px; padding: 70px 30px 25px; position: relative; font-size: 22px; font-family: 'Pretendard', sans-serif; font-weight: 600; z-index: 1;} #section4 ul li:nth-child(1){background: #ffffff url(/images/ebookinfo/stepicon01.png) 90% 80% no-repeat; background-size: 50px;} #section4 ul li:nth-child(2){background: #ffffff url(/images/ebookinfo/stepicon02.png) 90% 80% no-repeat; background-size: 50px;} #section4 ul li:nth-child(3){background: #ffffff url(/images/ebookinfo/stepicon03.png) 90% 80% no-repeat; background-size: 50px;} #section4 ul li:nth-child(4){background: #ffffff url(/images/ebookinfo/stepicon04.png) 90% 80% no-repeat; background-size: 50px;} #section4 ul li p{position: absolute; left: 30px; top: 0; background-color: #7e36f9; text-align: center; padding: 8px 16px; border-bottom-right-radius: 6px; border-bottom-left-radius: 6px; color: #ffffff; font-size: 18px; font-weight: 600; font-family: 'Pretendard', sans-serif; } #section5 {padding: 100px 0;} #section5 .inner { max-width: 1400px; min-width: 1100px; margin: auto; text-align: left; } #section5 .tit_whyebook {padding: 80px 0 80px 140px; background: linear-gradient(to right, #5750ff, #ab4bff); border-radius: 24px; position: relative;; margin-bottom: 100px;} #section5 .tit_whyebook::after{content: ""; width: 230px; height: 250px; background: url(/images/ebookinfo/stepicon05.png) top no-repeat; background-size: 100%; position: absolute; top: 10px; right: 130px; opacity: 0.5;} #section5 .tit_whyebook::before{content: "";position: absolute; bottom: -40px; left: 50%; width: 1px; height: 40px; background-color: #7e37f9; } #section5 .tit_whyebook h3 {font-size: 45px; color: #ffffff; font-family: 'Pretendard', sans-serif; font-weight: 700;} #section5 ul.tree-container { display: flex; justify-content: center; gap: 20px; position: relative;} #section5 ul.tree-container::before { content: ""; position: absolute; top: -60px; left: 50%; width: calc(100% - 25% + 15px); height: 1px; background-color: #7e37f9; transform: translateX(-50%); } #section5 ul.tree-container li { list-style: none; width: calc(25% - 15px); text-align: left; padding: 25px; border-radius: 10px;; border: 1px solid #cccccc; position: relative; background: white; } #section5 ul.tree-container li span{ display: block; font-size: 17px; color: #777777; } #section5 ul.tree-container li h4{ font-size: 24px; font-weight: 600; font-family: 'Pretendard', sans-serif; padding: 10px 0; } #section5 ul.tree-container li p.tag{ display: inline-block; font-size: 14px; border: #dddddd 1px solid; padding: 4px 10px; margin-right: 5px; margin-bottom: 0; font-family: 'Pretendard', sans-serif; border-radius: 15px; color: #9574ce; font-weight: 600; } #section5 ul.tree-container li::before { content: ""; position: absolute; top: -60px; left: 50%; width: 0.5px; height: 60px; background-color: #7e37f9; transform: translateX(-50%); } #section5 ul.tree-container li::after { content: ""; position: absolute; top: -15px; left: 50%; width: 30px; height: 30px; border: 10px solid #d4bbff; border-radius: 15px; background-color: #7e37f9; transform: translateX(-50%); } @media (max-width: 1200px) { #section1 {padding-left: 14px;} #section1 h3 {font-size: 32px;} #section1 .ebook_slide2 .swiper-slide .tit {font-size: 24px;} #section2 h3 {font-size: 32px;} .funtion_slide_wrap {padding: 0 14px;} .funtion_slide2 h4 {font-size: 20px; } .funtion_slide2 p.subtit_funtion {font-size: 25px; } .funtion_slide2 p {font-size: 18px;} .funtion_slide2 a {font-size: 16px; padding: 3px 10px 4px 14px; } #section3 h3 {font-size: 32px; } #section4 h3 {font-size: 32px;} #section4 .inner {padding: 0 14px; } #section4 ul li {font-size: 18px;} #section4 ul li p {font-size: 15px;} }