/* BASIC css start */
#topbanner .topSlider { width:100%; }
#topbanner .topSlider a { width:100%; text-align:center; line-height:48px !important; font-family: 'SUIT' !important; font-size:15px !important; font-weight:600 !important;  }
#topbanner .topSlider a span { font-family:'Roboto'; font-weight:700 }
#topbanner .topbanner-close img { width:40% }

header {width:100%; background:#fff; }
header .fix {width:100%; }

header .gnb { padding:12px 0px; text-align:left; height:58px; border-bottom:1px solid #dbdbdb; position:relative;  }
header .gnb h1 { padding-left:54px }
header .gnb h1 img {height:34px;}

header .gnb .li_ham {position:absolute; top:0;left:20px;}
header .gnb .li_ham a { display:block; width:50px; height:58px; background:url(/design/resetmall/img/hd_menu.png) no-repeat 0 center; background-size:18px 18px; font-size:0px }

header .gnb .my {position:absolute; top:0;right:52px;}
header .gnb .my a {display:block; width:26px; height:58px; background:url(/design/resetmall/img/m/i_my.png) no-repeat 0 center; background-size:26px 28px; font-size:0px }
header .gnb .cart {position:absolute; top:0;right:16px;}
header .gnb .cart a {display:block; width:25px; height:58px; background:url(/design/resetmall/img/m/i_cart.png) no-repeat 0 center; background-size:25px 28px; font-size:0px }
header .gnb .cart .cqu { position:absolute; top:14px; right:-3px; display:block; width:16px; height:16px; line-height:16px; text-align:center; background:#1e00ff; border-radius:10px; }
header .gnb .cart .cqu .user_basket_quantity { font-family:'Roboto'; font-size:11px; color:#fff; font-weight:500 }

header .top_menu { height:50px; position:relative; }
header .top_menu .bt { position:absolute; top:0px; right:0px; cursor:pointer; background:#fff; width:60px; height:49px; }
header .top_menu .bt img { height:24px; margin:13px 18px 12px 18px }

header .top_menu .con1 { width:100%; height:55px; overflow:hidden; box-sizing:border-box; padding:0 10% 0 15px; background:url(/design/resetmall/img/line01.png) repeat-x 0 49px; overflow-x:scroll;  }
header .top_menu .con1 p { /*width:225%;*/ width:850px }
header .top_menu .con1 span { margin-right:10px }
header .top_menu .con1 a { display:inline-block; line-height:50px; font-weight:500; color:#222; font-size:18px; padding:0 5px; letter-spacing:-1px }
header .top_menu .con1 a.sel { color:#1e00ff; line-height:40px; border-bottom:5px solid #1e00ff; }
header .top_menu .con2 { height:50px; overflow:hidden; padding-left:20px; line-height:50px; font-weight:700; color:#222; font-size:15px; }

header .top_menu .con2_box { position:absolute; z-index:98; background:#fff; width:100%; border-bottom:1px solid #e5e5e5 }
header .top_menu .con2_box > div { overflow:hidden; padding:0 17px 17px }
header .top_menu .con2_box > div span { width:33.33%; float:left; box-sizing:border-box; padding:3px }
header .top_menu .con2_box > div span a { display:block; width:100%; height:38px; line-height:38px; border:1px solid #e7e7e7; border-radius:3px; font-weight:700; color:#000; font-size:14px; text-align:center }
header .top_menu .con2_box > div span a:hover { border:1px solid #3600ff }

header .fix.active {position:fixed; z-index:5; background-color:rgba(255,255,255,0.95); top:0 }


header .top_menu .con1::-webkit-scrollbar {
  width: 5px;
}
header .top_menu .con1::-webkit-scrollbar-track {
  background-color:transparent;
}
header .top_menu .con1::-webkit-scrollbar-thumb {
  border-radius: 3px;
  background-color:transparent;
}
header .top_menu .con1::-webkit-scrollbar-button {
  width: 0;
  height: 0;
}  




/* 사이드 */

.asi_bg{display: none; opacity: 0; transition: opacity .7s; width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 99; background-color: rgba(0,0,0,.7);}
.asi_bg.show1{display: block;}
.asi_bg.show2{opacity: 1;}

.asi_bg .asi_close { position:absolute; left:83%; top:15px; }
.asi_bg .asi_close a {display: block;}
.asi_bg .asi_close a img{ width:20px }

#asi{ transition: opacity .5s, left .6s; opacity: 0; position: fixed; background-color: #fff; top: 0; left: -100%; width: 80%; height: 100%; z-index: 100; overflow-y: auto;  min-width: 250px; max-width: 650px; /* background-color: var(--main-bg-color); */}
#asi.show{left: 0; opacity: 1;}
#asi .asi_inner{ display: flex; flex-direction: column; justify-content: space-between; height: 100%; background-color: #fff}
#asi .asi_inner>div{}


#asi .asi_inner .asi_top { overflow:hidden; background:#000; height:48px }
#asi .asi_inner .asi_top li { width: 33.33%; float:left; text-align: center;}
#asi .asi_inner .asi_top li a { color:#fff; font-size: 14px; font-weight: 500; line-height:48px }

#asi .asi_inner .asi_cart { padding:14px 15px 0px; }
#asi .asi_inner .asi_cart a { display:block; width:100%; text-align: center; border:1px solid #e7e7e7; height:42px; box-sizing:border-box; border-radius:5px; }
#asi .asi_inner .asi_cart a > span { position:relative; color:#000; font-size: 16px; font-weight:500; line-height:43px; padding-right:24px }
#asi .asi_inner .asi_cart a > span .squ { position:absolute; top:1px; right:0px; display:block; width:19px; height:19px; line-height:20px; text-align: center; background:#1e00ff; border-radius:10px; }
#asi .asi_inner .asi_cart a > span .squ .user_basket_quantity { font-family:'Roboto'; font-size:13px; color:#fff; font-weight:500; }


#asi .asi_inner .asi_bottom { padding:10px 15px 0;}
#asi .asi_inner .asi_bottom .asi_cont{}
#asi .asi_inner .asi_bottom .asi_cont>div ul.main_m{}
#asi .asi_inner .asi_bottom .asi_cont>div ul.main_m>li{ }
#asi .asi_inner .asi_bottom .asi_cont>div ul.main_m>li>a{ display: block; color:#000; font-size: 16px; font-weight: 500; line-height:40px; padding-left:3px  }
#asi .asi_inner .asi_bottom .asi_cont>div ul.main_m>li>a span{display: inline-block; float: right; transition: transform .3s; }
#asi .asi_inner .asi_bottom .asi_cont>div ul.main_m>li>a span img{display: inline-block;transform: scale(.66); transform-origin: center center; transition: transform .3s; margin-top:12px }
#asi .asi_inner .asi_bottom .asi_cont>div ul.main_m>li>a.clicked span img{transform:scale(.66) rotate(-180deg);}

#asi .asi_inner .asi_bottom .mm2 { border-top:1px solid #e7e7e7;padding:10px 0; margin-top:10px }

#asi .asi_inner .asi_bottom .asi_cont>div ul.sub_m{display: none; background:#f8f8f8; padding:10px 0 }
#asi .asi_inner .asi_bottom .asi_cont>div ul.sub_m>li{}
#asi .asi_inner .asi_bottom .asi_cont>div ul.sub_m>li>a{transition: color .2s; display: block; color: #000; font-size: 13px; font-weight: 500; line-height:30px; padding-left:18px }

#asi .asi_inner .asi_bt { overflow:hidden; padding:0 15px 30px;}
#asi .asi_inner .asi_bt a:first-child { float:left; background:#fff; color:#000; }
#asi .asi_inner .asi_bt a { float:right; display:inline-block; width:49%; color:#fff; font-size:16px; font-weight:500; text-align: center; border:1px solid #e7e7e7; height:40px; line-height:40px; box-sizing:border-box; border-radius:5px; background:#3600ff }













/* BASIC css end */