/* BASIC css start */
.menu_on {height:100%;overflow:hidden}
.menu_off {height:auto;overflow:initial}

#mask {width:100%;height:100%;position:fixed;top: 0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.8);z-index:1000;display:none }
#wrap { margin-top:101px;position:relative;width:100%;min-width:320px;overflow:hidden}
#wrap #container { padding-top:0 !important }
#header {position: sticky;top: 0;left: 0;right: 0;width: 100%;background: #fff;z-index: 101;}
#header.fixed {}

#header.fixed #gnb {background: #fff;height: 0;overflow: hidden;}
#header.fixed #gnb .logo {background:url(/design/zoom/renewal/img/mo/m_logo_b.svg) 0 0 no-repeat; background-size:100px auto;}
#header.fixed #gnb p.asideOpen {background:url(/design/zoom/renewal/img/mo/mo_ic_ham_b.png) 0 0 no-repeat; background-size:24px auto}
#header.fixed #gnb p.searchBtn {background:url(/design/zoom/renewal/img/mo/ic_search_b.svg) 0 0 no-repeat; background-size:19px auto}
#header.fixed #gnb p.cartBtn {background:url(/design/zoom/renewal/img/mo/ic_cart_b.svg) 0 0 no-repeat; background-size:25px auto}
#header.fixed #gnb p.cartBtn .count {background:#000;color:#fff;}


/* 분류, 상세 헤더 */
#detail_gnb {position:relative;height:0; box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.08);background: transparent;opacity: 0;visibility: hidden;transition: opacity 0.6s ease, visibility 0.2s ease;}
#detail_gnb ul {padding: 11px 16px;}
#detail_gnb ul li {width: auto;margin-right: 28px;}
#detail_gnb ul li a {font-size:13px;font-weight: 400;}
#detail_gnb ul li a.red {color:#B30000;}
#detail_gnb .arrow {position: absolute;right: 0;top: 0;display: block;width: 40px;height: 40px;background: #fff;z-index: 10;}
#detail_gnb .arrow img {position: absolute;right: 16px;top: 15px;}
#detail_gnb ul li:first-child a {color:#946745;}
#detail_gnb .cate_menu {display:none;position: absolute;background: rgba(255, 255, 255, 1);width: 100%;box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.08);z-index: 5;}
#detail_gnb .cate_menu .inner {display: flex;padding: 20px 16px;border: 1px solid #e5e5e5;}
#detail_gnb .cate_menu .cate_list {display: flex;flex-direction: column;width: 33.3333%;padding: 0 20px;border-right: 1px solid #e5e5e5;}
#detail_gnb .cate_menu .cate_list:first-child {padding: 0 20px 0 0;}
#detail_gnb .cate_menu .cate_list:last-child {border-right:0;}
#detail_gnb .cate_menu .cate_list a {display:block;margin-bottom:12px;font-weight: 400;}
#detail_gnb .cate_menu .cate_list a.red {color:#B30000;}
#detail_gnb .cate_menu .cate_list a:last-child {margin-bottom:0;}
#detail_gnb .swiper {padding-right:40px;}

#header.fixed #detail_gnb {height:40px;opacity: 1;visibility: visible;background: rgba(255, 255, 255, 0.95);}

#detail_gnb.on .arrow img {top: 23px;transform: rotate(180deg);transform-origin: top;}
#detail_gnb.on .cate_menu {}

#gnb { position: absolute;width: 100%;height: 52px;background: #fff;}
#gnb .left_ic .back {display:none; position:absolute; top:20px; left:16px; width:22px; height:16px; text-indent:-9999em;background:url(/design/zoom/renewal/img/mo/ic_prev.svg) 0 0 no-repeat;background-size:20px auto;}
#gnb .logo { position:absolute; top:19px; left:50%; margin-left:-50px; width:110px;text-indent:-9999em; background:url(/design/zoom/renewal/img/mo/m_logo_b.svg) 0 0 no-repeat; background-size:100px auto }
#gnb .logo a { display:block;}
#gnb p.asideOpen { position:absolute; top:20px; left:16px; width:22px; height:16px; text-indent:-9999em; background:url(/design/zoom/renewal/img/mo/mo_ic_ham_b.png) 0 0 no-repeat; background-size:24px auto }
#gnb p.searchBtn { position:absolute; top:16px;right:55px; width:22px; height:25px; text-indent:-9999em; background:url(/design/zoom/renewal/img/mo/ic_search_b.svg) 0 0 no-repeat; background-size:19px auto }
#gnb p.searchBtn a { display:block; height:25px }
#gnb p.cartBtn { position:absolute; top:16px; right:16px; width:26px; height:25px; text-indent:-9999em; background:url(/design/zoom/renewal/img/mo/ic_cart_b.svg) 0 0 no-repeat; background-size:25px auto }
#gnb p.cartBtn a { display:block; height:20px }
#gnb p.cartBtn .count {position:absolute; top:-2px; right:-6px; color:#fff; text-indent:0; border-radius:25px; background:#000;width: 14px;height: 14px;display: flex;align-items: center;justify-content: center;font-size: 10px; }


/* header 배너 */
#top_banner. {transition: transform 0.5s ease, opacity 0.5s ease;}
#top_banner.hide {display:none; transform: translateY(-100%);opacity: 0;transition: transform 0.5s ease, opacity 0.5s ease;}
#top_banner.top-banner {height:35px;line-height:35px;background-color:#625850;text-align:center;overflow: hidden;z-index: 998;}
#top_banner.top-banner .swiper-slide {background-color:#625850;}
#top_banner.top-banner a {color:#fff;font-size:13px;font-weight:400;}
#top_banner.top-banner a strong {font-weight:300;}
#top_banner .close_btn {position: absolute;right: 16px;top: 11px;z-index: 90;cursor: pointer;}

/* 실시간 검색어 순위 */
.keyword_wrap .keyword_list .mk_new_ranking {padding:0;width:100%;border:none;}
.keyword_wrap .keyword_list .mk_new_ranking .mk_title_wrap .mk_h3 {font-size: 16px;font-family: tt-commons-pro, Pretendard, baskerville-display-pt, sans-serif;}
.keyword_wrap .keyword_list .mk_new_ranking .mk_keyword_wrap {margin-top:10px;}
.keyword_wrap .keyword_list .mk_new_ranking .mk_keyword_wrap .mk_keywords {display: grid;grid-template-columns: repeat(2, 1fr);}
.keyword_wrap .keyword_list .mk_new_ranking .mk_keyword_wrap .mk_keywords li a {width:auto;font-size: 14px;font-family: tt-commons-pro, Pretendard, baskerville-display-pt, sans-serif;}
.keyword_wrap .keyword_list .mk_new_ranking .mk_keyword_wrap .mk_keywords .mk_keywords_num {color:#000;font-weight:500;}
.keyword_wrap .keyword_list .mk_new_ranking .mk_keyword_wrap .mk_keywords .mk_keywords_txt {font-weight: 500;}


#header .search { display:none;padding:10px 10px 0; position:absolute; top:0; left:0; right:0;background:#fff; z-index:999 }
#header .search .prev {position: absolute;top: 26px;left: 20px;}
#header .search .searchBox {margin: 0 10px 0 50px; position:relative; height:38px;}
#header .search .searchBox input { width:100%; height:38px; line-height:38px; border:0; outline:none;border-bottom: 2px solid #000; }
#header .search .btn_search { position:absolute; top:10px; right:5px; width:20px; height:22px; text-indent:-9999em; background:url(/design/zoom/renewal/img/mo/ic_search_b.svg) center 50% no-repeat; background-size:18px auto }
#header .search .keyword_wrap {padding: 40px 30px;}
#header .search .keyword_wrap h2 {margin-bottom: 20px;font-size: 16px;font-weight: 700;}


#header .cate {}
#header .cate .list_category {overflow:hidden;}
#header .cate .list_category li {float:left; width:20%; border-bottom:1px solid #eee; border-right:1px solid #eee; box-sizing:border-box; -moz-box-sizing:border-box;}
#header .cate .list_category li:nth-child(5) {border-right:0px none;}
#header .cate .list_category li:nth-child(10) {border-right:0px none;}
#header .cate .list_category li a {display:block;height:32px;line-height:32px;color:#777;text-align:center;text-overflow: clip;white-space: nowrap;overflow: hidden;font-size: 11px;}

/* 사이드 메뉴 */
.asideClose { position:fixed; top:3px; left:-85%; width:45px; height:45px;text-indent:-9999em; background:url(/design/zoom/phps/m/common/btn_aside_close.png) 0 0 no-repeat; background-size:45px auto; cursor:pointer; z-index:1001 }

aside { position:fixed; top:0; left:-85%; width:85%; height:100%; background:#fff;padding: 32px 0;box-sizing: border-box;  overflow-y:auto; -webkit-overflow-scrolling: touch; z-index:1001 }
aside .asideLogo {position: relative;padding: 0 15px; }
aside .asideLogo .logo {width:100px; height:34px; text-indent:-9999em; background:url(/design/zoom/phps/m/common/tlogo.png) 0 0 no-repeat; background-size:100px auto }
aside .asideLogo .logo a { display:block; height:34px }
aside .asideLogo p { padding:18px 0 0 118px }
aside .asideLogo p a { display:inline-block; padding:5px 10px; border:1px solid #ddd }

aside .asideLogo .asideTop ul.icoBtn { }
aside .asideLogo .asideTop ul.icoBtn a { display:block;}
aside .asideLogo .asideTop ul.icoBtn li:first-child a {margin-right: 15px;}
aside .asideLogo .asideTop ul { display:flex; position: absolute;right: 16px;top: 0;}
aside .asideLogo .asideTop li {position: relative;}
aside .asideLogo .asideTop li .num { display:block; padding:11px 0 5px }
aside .asideLogo .asideTop li .ico { display:inline-block; margin-top:10px; width:22px; height:20px;}
aside .asideLogo .asideTop li .ico1 {background:url(/design/zoom/renewal/img/mo/ic_cart.svg) 0 0 no-repeat;background-size:22px auto  }
aside .asideLogo .asideTop li .ico2 {background:url(/design/zoom/renewal/img/mo/ic_edit.svg) 0 0 no-repeat;background-size:20px auto }
aside .asideLogo .asideTop li .txt { display:block; line-height:4px }
aside .asideLogo .asideTop li .count { padding:0 5px; position:absolute; top:11px; right:6px; color:#fff; text-indent:0; border-radius:25px; background:#000;width: 15px;height: 15px;box-sizing: border-box;font-size: 10px; }


aside .loginBx {position:relative;}
aside .loginBx .t1 {margin-top: 24px;padding: 0 16px;font-size: 13px;line-height: 20px;color: #858585;}
aside .loginBx .t2 {margin-top: 24px;padding: 0 16px;font-size: 13px;line-height: 20px;color: #111;font-weight: 400;}
aside .loginBx .t3 {margin-top: 8px;padding: 0 16px;font-size: 13px;line-height: 18px;color: #858585;}
aside .loginBx .t1 .em {color:#000;font-weight: 500;}
aside .loginBx .logout {font-size: 11px;text-decoration: underline;position: absolute;right: 16px;top: 22px;font-weight: 500;}
aside .loginBx .my_btn {padding:0 16px;margin: 24px 0;}
aside .loginBx .my_btn a {display: block;width: 100%;height: 42px;line-height: 42px; border: 1px solid #c5c5c5;text-align: center;font-size: 13px;font-weight: 400;}
aside .loginBx .loginAfterBtn {background:#f5f5f5;padding:32px 16px;margin-bottom: 15px;}
aside .loginBx .loginAfterBtn ul {display:flex;}
aside .loginBx .loginAfterBtn ul li {width:33.3333%;background: #fff;padding: 27px 15px;margin-right: 5px;box-sizing: border-box;}
aside .loginBx .loginAfterBtn ul li:last-child {margin-right:0;}
aside .loginBx .loginAfterBtn ul li span {display:block;text-align:center;}
aside .loginBx .loginAfterBtn ul li span.num {font-size:16px;margin-top:8px;font-weight: 400;}
aside #loginBefore {border-bottom: 6px solid #f9f9f9;}

aside .loginBeforeBtn {padding: 20px 15px 50px;}
aside .loginBeforeBtn ul { margin-left:-3px; font-size:0; text-align:center }
aside .loginBeforeBtn li {position: relative;display:inline-block; width:33.33% }
aside .loginBeforeBtn li a { display:block; margin:0 3px; padding:11px 0;height: 42px; color:#000; font-size:12px;line-height: 20px; border:1px solid #c5c5c5;font-weight: 400;box-sizing: border-box; }
aside .loginBeforeBtn li a.bt_login { color:#fff; border:1px solid #000; background:#000 }
aside .loginBeforeBtn li .join_bg {display: block;position: absolute;left: 50%;transform: translate(-50%);bottom: -25px;background:url(/design/zoom/renewal/img/mo/join_bg.svg) 0 0 no-repeat;width:40px;height:22px;background-size:40px auto;font-size: 10px;line-height: 26px;color: #fff;}


aside .asideCate {}
aside .asideCate > ul > li {position: relative;border-bottom: 1px solid #eee;}
aside .asideCate > ul > li:last-child {border-bottom:0;}
aside .asideCate > ul > li > a {display: block;font-size: 16px;line-height: 26px;font-weight: 500;padding: 18px 16px;height: 56px;box-sizing: border-box;}
aside .asideCate > ul > li > a > i {position: absolute;right: 16px;top: 23px;height: 8px;transition: all .3s;}
aside .asideCate .cateList {display:none; padding: 5px 16px 37px;}
aside .asideCate .cateList ul {display: flex;flex-wrap: wrap;row-gap: 10px;}
aside .asideCate .cateList > ul > li {display: inline-block;width: 50%;}
aside .asideCate .cateList > ul > li > a {font-size: 14px;font-weight: 400;}
aside .asideCate > ul > li.active .cateList {display:block;}
aside .asideCate > ul > li.active > a > i {transform: rotate(180deg);transform-origin: center center;transition: all .3s;}


aside .asideBottom {border-top: 6px solid #f9f9f9;padding: 24px 0 0;}
aside .asideBottom ul {padding: 0 23px; display: flex;justify-content: center; }
aside .asideBottom ul:after { display:block; clear:both; content:'' }
aside .asideBottom li {width:25%; text-align:center }
aside .asideBottom li a { display:block; }
aside .asideBottom li .ico { display:inline-block;width:56px; height:56px;border-radius: 15px;}
aside .asideBottom li .ico1 {background:#f5f5f5 url(/design/zoom/renewal/img/aside_bottom_ic01.svg) 0 0 no-repeat;background-position: center; }
aside .asideBottom li .ico2 {background:#f5f5f5 url(/design/zoom/renewal/img/aside_bottom_ic02.svg) 0 0 no-repeat;background-position: center; }
aside .asideBottom li .ico3 {background:#f5f5f5 url(/design/zoom/renewal/img/aside_bottom_ic03.svg) 0 0 no-repeat;background-position: center; }
aside .asideBottom li .ico4 {background:#f5f5f5 url(/design/zoom/renewal/img/aside_bottom_ic04.svg) 0 0 no-repeat;background-position: center; }
aside .asideBottom li .txt { display:block; line-height:10px;margin-top:5px;font-weight: 400;}
/* //카테고리 */
/* BASIC css end */