/* BASIC css start */
body.no-scroll { overflow: hidden; position: fixed; width: 100%; }

.promotion_box{}
.promotion_box img{ width: 100%}

.slide_box {position: relative; }
.slide_box .lefee_swiper{ position:absolute; bottom:2.1%; left:6vw; width:47.4%; }


.eventBanner{ width: 100%; }

.shopbrand h2 {text-align:center; font-size: 1.25em; font-weight:bold; padding-top:10px;}
.shopbrand .MK_product_list {background-color:#f9f9f9; border-bottom:1px solid #4a4a4a; border-top: 1px solid #4a4a4a;}
.shopbrand .MK_product_list .items {padding: 10px 0;}
.shopbrand .MK_product_list .items #MK_best_product li { width:33.33%; }
/* .shopbrand .MK_product_list .items .paging-num { text-align: center; clear: both; margin:20px 0; }
.shopbrand .MK_product_list .items .paging-num a { background-color:#fff; border:1px solid #393939; padding:5px 10px; margin:0 10px; }
.shopbrand .list_group {padding: 10px 1%;text-align:center;}
.shopbrand .list_group select {width:49%; height:28px;} */
.shopbrand .shopbrandTitle p { padding: 0 1.3rem 30px; font-size: 14px; line-height: 1.5; }
.shopbrand .shopbrandTitle .shopbrandCont{}
.shopbrand .shopbrandTitle img { max-width: 100%; margin: 0; }

.page_location { padding: 0 1.3rem; margin-bottom: 1.2rem; }
.page_location .SMScategoryName { display: flex; }
.page_location .SMScategoryName li.lastChild::after { display:none; }
.page_location .SMScategoryName li a { font-size: 20px; font-weight: 500; }

.depth_wrap{ margin: 0 0 20px; }

.depth_wrap .SMS_Category_list{ }
.depth_wrap .SMS_Category_list .CateInBody{ padding: 0 1.3rem; border-bottom: 1px solid #E2E2E2; }
.depth_wrap .SMS_Category_list .CateInBody ul{ display: flex; align-items: baseline; }
.depth_wrap .SMS_Category_list .CateInBody li{ width: auto; }
.depth_wrap .SMS_Category_list .CateInBody li a{ padding: 20px 0 15px; margin: 0 10px; font-size: 15px; display: inline-block; text-align:center; }
.depth_wrap .SMS_Category_list .CateInBody li:first-child a{ margin-left: 0;}
.depth_wrap .SMS_Category_list .CateInBody li a.sel{ font-weight: 600; position: relative; border-bottom: 1px solid #000;}
/*.depth_wrap .SMS_Category_list .CateInBody li a.sel::after{ position: absolute; content: ""; display: block; width: 100%; height: 1px; left: 0; bottom: -1px; background: #000;}*/
.depth_wrap .SMS_Category_list .CateInBody li a > span{ display: none; font-size: 15px; width:60px; height: 60px; margin-bottom: 16px;border-radius: 200px; }
.depth_wrap .SMS_Category_list .CateInBody li a > span span{  font-size: 15px; color:#000; background:#f6f6f6; display: block; width:60px; height: 60px; line-height: 1; line-height: 60px; border-radius: 200px;  }
.depth_wrap .SMS_Category_list .CateInBody li a img{width: 70px; display: block; margin-bottom: 22px;}


/* 정렬 */
.filter-area { display: flex; justify-content: space-between; max-width: 1920px; padding: 0 1.3rem; margin: 0 auto 16px; }
.filter-area .prd-total { margin-top: 2px; font-size: 13px; }
.filter-area p span { font-size: 13px; font-weight: 500;}
.filter-area .sort-filter-wrap { display: flex; }
.filter-area .sort-filter-wrap .sort { position: relative; display: flex; justify-content: center; width: 80px; }
.filter-area .sort-filter-wrap .sort .sorted { display: flex; gap: 6px; align-items: center; cursor: pointer; }
.filter-area .sort-filter-wrap .sort .sorted .sort-icon { display: block; width: 14px; height: 14px; }
.filter-area .sort-filter-wrap .sort .sorted .sort-icon img { width: 100%; }
.filter-area .sort-filter-wrap .sort .sorted .sorted-value { font-size: 13px; }
.filter-area .sort-filter-wrap .sort .sort-list { position: absolute; top: 30px; display: none; width: 118px; background-color: #fff; border: 1px solid #A2A2A2; text-align: center; z-index: 2;}
.filter-area .sort-filter-wrap .sort .sort-list li { padding: 8px 30px; }
.filter-area .sort-filter-wrap .sort .sort-list li:first-child { margin-top: 11px; }
.filter-area .sort-filter-wrap .sort .sort-list li:last-child { margin-bottom: 11px; }
.filter-area .sort-filter-wrap .sort .sort-list li a { font-size: 13px; }


/* 필터 */
.filter-area { position: relative; }
.filter-wrap { position:fixed; left:0; bottom:0; width:100%; height:auto; background:#fff; z-index:99999; overflow:auto; border-radius:15px 15px 0 0; margin-bottom:0; max-height:80%; transform: translateY(100%); transition: transform 0.3s ease; }
.filter-wrap.open { display: block; transform: translateY(0); }

.filter-area .btn-filter-wrap .btn-filter { display:flex; width:50px; justify-content: center; align-items: center; gap: 4px; }
.filter-area .btn-filter-wrap .btn-filter img { width: 20px; }
.filter-area .btn-filter-wrap .btn-filter span { font-size: 13px; font-weight: 400; color:#000; }

.filter-wrap .layer-filter-wrap  { position: relative; }
.filter-wrap .layer-filter-wrap .sheet-top { position: sticky; top:0; background-color: #fff; height: 26px; border-radius: 15px 15px 0 0; z-index: 99; }

.filter-wrap.popup_filter .layer-filter-wrap .layer-filter .tit {position:absolute; top:20px; right:1.3rem; }
.filter-wrap.popup_filter .layer-filter-wrap .layer-filter .tit a{ width:15px; height:15px; background:none; border:0; display:block; }
.filter-wrap.popup_filter .layer-filter-wrap .layer-filter .tit a img{ width:100%; }

.filter-wrap .layer-filter-wrap .opt-box > li { margin-bottom: 26px; padding:14px 22px; font-size:15px; font-weight:bold; cursor:pointer; -webkit-user-select:none; -webkit-tap-highlight-color:rgba(0,0,0,0);}
.filter-wrap .layer-filter-wrap .opt-box > li.acco {background-image:url(/design/jmomall/ECHO/uiux/icon/arrow_bottom.svg); background-repeat: no-repeat; background-position:right 1.3rem  top 21px; background-size:auto 7px; }
.filter-wrap .layer-filter-wrap .opt-box > li.acco.active {background-image:url(/design/jmomall/ECHO/uiux/icon/arrow_top.svg);}
.filter-wrap .layer-filter-wrap .opt-box > li.acco.active > .chk-box, .filter-wrap .layer-filter-wrap .opt-box > li.acco.active > .chk-color-code{display:flex; flex-wrap:wrap; column-gap:8px; row-gap:6px;}
.filter-wrap .layer-filter-wrap .opt-box > li > span{ font-size: 16px; font-weight: 500; color:#000; }

.filter-wrap .layer-filter-wrap .layer-filter .opt-box li > div { display: flex; flex-wrap: wrap; row-gap: 10px; column-gap: 5px;  margin-top: 20px;}
.filter-wrap .layer-filter-wrap .layer-filter .opt-box li.acco > div{display:none;}
.filter-wrap .layer-filter-wrap .layer-filter .opt-box li input[type="checkbox"]{display:none;}
.filter-wrap .layer-filter-wrap .layer-filter .opt-box li .chk-box input[type="checkbox"] + label{display:none;}
.filter-wrap .layer-filter-wrap .layer-filter .opt-box li .chk-box p { padding: 8px 14px; display: inline-block; cursor: pointer; border-radius: 17px; border: solid 1px #E2E2E2; font-size: 15px; font-weight:normal; color:#525252;}
.filter-wrap .layer-filter-wrap .layer-filter .opt-box li .chk-box p > span { display:none; }
.filter-wrap .layer-filter-wrap .layer-filter .opt-box li .chk-box input[type="checkbox"]:checked + label + p{background:#FBFBFB; border:solid 1px #525252; color:#393939;}
.filter-wrap .layer-filter-wrap .layer-filter .opt-box li .chk-color-code div{padding:7px 12px; display:inline-block; cursor:pointer;  border-radius:17px; border:solid 1px #E2E2E2; display:flex; height:fit-content; align-items: center;}
.filter-wrap .layer-filter-wrap .layer-filter .opt-box li .chk-color-code div label{box-shadow:none; width:16px; height:16px; margin-right:10px; display:inline-block; border-radius:50%;}
.filter-wrap .layer-filter-wrap .layer-filter .opt-box li .chk-color-code div label[style="background-color:#ffffff;"]{border:solid 1.5px #e2e2e2; }
.filter-wrap .layer-filter-wrap .layer-filter .opt-box li .chk-color-code div p{ font-size:15px; font-weight:normal; color:#525252; height:fit-content;}
.filter-wrap .layer-filter-wrap .layer-filter .opt-box li .chk-color-code div p > span{display:none;}
.filter-wrap .layer-filter-wrap .layer-filter .opt-box li .chk-color-code div:has(input[type="checkbox"]:checked){background:#FBFBFB; border: solid 1px #525252; color: #393939;}
.filter-wrap .layer-filter-wrap .layer-filter .opt-box li .chk-color-code div:has(input[type="checkbox"]:checked) label{border:solid 1.5px #e2e2e2; }
.filter-wrap .layer-filter-wrap .layer-filter .opt-box li .chk-color-code div:has(input[type="checkbox"]:checked) p{color:#393939;}

.filter-wrap .layer-filter-wrap .layer-filter .select-filter::-webkit-scrollbar { display: none; }
.filter-wrap .layer-filter-wrap .layer-filter .select-filter-wrap { margin: 0 20px 20px; border-bottom: 1px solid #E2E2E2; }
.filter-wrap .layer-filter-wrap .layer-filter .select-filter {display:flex; flex-wrap: nowrap; gap: 8px; overflow-x: auto; overflow-y: hidden; margin:20px 0 30px; }
.filter-wrap .layer-filter-wrap .layer-filter .select-filter-tit { display: flex; align-items: center; gap: 15px; }
.filter-wrap .layer-filter-wrap .layer-filter .select-filter-tit span { font-size: 16px; font-weight: 500; color: #000; }
.filter-wrap .layer-filter-wrap .layer-filter .select-filter-tit button { margin-right: 10px; background: none; border: 0; text-decoration: underline; font-size: 13px; color: #A2A2A2; }
.filter-wrap .layer-filter-wrap .layer-filter .select-filter li {display:flex; align-items:center; gap: 4px; padding:7px 10px; background:#fcfcfc; border-radius:30px; border: 1px solid #BF214B; white-space: nowrap;}
.filter-wrap .layer-filter-wrap .layer-filter .select-filter li .color-code[style*="background-color:#"] {width:16px; height:16px; border: 1px solid #e2e2e2; margin-right:10px; display:inline-block; border-radius:50%; margin-right:7px;}
.filter-wrap .layer-filter-wrap .layer-filter .select-filter li .filter-text {font-size:15px; font-weight:400; color:#BF214B;}
.filter-wrap .layer-filter-wrap .layer-filter .select-filter li .btn-del {position: relative; width: 13px; height: 13px; background: none; font-size: 0; border: 0; }
.filter-wrap .layer-filter-wrap .layer-filter .select-filter li .btn-del::before,
.filter-wrap .layer-filter-wrap .layer-filter .select-filter li .btn-del::after { content: ''; position: absolute; left: 50%; top: 50%; width: 8px; height: 1px; background: #BF214B; transform-origin: center; }
.filter-wrap .layer-filter-wrap .layer-filter .select-filter li .btn-del::before { transform: translate(-50%, -50%) rotate(45deg); }
.filter-wrap .layer-filter-wrap .layer-filter .select-filter li .btn-del::after { transform: translate(-50%, -50%) rotate(-45deg); }

.filter-wrap .layer-filter-wrap .layer-filter .btn-wrap {display:flex; gap: 10px; padding: 22px 20px; }
.filter-wrap .layer-filter-wrap .layer-filter .btn-wrap.bottom { position: sticky; bottom: 0; background:#fff; z-index: 100; }
.filter-wrap .layer-filter-wrap .layer-filter .btn-wrap button {width:auto; padding:14px 0; text-align:center; background:#fff;}
.filter-wrap .layer-filter-wrap .layer-filter .btn-wrap button.btn-reset {width:130px; border:solid 1px #DEDEDE; border-radius:4px;}
.filter-wrap .layer-filter-wrap .layer-filter .btn-wrap button.btn-search {width:calc(100% - 130px); background:#000000; border:solid 1px #000; border-radius: 4px;}
.filter-wrap .layer-filter-wrap .layer-filter .btn-wrap button.btn-search span { color: #fff;}
.filter-wrap .layer-filter-wrap .layer-filter .btn-wrap button span {color:#000; font-size:14px; font-weight:400;}

/* 사이즈 */
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .chk-box { display:none; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone { flex-direction: column; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone > ul { width: 100%; display:flex; justify-content: space-between ;}
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone > ul > li {width:calc(50% - 3px); position:relative; z-index:99}
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone > ul > li > span {display:block; color:#a2a2a2; font-size:14px; font-weight:400; border-radius:5px; border:solid 1px #dedede; padding:12px 40px 12px 20px; background-image:url(/design/jmomall/ECHO/uiux/icon/arrow_bottom.svg); background-repeat: no-repeat; background-position:right 1.3rem  top 17px; background-size:auto 7px; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone > ul > li > span.active {color:#000; border:solid 1px #000;}
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone > ul > li > ul { display:none; position:absolute; top:100%; left:0; background:#fff;width:100%; border:solid 1px #dedede; border-top:0; max-height:210px; overflow-y:auto;}
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone > ul > li > ul.active{ display: block; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone > ul > li > ul > li{ padding: 14px 40px 10px 14px; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone > ul > li > ul > li:last-child { border-bottom: 0; }

/* 대체 사이즈 */
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist { padding-top:25px; display:none; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist .sist-top { display: flex; justify-content: space-between; padding-bottom: 16px; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist .sist-top > p { color:#3182F7; font-size: 15px; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist .sist-top > p > img { width: 18px; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist .sist-top .close-btn { position: relative; width: 18px; height: 18px; background: none; border: none; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist .sist-top .close-btn::before,
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist .sist-top .close-btn::after { content: " "; position: absolute; top: 50%; width: 12px; height: 1px; transform-origin: center; background: #000; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist .sist-top .close-btn::before { transform: translate(-50%, -50%) rotate(45deg); }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist .sist-top .close-btn::after { transform: translate(-50%, -50%) rotate(-45deg); }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist ul li { gap: 8px; margin-bottom: 8px; padding: 14px 16px; justify-content: space-between; border: solid 1px #DEDEDE; border-radius: 6px; margin-left: 32px; position: relative;}
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist ul li:last-child { margin-bottom: 0; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist ul li::before { content:''; display: block; position: absolute; top:50%; transform: translateY(-50%); left:-33px; width:22px; height:22px; background-image:url(/design/jmomall/ECHO/uiux/icon/filter_plus.svg); background-position:center center; background-repeat:no-repeat; background-size:contain; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist ul li.active { border:solid 1px #000; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist ul li.active::before { background-image:url(/design/jmomall/ECHO/uiux/icon/filter_plus_on.svg) }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist ul li span:first-child { color:#000; font-size:14px; }
.filter-wrap .layer-filter-wrap .opt-box > li.bra > .bra_opt_clone .sist ul li span:last-child { color:#3182F7; font-size:14px; text-decoration: underline; text-decoration-color: #DEDEDE; text-underline-offset: 4px; }

/* 타이머 */
#echo-timer{position:relative;}
#echo-timer #HourCountdown{position:absolute; top:48.5%; left:40.5%; transform:translateX(-50%); width: 41.5%; display: flex; gap: 6%; justify-content: space-between; }
#echo-timer #HourCountdown span{ display:inline-block; font-family:"Wanted Sans"; font-size: 10vw; text-align:center; color:#121212; }
#echo-timer .echo-colon { position: relative }


/*.alertPop{ display:none; position: fixed; bottom: 3%; left: 50%; transform: translateX(-50%); width: calc(100% - 2.6rem); background: #393939; padding: 13px 20px; color:#fff; font-size: 15px; border-radius: 5px; z-index: 10;
    transition: transform 0.3s ease-in-out;
}*/
.shopbrandTitle .bf_popup { display:none; position: fixed; top:50%; left:50%; transform: translate(-50%, -50%); z-index:15; width:90%; border: 1px solid rgba(0, 0, 0, 0.1);}
.shopbrandTitle .bf_popup .bf_popup_close { position: absolute; right:0; top:0; width:60px; height: 60px; z-index:1;}

.promotion_wrap{width:100%; margin:0 auto; font-size:0; line-height:0;}
.promotion_wrap a{display:inline-block; width:100%;}
.promotion_wrap img{width:100%; display:inline-block;}
.promotion_wrap .wd50{width:50%; display: inline-block;}
.promotion_wrap .wd33{width:33.33%; display: inline-block;}

.promotion_wrap .menu{background:#fff; width:100%;}
.promotion_wrap .menu ul{display:flex;}
.promotion_wrap .menu ul li{font-size:15px; border:solid 1px #d8d8d8; padding:6px 11px; display:inline-block; margin-right:6px; margin-bottom:6px; border-radius:20px;}
.promotion_wrap .menu ul li.active{border:solid 1px #000;}
.promotion_wrap .menu ul li span{color:#BF214B; font-size:11px;  vertical-align: text-top; margin-left: 4px;}

.promotion_wrap .tab_con{display:none; font-size:0;}
.promotion_wrap .tab_con.on{display:block;}
.promotion_wrap .tab_con .img_viewer{position:relative;}
.promotion_wrap .tab_con .img_viewer .imgBox{position:absolute; top:3vw; left:50%; transform:translateX(-50%); display:flex; justify-content:space-between; flex-direction:row; flex-wrap:wrap; width: 90%;}
.promotion_wrap .tab_con .img_viewer .imgBox > img{width:79%;}
.promotion_wrap .tab_con .img_viewer .imgBox > ul{display:flex; flex-direction:column; justify-content:space-between; width:18%;}

.collection .prd_info p{font-size:14px;}

.prd_info > a > img{width: 6px; vertical-align: 0px; margin: 0 0 0 6px;}


/* xcode=014 */
.promotion_wrap .echo-swiper-container {position:relative;}
.echo-swiper-container .echo-swiper-01 {position:absolute; top:4.5%; left:0; right:0;}

.promotion_wrap .popup{position:fixed; width:100%; height:100%; left:0; top:0; background:rgba(0,0,0,0.3); z-index:99;}
.promotion_wrap .popup_con{width:85%; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);}
.promotion_wrap .popup_con .close{position:absolute; top:18px; right:18px; width:16px;}

.coupon-benefit{text-align: left;}
.list_shopping2x .list_shoppingInfo {padding: 0 6px; margin: -12px 0 0 0;}
.list_shopping2x .list_shoppingInfo a img{width: 35%;}

.list_shopping2x .collection p{font-size:15px;}
.list_shopping2x .collection a{margin-top:12px; padding:5px 14px; border:solid 1px #000; display:inline-block; border-radius:14px;}
.list_shopping2x .collection a img{width: 6px; margin-top: 3px; margin-left: 3px;}


.promotion_wrap .echo-dom-control .wd50{float:left;}

.echo-dom-control a{position:relative;}
.echo-dom-control .echo-label{position:absolute; top:7%; width: 22.5%;}
.echo-dom-control .echo-label.echo-blink{ animation: fade 1s infinite steps(1); }

@keyframes fade {
    0%   { opacity: 0; }
    50%  { opacity: 1; }
    100% { opacity: 0; }
}

 /* 탭 스타일 */
.echo-tab { position: relative; }
.echo-tab-menu { position: absolute; top:3%; left:50%; width:90%; transform:translate(-50%,0); display: flex; }
.echo-menu-item { /*cursor: pointer;*/ padding: 22px 20px; flex:1; font-size:4vw; color:#A2A2A2; text-align:center; pointer-events: none;}
.echo-menu-item.on { color:#121212; }

.echo-tab-content { position: relative; overflow: hidden; }
.echo-content-item { display: none; opacity: 0; transition: opacity 0.5s ease-in-out; }
.echo-content-item.on { display: block; opacity: 1;}

/* 클릭하면 사라지는 효과 */
.wd50:has(.echo-cover) { position: relative; }
.echo-cover { 
    position: absolute; 
    top: 2%; width: 80% !important;
    opacity: 1; transition: opacity 0.5s ease;
    cursor: pointer;
    pointer-events: auto;
}
.echo-cover.fade-out { opacity: 0; pointer-events: none; }


/* 상품 리스트 */
.list_shopping2x ul { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
.list_shopping2x li { display: block; box-sizing: border-box; width: 100%; }


/* 더보기 버튼 */
.more { margin: 40px auto 80px; }
.more .btn_moreGray { width: 75.1%; border: 1px solid #A2A2A2; font-size: 13px; }
/* BASIC css end */