@charset "utf-8";
#wrap #header .headerBottom_wrap{border-bottom:0}
/* 메인 롤링이미지 */
#big {width: 100%;  margin: 0 auto;}
#big .swiper-wrapper{ position: relative;width: 100%;}
#big .swiper-slide  a img{width: 100%;}
#big .swiper-button-prev { position: absolute; left: 7%; z-index: 10; background:none; width: 44px; height: 84px;margin-top: -42px;}
#big .swiper-button-next { position: absolute; right: 7%; z-index: 10; background:none; width: 44px; height: 84px;margin-top: -42px;}
#big .swiper-button-next:after,#big .swiper-button-prev:after{font-size:0}
#big .swiper-button-prev i, #big .swiper-button-next i {opacity: 0;}

#big .swiper-button-prev::after,
#big .swiper-button-next::after{display:block;content:'';border-style: solid;border-color: #ccc; border-width:  0 3px 3px 0  ;    padding: 30px;transform: rotate(135deg);position: absolute;top: 12px;left: 12px}
#big .swiper-button-next::after{border-width:  3px 0 0 3px;left: auto;right: 12px;}
/* 타이틀 */
.cateTit { padding:100px 0 60px; position:relative; text-align:center }
.cateTit h3{color: #242424; font-family:'Gmarket Sans'; font-size: 40px; font-weight: 700; letter-spacing: -2px;}
.cateTit .line{margin: 25px auto 0; width: 35px;height:4px;font-size:0; background:#1c1c1c }
.cateTit span{font-size: 15px; color: #999999; font-family: 'Noto Sans KR', sans-serif; letter-spacing: -1px;}
/* 상품 목록 영역 */
/* .item-wrap */
.item-wrap { overflow: hidden;/*  width:1100px  */}
.pageContent .item-wrap {padding-top: 25px;clear: both;}
.item-wrap .item-hd { margin: 40px 0 20px 0 }
.item-wrap .nbg { background: none; text-align: center; }
.item-wrap .item-info { zoom: 1; overflow: hidden; padding: 35px 0 10px; margin-bottom:10px }
.item-wrap .item-info:after { display:block; clear:both; content:'' }
.item-wrap .item-info .item-total { float: left; font-size:14px; color:#7b7b7b }
.item-wrap .item-info .item-total span { color: #0e0d0d }
.item-wrap .item-info .item-order { float: right }
.item-wrap .item-info .item-order li { float: left; padding: 0 15px; line-height:12px; border-right:1px solid #ddd }
.item-wrap .item-info .item-order li.nobg { padding-right:0; border-right:none }
.item-wrap .item-info .item-order li a { font-size: 12px; color:#a6a6a6; line-height:12px; vertical-align:top }
.item-wrap .item-info .item-order li a .on { color: #111 }
.item-wrap .item-cont .nothing{height: 450px;border: 1px solid #ddd;background-color: #f9f8f7;text-align: center;line-height: 450px;margin-bottom: 100px;margin-left: 40px;}
.item-wrap .item-cont { overflow: hidden;margin-left: -40px; }
.item-wrap .item-cont:after { content: ""; display: block; clear: both }
.item-wrap .item-cont .item-list { margin-left: 40px; float:left; width:295px;width: calc(100%/4 - 40px);}

.item-wrap .item-cont .item-list .thumb { width:100%; overflow:hidden }
.item-wrap .item-cont .item-list .thumb img { width:100%;}
.item-wrap .item-cont .item-list .prd-info { padding:20px 0 60px; overflow:hidden }
.item-wrap .item-cont .item-list .prd-ico img { margin:2px }
.item-wrap .item-cont .item-list .prd-name { padding:0; margin-bottom: 15px; border-bottom: 1px solid #e6e6e6;padding-bottom:15px}
.item-wrap .item-cont .item-list .prd-name a { display:block; color:#242424;/* line-height:16px;*/ font-weight: 500; text-overflow:ellipsis; word-wrap:normal; font-size: 18px;/* font-family: "맑은 고딕",'Malgun Gothic',sans-serif;**/ }
.item-wrap .item-cont .item-list .prd-price {  }
.item-wrap .item-cont .item-list .prd-price strike { color:#bfbfbf; font-size: 17px; font-weight: bold; margin-right: 12px; }
.item-wrap .item-cont .item-list .prd-price .price { color: #242424; font-size: 17px; font-weight: bold; }
.item-wrap .item-cont .item-list .prd-color { padding-top:5px }
.item-wrap .item-cont .item-list .prd-subname {margin-bottom:10px; color:#999;font-size: 15px; }
.item-wrap .item-cont .item-list .MK-product-icons img { vertical-align: middle }
.item-wrap .item-cont .nomg { padding-right: 0px }
.item-wrap .item-page { margin-top: 50px; text-align: center; }
.item-wrap .item-page a { padding: 0 5px }
.item-wrap .item-page a:hover, .item-wrap .item-page a.now { color: #111; font-weight: bold; letter-spacing: -1px; }
.item-wrap .item-cont .item-list .prd-subname,.item-wrap .item-cont .item-list .prd-name a{display: -webkit-box;overflow: hidden;text-overflow: ellipsis;word-break: break-all;-webkit-box-orient: vertical; -webkit-line-clamp: 2;height:calc(1em * 1.2 * 2);line-height:1.2;}
.item-wrap .item-cont .item-list .prd-price .soldout{color:#fff;line-height:20px ;display:inline-block;padding:0 11px;font-weight:bold;background:#ceb389;height:21px;font-size:12px;font-family:'Noto Sans KR';letter-spacing:-1px;border-radius:2.5em}

.product-wrap { margin:0 auto; position:relative; max-width:1300px ;width: 95%;}

.item-wrap .item-cont .item-list .thumb{position: relative;}
.item-wrap .item-cont .item-list .thumb a::after{content: '';display: block;position: absolute;background: #e72471 url(../img/common/tag.png);width: 60px;height: 60px;top: 0;right: 0;}


/* 리뷰영역 */
.reviewarea{background: url(../img/main/darksea.jpg) top center no-repeat; background-color: #f5f5f5;padding-bottom: 150px;}
.review_recmd .cateTit .line{background: #fff}
.review_recmd .cateTit h3{color: #fff}
.reviewarea figure{ max-width: 1300px; margin: 0 auto 30px;width: 95%;background-color: #fff;}
.reviewarea figure:after{content:''; display:block; clear:both}
.reviewarea figure img{max-width: 100%;  float: left;}
.reviewarea figure figcaption{width:auto; height: 440px; float: left; background: #fff;}
.reviewarea figure figcaption h3{font-size: 30px; color: #242424; margin: 80px 60px 22px;}
.reviewarea figure figcaption p{color: #595959; font-size: 17px; font-weight: 300; line-height: 31px; margin: 0 60px;}
.reviewarea figure figcaption span{border: 1px solid #dddddd; display: inline-block; margin: 35px 60px 0;}
.reviewarea figure figcaption span a{display:block; padding: 13px 54px; color: #000;  font-weight: 700; letter-spacing: 5px;}

/* 동영상 영역 */
.video_box{text-align: center;max-width: 885px;margin: 0 auto;width: 95%;}
.videoArea{margin:  0 auto ;height: 0;position: relative;padding-top: 56.271%;}
.videoArea iframe{position: absolute;top: 0;left: 0;width: 100%  !important;bottom: 0;height: 100% !important;}

/* 탭 상품 기능 */
.tabarea{max-width: 1300px; margin: 0 auto;width: 95%;}
.tab_in_wrap.active{ border:0;}
.tab{ display: inline-block;  padding-bottom: 50px;display: table;width: 100%;}
.tab > li{font-size: 0; border: 1px solid #e9e9e9; border-left: 0; box-sizing: border-box; border-bottom: 1px solid #ccc;display: table-cell;}
.tab > li:first-of-type{border-left: 1px solid #e9e9e9;}
.tab > li > span{ display: block; height: 54px; line-height: 54px; text-align: center; cursor: pointer; box-sizing: border-box;  color: #666; font-size: 15px;}
.tab li.live{ font-weight: bold; border: 1px solid #000 ; border-bottom: 0px ;}
.tab li.live span{ color: #000;}
.item_container .item-wrap{ display: none;}
.item_container .item-wrap.active{ display: block;}


/* 인스타 영역 */
.instaArea{max-width: 1300px; margin: 20px auto 0; text-align: center; /*border-top: 1px solid #e6e6e6;*/ padding: 100px 0 70px;width: 95%;}
.instaArea h3{color: #242424; font-size: 40px; font-family: 'Montserrat',sans-serif; padding-bottom: 34px;}
.instaArea h3 img{padding: 8px 10px 0 0; vertical-align: text-top;}


@media screen and (max-width:1200px) {
.item-wrap .item-cont {margin-left: -25px; }
.item-wrap .item-cont .item-list { margin-left: 25px;width: calc(100%/4 - 25px);}
.item-wrap .item-cont .item-list .prd-info{padding: 10px 0 20px;}
.item-wrap .item-cont .nothing{margin-left: 25px;}

.reviewarea {padding-bottom: 80px;}
.reviewarea figure{margin-bottom: 0;}
.reviewarea figure img,
.reviewarea figure figcaption{width:50%;}
.reviewarea figure figcaption{height: auto;}
.reviewarea figure figcaption h3{margin: 8% 0 5% 7%;}
.reviewarea figure figcaption span{margin:8% 0 5% 7%;}
.reviewarea figure figcaption p{font-size: 15px;line-height: 1.4;margin: 0 5%;margin-left: 7%;}
.instaArea{margin-top: 0;padding: 50px 0 ;}
}
@media screen and (max-width:800px) {
#big .swiper-button-prev {left: 3%;height: 60px; margin-top: -30px;}
#big .swiper-button-next {right: 3%;height: 60px;margin-top: -30px;}
#big .swiper-button-prev::after,
#big .swiper-button-next::after{padding: 18px;top: 10px;}

.tab{padding-bottom: 0;}
.tab{text-align: center;width: 100%;display: inline-block;-webkit-box-sizing: border-box;box-sizing: border-box;white-space: nowrap;overflow-y: hidden;overflow-x: auto;-webkit-overflow-scrolling: touch;text-align: center;list-style: none;font-size: 0;padding: 0 10px 0 0 ;height: 60px;}
.tab::-webkit-scrollbar{display:none;}
.tab li{list-style-type: none;margin: 0;padding: 0;position:relative;box-sizing: border-box;display: inline-block;vertical-align: top;height: 100%;border: none;}
.tab li span{position:relative;width: 100%;height: 100%;display: flex;flex-wrap: wrap;align-items: center;font-size: 16px;font-weight: 400;padding:0 15px;box-sizing:border-box;letter-spacing:-1px;}
.tab > li:first-of-type,
.tab li.live{border: none}

.tab li span::after{display: block;content: '';position: absolute;bottom: 10px;left: 50%;right: 50%;height: 2px;background-color: #e72471;opacity: 0;transition: .25s;width: auto;}
.tab li span:hover::after,
.tab li.live span::after{left: 15px;right: 15px;height: 2px;opacity: 1;width: auto;}
.tab li + li:before{display: inline-block;content: "";position: absolute;top:50%;left: -1px;width: 1px;height: 10px;background: rgba(0,0,0,0.13);vertical-align: top;transform:translateY(-50%);}
.tab { scrollbar-width: thin;  scrollbar-color: #e8e8e8 transparent;}
.tab::-webkit-scrollbar {  height:5px;}
.tab::-webkit-scrollbar-track {  background: #d8d7d6; }
.tab::-webkit-scrollbar-thumb {  background: #383736;   border-radius:0;}
.tab > li:first-of-type span{ padding-left: 0;}
.tab > li:first-of-type span:hover::after,
.tab > li.live:first-of-type span::after{left: 0;}

.item-wrap .item-cont {margin-left: -30px; }
.item-wrap .item-cont .nothing{margin-left: 30px;height: 300px;line-height: 300px;margin-bottom: 50px;}
.item-wrap .item-cont .item-list { margin-left: 30px;width: calc(100%/2 - 30px);}
.item-wrap .item-cont .item-list .prd-name{margin-bottom: 8px;padding-bottom: 8px;}
.item-wrap .item-cont .item-list .prd-name a{font-size: 16px;}
.item-wrap .item-cont .item-list .prd-subname{font-size: 14px;}
.cateTit { padding:75px 0 30px; }
.cateTit h3{ font-size: 32px;letter-spacing: -1px;}
.cateTit .line{margin-top: 15px}
.reviewarea figure img{width:100%;float: none;}
.reviewarea figure figcaption{width:auto;float: none;}
.reviewarea figure figcaption h3{margin: 7% 0 5% 6%;}
.reviewarea figure figcaption span{margin:5% 0 6% 6%;}
.reviewarea figure figcaption p{margin-left: 6%;font-size: 16px;}
.reviewarea figure figcaption p br{display: none;}
.instaArea {padding: 70px 0 50px;}
.instaArea h3{font-size: 30px;}

}
@media screen and (max-width:500px) {
.cateTit { padding:60px 0 25px; }
.cateTit h3{ font-size: 28px;}
}
/* mainRoad */
.mainRoad{position: relative;background-color: #333;padding: 130px 0;height: 700px;box-sizing: border-box;}
.mainRoad h2{color: #fff;font-size: 42px;font-family:'Gmarket Sans';letter-spacing: -2px;margin-bottom: 38px;}
.roadInfo p {color: #fff;font-size: 22px;font-family:'Gmarket Sans';letter-spacing: 0;padding-bottom: 20px;padding-left: 35px;line-height: 1.3;position: relative;}
.roadInfo p em{font-weight: 700;font-style: normal;position: absolute;top: 0;left: 0;}
.roadBtn{overflow: hidden;padding-top: 5px;width: 370px;}
.roadBtn a{display: block;background-color: #fff;height: 60px;line-height: 58px;padding-left: 27px;font-size: 18px;font-weight: 400;position: relative;margin-top: 10px;}
.roadBtn a.i3{color: #fff;background-color: #5c5ae1;}

.roadBtn a span{display: block;font-size: 32px;position: absolute;line-height: 60px;top: 0;right: 15px;}
.mainRoad .wrapper{position: static;}
.roadMap{position: absolute;top: 0;right: 0;bottom: 0;width: calc(50% + 190px);background-color: #999;}
.roadMap .root_daum_roughmap{border:0;width: 100% ;position: absolute;top: 0;right: 0;left: 0;bottom: 0;}
@media screen and (max-width:1250px) {
.mainRoad h2{font-size: 37px;}
.mainRoad p{font-size: 18px;}
.roadBtn{width: 315px;}
}
@media screen and (max-width:1100px) {
.mainRoad{padding: 50px 0 2.5%;height: auto;}
.roadBtn{width: auto;width: auto;margin-bottom: 2.5%;}
.roadBtn a{float: left;width: calc((100% - 27px * 2)/2);margin: 0;}
/* .roadBtn a.i2{margin: 0 1%;} */
.roadMap{width: auto;position: relative;top: auto;bottom: auto;left: auto;right: auto;padding-top: 66%;height: 0;}
}
@media screen and (max-width:580px) {
.roadBtn a{font-size: 16px;padding-top: 50px;line-height: 20px;height: 20px;padding-bottom: 10px;text-align: center;padding-left: 0;width: calc(100%/2);}
.roadBtn a span{top: 0;bottom: auto;height: 45px;right: 0;width: auto;left: 0;line-height: 49px;}
}
@media screen and (max-width:350px) {
.roadBtn a{font-size: 14px;}
}