/* BASIC css start */
/*메인배너*/
#section1{overflow:hidden;}
#section1 .main_banner li:nth-of-type(1) ~ li{display: none;}
#section1 .slick-prev{width:25px; height:50px; background:url('/design/goodsk/wib/img/main/icon_arrow_prev_b.png')no-repeat 50% 50%; position:absolute; left:50%; margin-left:-600px; top:43%; z-index:10; transition:all 0.3s ease; opacity:0;}
#section1 .slick-next{width:25px; height:50px; background:url('/design/goodsk/wib/img/main/icon_arrow_next_b.png')no-repeat 50% 50%; position:absolute; right:50%; margin-right:-600px; top:43%; z-index:10; transition:all 0.3s ease; opacity:0;}
#section1:hover .slick-prev{opacity:1; margin-left:-630px;} 
#section1:hover .slick-next{opacity:1; margin-right:-630px;}
#section1 .slick-dots{position:absolute; bottom:7%; height:3px; width:100%; text-align:center;}
#section1 .slick-dots>li{margin:0 5px; display:inline-block ! important;}
#section1 .slick-dots>li>button{width:44px; height:3px; background:#fff;}
#section1 .slick-dots li.slick-active button{background:#000;}
#section1 .slick-list{width:2560px; left:50%; margin-left:-1280px;}
#section1 .slick-list:after{display:none;}


#section2{width:1200px; margin:0% auto 0;}
#section2 .sub-banner1{float:left; width:50%;}
#section2 .b-right a{float:left;}
#section2 .sub-banner1 a img{transition:all 0.3s ease-in-out;}
#section2 .sub-banner1 a img:hover{opacity:0.6;}
#section2 .clear{clear:both;}

/*베스트 상품*/
#section3{width:1200px; margin:0 auto;}
.item-wrap{width:100%;}
.cateTit{padding:0;}
.cateTit h3{margin:8% 0 3%; font-size:28px; color:#333232; font-family: "Josefin Sans", "Malgun Gothic", "맑은 고딕", "Nanum Gothic", "나눔 고딕", "Apple SD Gothic Neo", sans-serif;}
.cateTit h3 .su {font-weight:normal; letter-spacing:-2px; }
.cateTit h3 span {font-weight:normal ;font-size: 24px; color: #737373;}
#section3 .item-cont{width:100%;}
#section3 .item-cont .item-list{width:calc(25% - 20px); padding:0 10px; margin-bottom:8%;}
#section3 .item-cont .item-list .thumb{width:100%; height:auto; position:relative;}
#section3 .item-cont .item-list .thumb img{width:100%; height:auto;}
.thumb .item-view{position:absolute; right:0; top:15px; background:#fff; box-shadow:1px 1px 2px #c5c5c5; opacity:0; visibility:hidden; transition:all 0.3s ease-in-out;}
.thumb .item-view li{}
.thumb .item-view li a{display:inline-block; padding:9px 11px; position:relative;}
.thumb .item-view li a img{}
.thumb .item-view li a span{background:#333232; color:#fff; font-size:15px; font-weight:300; padding:2px 9px 1px; border-radius:15px; position:absolute; right:55px; top:5px; min-width:100px; display:block; opacity:0; visibility:hidden; transition:all 0.3s ease-in-out;}
.thumb:hover .item-view{right:15px; opacity:1; visibility:visible;}
.thumb .item-view li:hover span{opacity:1; visibility:visible;}
.thumb .item-view li:hover span:hover{background:#fff; color:#222;}
.discount-rate{position:absolute; left:15px; top:15px; width:50px; height:50px; display:block; text-align:center; background:#333232; border-radius:50%; color:#fff; line-height:51px; font-size:15px;}

.item-cont .item-list .prd-info{padding:10px 0 0 0 ! important; text-align:left ! important;}
.item-cont .item-list .prd-name a{font-size:17px; color:#333 ! important;}
.item-cont .item-list .prd-subname{padding:10px 10px 0 0; font-size:13px; line-height:18px; border-top:none ! important; margin-top:0 ! important; color:#333 ! important;}
.item-cont .item-list .prd-price{padding-top:13px; font-family: "Josefin Sans", "Malgun Gothic", "맑은 고딕", "Nanum Gothic", "나눔 고딕", "Apple SD Gothic Neo", sans-serif ! important;}
.item-cont .item-list .prd-price strike{font-size:17px; color:#888 ! important; padding-right:7px;}
.item-cont .item-list .prd-price .price{font-size:17px; color:#4c4c4c ! important; font-weight:600;}
.prd-preview{display:none;}


/*서브배너02*/
#section4{width:100%; font-size:0; margin:0 auto 11%;}
#section4 .sub-banner2{width:50%; display:inline-block;}
#section4 .sub-banner2 img{width:100%; transition:all 0.3s ease-in-out;}
#section4 .sub-banner2 img:hover{opacity:0.6;}

/*신상품*/
#section5{width:1200px; margin:0 auto;}
#section5 .item-cont{width:100%; font-size:0;}
#section5 .item-cont .item-list{display:inline-block; padding:0; width:25%; margin-bottom:8%; position:relative; vertical-align:top; float:none;}
#section5 .item-cont .item-list:nth-child(1), #section5 .item-cont .item-list:nth-child(6){width:50%;}
#section5 .item-cont .item-list:nth-child(4) ~ .item-list{vertical-align:bottom; margin-top:-26%;}
#section5 .item-cont .item-list .thumb{width:calc(100% - 20px); height:auto; margin:0 10px; position:relative;}
#section5 .item-cont .item-list .thumb img{width:100%; height:auto;}
#section5 .new-tab{width:100%; text-align:center; margin-bottom:3%; font-size:0;}
#section5 .new-tab li{margin:0 1.5%; display:inline-block;}
#section5 .new-tab li a{color:#575757; font-size:18px; position:relative; cursor:pointer; display:block; line-height:25px;}
#section5 .new-tab li a:after{content:""; position:absolute; bottom:-3px; left:50%; transform:translateX(-50%); width:0%; height:1px; background-color:#666; transition:all 0.3s ease;}
#section5 .new-tab li.on a{color:#000;}
#section5 .new-tab li.on a:after{width:100%;}
#section5 .new-tab li:hover a:after{width:100%;}
#section5 .new-cont{display:none;}
#section5 .step1{display:block;}

/*갤러리*/
#section6{width:100%; padding: 5% 0 7%; background:#f2f2f2;}
#section6 .gallery_title h3{font-size:28px; color:#333232; margin-bottom:3%; font-weight:bold; text-align:center;}
#section6 .gallery_img{font-size:0; z-index:10 ! important;}
#section6 .gallery_img li{position:relative; display:inline-block; width:33.33%;}
#section6 .gallery_img li a{}
#section6 .gallery_img li img{width:100%;}
#section6 .gallery_img li span{position:absolute; bottom:26px; left:50%; width:88%; margin-left:-46%; background:rgba(255,255,255,0.8); padding:15px; display:block; font-size:17px; letter-spacing:-0.5px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; color:#333;}

#section6 .slick-slider .slick-list{padding:0 29.5% !important; position: relative;}
#section6 .slick-slider .slick-list::before,.slick-slider .slick-list:after{content: ""; display: block;	position: absolute;	background: rgba(0,0,0,0.4); width: 28.8% ;	height: 100%; z-index: 1; left: 0; top: 0;}
#section6 .slick-slider .slick-list:after{left: auto; right: 0;}
#section6 .slick-slider .slick-slide{width: 33.3333%; position: relative; padding: 0 0.22%;}
#section6 .slick-slider .slick-arrow{position:absolute; z-index:9; width:26px; height:49px; top:50%; font-size:0;}
#section6 .slick-slider .slick-prev{background: url('/design/goodsk/wib/img/icon/icon_arrow_prev_w.png') no-repeat; left: 26%;}
#section6 .slick-slider .slick-next{background: url('/design/goodsk/wib/img/icon/icon_arrow_next_w.png') no-repeat; right: 26%;}


/*리뷰*/
#section7{width:1200px; margin:0 auto 7%;}
#section7 .review_title{text-align:center; margin:8% 0 3% 0;}
#section7 .review_title h3{font-size:28px; color:#333232; font-weight:bold;}
#section7 .review_title p{font-size:15px; color:#565656; margin-top:12px;}
#section7 .review_title a{display:inline-block; margin-top:25px; background:#4f4e4e; width:184px; height:48px; line-height:48px; color:#fff; font-size:14px; font-weight:bold;}
#section7 .review_img{font-size:0; position:relative;}
#section7 .review_img > li{display:inline-block; margin:0 10px; width:calc(25% - 22px); vertical-align:top; border:1px solid #ddd;}
#section7 .review_img > li img{width:100%;}
#section7 .review_img > li:nth-of-type(4) ~ li{display:none;}
#section7 .prd-info{padding:20px;}
#section7 .prd-subject{font-size:14px; color:#313131; margin-bottom:5px;}
#section7 .prd-cont{font-size:14px; line-height:22px; color:#929292; margin-bottom:15px; letter-spacing:-1px;}
#section7 .prd-name{font-size:14px; color:#929292;}
#section7 .prd-name span{margin-left:10px; padding-left:10px; border-left:1px solid #ddd; display:inline-block;}
#section7 .slick-list{padding-top:30px;}
#section7 .slick-list:after{display:none;}
#section7 .slick-slide img{width:100%;}
#section7 .slick-slide{margin:0 10px; border:1px solid #ddd; transition:all 0.5s;}
#section7 .slick-slide:hover{margin-top:-30px; box-shadow:1px 2px 15px #ccc;}
#section7 .slick-prev{position:absolute; left:-50px; top:45%; width:25px; height:50px; background:url('/design/goodsk/wib/img/main/icon_arrow_prev_b.png') no-repeat;}
#section7 .slick-next{position:absolute; right:-50px; top:45%; width:25px; height:50px; background:url('/design/goodsk/wib/img/main/icon_arrow_next_b.png') no-repeat;}

/*동영상*/
#section8{width:1200px; margin:0 auto; margin-bottom:7%; font-size:0;}
#section8 .play_banner{width:590px; display:inline-block; overflow:hidden; position:relative;}
#section8 .play_banner_l{margin-right:20px;}
#section8 .play_banner img{transition:transform .3s cubic-bezier(0.645,0.045,0.355,1); width:100%; transform:scale(1.08);}
#section8 .play_banner:hover img{transition:transform 1s cubic-bezier(0.33,0.02,0,0.93); transform:scale(1.06) translateX(3%);}
#section8 .play_banner:before, #section8 .play_banner:after{content:""; display:block; position:absolute; border:3px solid #fff; width:84px; height:84px; border-radius:50%; box-sizing:border-box; top:calc(50% - 42px); left:calc(50% - 42px); transition:all 0.4s; z-index:1;}
#section8 .play_banner:after{border:none; background:url('/design/goodsk/wib/img/icon/icon_play.png')no-repeat 57% 50%;}
#section8 .play_banner:hover::before{opacity:0; transform:scale(0.9);}
#section8 .video{position:fixed; background:rgba(0,0,0,0.5); width:100%; height:100%; top:0; left:0; z-index:99; display:none;}
#section8 .video .video-play{width:950px; height:540px; position:absolute; top:calc(50% - 270px); left:calc(50% - 475px); z-index:100;}
#section8 .video .video-play iframe{width:100%; height:100%;}

.close_pop{
	width: 41px;
	height: 41px;
	display: block;
	background: url('/design/goodsk/wib/img/icon/icon_close_w.png') no-repeat;
	position: fixed;
    top: 50%;
    right: 50%;
    z-index: 100;
    margin-top: -330px;
    margin-right: -475px;
	display: none;
	cursor: pointer;
}

/*추천상품*/
#section9{width:1200px; margin:0 auto 5%;}
#section9 .cateTit h3{margin-top:0;}
#section9 .item-cont{width:100%;}
#section9 .item-list{width:50%; border:1px solid #ddd; box-sizing:border-box; margin:-1px -1px 0 0; padding:15px;}
#section9 .thumb{width:235px; height:235px; float:left; position:relative; margin-top:14px;}
#section9 .thumb img{width:100%; height:100%;}
#section9 .prd-info{float:left; width:300px; height:200px; padding:0; text-align:left; display:table;}
#section9 .prd-info ul{width:100%; height:175px; display:table-cell; vertical-align:middle;}




/*GOODS PRODUCT*/
#section10 {width:1200px; margin: -6% auto 5% ; }
#section10 .sub-banner1{float:left; width:33.3%;}
#section10 .b-left a{float:left;}
#section10 .b-left a{float:middle;}
#section10 .b-right a{float:right;}
#section10 .sub-banner1 a img{transition:all 0.3s ease-in-out;}
#section10 .sub-banner1 a img:hover{opacity:0.6;}
#section10 .sub-banner1 a img.center {margin-left:5px}
#section10 .clear{clear:both;}




/*연락처 배너*/
#section11 {width:1200px; margin: 1% auto 0 ; }




/*소개 배너*/
#section12 {width:1200px; margin: 1% auto 0 ; }




/*인스타*/
#section13 {width:1200px; margin: auto; }















/* BASIC css end */

