/* BASIC css start */
#header .left.detail{display:none;}


#header .headroom--unpinned .top{top: -59px; transition: 0.3s;}
#header .top{padding: 16px 20px; display: flex; justify-content: space-between; align-items: center; position: fixed; top: 0; left: 0; z-index: 100; width: 100%; box-sizing: border-box;}
#header .cate-wrap{display: none;}
#header .headroom--unpinned .cate-wrap{display: block; position: fixed; top: 0; left: 0; width: 100%; transition: 0.3s; background-color: rgba(255,255,255,0.9); z-index: 10;}
#header .cate-wrap .swiper{padding:0 18px;}
#header .cate-wrap li{width: fit-content;}
#header .cate-wrap li a{font-size: 14px; font-weight: 500; color: #111; line-height: 18px; padding: 11px 0; display: block;}

#header .top .logo svg{height: 18px;}

#header .top .util{display: flex; align-items: center; gap: 16px;}
#header .top .util a svg{max-width: 20px;}
#header .util .cart a { position: relative; display:block;}
#header .util .cart .count { position: absolute; top: -6px; right:-7px; width: 16px; height: 16px; background: #000; border-radius: 50%; line-height: 18px; text-align: center;  font-weight: 600; font-size: 8px; color: #fff; }


#main #header .headroom--not-top .left svg,
#main #header .headroom--not-top .util .cart svg{fill: #111;}
#main #header .headroom--not-top .util .search svg,
#main #header .headroom--not-top .util .mypage svg,
#main #header .headroom--not-top .util .ham svg{stroke: #111;}
#main #header .headroom--not-top .top{background-color: #fff;}


#header .left svg,
#header .util .cart svg{fill: #111;}
#header .util .search svg,
#header .util .mypage svg,
#header .util .ham svg{stroke: #111;}
#header .top{background-color: #fff;}


#main #header .headroom--top .left svg,
#main #header .headroom--top .util .cart svg{fill: #fff;}
#main #header .headroom--top .util .search svg,
#main #header .headroom--top .util .mypage svg,
#main #header .headroom--top .util .ham svg{stroke: #fff;}
#main #header .headroom--top .top{background-color: transparent;}



.dimBox.open{background-color: rgba(0,0,0,0.5); width: 100%; height: 100dvh; z-index: 100000; position: fixed; top: 0; right: 0;}


/*¸ÞÀÎÆ˾÷*/
.popupLayer{display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100000; background: rgba(0, 0, 0, 0.5);}
.popupLayer2{display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100000; background: rgba(0, 0, 0, 0.5);}
.popupLayer .main_popup{position: fixed; z-index: 33; width: 80%; height: auto; visibility: visible; opacity: 1; left: 50%; top: 45%; transform: translate(-50%, -50%); max-width: 600px;}
.popupLayer .main_popup .swiper-container{overflow: hidden;}
.popupLayer .main_popup .swiper-pagination{position: absolute; top: -25px; right: 0; background: #000; width: 40px; height: 20px; color: #fff; left: auto; font-size: 11px; line-height: 20px; border-radius: 20px;}
.popupLayer .swiper-slide img{width: 100%;}
.popupLayer .main_popup video{    width: 100%; height: auto; margin: 0; padding: 0; vertical-align: top; background:#000; }
.popupLayer2 .swiper-slide img{width: 100%;}
.popupLayer2 .main_popup2 {position: fixed; z-index: 33; width: 80%; height: auto; visibility: visible; opacity: 1; left: 50%; top: 45%; transform: translate(-50%, -50%); max-width: 600px; border-radius: 10px 10px 0 0; overflow: hidden; }
.popupLayer2 .main_popup2 .swiper-container {overflow:hidden; position:relative;}
.popupLayer2 .main_popup2 .swiper-container .swiper-pagination {position:absolute; top:16px; right:16px; left:auto; bottom:auto; padding:5px 10px;; background:rgba(0,0,0,0.4); color:#fff; width:auto; border-radius:16px;}
.popupLayer2 .main_popup2 .swiper-container .popup_controls {display:flex; position:absolute; bottom:16px; right:16px; gap:4px;}
.popupLayer2 .main_popup2 .swiper-container .popup_controls .swiper-button-prev, .popupLayer2 .main_popup2 .swiper-container .popup_controls .swiper-button-next {position:relative; margin-top:0; left:auto; right:auto; top:auto;}
.main_popup2 .popup_controls .swiper-button-autoplay {
    position: static;
    width: 36px;
    height: 36px;
    margin: 0;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.4);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index:10;
}

/* autoplay ±âº» ¾ÆÀÌÄÜ Á¦°Å */
.main_popup2 .swiper-button-autoplay:before,
.main_popup2 .swiper-button-autoplay:after {
    content: '';
    display: block;
}

/* Àç»ý Áß »óÅÂ: pause ¾ÆÀÌÄÜ */
.main_popup2 .swiper-button-autoplay.is-play:before {
    width: 2px;
    height: 14px;
    background: #fff;
    margin-right: 4px;
}

.main_popup2 .swiper-button-autoplay.is-play:after {
    width: 2px;
    height: 14px;
    background: #fff;
}

/* Á¤Áö »óÅÂ: play ¾ÆÀÌÄÜ */
.main_popup2 .swiper-button-autoplay.is-pause:before {
    width: 0;
    height: 0;
    margin-left: 3px;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 12px solid #fff;
}

.main_popup2 .swiper-button-autoplay.is-pause:after {
    display: none;
}
.popup-bottom {display: flex; justify-content: space-between; align-items: center; min-height: 30px; line-height: 30px; padding:0 10px; font-size: 13px; background:#000;}
.popup-bottom >*{color: #ffffff; font-weight: 600; cursor:pointer;}
.popup-bottom .justClose svg{width: 25px; height: 25px; vertical-align:middle;}
.popup-bottom .justClose2 svg{width: 25px; height: 25px; vertical-align:middle;}

.popupLayer.open{display: block;}
.popupLayer2.open{display: block;}
/* BASIC css end */