/* BASIC css start */
/*.allMenu {position:relative !important; top:0px !important;}*/
#contentWrapper { margin-bottom: 0 !important }

/* 스크롤시 상단 하위메뉴 */
/*
#hdWrap { height:55px !important; transition:all 0.3s ease; -webkit-transition:all 0.3s ease }
#hdWrap.on { height:120px !important; transition-delay:0.3s; -webkit-transition-delay:0.3s }
#hdWrap .hdCateArea { height: 0px; visibility: hidden; overflow:hidden }
*/

/* 메인 비쥬얼 배너 */
.mainSlideWrap .mainSlide .slick-slide { position: relative; margin:0 0px; }
/*
.mainSlideWrap .mainSlide .slick-slide::after { content:''; display: block; position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: calc(100% - 4px); background: #000; opacity: 0.6; }
.mainSlideWrap .mainSlide .slick-slide.slick-current::after { display: none }
*/
.mainSlideWrap .mainSlide .slick-mask { content:''; display: block; position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: calc(100% - 4px); background: #fff; opacity: 0.6; }
.mainSlideWrap .mainSlide .slick-slide.slick-current .slick-mask { display: none }

.mainSlideWrap .mainSlide .slick-slide a:link,
.mainSlideWrap .mainSlide .slick-slide a:visited,
.mainSlideWrap .mainSlide .slick-slide a:active,
.mainSlideWrap .mainSlide .slick-slide a:hover { outline:none }
.mainSlideWrap .mainSlide .slick-slide img {width: 100%;}
.mainSlideWrap .mainSlide .slick-slide .content {position: absolute; top: 80%; left: 200px; transform: translateY(-80%); font-size: 25px; color: #fff; font-weight: 500; letter-spacing: 0px; text-shadow: #c4c4c4 0px 0 0px; opacity: 0; left: -120px; transition: 1s;}
.mainSlideWrap .mainSlide .slick-slide.slick-current .content{opacity: 1; left: 200px;}
.mainSlideWrap .mainSlide .slick-slide .content .color {color: #fde7d1;}
.mainSlideWrap .mainSlide .slick-slide .content .sub {font-size: 16px; font-weight: 100;letter-spacing: initial;}
.mainSlideWrap .mainSlide .slick-slide .content .sub2 {font-size: 16px; font-weight: 100;letter-spacing: initial; display:block}


.mainSlideWrap .mainSlide .slick-slide .content_bk {position: absolute; top: 80%; left: 200px; transform: translateY(-80%); font-size: 25px; color: #000; font-weight: 500; letter-spacing: 0px; text-shadow: #000 0px 0 0px; opacity: 0; left: -120px; transition: 1s;}
.mainSlideWrap .mainSlide .slick-slide.slick-current .content_bk {opacity: 1; left: 200px;}
.mainSlideWrap .mainSlide .slick-slide .content_bk .color {color: #000;}
.mainSlideWrap .mainSlide .slick-slide .content_bk .sub {font-size: 16px; font-weight: 100;letter-spacing: initial;}
.mainSlideWrap .mainSlide .slick-slide .content_bk .sub2 {font-size: 16px; font-weight: 100;letter-spacing: initial; display:block}


.mainSlideWrap .mainSlide .slick-arrow { position: absolute; top: 47%; width: 30px;  height: 78px; margin-top: -22px;  z-index: 10; cursor: pointer; background: url(/design/hippink0/phps/img/midBannerArrow.png) no-repeat center; font-size: 0; outline: none; }
.mainSlideWrap .mainSlide .slick-next { right: 50%; left: auto; background-position: -14px -78px; margin-right: -560px; }
.mainSlideWrap .mainSlide .slick-prev { left: 50%; right: auto; background-position: 0 0px; margin-left: -560px; }


/*써클이벤트배너*/

.circleEvent { width: auto; margin: 60px auto 60px; text-align: center; }
.circleEvent ul { overflow: hidden; }
.circleEvent li { display: inline-block; margin: 0 0.5%; }


/* 브랜드소개 배너 */
.brandBannerWrap { position: relative; margin-top: 8px; background: #ececec; font-size:0 }
.brandBannerWrap .container > a { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
.brandBannerWrap .left { display: inline-block; vertical-align: top; width: 670px; margin-left: 200px; }
.brandBannerWrap .left .t1 { margin-top: 60px; margin-bottom: 15px; font-size: 25px; font-weight: bold; }
.brandBannerWrap .left .t2 { margin-top: 5px; font-size: 18px; }
.brandBannerWrap .right { display: inline-block; vertical-align: top; width: 400px; }


/* 리뷰퀸 배너 */
.reviewBannerWrap { position: relative; margin-top: 8px; background: #ececec; font-size:0 }
.reviewBannerWrap .container > a { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
.reviewBannerWrap .left { display: inline-block; vertical-align: top; width: 670px; margin-left: 40px; }
.reviewBannerWrap .left .t1 { margin-top: 60px; margin-bottom: 15px; font-size: 25px; font-weight: bold; }
.reviewBannerWrap .left .t2 { margin-top: 5px; font-size: 18px; }
.reviewBannerWrap .right { display: inline-block; vertical-align: top; width: 670px; }


/* 탑 배너 */
.topBannerWrap { margin-top: 82px }
.topBannerWrap ul { font-size: 0; }
.topBannerWrap ul li { display: inline-block; width: 690px }
.topBannerWrap ul li:first-child { margin-right: 20px }

/* 신상 슬라이드 */
.newPdWrap { overflow: hidden; position: relative; margin-top: 80px; padding: 65px 0; background: #f5f5f5 }
.newPdWrap .wrapTitle { margin-bottom: 27px; }
.newPdWrap .item-wrap { overflow: visible }
.newPdWrap .item-wrap .item-cont .item-list { background: ; padding-right: 0; margin:0 }
.newPdWrap .item-wrap .item-cont .item-list a:link,
.newPdWrap .item-wrap .item-cont .item-list a:visited,
.newPdWrap .item-wrap .item-cont .item-list a:active,
.newPdWrap .item-wrap .item-cont .item-list a:hover { outline:none }
.newPdWrap .item-wrap .item-cont .item-list .prd-info { padding: 0px 10px 30px 10px; min-height:150px ;max-height:150px }
.newPdWrap .item-wrap .item-cont .item-list .thumb img { width: 100% ;padding: 5px; box-sizing: border-box; }
.newPdWrap .item-wrap .item-cont .item-list .prd-name { height: 20px; line-height: 16px;font-size: 12px;padding-right: 10px;position: relative;line-height: 20px;font-weight: 300;}
.newPdWrap .item-wrap .item-cont .item-list .prd-review {position: absolute;right: 10px;}
.newPdWrap .item-wrap .item-cont .item-list .prd-review .snap_review_count{color:#f86f50; font-weight:300}
.newPdWrap .item-wrap .item-cont .item-list .prd-priceBox del,
.newPdWrap .item-wrap .item-cont .item-list .prd-price { font-size: 13px }
.newPdWrap .item-wrap .item-cont .item-list .prd-subname {margin-top: 10px;font-size: 12px;}
.newPdWrap .item-wrap .item-cont .item-list .prd-etc {margin-top: 0px;line-height: 18px;font-size: 13px; font-weight:300}


.newPdWrap .slick-next,
.newPdWrap .slick-prev { position: absolute; top: 49%; width: 44px;  height: 78px; margin-top: -39px;  z-index: 10; cursor: pointer; background: url(/design/hippink0/phps/img/midBannerArrow.png) no-repeat center; outline: none; font-size: 0 }
.newPdWrap .slick-next { right: 50%; left: auto; background-position: 0 -78px; margin-right: -780px;}
.newPdWrap .slick-prev { left: 50%; right: auto; background-position: 0 0px; margin-left: -780px; }

/* 베스트 탭 */
.bestPdWrap .bestTabCate { margin-top: 35px }
.bestPdWrap .bestTabCate li { display: inline-block; margin-right: 40px; font-size: 20px; }
.bestPdWrap .bestTabCate li a { font-size: inherit }
.bestPdWrap .bestTabCate li.active a { position: relative; }
.bestPdWrap .bestTabCate li.active a::after { position: absolute; bottom: -10px; z-index: -1; content:''; display: block; width: 100%; height: 3px; background: #2c2a29;  }

.bestPdWrap .wrapTitle { margin-top: 115px }
.bestPdWrap .item-wrap { margin-top: 30px }


/* 중간 이미지 배너 슬라이드 */
.midBannerWrap { overflow: hidden; width: 100%; }

.midBannerWrap .wrapTitle { width:30%; margin-left: 35%; padding: 60px 0 20px 0; text-align:center; border-bottom: 3px solid #2c2a29; color: #2c2a29; display: inline-block; }
/*.midBannerWrap .wrapTitle { width: 100%; padding: 60px 0 40px 0; text-align:center;  text-decoration: underline; }*/

.midBannerWrap .midSlide .swiper-slide img { width: 100%; margin-bottom:60px; border-top: 0px solid #2c2a29 ; border-bottom: 0px solid #2c2a29 ; }
.midBannerWrap .midSlideNext,
.midBannerWrap .midSlidePrev { position: absolute; top: 45%; width: 44px;  height: 78px; margin-top: -39px;  z-index: 10; cursor: pointer; background: url(/design/hippink0/phps/img/midBannerArrow.png) no-repeat center; outline: none; }
.midBannerWrap .midSlideNext { right: 50%; left: auto; background-position: 0 -78px; margin-right: -45%;}
.midBannerWrap .midSlidePrev { left: 50%; right: auto; background-position: 0 0px; margin-left: -45%; }


/* 이상품어때요 슬라이드 */
.centerBannerWrap { margin-top: 104px; background: #f9f9f9 }
.centerBannerWrap .container { width: 1500px }
.centerBannerWrap .wrapTitle { padding: 60px 0 0; text-align: center; }
.centerBannerWrap .centerSlide { margin: 30px 0; height: 793px; }
.centerBannerWrap .centerSlide .slick-track { padding: 35px 0; }
.centerBannerWrap .centerSlide .slick-slide { width: 482px; transition: all 0.5s }
.centerBannerWrap .centerSlide .slick-slide:focus, .centerBannerWrap .centerSlide .slick-slide img :focus,
.centerBannerWrap .centerSlide .slick-slide div:focus, .centerBannerWrap .centerSlide .slick-slide li:focus, .centerBannerWrap .centerSlide .slick-slide a:focus { outline: none }
.centerBannerWrap .centerSlide .slick-slide li { position: relative; padding: 30px; box-sizing: border-box; }
.centerBannerWrap .centerSlide .slick-slide li::after { content: ''; display: block; width: calc(100% - 60px); height: 578px; background: #000; opacity: 0.6; position: absolute; top: 30px; }
.centerBannerWrap .centerSlide .slick-slide.slick-center { transform: scale(1.08); /*width: 540px !important;*/ }
.centerBannerWrap .centerSlide .slick-slide.slick-center li::after { display: none }
.centerBannerWrap .centerSlide .slick-slide img { width: 100%;box-shadow: 0 0 0px 0px #ddd;  }

.centerBannerWrap .centerSlide .slick-dots { position: absolute; top: auto; left: 50%; bottom: 60px; transform: translateX(-50%); height:2px; background: #e5e5e5; }
.centerBannerWrap .centerSlide .slick-dots li { display:inline-block; width: 50px; line-height: 1px; vertical-align: top; }
.centerBannerWrap .centerSlide .slick-dots li.slick-active { background: #000 }
.centerBannerWrap .centerSlide .slick-dots li button { font-size: 0 }

/* 잠옷 필요하세요? 배너 + 슬라이드 */
.leftBannerWrap .container { width: 1500px } 
.leftBannerWrap .wrapTitle { margin: 110px 0 50px; }
.leftBannerWrap .leftImgWrap { font-size: 0 }
.leftBannerWrap .leftImgWrap .left { display:inline-block; width: 580px; margin-right: 0px; vertical-align: top }
.leftBannerWrap .leftImgWrap .right { display:inline-block; width: 916px; vertical-align: top;}
.leftBannerWrap .leftImgWrap .right .leftSlide { padding:0px 4px 0px 4px; height:700px; border: 0px solid #eee;}

.leftBannerWrap .item-wrap .item-cont .item-list { position: relative; padding-right: 0; margin:0; text-align: center; width: calc(25%) }
.leftBannerWrap .item-wrap .item-cont .item-list a { padding: 5px;  display: block; }
.leftBannerWrap .item-wrap .item-cont .item-list .prd-info { width: calc(100% - 30px); padding: 20px 10px; margin: 10px 10px 7px 10px; position: absolute; bottom: 5px; opacity:0; background: rgba(255,255,255,0.7); transition: all 0.3s; box-sizing: border-box; }
.leftBannerWrap .item-wrap .item-cont .item-list:hover .prd-info { opacity:1; }
.leftBannerWrap .item-wrap .item-cont .item-list .thumb img { width: 100% ; }
.leftBannerWrap .item-wrap .item-cont .item-list .prd-icon { margin-top: 0px; }
.leftBannerWrap .item-wrap .item-cont .item-list .prd-name { margin-top: 5px; line-height: 15px; font-size: 13px;padding-right:0 !important}
.leftBannerWrap .item-wrap .item-cont .item-list .prd-priceBox { margin-top: 5px; }
.leftBannerWrap .item-wrap .item-cont .item-list .prd-priceBox del,
.leftBannerWrap .item-wrap .item-cont .item-list .prd-price { font-size: 13px }
.leftBannerWrap .item-wrap .item-cont .item-list .prd-subname { margin-top: 5px; font-size: 12px }
.leftBannerWrap .item-wrap .item-cont .item-list .prd-etc { margin-top: 5px; line-height: 18px; font-size: 12px }

.leftBannerWrap .leftSlide .leftBar { right:0; left:auto; /*position: relative; width: calc(100% - 10px); height:4px;  margin: 14px auto 0;*/ background: #e5e5e5; }
.leftBannerWrap .leftSlide .leftBar.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: #737373 }


/* 유튜브 슬라이드 */
.youtubeWrap { overflow: hidden; position: relative; margin: 0 auto 200px; }
.youtubeWrap .container { width: 1500px } 
.youtubeWrap .wrapTitle { margin: 195px auto 47px; text-align: center; }
.youtubeWrap .swiper-wrapper { margin: 30px 0; height: 630px }
.youtubeWrap .youtubeSlide .swiper-slide { position: relative; margin:0 20px; width: 1093px; transition: all 0.3s }
.youtubeWrap .youtubeSlide .swiper-slide img { width: 100% }
.youtubeWrap .youtubeSlide .swiper-slide::after { content:''; display: block; position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: calc(100% - 60px); background: #000; opacity: 0.6; }
.youtubeWrap .youtubeSlide .swiper-slide.swiper-slide-active { margin-top: -30px; width: 1100px; }
.youtubeWrap .youtubeSlide .swiper-slide.swiper-slide-active::after { display: none }

.youtubeWrap .youtubeSlide .swiper-slide .videoWrap { padding-bottom: 570px; position:relative; height:0; overflow:hidden }
.youtubeWrap .youtubeSlide .swiper-slide .videoWrap iframe,
.youtubeWrap .youtubeSlide .swiper-slide .videoWrap object, 
.youtubeWrap .youtubeSlide .swiper-slide .videoWrap embed { position:absolute; top:0; left:0; width:100%; height:100% }

.youtubeWrap .youtubeSlide .swiper-slide.swiper-slide-active .videoWrap { padding-bottom: 630px; position:relative; height:0; overflow:hidden }

.youtubeWrap .youtubeSlide .youtubeSlideNext,
.youtubeWrap .youtubeSlide .youtubeSlidePrev { position: absolute; top: 50%; width: 44px;  height: 78px; margin-top: -22px;  z-index: 10; cursor: pointer; background: url(/design/hippink0/phps/img/visualArrow.png) no-repeat center; }
.youtubeWrap .youtubeSlide .youtubeSlideNext { right: 50%; left: auto; background-position: 0 -78px; margin-right: -700px;top: 43%;}
.youtubeWrap .youtubeSlide .youtubeSlidePrev { left: 50%; right: auto; background-position: 0 0px; margin-left: -700px;top: 43%; }


/*인스타위젯*/
.instaWrap .container { width: 90%; margin-bottom: 10%; }


/* 이벤트배너 4개 */
.eventBannerWrap { font-size: 0; }
.eventBannerWrap a { display: inline-block; width: 50% }
.eventBannerWrap a img { width: 100%;  padding:0px 0px 10px 0px; }

/* 포토리뷰 */
.photoWrap .wrapTitle { margin: 195px auto 55px; text-align: center; }

/* 하단 슬라이드 */
.bottomSlideWrap { background: #ececec; padding: 130px 0 }
.bottomSlideWrap .wrapTitle { margin: 195px auto 55px; text-align: center; }
.bottomSlideWrap .swiper-slide { text-align: center; }
.bottomSlideWrap .swiper-slide .txt span { display: block; margin-top: 30px; font-weight: bold; font-size: 32px }
.bottomSlideWrap .swiper-slide .txt p { margin-top: 10px; font-size: 16px;  }
.bottomSlideWrap .swiper-slide img { width : 100% }
/* BASIC css end */