/* BASIC css start */
/* 메인 비쥬얼 배너 */
#mainSpot { position:relative; width:100%; height:500px; overflow:hidden }
#mainSpot .inner { margin-left:-960px; position:absolute; top:0; left:50%; width:1920px; height:500px }
#mainSpot .spotSlider .slick-arrow { margin-top:-27px; position:absolute; top:50%; width:60px; height:60px; font-size:0; z-index:1 }
#mainSpot .spotSlider .slick-prev { left:50%; margin-left:-700px; background:url(/design/doobobiz/main/main-slide-arr.png) no-repeat 0 0 }
#mainSpot .spotSlider .slick-next { right:50%; margin-right:-700px; background:url(/design/doobobiz/main/main-slide-arr.png) no-repeat 0 -60px }
#mainSpot .spotSlider .slick-dots { position:absolute; bottom:20px; left:50%; }
#mainSpot .spotSlider .slick-dots li { display: inline-block; width: 10px; height: 10px; background-color: rgba(0,0,0,0.2); margin: 0 6px; border-radius: 20px; }
#mainSpot .spotSlider .slick-dots li.slick-active { background-color: rgba(0,0,0,1); }
#mainSpot .spotSlider .slick-dots li button { display:block; height:2px; font-size:0 }
/* 이미지 배너 */
.imgBanner { margin:30px auto 0; position:relative; width:1100px; overflow:hidden }
.imgBanner ul { *zoom:1 }
.imgBanner ul:after { display:block; clear:both; content:'' }
.imgBanner ul li { padding-right:10px; float:left }

/* mainLink */
.mainLinkArea { margin:80px auto 0; width:1200px; overflow:hidden }
.mainLinkArea .box { width:1240px }
.mainLinkArea .box ul { *zoom:1 }
.mainLinkArea .box ul:after { display:block; clear:both; content:'' }
.mainLinkArea .box li { margin-right:40px; position:relative; float:left; width:270px; height:120px; background:#f5f5f5 }
.mainLinkArea .box li a { display:block; height:100% }
.mainLinkArea .box li .t1 { display:block; padding:25px 0 0 30px; font-size:22px; font-weight:600 }
.mainLinkArea .box li .t2 { display:block; padding:5px 0 0 30px; font-size:14px; color:#666; line-height:18px }
.mainLinkArea .box li .ico { position:absolute; top:30px; right:30px; width:60px; height:60px; background:url(/design/doobobiz/main/sp_main_top_link.png) 0 0 no-repeat }
.mainLinkArea .box li .ico1 { background-position:0 0 }
.mainLinkArea .box li .ico2 { background-position:0 -60px }
.mainLinkArea .box li .ico3 { background-position:0 -120px }
.mainLinkArea .box li .ico4 { background-position:0 -180px }

/* 메인 카테고리 */
#mainCategory { margin:0 auto; width:1200px }
#mainCategory .mainCateArea { margin: 80px 0 50px; }
#mainCategory .mainCateArea .mainCateHidden { display:none }
#mainCategory .mainCateArea .mainCateCol.active { display:block }
#mainCategory .mainCateArea .mainCateList ul { *zoom:1 }
#mainCategory .mainCateArea .mainCateList ul:after { display:block; clear:both; content:'' }
#mainCategory .mainCateArea .mainCateList li { padding:0 19px 30px; float:left }
#mainCategory .mainCateArea .mainCateList li:first-child { padding-left: 0; }
#mainCategory .mainCateArea .mainCateList li:last-child { padding-right: 0; }
#mainCategory .mainCateArea .mainCateList li a { display:block }
#mainCategory .mainCateArea .mainCateList li .listCateInfo { display:block; padding-top:12px; text-align:center }
#mainCategory .mainCateArea .mainCateList li .listCateInfo .cateName { font-size:14px; color:#666; } 

/* 상품 목록 영역 */
#contentWrapper .item-wrap { margin:0 auto; position:relative; width:1200px; }
#contentWrapper .item-wrap .cateTit h3 { font-size: 30px; font-weight: bold; margin-bottom: 50px; }
#contentWrapper .cateTit { padding-top: 80px; }
#contentWrapper .cateTit p { font-size: 16px; margin-top: 20px; color: #666; margin-bottom: 50px; }
#contentWrapper .item-wrap .item-cont .item-list:nth-child(n+5) { margin-top: 40px; }
#contentWrapper .item-wrap .item-cont .item-list:nth-child(4n) { padding-right: 0 !important; }
#contentWrapper .item-wrap .item-cont .item-list .prd-info ul { height: 80px; position: relative; }
#contentWrapper .item-wrap .item-cont .item-list .prd-name { padding-top: 0; }
#contentWrapper .item-wrap .item-cont .item-list .prd-price { font-size: 22px; font-weight: 600 }
#contentWrapper .moreBTn { height: 42px; width: 156px; border: 1px solid #000; border-radius: 30px; text-align: center; line-height: 44px; font-size: 16px; margin: 40px auto 80px; display: block; background: #fff; }
#contentWrapper .moreBTn i { font-size: 20px; position: relative; top: 2px; margin-left: 7px; }



/* 유튜브 캐러셀 */
.youtube-wrapper .item-wrap { overflow: initial; }
.youtube-wrapper .youtube-wrap { overflow: hidden; }
.youtube-wrapper .swiper-button-next, .youtube-wrapper .swiper-button-prev { width: 41px; height: 41px; background: url('/design/doobobiz/common/slide-arr~.png') no-repeat 0 0 }
.youtube-wrapper .swiper-button-next:after, .youtube-wrapper .swiper-button-prev:after { opacity: 0; }
.youtube-wrapper .swiper-button-next { right: -60px; background-position: 0 -41px; }
.youtube-wrapper .swiper-button-prev { left: -60px; }

.youtube-wrapper .swiper-wrapper li p { font-size: 18px; color: #666; padding: 25px 0; margin-bottom: 15px; text-align: center; }
.youtube-wrapper .swiper-wrapper .swiper-slide > img { height: 325px; width: 100%; }

.youtube-wrapper .swiper-wrapper .videoMask { position:absolute; top:0; left:0; right:0; width:100%; height:325px; background:rgba(0,0,0,0); z-index:10; cursor:pointer }
.youtube-wrapper .swiper-wrapper .videoMask:after { margin-left:-31px; margin-top:-23px; position:absolute; top:50%; left:50%; width:62px; height:47px; background:url(/design/doobobiz/main/ico_video_play.png) 0 0 no-repeat; z-index:10; content:'' }


.youtubePopupLayer { display: none; width: 100%; height:100%; background: rgba(0,0,0,0.5); position: fixed; top:0; left:0; right:0; bottom:0; z-index:120; }
.youtubePopupLayer > div { position: relative; width:900px; margin: 0 auto; height: 100%; }
.youtubePopupClose { position: absolute; top:-10%; right: 0; }
.youtubePopupClose > i { font-size: 40px; color: #fff; }
.youtubePopupLayer .youtube { width: 100%; height:506px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; }
.youtubePopupLayer .youtube iframe { width:100%; height:506px }

/* 인스타그램 */
.insta-wrapper .instaTit { text-align: center; }
.insta-wrapper .instaTit a { display: inline-block; padding: 15px 30px 30px; font-size: 16px; color: #999; }
.insta-wrapper .item-wrap { display: flex; flex-wrap: wrap; justify-content: space-between; }
.insta-wrapper .item-wrap > li { margin-bottom: 10px; }
/* BASIC css end */