/* BASIC css start */
#header .headerTop .headerRight .headerIcon ul li.cart #user_basket_quantity {background: #fff; color:#000; }
#header.fixed .headerTop .headerRight .headerIcon ul li.cart #user_basket_quantity {background: #000; color:#fff; }

.bannerWrap { width:100%; max-width:75%; margin:0 auto; }

.mySwiper { position:relative; width:100%; height:100%; text-align:center; }
.mySwiper .swiper-slide img { width:100%; object-fit: cover; }
.mySwiper .mont { position:absolute; top:50%; margin-top:-10px; z-index:10; display:none; }
.mySwiper .mont span { font-size:40px; color:#fff; }
.mySwiper .swiper-next { right:20px; }
.mySwiper .swiper-prev { left:20px; }
.mySwiper:hover .mont { display:block; }
#main_bnr_swiper img{ -webkit-user-drag: none; user-drag: none; user-select: none; -webkit-user-select: none; }

.gallery-list { overflow:hidden; }
.gallery-list .swiper-slide { position:relative; }
.gallery-list .swiper-slide .text { position:absolute; text-align:left; left:25px; bottom:35px; color:#fff; pointer-events:none; }
.gallery-list .swiper-slide .text h3 { font-size:clamp(16px, 2.5vw, 40px); font-weight:700; color:#fff; margin-bottom:10px; font-family: 'Oswald', 'Pretendard', sans-serif; }
.gallery-list .swiper-slide .text p { font-size:clamp(11px, 1vw, 15px); line-height:20px; }
.gallery-list .swiper-slide img { width:100%; }

.main-slide_txt { position: absolute; left: 100px; bottom: 70px; z-index: 2; text-align:left; }
.main-slide_txt.middle { left:50%; transform: translateX(-50%); text-align:center; }
.main-slide_txt.last { left:auto; right:100px; text-align:right; }
.main-slide_txt.last .main-slide_btn { margin-left:auto; }
.main-slide_title { font-size: 5.5vw; font-weight: 500; line-height: 1.0; color: #fff; margin-bottom: 30px; font-family: 'Oswald', 'Pretendard', sans-serif; letter-spacing: -3px; }
.main-slide_desc { font-size: clamp(13px, 1.2vw, 20px); line-height: 1.5; color: #fff; }
.main-slide_btn { display: block; width: 100px; height: 50px; line-height: 48px; margin-top: 20px; color: #000; font-size: 13px; font-weight: 500; text-align: center; cursor: pointer; position: relative; z-index:50; border-radius: 50px; background: #fff; }
.swiper-slide .main-slide_txt * { opacity: 0; visibility: hidden; -webkit-transform: translateY(10px); transform: translateY(10px); }
.swiper-slide-active .main-slide_txt * { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); }
.swiper-slide-active .main-slide_title { transition: opacity 0.7s, transform 0.7s; transition-delay: 0.2s !important; -webkit-transition-delay: 0.2s !important; }
.swiper-slide-active .main-slide_desc { transition: opacity 0.7s, transform 0.7s; transition-delay: 0.4s !important; -webkit-transition-delay: 0.4s !important; }
.swiper-slide-active .main-slide_btn { transition-duration: 0.7s; -webkit-transition-delay: 0.6s !important; transition-delay: 0.6s !important; }
.main-slide_txt.middle .main-slide_btn { margin-left:auto; margin-right:auto; }

.brand-banner { position:relative; text-align:center; display:flex; flex-direction:column; align-items:center; }
.brand-banner .brand-list { width:100%; max-width:100%; margin:0 auto; overflow:hidden; }
.brand-banner .swiper-slide .brand { margin-top:0; padding:20px 0; }
.brand-banner .swiper-slide img { width:100%; }
.brand-banner .swiper-slide .brand .imglogo { display:block; }
.brand-banner .swiper-slide .brand .imgPrd { display:none; width:100%; }
.brand-banner .swiper-slide .brand:hover .imglogo { display:none; }
.brand-banner .swiper-slide .brand:hover .imgPrd { display:block; }
.brand-banner .brand-button-next { position:absolute; width:27px; top:160px; right:50%; margin-right:-680px; }
.brand-banner .brand-button-prev { position:absolute; width:27px; top:160px; left:50%; margin-left:-680px; }
.brand-banner .brand-button-next img,
.brand-banner .brand-button-prev img { width:100%; cursor:pointer; }
.swiper-button-disabled img { opacity:0.35; }
#content { width:auto; }

/* 메인 상단 헤더 */
#header { position:fixed !important; top: 0; left: 0; right: 0; background: transparent !important; }
#header.fixed { background: #fff !important; }
#header .headerTop .tlogo a { background: url('/design/icooing/2026/logo_white.png') no-repeat !important; background-size:130px !important; }
#header .headerTop .headerGnb ul li a,
#header .headerTop .headerRight .headerUser ul li a { color:#fff !important; }
#header.fixed .headerTop .headerGnb ul li a { color:#000 !important; }
#header.fixed .headerTop .headerRight .headerUser ul li a { color:#000 !important; }
#header.fixed .headerTop .headerRight .headerUser ul li a:after { display:none; content: '' !important; position: absolute; bottom: -1px; left: -5%; transform: translateX(-50%); background:#f9dfdf; width: 110%; height: 10px; transform: scaleX(0); transition: transform 250ms ease-in-out; z-index: -1; }
#header.fixed .headerTop .headerRight .headerUser ul li a:hover:after { transform: scaleX(1); color:#000; }

/* swiper 공통 */
.swiper-button-prev { left:0; }
.swiper-button-next { right:0; }
.swiper-button-next:after, .swiper-button-prev:after { content:unset !important; }
.swiper-button-prev img,
.swiper-button-next img { width:26px; }

/* 메인 배너 */
#main_bnr_swiper { width: 100%; margin-bottom:50px; }
#main_bnr_swiper .swiper-slide img { width:100%; }
#main_bnr_swiper .swiper-pagination { bottom:30px; text-align:right; color:#fff; font-size:18px; }
#main_bnr_swiper .swiper-pagination-bullet { width:11px; height:11px; opacity:1 !important; background:transparent; border:2px solid #fff; margin:0 6px !important; position:relative; box-sizing:border-box; }
#main_bnr_swiper .swiper-pagination-bullet-active { background:#fff !important; }

/* 상품 영역 공통 */
.area1_wrap { width: 100%; box-sizing: border-box; overflow: hidden; }
.area1_wrap .swiper-container { max-width:1240px; width:100%; margin:0 auto; overflow: hidden; position:relative; box-sizing:border-box; }

/* 따끈따끈 신상 */
.area2_wrap #area2_wrap_swiper .swiper-scrollbar { height:3px !important; background:#fff; left: 0 !important; }
.area2_wrap #area2_wrap_swiper .swiper-scrollbar-drag { background: #eb9595; }
.area2_wrap { background:#f7f7f7; width: 100%; padding: 140px 0 100px; margin-bottom: 140px; }
.area2_wrap #area2_wrap_swiper { max-width: 1440px; margin:0 auto; }
.area2_wrap .item-cont .item-list { display: flex; align-items: center; margin-bottom: 40px; }
.area2_wrap .item-cont .item-list dt.thumb { width:220px; margin-right:30px; }
.area2_wrap .item-cont .item-list dd.prd-info { padding:0; }
.area2_wrap .thumb .dc_per { width: 40px !important; height: 40px !important; line-height: 40px !important; font-size: 14px !important; }

/* 몽슈슈 특별 상품 */
.area3_wrap { width: 100%; max-width: 1550px; }
.area3_wrap #area3_wrap_swiper { padding: 0 64px; }

/* 리뷰 영역 */
.area4_wrap { background:#f7f7f7; width: 100%; padding: 140px 0 100px; }
.area4_wrap #area4_wrap_swiper { max-width: 1440px; margin: 0 auto; padding: 0 64px; }
.area4_wrap .item-cont .item-list { background: #fff; border-radius: 15px; overflow: hidden; box-shadow: 2px 2px 5px #f1f1f1; }
.area4_wrap .item-cont .item-list .prd-subname { border-top: 0; padding-top: 0; margin-bottom: 30px; }
.area4_wrap .item-cont .item-list .prd-subname a { font-size: 14px; color: #aaaaaa; }
.area4_wrap .item-cont .item-list .prd-score { color: #eb9595; text-align: right; font-size: 15px; }
.area4_wrap .item-cont .item-list .prd-info { padding: 40px 23px; }

/* 중간배너 */
.mid_bnr_wrap { position: relative; margin-bottom:230px; }
.mid_bnr_wrap ul { display:flex; justify-content: center; align-items: center; }
.mid_bnr_wrap ul li { position: relative; }
.mid_bnr_wrap ul li img { width: 100%; }
.mid_bnr_wrap ul li dl { position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; }
.mid_bnr_wrap ul li dl dt { font-size: 50px; color: #fff; margin-bottom: 50px; }
.mid_bnr_wrap ul li dl dd a { display:inline-block; font-size: 18px; font-weight: bold; color: #fff; letter-spacing: 10px; background: rgba(255,255,255,0.2); padding: 24px 58px; border: 1px solid #fff; border-radius: 50px; box-sizing: border-box; }

/* 인스타그램 */
.insta_wrap { width: 75%; max-width: 75%; margin: 0 auto; padding: 0 0 100px; text-align:center; }
.insta_wrap .cateTit h3 { font-family: 'Oswald', 'Pretendard', sans-serif; font-size: 40px; font-weight: 500; letter-spacing: -0.4px; margin-top: 0; margin-bottom: 30px; text-align: center; width: 100%; display: block; }
.insta_wrap .insta_sub { text-align: center; margin-bottom: 30px; }
.insta_wrap .insta_sub span { font-size: 14px; color: #aaaaaa; margin: 0 10px; }
.insta_wrap .insta_follow { font-size: 12px; color: #555; border: 1px solid #555; border-radius: 50px; padding: 6px 20px; letter-spacing: 3px; }
.insta_wrap .insta-list { width: 100%; overflow: hidden; }
.insta_wrap .insta-list .swiper-slide img { width: 100%; display: block; aspect-ratio: 1/1.5; object-fit: cover; }
.insta_wrap .insta-list .swiper-slide { position: relative; }
.insta_wrap .insta-list .swiper-slide::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40%;
    background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, transparent 100%);
    pointer-events: none;
    z-index: 1;
}
.insta_wrap .insta-list .swiper-slide .insta-text { position: absolute; left: 15px; bottom: 20px; color: #fff; text-align: left; z-index: 2; }
.insta_wrap .insta-list .swiper-slide .insta-text h3 { font-size: clamp(10px, 1.2vw, 16px); font-weight: 300; font-family: 'Pretendard', sans-serif; margin-bottom: 5px; color: #fff; display: block; }
.insta_wrap .insta-list .swiper-slide .insta-text p { font-size: clamp(9px, 0.8vw, 12px); line-height: 1.4; }
.insta_wrap .cateTit { text-align: center; padding-top: 150px; margin: 0 auto; }
.insta_wrap .cateTit .insta-icon { width: 40px; margin-bottom: 15px; filter: brightness(0) invert(0.7); }

/* BRAND 타이틀 */
.brand-banner .cateTit h3 { font-family: 'Oswald', 'Pretendard', sans-serif; font-size: 40px; font-weight: 500; letter-spacing: -0.4px; margin-top: 120px; margin-bottom: 40px; }

/* 유튜브 */
.youtube_wrap { position: relative; text-align: center; width: 100%; height: 600px; overflow: hidden; margin-top: 100px; }
.youtube_wrap iframe { position: absolute; top: 50%; left: 50%; width: 100vw; height: 56.25vw; min-width: 100%; min-height: 30px; transform: translate(-50%, -50%); pointer-events: none; }
.youtube_wrap > img { width: 100%; }
.youtube_wrap dl { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: left; width: 90%; }
.youtube_wrap dl dt { font-size: 56px; color: #fff; margin-bottom: 60px; text-align: left; }
/* BASIC css end */

