/* BASIC css start */ @import url('https://fonts.googleapis.com/css?family=Cardo|Rozha+One|Lora:400,700|Black+Han+Sans|Do+Hyeon|Nanum+Gothic:400,700,800|Nanum+Myeongjo:400,700,800|Noto+Serif+KR:200,300,400,500,600,700,900|Noto+Sans+KR:100,300,400,500,700,900&display=swap&subset=korean'); @import url('https://fonts.googleapis.com/css2?family=Playball&family=Russo+One&display=swap'); @font-face { font-family: 'MapoGoldenPier'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/MapoGoldenPierA.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'HakgyoansimBareonbatangB'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2307-2@1.0/HakgyoansimBareonbatangB.woff2') format('woff2'); font-weight: 700; font-style: normal; } @keyframes textLoop { 0% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 100% { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @font-face { font-family: 'GmarketSansLight'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff'); font-weight: light; font-style: light; } @font-face { font-family: 'GmarketSansMedium'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'WAGURITTF'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2403@1.0/WAGURITTF.woff2') format('woff2'); font-weight: normal; font-style: normal; } @font-face { font-family: 'WavvePADO-Regular'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2404@1.0/WavvePADO-Regular.woff2') format('woff2'); font-weight: normal; font-style: normal; } @import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap'); /* 스와이퍼 공통 */ .swiper-pagination .swiper-pagination-bullet { width: 10px; height: 10px; background: #ddd; opacity: 1; } .swiper-pagination .swiper-pagination-bullet-active { background: #000; } .swiper-button-prev:after, .swiper-button-next:after { content: unset !important; } /* 화살표 기본 숨김 */ .swiper-button-prev, .swiper-button-next { opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease; background-size:0 !important;} /* 마우스 오버 시 화살표 표시 */ .swiper-container:hover .swiper-button-prev, .swiper-container:hover .swiper-button-next { opacity: 1; visibility: visible; background-size:0 !important;} .sub_bnr_wrap .cont_tit { position:relative; max-width: 1416px; width:100%; display:flex; justify-content:space-between; align-items:center; line-height:72px; margin: 0 auto; } .sub_bnr_wrap .cont_tit h1 { display:flex; align-items: baseline; gap:15px; font-size:14px; font-weight:400; color:#888; line-height: 72px; } .sub_bnr_wrap .cont_tit h1 b {font-size: 28px;font-weight: 700;color:#000;} .sub_bnr_wrap .cont_tit a { display:flex; align-items:center; gap:5px; font-size:12px; font-weight:400; color: #000; } /* 섹션공통 */ section{width: 100%;} section .sec_inner{/*width: 1400px;*/ margin: 0 auto; } section .shop_now{font-family: 'Lato' , sans-serif; font-size: 14px; color: #000;padding-bottom: 7px; font-weight: 600;letter-spacing: 1px; display: inline-block;} section .shop_now span{display: inline-block;margin-left: 17px;} section .shop_now span img{display:inline-block; margin-top:-3px} section p.tit{font-family: 'Noto Sans KR', sans-serif;letter-spacing: -.2px;font-weight:500 } .start{transition: all 2s; opacity: 0;} .end{opacity: 1 !important;transition: all 2s;margin-top:-35px} .section h2{font-family: 'Noto Sans KR', sans-serif; margin-bottom: 70px; text-align: center; color: #000 ;font-size: 30px; font-weight: 600;} .setionTit h3{margin: 0 0 20px; font-size: 15px; color: #000; font-weight: bold; letter-spacing: 2px; font-family: 'Lato', sans-serif;text-align: center;} .setionTit .line{display: block; width: 7px; height: 1px; background: #000; margin: 0 auto 20px;} .setionTit h1{ color: #000; font-family: 'Noto Serif KR', sans-serif; font-size: 46px; line-height: 50px; text-align: center; } /* 게시판 영역 */ .board_area{ padding: 100px 0 150px; max-width:1500px; margin:0 auto;} .board_area .board_wrap{ margin: 80px auto 0;display:flex;justify-content:space-between;} .board_area .board_wrap:after{content:''; display:block; clear:both;} .board_area .board_wrap div{} .board_area .board_wrap div .board_more{ padding: 0 0 15px; margin:0; border-bottom: 2px solid #424242; color: #1B1B1B; font-size: 1.7rem;font-family:'Pretendard', sans-serif; font-weight:700;text-align: left;} .board_area .board_wrap div .board_more a{ float: right; margin: 2px 0 0;} .board_area .board_wrap div .board_gallery_inner{ margin: 0; } .board_area .board_wrap div .board_gallery_inner a{padding:1.8rem 1rem; border-bottom:1px solid #ddd;transition:all .5s; color:#1B1B1B; display:block; font-size:1.1rem; font-weight:500;font-family:'Pretendard', sans-serif;} .board_area .board_wrap div .board_gallery_inner a:hover{color:#fff; background:#1B1B1B;} .board_area .board_wrap div .board_gallery_inner .board_gallery_con:after{content:''; display:block; clear:both;} .board_area .board_wrap div .board_gallery_inner .board_gallery_con .con{float: left;} .board_area .board_wrap div .board_gallery_inner .board_gallery_con .con img{margin-left:5px;} .board_area .board_wrap div .board_gallery_inner .board_gallery_con .date{float: right; font-size:1rem; font-family:'Pretendard', sans-serif; font-weight:400;} .board_area .board_wrap div .board_gallery_inner .board_gallery_con p{} .board_area .board_wrap .board_gallery_left{ float: left;width: 70%;} .board_area .board_wrap .board_gallery_right{ float: right;width:calc(100% - 70%); margin-left:60px;} .board_area .board_wrap .board_gallery_right .faq{ padding: 0 0 15px; margin:0; color: #1B1B1B; font-size: 1.7rem;font-family:'Pretendard', sans-serif; font-weight:700;text-align: left;} .board_area .board_wrap .board_gallery_right .faq a{ float: right; margin: 2px 0 0;} .board_area .board_wrap .board_gallery_right .faq_box{border-radius:10px; padding:30px 35px; position:relative; height:185px; background:#f0f0f2;} .board_area .board_wrap .board_gallery_right .faq_box .text{font-size:1.25rem; text-align:left; font-weight:500;} .board_area .board_wrap .board_gallery_right .faq_box .img img{width:55%;position:absolute;right:15px; bottom:20px;} /* 메인 비쥬얼 배너 */ .main-banner .swiper-slide img {width: 100%;} .main-banner .swiper-slide .visual_txt { position:absolute; left:50%; top:0; transform:translateX(-50%); font-weight:300; height:93%; display:flex; flex-flow:column; justify-content:center; max-width:1600px;width:80%; margin:0 auto;} .main-banner .swiper-slide .visual_txt h2 {font-size:2.3vw; font-weight:700;font-family: 'FlightSans-Bold', sans-serif; display:block; margin-bottom:20px; line-height:1.3; letter-spacing:-.5;} .main-banner .swiper-slide .visual_txt h2>span{font-weight:bold;font-family: 'FlightSans-Title', sans-serif; color:#355BF5;} .main-banner .swiper-slide .visual_txt .sub {font-size:1.2vw;font-weight:400;font-family: 'FlightSans-Regular', sans-serif;display:block;} .main-banner .swiper-slide .visual_txt .time {font-size:.8vw; line-height:1; margin-top:20px; display:block;} .main-banner .swiper-slide .visual_txt .visual_btn{border-radius:50px; padding:1em 2em; margin-top:7%; width:5.6vw; overflow:hidden; font-size:0.75vw; font-family: 'FlightSans-Bold', sans-serif; transition:all .5s; background:#355BF5; display:flex; border:1px solid #355BF5; color:#fff; justify-content:space-between;} .main-banner .swiper-slide .visual_txt .visual_btn:hover{color:#355BF5; background:none;} .main-banner .swiper-pagination-wrap {position: absolute; bottom: 26px; left: 50%; transform: translateX(-50%); display: flex; gap: 15px; width: 160px; height: 42px; border-radius: 25px; background: rgba(0, 0, 0, 0.4) !important; z-index: 1;} .main-banner .swiper-button-prev, .main-banner .swiper-button-next {width: 24px;height: 24px;top: 50%;transform: translateY(-50%);margin: 0;z-index: 20;opacity: 1 !important; visibility: visible !important;background-size:24px 24px !important;} .main-banner:hover .swiper-button-prev, .main-banner:hover .swiper-button-next { opacity: 1; visibility: visible; background-size:24px 24px !important;} .main-banner .swiper-pagination .swiper-pagination-bullet { width: 10px; height: 10px; background: #ddd; opacity: 0 !important; } .main-banner .swiper-button-prev {background: url('//skin.makeshop.co.kr/skin/onstore/pc/images/ic_arrow_w_prev.png') no-repeat center;} .main-banner .swiper-button-next {background: url('//skin.makeshop.co.kr/skin/onstore/pc/images/ic_arrow_w_next.png') no-repeat center;} .main-banner .swiper-pagination-fraction {position: relative;display: flex;gap: 20px;align-items: center;justify-content: center;height: 100% !important;top: 0; border-radius: 25px;} .main-banner .swiper-pagination-fraction:before {content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 1px;height: 10px;background: #AAAAAA;} .main-banner .swiper-pagination-fraction > span {font-weight: 700;font-size: 14px;text-align: center;color: #AAAAAA;} .main-banner .swiper-pagination-fraction .swiper-pagination-current {color: #FFFFFF;} #main-banner01 .main-banner .swiper-horizontal>.swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite, .swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{height:auto;} /* 구매가이드 */ .circle{position:relative; overflow:hidden; margin-top: 7.5rem; padding-top: 9.5rem; padding-bottom: 10rem; width:100%;background:#111;} .circle:before{content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("//resfor.cafe24.com/wig/site/mosim/guide_bg.jpg"); background-size: cover; background-position: center; opacity: 0.2;} .circle .bg_man{position: absolute; top: 0; left: 0;} .circle .container{z-index:1;} .circle .container .cont-tit{position:relative; margin-bottom:5rem; padding-bottom:6.25rem;text-align:center; color:#fff;} .circle .container .cont-tit:before{content:""; position:absolute; left:50%; bottom:0; width:1px; height:3.75rem;background:#999; transform:transiateX(-50%);} .circle .container .cont-tit>p{margin-bottom:0.6em; font-size:1.25rem; font-weight:500;} .circle .container .cont-tit h3{font-size:3rem; font-weight:700;font-family: 'FlightSans-Bold', sans-serif; line-height:1.5; color:#fff;} .circle .container .cont-tit h5{font-size:1.5rem; font-weight:400; line-height:1.5; color:#fff;} .circle .container .bx-grid-wrp{position:relative; margin:0 auto;} .circle .bx-grid-list{align-items:center; gap:4%; display:flex; justify-content:center; } .circle .bx-grid-list .bx-grid-item{position:relative;min-height:0; margin:0; padding:0;max-width:400px; border-radius:50% !important;align-items:flex-start;justify-content:center;text-align:center;} .bg-green{background:rgba(0,35,156,1);box-shadow:0 0 20px rgba(0,0,0,0.1);transition: all .5s;} .bg-green:hover{box-shadow:0 0 20px rgba(0,35,156,.5);} .bg-dark{background:rgba(25,87,173,1);box-shadow:0 0 20px rgba(0,0,0,0.1);transition: all .5s;} .bg-dark:hover{box-shadow:0 0 20px rgba(25,87,173,.5);} .bg-blue{background:rgba(72,49,212,1);box-shadow:0 0 20px rgba(0,0,0,0.1);transition: all .5s;} .bg-blue:hover{box-shadow:0 0 20px rgba(72,49,212,.5);} .bx-grid-list .bx-grid-item:before{content:""; display:block; padding-top:100%; width:100%;} .bx-grid-list.flex-bx .bx-grid-item>*{display:flex; justify-content:center; align-items:center; flex-direction:column; position:absolute; top:0; left:0; width:100%; height:100%; text-align:center;color:#fff !important;} .bx-grid-item img{width:90px; height:90px; opacity:.5;} .bx-grid-item h5 {font-size:1.75rem; font-weight:700;font-family: 'FlightSans-Bold', sans-serif; line-height:1.17857; color:#fff !important;padding-top:30px;} .bx-grid-item p{margin-top:15px; font-size:1.1875rem; line-height:1.5; font-family: 'FlightSans-Regular', sans-serif;} .bx {display:flex; width:100%; font-size:1.25rem;} .bx-grid-item{flex:1; overflow:hidden} .circle .bx-grid-list .bx-grid-item:hover{transform:translateY(-15px);} /* 매장안내 */ .sliderWrap{padding:50px 0 100px; width:1400px ;margin:0 auto;display:grid; background:#fff; padding-top:1.0416666667vw;} .sliderArea{position:relative;max-width:100%;} .sliderArea .cateTit5{padding: 100px 0 50px; text-align:left; position:relative; } .sliderArea .cateTit5 h3{color: #242424;font-size: 3rem;font-weight:400;font-family: 'FlightSans-Regular', sans-serif; padding:20px 0;} .sliderArea .cateTit5 .sub_tit{color: #355BF5;font-size: 20px; font-family: 'Montserrat'; font-weight:700; } .sliderArea .shop_now{font-family: 'Lato' , sans-serif; font-size: 14px; color: #000;padding-bottom: 10px; border-bottom: 1px solid #000; font-weight: 600; letter-spacing: 1px; position:absolute; right:0; bottom:70px;} .sliderArea .shop_now span{display: inline-block;margin-left: 8px;} .sliderArea .bx-wrapper{float:right !important; height:500px; width:1000px !important;margin-left:5%; border-radius:10px;overflow:hidden; border:0.0520833333vw solid #CCCCCC;} .sliderArea .root_daum_roughmap .wrap_map{width:1000px !important; height:500px !important;} .sliderArea .root_daum_roughmap .wrap_btn_zoom{display:none;} .sliderArea .root_daum_roughmap_landing{overflow:visible !important;} .sliderArea .pagerWrap{display:inline-block; vertical-align:top; width:300px;height:auto; margin-bottom:20px;padding-top:initial;} .sliderArea .pagerWrap a{} .sliderArea img{width:100%;} .sliderArea .bx-pager{position:absolute;bottom:70px;left:0;right:0;z-index:60;text-align:center;} .sliderArea .bx-pager-item{transition:all 0.3s ease;display:inline-block;position:relative;} .sliderArea .bx-pager-link{display:inline-block;width:18px;height:18px;border-radius: 50%;background-color:transparent;font-size:0;margin:4px;border:4px solid #ffb400;} .sliderArea .bx-pager-link.active{background-color:#ffb400;} .sliderArea .title {font-weight: 700;font-size: 1.3rem;font-family: 'FlightSans-Bold', sans-serif; color:#111; text-align:left !important; display:block; margin-bottom:10px !important;} .sliderArea .subTitle {font-weight: 400;font-size: 1.05rem;font-family: 'FlightSans-Regular', sans-serif;color:#333; line-height:1.5 !important;} .sliderArea .call{font-weight: 700;font-size: 1.1rem;font-family: 'FlightSans-Regular', sans-serif;color:#333; padding-top:10px; display:block;} .sliderArea .customPager{} .sliderArea .customPager .link{display:block;margin:0 10% 20px 0;width:100%;padding:21px;border:0.0520833333vw solid #CCCCCC;border-radius:0.5208333333vw;word-break:keep-all;} .sliderArea .customPager .link.active{background-color:#DCECFF;border:0.0520833333vw solid #DCECFF;} .sliderArea .bx-controls{} .sliderArea .bx-controls-direction{position:absolute;top:50%;left:50%;z-index:60;text-align:center;} .sliderArea .bx-prev, .sliderArea .bx-next{position:absolute;top:0;margin-top:-21px;font-size:34px;display:inline-block;width:40px;height:40px;vertical-align:middle;border:1px solid transparent;} .sliderArea .bx-prev{left:0;margin-left:-600px;} .sliderArea .bx-next{right:0;margin-right:-600px;} /* mainSlider */ .mainSliderWrap .bx-prev:hover, .mainSliderWrap .bx-next:hover{border-color:#000;} /* map */ #map { padding:30px 50px 16px; margin:0 auto; display:block;} #map h3{ padding: 10px 0 5px; margin:0 auto; display:block; font-weight:700; font-size:16px !important; color:#333;} #map p{ padding:0 10px 10px; display:block; font-size:13px !important; color:#919191; } #map a{display:block; padding-bottom:10px; font-size:13px; color:#919191;} #tabProduct .newCate_prod .slideList li #map { padding:30px 0px 16px 0; margin:0 auto; display:inline-block; } #tabProduct .newCate_prod .slideList li #map h3{ font-family: 'Nanum Gothic', sans-serif; padding-top: 10px; padding-bottom:5px; margin:0 auto; display:block; font-weight:700; font-size:20px; color:#333;} #tabProduct .newCate_prod .slideList li #map p{ padding-left: 10px; padding-right: 10px; display:block; font-size:15px; color:#919191; } #tabProduct .newCate_prod .slideList li #map a{ font-family: 'Nanum Gothic', sans-serif; display:block; padding-bottom:10px; font-size:13px; color:#919191;} #map1 { padding:30px 0px 16px 0; margin:0 auto; display:inline-block; } #map1 h3{ padding-top: 10px; margin:0 auto; display:block; font-weight:700; font-size:16px !important; color:#333;} #map1 p{ padding:5px 10px 10px; display:block; font-size:13px !important; color:#919191; } #map1 a{ font-family: 'Nanum Gothic', sans-serif; display:block; padding-bottom:10px; font-size:13px; color:#919191;} #map2 { padding:30px 0px 16px 0; margin:0 auto; display:inline-block; } #map2 h3{ padding-top: 10px; margin:0 auto; display:block; font-weight:700; font-size:16px !important; color:#333;} #map2 p{ padding:5px 10px 10px; display:block; font-size:13px !important; color:#919191; } #map2 a{ font-family: 'Nanum Gothic', sans-serif; display:block; padding-bottom:10px; font-size:13px; color:#919191;} /* 스타일 */ #main-banner02{position:relative; width:100%; height:1300px; background:rgb(20, 20, 22); } #main-banner02 .cont_tit { position:absolute; z-index:11; width:100%;line-height:72px; margin: 0 auto; top:140px;text-align:center; display:inline-block;left:50%;transform: translateX(-50%);} #main-banner02 .cont_tit h1 {line-height: 75px; font-size: 50px;font-weight: 700;color:#fff;font-weight:700;font-family: 'FlightSans-Bold', sans-serif; display:block;} #main-banner02 .cont_tit a { font-size:1.1rem; font-weight:400; color: #fff; display:inline-block;cursor: pointer;margin-top:25px;font-family: 'FlightSans-Regular', sans-serif; opacity:.7;} .main-banner-m {position:absolute;z-index:10;bottom:0;margin:auto;left:0; right:0;width:1000px;} .main-banner1 {width:422px; border-radius:45px;position:absolute !important; z-index:100 !important; left:0; right:0; bottom:53px !important;margin:auto;} .main-banner1 .swiper-slide img {width:100%;height: auto;transition: transform 10s ease 0.5s; transform: scale(1);} .main-banner1 .swiper-slide-active img{transform: scale(1.1);} .main-banner1 .swiper-slide .txt_wrap {position: absolute; width:80%; z-index:101;bottom: 90px; left:50%; -webkit-transform:translate(-50%,-50%); opacity:0; visibility: hidden; transition:all .8s ease .5s; -webkit-transition:all .8s ease .5s;} .main-banner1 .swiper-slide-active .txt_wrap {opacity:1; bottom:100px !important; visibility: visible;} .main-banner1 .swiper-slide .txt_wrap p {color:#fff;} .main-banner1 .swiper-slide .txt_wrap .t_black p{color:#000;} .main-banner1 .swiper-slide .txt_wrap .txt_01 { font-size: 1.875rem; font-weight:700;font-family: 'FlightSans-Bold', sans-serif; line-height: 2; margin-bottom: 5px;} .main-banner1 .swiper-slide .txt_wrap .txt_02 { font-size: 1.275rem; font-weight:400;font-family: 'FlightSans-Regular', sans-serif; line-height: 1.2;} .main-banner1 .swiper-pagination-wrap {position: absolute; bottom: 26px; left: 50%; transform: translateX(-50%); display: flex; gap: 15px; width: 160px; height: 42px; border-radius: 25px; background: rgba(0, 0, 0, 0.4) !important; z-index: 1;} .main-banner1 .swiper-button-prev, .main-banner1 .swiper-button-next {width: 24px;height: 24px;top: 50%;transform: translateY(-50%);margin: 0;z-index: 20;opacity: 1 !important; visibility: visible !important;background-size:24px 24px !important;} .main-banner1:hover .swiper-button-prev, .main-banner1:hover .swiper-button-next { opacity: 1; visibility: visible; background-size:24px 24px !important;} .main-banner1 .swiper-pagination .swiper-pagination-bullet { width: 10px; height: 10px; background: #ddd; opacity: 0 !important; } .main-banner1 .swiper-button-prev {background: url('//skin.makeshop.co.kr/skin/onstore/pc/images/ic_arrow_w_prev.png') no-repeat center;} .main-banner1 .swiper-button-next {background: url('//skin.makeshop.co.kr/skin/onstore/pc/images/ic_arrow_w_next.png') no-repeat center;} .main-banner1 .swiper-pagination-fraction {position: relative;display: flex;gap: 20px;align-items: center;justify-content: center;height: 100% !important;top: 0; border-radius: 25px;} .main-banner1 .swiper-pagination-fraction:before {content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 1px;height: 10px;background: #AAAAAA;} .main-banner1 .swiper-pagination-fraction > span {font-weight: 700;font-size: 14px;text-align: center;color: #AAAAAA;} .main-banner1 .swiper-pagination-fraction .swiper-pagination-current {color: #FFFFFF;} @keyframes zoomIn { 0% { transform: scale(1); } 100% { transform: scale(1.1); } } .marquee-container {overflow: hidden; white-space: nowrap; width: 100%; position: relative; height: 64px; padding-top:700px;display: flex; align-items: center; cursor: default;} .marquee {display: flex;animation: scroll 20s linear infinite;/* 끊김 없이 반복 애니메이션 */font-size: 60px;font-weight:700;font-family: 'FlightSans-Bold', sans-serif;color:rgba(255, 255, 255, 0.1);} .marquee span {padding: 0 75px;} @keyframes scroll { from { transform: translateX(0); } to { transform: translateX(-50%); /* 절반만 이동 */ } } .marquee-container1 {overflow: hidden; white-space: nowrap; width: 100%; position: relative; height: 64px; padding-top:50px;display: flex; align-items: center; cursor: default;} .marquee1 {display: flex;animation: xscroll 20s linear infinite reverse;/* 끊김 없이 반복 애니메이션 */font-size: 60px;font-weight:700;font-family: 'FlightSans-Bold', sans-serif;color:rgba(255, 255, 255, 0.1);} .marquee1 span {padding: 0 75px;} @keyframes xscroll { from { transform: translateX(0); } to { transform: translateX(-50%); /* 절반만 이동 */ } } /* 후기 */ .mainCopyHd{position:relative; min-width: 1100px; margin-left: 170px; /* height: 160px; */ padding: 40px 160px 0px 120px; margin-bottom: 30px; font-family:'Pretendard', sans-serif;} .mainCopyHd .mainTx {font-size: 70px; line-height: 70px; letter-spacing: -0.75px; font-weight: 300;} .mainCopyHd .subTx{font-size: 1.25rem; font-weight: 500; margin-top: 30px; margin-left: 10px;} .mainCopyHd1 {position:relative; min-width: 1100px; padding-top: 150px; text-align:center;} .mainCopyHd1 .mainTx {font-size: 3.5rem; font-weight:700;font-family: 'FlightSans-Bold', sans-serif;} .mainCopyHd1 .mainTx1 {font-size: 1.875rem; padding-bottom:20px; font-weight:700;font-family: 'FlightSans-Bold', sans-serif;} .mainCopyHd1 .mainTx2 {font-size:1.5rem;line-height:1.5; padding:0.75em 0 1.5em;font-weight:700;font-family: 'FlightSans-Bold', sans-serif;} .mainCopyHd1 .subTx{font-size: 1.5rem; margin-top: 30px; padding-bottom:10px; line-height:1.5;font-weight:400;font-family: 'FlightSans-Regular', sans-serif;} .mainCopyHd1 .mainTx-btn a{margin:2rem 0 5rem;text-align:center;color:#355BF5;padding:20px 35px;font-weight:500;font-size:1rem;border-radius:2em;line-height:1;transition:color 0.1s,border-color 0.25s,background 0.4s cubic-bezier(0.165,0.84,0.44,1);display:inline-flex;align-items:center;border:1px solid #355BF5;font-family: 'FlightSans-Bold', sans-serif;} .mainCopyHd1 .mainTx-btn a:hover{background:#355BF5; color:#fff;} .lengline{ height: 100px; width: 1px; margin: 40px auto; background: #aaa;} .sub_bnr_wrap { position:relative; background:#fff;} .sub_bnr_wrap h1{line-height:40px; padding-bottom:40px;} .sub_bnr_wrap .swiper-slide{ border-radius: 15px;overflow:hidden;} /*.sub_bnr_wrap .swiper-slide:hover a img{transform: scale(1.05);}*/ .sub_bnr_wrap .swiper-slide a { display:block;width: 100%; transform:translateY(0); opacity:1; overflow:hidden; position:relative; border-radius:2rem; transition-property:transform , opacity; transition-duration:0.8s; } .sub_bnr_wrap .swiper-slide a:hover .prd-info{transform:translateY(0);} .sub_bnr_wrap .swiper-slide a:hover .hover_box{background-color:rgba(0,0,0,0.4);} .sub_bnr_wrap .swiper-slide .prd-info {position:absolute; bottom:0; left:0; font-size:1.375rem; transform:translateY(calc(100% + -4rem)); padding:5%; color:#fff; z-index:3; transition:all 0.5s; } .sub_bnr_wrap .swiper-slide .prd-info .name{font-size:20px; font-weight:700;} .sub_bnr_wrap .swiper-slide .prd-info .cont{margin-top:2em; font-size:15px;} .sub_bnr_wrap .swiper-slide .prd-info .cont img{display:none;} .sub_bnr_wrap .swiper-slide .hover_box{content:""; display:flex; align-items:center; justify-content:center; position:absolute; left:0; top:0; width:100%; height:100%; color:#fff; background-color:rgba(0,0,0,0); z-index:2; transition:all 0.3s ease-in-out;} .sub_bnr_wrap .swiper-slide a img { width:100%;transition: all .7s;} .sub_bnr_wrap .arrow_wrap { width: 74%; margin: 0 auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10;} .sub_bnr_wrap .arrow_wrap div { width: 56px; } .sub_bnr_wrap .arrow_wrap .swiper-button-prev { left: -2px; } .sub_bnr_wrap .arrow_wrap .swiper-button-next { right: 0; } .sub_bnr_wrap .txt_wrap { position: absolute; bottom: 28px; left: 28px; } .sub_bnr_wrap .txt_wrap p {color:#fff;} .sub_bnr_wrap .txt_wrap.t_black p{color:#000;} .sub_bnr_wrap .txt_wrap .txt_01 { font-size: 20px; font-weight: 700; line-height: 24.96px; margin-bottom: 8px; } .sub_bnr_wrap .txt_wrap .txt_02 { font-size: 16px; font-weight: 400; line-height: 19.97px; } .container-wrap {width: 100%;max-width: 1760px;margin: 0 auto;} .title {font-weight: 800;font-size: 26px;text-align: center;margin-bottom: 50px;} #section03 {margin-bottom: 160px;} #section03 .event-wrap {display: flex;gap: 28px;margin-bottom: 50px;} #section03 .event-wrap > a {flex: 1;height: 260px;border-radius: 15px;padding: 94px 90px 0 90px;box-sizing: border-box;color: #000000;} #section03 .event-wrap > a:nth-child(1) {background: url('//resfor.cafe24.com/wig/site/mosim/bn_ranking.png') no-repeat center;} #section03 .event-wrap > a:nth-child(2) {background: url('//skin.makeshop.co.kr/skin/onstore/pc/images/section03_bg02.png') no-repeat center;} #section03 .event-wrap .item-box strong {display: block;margin-bottom: 25px;font-weight: 700;font-size: 26px;} #section03 .event-wrap .item-box p {font-weight: 400;font-size: 14px;} #section05 {margin-bottom: 80px;} #section05 .inner-box {display: flex;gap: 217px;justify-content: center;align-items: center;height: 300px;background: #ccc6c6;color: #000000;} #section05 .inner-box .right p {display: block;font-weight: 700;font-size: 26px;line-height: 1.4;margin-bottom: 30px;} #section05 .inner-box .right .btn-link {display: block;font-weight: 800;font-size: 14px;text-align: center;width: 120px;height: 34px;line-height: 34px;color: #FFFFFF;background:#000;border-radius: 25px;} /* sec6 */ #sec6{overflow: hidden; padding-bottom:50px; border-radius:0px 0px 0 0;background:#fff;} #sec6 .sec6_cont{background:#f9f9f9; padding:80px 0 0px;margin-bottom:80px;/*border-radius:100px 100px 0 0;*/} #sec6 .sec6_cont .swiper{padding: 40px 0 80px;} #sec6 .sec6_cont .swiper ul{ margin-left:calc((100% / 6) / 2);} #sec6 .sec6_cont .swiper ul li{width:calc(100% / 6);padding: 0 15px;} #sec6 .sec6_cont .swiper ul li .ban_img{} #sec6 .sec6_cont .swiper ul li .ban_img a{display: block; width: 100%;border-radius: 25px; overflow: hidden;} #sec6 .sec6_cont .swiper ul li .ban_img a img{width:100%;} #sec6 .sec6_cont .swiper ul li .ban_txt{width: 100%; padding: 25px 0;} #sec6 .sec6_cont .swiper ul li .ban_txt p{text-align: left; font-family: 'Jost', 'Noto Sans KR', sans-serif; padding:0 10px;} #sec6 .sec6_cont .swiper ul li .ban_txt p.big{font-size: 16px; color: #000; font-weight: 500; margin-bottom: 10px;} #sec6 .sec6_cont .swiper ul li .ban_txt p.small{color: #999999; font-size: 14px; font-weight: 400;} #sec6 .swiper .swiper-pagination{bottom: 0;} #sec6 .swiper .swiper-pagination-bullet-active{background-color: #000;} /* sec1 */ #sec1{ height: 100vh; overflow:hidden;margin:0 auto;width:100%; min-width:1320px;background:#f9f9f9;} #sec1 .swiper{} #sec1 .swiper ul{} #sec1 .swiper ul li{position: relative;} #sec1 .swiper ul li>a{display: block;width: 100%;} #sec1 .swiper ul li>a>img{width: 100%;} #sec1 .swiper ul li .txt_area{position: absolute; left:50%; transform: translate(-50%,-50%); top: 50%;width:80%;} #sec1 .swiper ul li .txt_area p{opacity: 0;} #sec1 .swiper ul li .txt_area p.tit{ color: #fff; font-size: 28px; font-weight: 400; letter-spacing: 0px; padding-left:5px;line-height:60px;transition: all .4s; } #sec1 .swiper ul li .txt_area p.count{color:#fff; line-height:100px;transition: all .4s; transition-delay: .25s;} #sec1 .swiper ul li .txt_area p.tit2{color: #fff; margin-top:70px; font-size: 43px;font-weight:600; letter-spacing:-1px !important; text-align:left; margin-bottom:0 !important;transition: all .5s;transition-delay: .5s;} #sec1 .swiper ul li .txt_area p.tit2_1{color: #fff; font-size: 28px;font-weight:400; letter-spacing:-.5px !important; text-align:left; margin-bottom:20 !important;transition: all .5s;transition-delay: .5s;} #sec1 .swiper ul li .txt_area p.tit2_1 b{color:#e3c8a1 !important;} #sec1 .swiper ul li .txt_area p.tit1{ color: #f1f1f1; font-size: 28px; font-weight: 400; letter-spacing: 0px;line-height:38px;padding:20px 0 50px;transition: all .5s;transition-delay: .75s;} #sec1 .swiper ul li .txt_area p.tit3{color: #fff; font-size: 20px; font-weight: 400; letter-spacing: 0px;transition: all .5s;transition-delay: .75s; margin-top:50px;} #sec1 .swiper ul li .txt_area p.tit3 span{display:inline-block; border-radius:150px; margin-right:40px; width:190px; height:190px; background:rgba(255,255,255,.25); text-align:center;} #sec1 .swiper ul li .txt_area p.tit3 span img{width:33%;margin-top:35px;} #sec1 .swiper ul li .txt_area p.tit4{ color: #f1f1f1; font-size: 27px; font-weight: 400; letter-spacing: 0px;line-height:37px; padding-bottom:10px; transition: all .5s;transition-delay: .75s;} #sec1 .swiper ul li .txt_area p.tit4 span{color:#ffc77f;} #sec1 .swiper ul li .txt_area.act p.tit{transform: translateY(30px); opacity: 1;} #sec1 .swiper ul li .txt_area.act p.count{transform: translateY(30px); opacity: 1;} #sec1 .swiper ul li .txt_area.act p.tit2{transform: translateY(30px); opacity: 1;} #sec1 .swiper ul li .txt_area.act p.tit2_1{transform: translateY(30px); opacity: 1;} #sec1 .swiper ul li .txt_area.act p.tit1{transform: translateY(30px); opacity: 1;} #sec1 .swiper ul li .txt_area.act p.tit3{transform: translateY(30px); opacity: 1;} #sec1 .swiper ul li .txt_area.act p.tit4{transform: translateY(30px); opacity: 1;} #sec1 .swiper ul li .txt_area .shop_now{ font-size: 20px; color: #fff; padding-bottom: 10px; border-bottom: 1px solid #fff; font-weight: 600; letter-spacing: 1px; display: inline-block;transition: transform .4s, opacity .4s;opacity: 0; transition-delay: .4s;} #sec1 .swiper ul li .txt_area.act .shop_now{transform: translateY(30px); opacity: 1;} #sec1 .swiper ul li .txt_areat .shop_now span{display: inline-block;margin-left: 8px;} #sec1 .swiper-pagination{width: auto; top: 50%; right: 50%; bottom: unset; left: unset; z-index: 19; transform: translateX(750px);} #sec1 .swiper-pagination-bullet{background-color: #000; display: block;margin: 10px 0;} #sec1 .swiper_btn_next{position: absolute; bottom: 40px; z-index: 10; left: 50%; transform: translateX(-50%); cursor: pointer;} #sec1 .swiper-button-disabled{opacity: .3;} .ea{font-size:50px;font-family: 'Playfair Display SC'; padding-left:30px;} #countNumUp{color:greenyellow;font-size:110px;width:280px; display:inline-block; font-family: 'MapoGoldenPier';} #countNumUp1{color:#fff;font-size:72px;width:1000px; display:inline-block; font-family: 'Gothic A1', sans-serif; font-weight:700;} #countNumUp2{color:#fff;font-size:75px;width:1000px; display:inline-block; font-family: 'Do Hyeon', sans-serif; font-weight:500;} @keyframes move1{ 0%{background: url(//resfor.cafe24.com/wig/site/mosim/repair_1.png) no-repeat center center ;background-size:110% 110%;} 45%{background: url(//resfor.cafe24.com/wig/site/mosim/repair_1.png) no-repeat center center ;background-size:100% 100%;} 50%{background: url(//resfor.cafe24.com/wig/site/mosim/repair_1.png) no-repeat center center ;background-size:110% 110%;} 50%{background: url(//resfor.cafe24.com/wig/site/mosim/repair_2.png) no-repeat center center ;background-size:110% 110%;} 95%{background: url(//resfor.cafe24.com/wig/site/mosim/repair_2.png) no-repeat center center ;background-size:100% 100%;} 100%{background: url(//resfor.cafe24.com/wig/site/mosim/repair_2.png) no-repeat center center ;background-size:110% 110%;} 100%{background: url(//resfor.cafe24.com/wig/site/mosim/repair_1.png) no-repeat center center ;background-size:110% 110%;} } /* 서브 이미지 베너 */ .subBanner a{display:block;} .subBanner.fixBg{margin-top:70px;position:relative;} .subBanner.fixBg .title{font-size:60px;font-weight:bold;line-height:60px;height:60px;display:block;position:absolute;top:50%;left:0;right:0;text-align:center;margin-top:-60px;color:#000;font-family: 'Playfair Display SC', sans-serif;} .subBanner.fixBg .title_s{color:#000; font-size:1.5rem;position:absolute;top:50%;left:0;right:0;text-align:center;margin-top:20px; letter-spacing:-.7px;} .subBanner.fixBg .bg{height:550px;background:url(//resfor.cafe24.com/wig/site/mosim/bn_custom.png) center top no-repeat fixed } /*방송*/ .companyInfoWrap {position: relative; width:100%; padding:150px 0 70px; overflow: hidden; background:#fff;} .companyInfoWrap .leftInfo{text-align:center;color:#000;} .companyInfoWrap .infotext{font-size: 2rem; color: #222; font-weight: 400; font-family: 'FlightSans-Regular', sans-serif; padding-bottom:20px;line-height:30px;} .companyInfoWrap .infoTit {font-size: 3rem; font-weight:700;font-family: 'FlightSans-Bold', sans-serif; line-height:34px; padding:40px 0 60px;} .companyInfoWrap .infoSubTit{font-size:1.275rem; font-weight: 400; font-family: 'FlightSans-Regular', sans-serif; line-height:32px; padding-bottom:40px; color:#565656;} /* sec7 방송*/ #sec7{margin-bottom:0px; background:#fff;} #sec7 .sec_inner{width:80% !important;} #sec7 .sec_inner h2{} #sec7 .sec_inner h2 a.h2_more{display: inline-block; float: right;} #sec7 .sec_inner h2 a.h2_more img{} #sec7 .sec7_cont{} #sec7 .sec7_cont ul{display: flex; flex-wrap: nowrap; justify-content: space-between;} #sec7 .sec7_cont ul li{width: 32.5%;} #sec7 .sec7_cont ul li iframe,#sec7 .sec7_cont ul li embed,#sec7 .sec7_cont ul li object{margin-left:-5%;/*position:absolute; top:0; left:0; width:100%; */} #sec7 .sec7_cont ul li .img_sec {border-radius:20px; position:relative; padding-bottom:0; height:420px;overflow:hidden;} #sec7 .sec7_cont ul li .img_sec a{display: block; width: 100%;overflow: hidden; } #sec7 .sec7_cont ul li .img_sec a:hover>img{transform: scale(1.2); } #sec7 .sec7_cont ul li .img_sec a img{width: 100%;display: block;transition: all 1s;} #sec7 .sec7_cont ul li .txt_sec{text-align:center;} #sec7 .sec7_cont ul li .txt_sec span{} #sec7 .sec7_cont ul li .txt_sec .top {font-size:32px;font-weight:600;padding:10px 0 20px; text-align:center;width:100%;display:block;} #sec7 .sec7_cont ul li .txt_sec .top img{} #sec7 .sec7_cont ul li .txt_sec p.big{font-family: 'FlightSans-Regular', sans-serif; line-height: 1.5; margin: 35px 0 18px; font-size: 1.325rem; color: #242424; font-weight: 400;width: auto; display: inline-block; position: relative; letter-spacing:-.2x;} #sec7 .sec7_cont ul li:hover>.txt_sec p.big::after{width: 105%; opacity: 1;} #sec7 .sec7_cont ul li .txt_sec p.big::after{content: ""; display: block; position: absolute ; opacity: 0; bottom: -3px; left: -1%; width: 10%;transition: all .3s;transform-origin: left center; height: 15px; background-color: rgb(240, 229, 229);z-index: -1;transform: rotate(-1deg);} #sec7 .sec7_cont ul li .txt_sec p.sub{font-family: 'FlightSans-Regular', sans-serif; color: #565656; line-height: 1.4; letter-spacing:-.2px; font-size: 1.125rem; font-weight: 400; padding:0 10px;} /* sec13 유튜브*/ .youtube{display:flex;align-items:stretch;justify-content:space-between;} .youtube .video {width:55%; margin-right:2.5rem;} .youtube .video { position:relative; width:100%; display:block; overflow:hidden;} .youtube .video iframe,.youtube .video object,.youtube .video embed{position:absolute; top:0; left:0; width:100%; height:100%;object-fit:cover;} .youtube .video .video_info{position: relative; top: 0; left: 0; width: 50%; height: 535px; background: #f6f6f6; text-align: center;} .youtube .video .video_info .textinner{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);} .youtube .video .video_info h3{padding-top: 0;} .youtube .video .video_info i{ padding-bottom:0;} .youtube .video .video_info i img:hover{opacity:0.8;} #sec13{padding:12rem 0 10rem; width:100%; background:rgba(13,50,111,0.04); } #sec13 .sec_inner{position:relative; max-width:1600px; margin: 0 auto;} #sec13 .text_box {text-align:left;position:relative; margin-bottom:70px;} #sec13 .text_box .tit{font-size:24px;} #sec13 .text_box h2{font-size:50px; line-height:130px; font-weight:700;font-family: 'FlightSans-Bold', sans-serif; margin-bottom:0 !important; text-align:left !important;} #sec13 .text_box h2>img{width:50px; margin-right:5px;} #sec13 .text_box .tit_con{font-size:22px; font-weight:400;font-family: 'FlightSans-Regular', sans-serif; line-height:1.3; } #sec13 .text_box .more{position:absolute; right:0; bottom:0;} #sec13 .text_box .more a{font-size:16px; display:flex; align-items:center; justify-content:center; flex-shrink:0; height:3.5rem; padding:0 2rem; font-weight:500; transition:all .3s; border-radius:2em; text-align:center;color:#fff; background:#191919; border:1px solid #191919;} #sec13 .text_box .more a:hover{ color:#191919; background:#fff;} #sec13 .text_box .more a .ico{display:flex; font-size:20px;line-height:.7; width:1em; height:1em; margin-left:1.5rem;font-weight:300;} #sec13 .sec13_review{width:49.9%; display:flex; align-items:flex-start; justify-content:space-between; flex-direction:column;} #sec13 .sec13_review>div{width: 100%;} #sec13 .sec13_review>div>ul{width: 100%;} #sec13 .sec13_review>div>ul>li{flex-grow:1} #sec13 .li_review {margin-bottom:4%;} #sec13 .li_review:last-child{margin-bottom:0 !important;;} #sec13 .li_review .rv_main {width: 100%; display:flex; align-items:center; justify-content:flex-start;} #sec13 .li_review .rv_main .thumb {width:45%; height:auto !important; display:block;margin-right:1rem;} #sec13 .li_review .rv_main .thumb img{width: 100%; height: 100%;} #sec13 .li_review .rv_main .rv_main_cont{width: 52.5%; padding:0; float:right;} #sec13 .li_review .rv_main .rv_main_cont .rv_tit{margin-bottom: 10px;color:#565656; font-size: 16px; font-weight: 400;} #sec13 .li_review .rv_main .rv_main_cont .rv_info{;color:#000; font-size: 18px; font-weight: 500;word-break:keep-all; } #sec13 .li_review .rv_main .rv_main_cont .rv_cont{font-size: 12px; font-family: 'Noto Sans KR', sans-serif; text-overflow: ellipsis; overflow: hidden; font-weight:400; color:#999999; line-height:1.7; } #sec13 .swiper_btn_prev,#sec13 .swiper_btn_next{position: absolute;z-index: 2; cursor: pointer; bottom: 23%; transform: translateY(-50%);} #sec13 .swiper_btn_prev{left:-60px } #sec13 .swiper_btn_next{right:-60px} /* 유튜브숏츠 */ #sec2{} #sec2 .sec_inner{100%;} #sec2 .sec_inner h2{width:1500px;margin:100px auto 0; text-align:left; position:relative; font-size:28px; color:#202020; font-weight:700;font-family: 'FlightSans-Bold', sans-serif;} #sec2 .sec_inner h2 i{font-size:35px;} #sec2 .sec_inner .subname {width:1500px;margin:10px auto 30px; font-weight:400;font-family: 'FlightSans-Regular', sans-serif;font-size:16px;color:rgb(153, 153, 153);} #sec2 .sec_inner .more {font-size:15px; font-weight:500; color:#333; float:right; margin-right:10%;} #sec2 .sec_inner .more .fa {margin:0 5px;font-size: 18px;} #sec2 .sec_inner .sec2_cont{} #sec2 .sec_inner .sec2_cont .swiper{padding-bottom:40px;} #sec2 .sec_inner .sec2_cont .swiper ul{} #sec2 .sec_inner .sec2_cont .swiper ul li{width: 15.5%; } #sec2 .sec_inner .sec2_cont .swiper ul li .img_sec{ } #sec2 .sec_inner .sec2_cont .swiper ul li .img_sec a{display: block;position:relative;/*border-radius:10px;*/} #sec2 .sec_inner .sec2_cont .swiper ul li .img_sec a img{width: 100%; transition:all .3s} #sec2 .sec_inner .sec2_cont .swiper ul li .img_sec a i{position:absolute; font-size:50px; line-height:220px;color:rgba(255,255,255,.0); text-align:center; display:block; width:100%; height:100%; transition:all .3s; font-weight:light;} #sec2 .sec_inner .sec2_cont .swiper ul li .img_sec a:hover i {background:rgba(0,0,0,.5); /*text-shadow: 0px 0px 10px #b690f4;*/ font-size:70px; color:rgba(255,255,255,.9)} #sec2 .sec_inner .sec2_cont .swiper ul li .text_sec{padding: 25px 0; width: 100%;} #sec2 .sec_inner .sec2_cont .swiper ul li .text_sec p{line-height: 1.2;word-break:keep-all;} #sec2 .sec_inner .sec2_cont .swiper ul li .text_sec p.big{font-size: 19px;color: #000; margin-bottom: 10px; font-weight:700;} #sec2 .sec_inner .sec2_cont .swiper ul li .text_sec p.small{color: #8d8d8d; font-size: 15px; font-weight: 400;} #sec2 .swiper .swiper-pagination-progressbar{bottom: 0; top: unset; height: 1.5px; background-color: rgba(0,0,0,.09);width:1780px} #sec2 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background-color: #222;} .fa-angle-right::before{content:"";} /* 매장 */ .cateTit5{padding: 150px 0 50px;text-align:center;} .cateTit5 h3{color: #242424;font-size: 3rem;font-weight:700;font-family: 'FlightSans-Bold', sans-serif; padding-top:30px;} .cateTit5 .sub_tit{color: #242424; font-family: 'Montserrat'; font-size: 20px; padding-top:10px;} .cateTit5 .sub_tit1{color: #242424;font-size: 20px; padding:20px 0;font-family: 'FlightSans-Regular', sans-serif; font-weight:400;} .cateTit5 h1{color: #242424; font-family: 'GmarketSansBold'; font-size: 32px; letter-spacing: 1px;font-weight:bold;} .cateTit5 .subname{color: #242424; font-size: 20px; letter-spacing: 1px; padding-top:10px;font-family: 'GmarketSansLight'; font-weight:300;} .cateTit5 .line{margin: 40px auto 22px; width: 35px; background: #000;height:2px;} .cateTit5 span{font-size: 15px; color: #999999; letter-spacing: -1px;} #sec21 .swiper{ padding-bottom: 120px;} #sec21 .swiper ul{margin-left: calc((100% / 3) / 2);} #sec21 .swiper ul li{transition: opacity .2s; width: calc(100% / 3);} #sec21 .swiper>ul>li:not(.swiper-slide-active,.swiper-slide-next){opacity: .3;} #sec21 .swiper ul li a{display: block; width: 100%;} #sec21 .swiper ul li a img{width: 100%;} #sec21 .swiper ul li .txt_area{padding-top: 15px;} #sec21 .swiper ul li .txt_area p{font-family: 'Noto Sans KR', sans-serif;} #sec21 .swiper ul li .txt_area p.big{color: #222;font-size: 1.5rem; margin: 5px 0;font-weight:700;font-family: 'FlightSans-Bold', sans-serif;} #sec21 .swiper ul li .txt_area p.small{color: #999999; font-size: 1.125rem; font-weight: 400;font-family: 'FlightSans-Regular', sans-serif;} #sec21 .swiper .btn_wrap{padding: 30px; position: absolute; z-index: 4; bottom: 0; left: 50%; transform: translateX(-50%); width: max-content;display: flex; align-items: center;} #sec21 .swiper .btn_wrap>*{} #sec21 .swiper .btn_wrap>ul{display: flex; align-items: center;gap: 10px;} #sec21 .swiper .btn_wrap>ul li:not(:has(.swiper-pagination)){} #sec21 .swiper .btn_wrap>ul li>div:has(img){display: flex; align-items: center; justify-content: center; width: 30px; height: 30px;} #sec21 .swiper .btn_wrap>ul li .swiper_prev{cursor: pointer; } #sec21 .swiper .btn_wrap>ul li .swiper_prev img{} #sec21 .swiper .btn_wrap>ul li .swiper-pagination{position: unset;color: #afafaf;font-size: 1.125rem; display: flex; align-items: center; gap: 1px;} #sec21 .swiper .btn_wrap>ul li .swiper-pagination-progressbar{background:none !important;} #sec21 .swiper .btn_wrap>ul li:has(.swiper-pagination){margin: 0 10px;} #sec21 .swiper .btn_wrap>ul li .swiper-pagination span{display: inline-block; font-size: 1.25rem;font-weight: 500; font-family: 'Montserrat', sans-serif; } #sec21 .swiper .btn_wrap>ul li .swiper-pagination span.swiper-pagination-current{color: #000; padding-right:8px;} #sec21 .swiper .btn_wrap>ul li .swiper-pagination span.swiper-pagination-total{padding-left:8px;} #sec21 .swiper .btn_wrap>ul li .swiper_next{cursor: pointer; } #sec21 .swiper .btn_wrap>ul li .swiper_prev img,#sec21 .swiper .btn_wrap>ul li .swiper_next img{width:100%;} #sec21 .swiper .btn_wrap .control{margin-left: 8px;} #sec21 .swiper .btn_wrap .control a{cursor: pointer; display: flex;transition: all .1s; align-items: center; justify-content: center; width: 25px; height: 25px; border: 1px solid #afafaf;} #sec21 .swiper .btn_wrap .control a.clicked{ background-color: rgb(233, 233, 233);} .item_list1 .thumb img{width:100%;} .item_list1 .info{padding:13px 0 10px; } .item_list1 .info p{margin-bottom:12px; font-size:15px; font-weight:500; } .item_list1 .info .prdname{font-family: 'Noto Sans KR', sans-serif; color:#000;font-weight:400;letter-spacing:-.7px; font-size:15px;} .item_list1 .info .subname{font-family: 'Noto Sans KR', sans-serif; color:#000;font-weight:400;letter-spacing:-.7px; font-size:15px;} .item_list1 .info .prdetc{font-family: 'Noto Sans KR', sans-serif; color:#999; font-size:13px;font-weight:500; } .item_list1 .info .prdprice{} .item_list1 .info .prdprice .price{font-family: 'Lato', sans-serif; font-size:15px; color:#000; font-weight:600;} .item_list1 .info .prdprice strike{font-family: 'Lato', sans-serif; font-size:15px; color:#adadad; display:inline-block; font-weight:500; } .item_list1 .info .prdbtn{} .item_list1 .info .prdbtn>span img{display:inline-block; margin:0 3px} .item_list1 .info .prd_review_conut{color:#a9785b; font-size:14px; font-weight:500} /* 메인 비쥬얼 배너 */ #mainSpot { position:relative; width:1400px; margin: 0 auto;overflow:hidden } #mainSpot .inner { /*margin-left:-952px;*/ top:0; left:0; right:0; width:100%; } #mainSpot .inner .spotSlider ul li{} #mainSpot .inner .spotSlider img{width:100%;border-radius:30px;} #mainSpot .bx-pager { position:absolute; bottom:44px; left:0; right:0; height:11px; text-align:center } #mainSpot .bx-pager .bx-pager-item { display:inline-block; } *:first-child+html #mainSpot .bx-pager .bx-pager-item { display:inline } /* IE7 Hack */ #mainSpot .bx-pager .bx-pager-item a { display:block; width:40px; height:2px; text-indent:-9999em; background:#979797 } #mainSpot .bx-pager .bx-pager-item a.active { background:#fff } #mainSpot .txtArea { position:absolute; bottom:15%; left:10%; width:1200px; z-index:10 } #mainSpot .txtArea span{ color:#fff; font-family: 'Noto Sans KR',sans-serif; transition: all 1s ease; letter-spacing: -2px;} #mainSpot .txtArea .t1 { display:block; font-size:18px; font-weight: bold; font-weight:700; opacity:0; margin-left: -100px} #mainSpot .txtArea .t2 { display:block; padding-top:24px; font-size:46px; opacity:0; margin-left: -200px; font-weight: 300;} #mainSpot .txtArea .t3 { display:block; font-size:46px; opacity:0; margin-left: -300px; line-height: 48px;} #mainSpot .txtArea .t4 { display:block; padding-top:39px; font-size:18px; opacity:0; margin-left: -400px; font-weight: 300;} #mainSpot .txtArea.active .t1 { margin-left:0 ; opacity: 1 } #mainSpot .txtArea.active .t2 { margin-left:0 ; opacity: 1 } #mainSpot .txtArea.active .t3 { margin-left:0 ; opacity: 1 } #mainSpot .txtArea.active .t4 { margin-left:0 ; opacity: 1 } /* 화살표 */ #mainSpot .bx-controls .bx-controls-direction{position: absolute; top: 50%; transform: translateY(-50%); width: 100%;} #mainSpot .bx-controls .bx-controls-direction .bx-prev{ position: absolute; left: 40px; width: 46px; height: 46px; margin: 0; background: url(//skin.makeshop.co.kr/skin/studio/pc/icon/left_arrow.png) no-repeat; text-indent: -9999px; opacity: 0.8;} #mainSpot .bx-controls .bx-controls-direction .bx-next{ position: absolute; right: 40px; width: 46px; height: 46px; margin: 0; background: url(//skin.makeshop.co.kr/skin/studio/pc/icon/right_arrow.png) no-repeat; text-indent: -9999px; } @media (max-width: 1845px) { #mainSpot .bx-controls .bx-controls-direction{bottom: 76px; top: auto; transform: none;} #mainSpot .bx-controls .bx-controls-direction .bx-prev{ left: auto; right: 98px;} } /* 이미지 배너 */ .top_proinfo{padding: 65px 0 180px;} .top_proinfo .mainproinfo{ text-align: center;} .top_proinfo .mainproinfo .lengline{ height: 80px; width: 1px; margin: auto; background: #e5e5e6;} .mainproinfo h1{padding: 20px 0 40px; color: #333333; font-size: 40px; font-family: 'Noto Serif KR', serif; font-weight: 900;} .mainproinfo h3{ padding-top: 26px; color: #4c4c4c; font-size: 18px; font-family: 'Spoqa Han Sans', 'Spoqa Han Sans JP','Noto Serif KR', 'Sans-serif';} .mainproinfo p{ line-height: 31px; color: #808080; font-size: 16px; font-family: 'Noto Sans KR', sans-serif; letter-spacing:-.5px;} .mainproinfo p b{font-size:20px; line-height:40px;} .mainproinfo i{ display: block; padding: 40px 0 70px;} .imgBanner { margin:0 auto;; position:relative; width:1200px; overflow:hidden } .imgBanner img{width: 100%;} /* sec9 */ #sec9{padding:30px 0 150px; width:100%;} #sec9 .sec_inner{position:relative;width:70%; margin: 0 auto; border-radius:30px;} #sec9 h2{font-size:36px; letter-spacing:-.75;} #sec9 .sec9_review{} #sec9 .sec9_review>div{width: 100%;} #sec9 .sec9_review>div>ul{width: 100%;} #sec9 .sec9_review>div>ul>li{flex-grow:1} #sec9 .swiper-slide{width:100% !important;} #sec9 .li_review .rv_main{ width: 100%; border-bottom: 1px solid #e4e4e4;} #sec9 .li_review .rv_main .thumb{width:100%; height:500px !important;} #sec9 .li_review .rv_main .thumb a{display: block; width: 100%; height: 100%; } #sec9 .li_review .rv_main .thumb a img{width: 100%; height: 100%; object-fit: cover;} #sec9 .li_review .rv_main .thumb a img:first-child{display:none;} #sec9 .li_review .rv_main .rv_main_cont{width: 100%; padding: 20px 0; max-width:280px} #sec9 .li_review .rv_main .rv_main_cont .rv_info{margin-bottom: 7px;color:#000; font-size: 15px;font-weight: 500;} #sec9 .li_review .rv_main .rv_main_cont .rv_cont{font-size: 14px; font-family: 'Noto Sans KR', sans-serif; text-overflow: ellipsis; overflow: hidden; font-weight:400; color:#999999; line-height:1.7; } #sec9 .li_review .rv_mini{width: 100%; display: flex; align-items: center; justify-content: left; gap:15px; margin-top:20px } #sec9 .li_review .rv_mini ul { display:flex; flex-direction:column; gap:8px;} #sec9 .li_review .rv_mini ul li {font-family: 'Noto Sans KR', sans-serif;font-size: 13px; color: #000;} #sec9 .li_review .rv_mini ul li{display:flex; align-items:center} #sec9 .li_review .rv_mini ul li span {font-family: 'Jost', sans-serif;display:flex; align-items:center; color:#000; font-size:16px; font-weight: 500; } #sec9 .li_review .rv_mini ul li span img{display:inline-block; margin-right:8px;} #sec9 .swiper_btn_prev,#sec9 .swiper_btn_next{position: absolute;z-index: 2; cursor: pointer; top: 50%; transform: translateY(-50%);} #sec9 .swiper_btn_prev{left:-110px } #sec9 .swiper_btn_next{right:-110px} /* sec11 */ #sec11{ padding:150px 0; width:100%; overflow: hidden; background:#fff;/*background:rgb(247 242 234);*/} #sec11 .subTx{font-size: 22px; color: #191919; font-weight: 500; letter-spacing: -1px; margin-top: 30px; padding-bottom:20px;line-height:30px; text-align:center;} #sec11 .mainTx {font-size: 2.6vw; line-height: 1.3; letter-spacing: -0.2px; margin-bottom:80px;text-align:center; font-weight:700;font-family: 'FlightSans-Bold', sans-serif;} #sec11 .sec11_banner{margin: 0 auto;/*max-width: 1920px;*/} #sec11 .sec11_banner .swiper{overflow: visible !important;} #sec11 .sec11_banner .swiper ul{} #sec11 .sec11_banner .swiper ul li {width:(100 - 60%) / 2) !important; height:40%;background:no-repeat center center; background-size: cover; position:relative; text-align:center;} #sec11 .sec11_banner .swiper ul li a{display: block; width: 100%; height: 100%; position:relative;} #sec11 .sec11_banner .swiper ul li a .bg{position:absolute; top:50%; left:0px; transform: translateY(-50%);font-size:6vw; font-weight:700;color:rgba(0,0,0,0.05);text-align:center; width:100%; letter-spacing:-0.05em;} #sec11 .sec11_banner .swiper ul li a img {width:50%; filter: drop-shadow(rgba(0, 0, 0, 0.15) 7px 7px 10px);} #sec11 .sec11_banner .swiper ul li a p{ color: #191919;background:#fff; padding-top:40px;} #sec11 .sec11_banner .swiper ul li a p .tit{font-size: 20px; display:block; padding-bottom:10px; letter-spacing: -.2px; font-weight:400;font-family: 'FlightSans-Regular', sans-serif;} #sec11 .sec11_banner .swiper ul li a p .tit_tag{ font-size:2rem; /*padding-bottom:35px;*/display:block; font-weight:700;font-family: 'FlightSans-Bold', sans-serif;} #sec11 .sec11_banner .swiper ul li a p .tit_text{font-size: 24px;} #sec11 .swiper-slide{transform: scale(.9);opacity:.45; } #sec11 .swiper-slide.swiper-slide-active{opacity:1 !important; transform: scale(1.1);} #sec11 .slide_move{position: absolute;top: calc(50% - 2rem); left:50%; width:55vw;transform: translate(-50%,-50%);z-index: 2;} #sec11 .swiper_btn_prev{position: absolute; top: 50%; left: -50px; right:auto; z-index: 10;cursor: pointer;} #sec11 .swiper_btn_next{position: absolute; top: 50%; right: -50px; left:auto; z-index: 10; cursor: pointer;} /*상품리스트*/ #sec19{ margin:100px 0 200px;font-family:'Pretendard', sans-serif;} #sec19 .sec19_cont{} #sec19 .sec19_cont>div{display: flex;} #sec19 .sec19_cont>div .tit{width: 20%;display: flex; flex-direction: column;align-items: flex-end; padding-right: 30px;} #sec19 .sec19_cont>div .tit h3{font-size: 50px;font-family: "Bebas Neue", sans-serif; color: #000; font-weight: 400; margin-bottom: 25px; line-height:45px;} #sec19 .sec19_cont>div .tit a.more{font-size: 13px; color: #323232; display:flex; align-items:center; justify-content:center; gap:15px; line-height:20px; border:1px solid #323232; padding: 10px 20px; text-align: center; border-radius: 25px; font-weight: 500; letter-spacing: -.4px;transition: all .5s;} #sec19 .sec19_cont>div .tit a.more:hover{background:#323232; color:#fff;} #sec19 .sec19_cont>div .tit a.more:hover span{color:#fff;} #sec19 .sec19_cont>div .tit a.more span{color: #323232; font-size: 20px; font-weight: 400; float:right;transition: all .5s; display:flex; width:1em; height:1em; line-height:.8;} #sec19 .sec19_cont>div .item_area{width: 80%; counter-reset:title;} #sec19 .sec19_cont>div .item_area .swiper{padding-bottom:50px} #sec19 .sec19_cont>div .item_area .swiper>ul{} #sec19 .sec19_cont>div .item_area .swiper>ul>li{width:20%} #sec19 .swiper .swiper-pagination{top: unset; left: 50%; transform: translateX(-50%); bottom: 0; height:1px; background:rgba(0,0,0,.15)} #sec19 .swiper-pagination-progressbar-fill{background-color:#333} #sec19 .sec19_cont .sec19_1{margin-bottom:150px} #sec19 .sec19_cont .sec19_2{} .item_list19 {border-left:1px solid #1b1b1b; padding:0 15px; margin:0 !important;} .item_list19 .thumb img{width:100%;} .item_list19 .info .ranking{font-size:40px;font-family: "Bebas Neue", sans-serif; line-height:37px;} .item_list19 .info .ranking:before { counter-increment:title; content:counter(title);} .item_list19 .info {padding-bottom:15px;} .item_list19 .info p{margin-bottom:12px; font-size:15px; font-weight:500; } .item_list19 .info .prdname{ color:#000;font-weight:400;letter-spacing:-.7px; font-size:15px; padding-top:30px;} .item_list19 .info .subname{ color:#000;font-weight:400;letter-spacing:-.7px; font-size:15px;} .item_list19 .info .prdetc{ color:#999; font-size:13px;font-weight:500; } .item_list19 .info .prdprice{} .item_list19 .info .prdprice .price{font-size:15px; color:#000; font-weight:600;} .item_list19 .info .prdprice strike{ font-size:13px; color:#787878; display:inline-block; font-weight:300; margin-left:10px;} .item_list19 .info .prdbtn{} .item_list19 .info .prdbtn>span img{display:inline-block; margin:0 3px} .item_list19 .info .prd_review_conut{color:#a9785b; font-size:14px; font-weight:500} /* 지도 */ .map_wrap{ padding: 150px 0; background: #191919; font-family:'Noto Sans KR', sans-serif;} .map_wrap .map_area{width: 80%; margin: 0 auto;} .map_wrap .map_area:after{content:''; display:block; clear:both;} .map_wrap .map_area .map_left{float: left; width:31%; margin-right:3.5%;} .map_wrap .map_area .map_left:last-child{margin-right:0;} .map_wrap .map_area .map_left .tit{color:#fff; font-size:42px;padding-bottom:15px; font-weight:600;} .map_wrap .map_area h3{font-size:50px; text-align:left !important; color:#fff;font-weight:700;} .map_wrap .map_area h4{color:#fff; font-size:20px;border-bottom:1px solid #fff;padding-bottom:50px;margin-bottom:40px;} .map_wrap .map_area .map_left .map_info{ padding: 20px 0;} .map_wrap .map_area .map_left .map_info p{ margin-bottom:10px; color: #E3AD62; font-size: 20px; font-weight:600; } .map_wrap .map_area .map_left .map_info span{ display: block; margin: 10px 0 0; color: #ddd; font-size: 18px; font-weight: 300; line-height: 26px;} .map_wrap .map_area .map_left .map_info .tel{font-size:35px; font-weight:600;font-family: 'Montserrat' , sans-serif;line-height:40px; padding-bottom:20px;letter-spacing:1.5px;} .map_wrap .map_area .map_main{ float: left; border-radius:20px;} .root_daum_roughmap .map{overflow:visible !important;} .root_daum_roughmap .cont{display:none !important;} /* BASIC css end */