/* BASIC css start */
/* BASIC css start */


aside .side-category>nav ul.depth-one>li>a img {vertical-align: sub; padding-right: 5px; }



.menu_on {
    height: 100%;
    overflow: hidden;
}

.menu_off {
    height: auto;
    overflow: initial;
}

#header {
    width: 100%;
}

#header .top-pt-01 {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
}

#header .top-pt-02 {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
}

#header .headerTop {
    min-width: 275px;
    text-align: center;
    padding-right: 45px;
    background-color: #3e4347;
}

#header .headerTop a {
    width: 25%;
    height: 36px;
    line-height: 36px;
    background-color: #3e4347;
    color: #fff;
    display: inline-block;
    border-left: 1px solid #373737;
    margin-left: -1px;
}

#header .headerTop a .fa {
    vertical-align: top;
    position: relative;
    top: 12px;
}

#header #menu {
    width: 45px;
    background-color: #393939;
    position: absolute;
    right: 0;
}

#header #menu .fa {
    top: 5px;
}

#header .headerBottom {
    padding: 0 10px;
    margin-bottom: 20px;
}

#header .headerBottom h1 {
    font-size: 2.333em;
}

#header .headerBottom .headerBottomLeft {
    float: left;
    margin-top: 22px;
}

#header .headerBottom .headerBottomRight {
    float: right;
    margin-top: 20px;
}

#header .headerBottom .headerBottomRight a {
    margin-left: 17px;
    color: #7d7d7d;
}

#header .headerBottom .headerBottomRight a .fa-bookmark-o {
    color: #f1494d;
}

#header .headerBottom .headerBottomRight .cart {
    position: relative;
}

#header .headerBottom .headerBottomRight .cart sup {
    width: 12px;
    height: 12px;
    background-color: #f1191f;
    color: #fff;
    border-radius: 6px;
    position: absolute;
    top: -12px;
    right: -5px;
    text-align: center;
    line-height: 12px;
}

#header .search {
    height: 42px;
    position: relative;
    left: 0;
    right: 0;
    background-color: #393939;
    padding-right: 45px;
    text-align: center;
    display: none;
    z-index: 10;
}

#header .search .searchBox {
    width: 100%;
}

#header .search .searchBox input {
    width: 90%;
    height: 30px;
    border: 0px none;
    margin-top: 6px;
    padding: 0 5px;
}

#header .search .btn_search {
    width: 45px;
    height: 42px;
    line-height: 50px;
    background-color: #822023;
    position: absolute;
    top: 0;
    right: 0;
    color: #fff;
    text-align: center;
}

/* 카테고리 */

aside {
    position: fixed !important;
    width: 100%;
   /* height: calc(100% - 54px);*/
    height: 100vh;
    top: 0px;
    right: -100%;
    bottom: 0;
    background-color: #fff;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    z-index: 1001;
   /* opacity: 0;
    visibility: hidden;*/
    transition:all .3s;
}

aside.on {
    top: 0;
    right: 0;
    /*opacity: 1;*/
    visibility: visible;
}

aside a.btn-close {
    position: absolute;
    top:15px;
    right: 10px;
}

aside a.btn-close img {
    width: 20px;
    height: auto;
}


aside .side-category {
    /*margin-top: 47px;*/
    /*padding-left: 23px;*/
}

aside .side-category .depth-one {
    /*margin-bottom: 5px;*/
}

aside .side-category .depth-one>p,
aside .side-category .depth-one>a {
    font-family: 'Noto Sans Korean', "Helvetica Neue", Helvetica, NanumGothic, "Malgun Gothic", Dotum, Gulim, sans-serif;
   /*font-size: 32px;*/
    font-size:15px;
    color: #000;
    line-height: 56px;
}

aside .side-category>nav {
    /*margin: 15px 0px 25px;*/
}

aside .side-category>nav ul li {
    position: relative;
}

aside .side-category>nav ul.depth-one ul {
    /*padding-left: 20px;*/
    display: none;
    padding: 20px 0;
    background-color: #f9f9f9;
}

aside .side-category>nav ul li a {
    padding-left:10px;
    font-size: 15px;
    color: #000;
    display: block;
    line-height: 58px;
   
}
aside .side-category>nav ul.depth-one>li>a{ border-top: 1px solid #EEEEEE;}
aside .side-category>nav ul.depth-two>li{ background:#f9f9f9;}
aside .side-category>nav ul.depth-two>li>a{padding: 0px 0 0;line-height: 35px;color:#5A5A5A;padding-left:20px; font-size:14px;font-weight: 400;}


aside .side-category>nav ul.depth-two>li.two a{padding-top:0;}
aside .side-category>nav ul.depth-three{padding: 10px 0 !important;}
aside .side-category>nav ul.depth-three li a{padding-left:30px;color:#5A5A5A;font-size:14px;line-height: 35px;font-weight: 400;}

aside .side-category>nav>ul>li>a {
    font-weight: 500;
    font-family: 'Noto Sans Korean', "Helvetica Neue", Helvetica, NanumGothic, "Malgun Gothic", Dotum, Gulim, sans-serif;
}

aside .side-category>nav>ul>li.add_menu>a {
    color:#00000;
}

aside .side-category>nav ul li span.btn-toggle {
    position: absolute;
    top: 0px;
    right: 10px;
    display: block;
    width: 13px;
    height: 58px;
    background: url(/design/mastideco/wib2018/mobile/img/icon/cate_arrow.png) no-repeat center;
    background-size: 13px auto;
    z-index: 1;
}

aside .side-category>nav ul li span.btn-toggle.on {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}
.slide_menu{font-size:0;padding:15px 10px;}
.slide_menu li{width:auto;display:inline-block;}
.slide_menu li:after{content:"";display:inline-block;width:1px; height:10px; background-color: #ddd;margin:0 9px;}
.slide_menu li:last-child:after{display:none;}
.slide_menu li a{font-size:14px; color:#565656;font-family: 'Noto Sans Korean', "Helvetica Neue", Helvetica, NanumGothic, "Malgun Gothic", Dotum, Gulim, sans-serif;}
.search_box{padding:13px 10px 23px;}
.search_box #keyword{width:95%;border: 1px solid #000;height:51px;}
.search_box fieldset{position: relative;}
.search_box .btn-search{display:block;width:20px;position: absolute;right: 39px;top:15px;}
.search_box fieldset img{width:100%;}
.line_block{width:100%;height:10px;background-color: #F5F5F5;border-top:1px solid #dbdbdb;}

aside .side-category>nav ul.depth-two>li.two span.btn-toggle{height:35px !important; }

.li_img{width:22px;vertical-align: sub;margin-right:10px;}
.sns{display:block;border-top: 1px solid #EEEEEE;padding: 25px 0 79px 10px;}
.sns a{display:inline-block;width:32px;margin-right:12px;}
.sns a:last-child{margin-right:0;}
.sns img{width:32px;}

/* //카테고리 */

/* 최근 본 상품 */

#ly_lastView {
    width: 100%;
    position: absolute;
    top: 36px;
    left: 0;
    background-color: #fff;
    z-index: 101;
    padding-bottom: 20px;
    box-shadow: 0 1px 10px #717171;
    display: none;
}

/* //최근 본 상품 */

@media screen and (min-width:768px) {
    #header #menu {
        width: 85px;
    }
    #header .headerTop {
        padding-right: 85px;
    }
    #header .search {
        padding-right: 85px;
    }
    #header .search .searchBox input {
        width: 95%;
    }
    #header .search .btn_search {
        width: 85px;
    }
}

/* 디자인위브 추가 */

#header {
    height: 124.56px;
}

#header .header-wrap {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 50;
    background: #fff;
}

#header .header-wrap .logo-wrap {
    width: 124px;
    margin: 4px 0px 14.5px 17px;
}

#header .header-wrap .logo-wrap img {
    width: 100%;
    height: auto;
}

#header .header-wrap a.btn-search {
    font-size: 0;
    display: block;
    padding-top: 14px;
    margin-right: 14px;
}

#header .header-wrap a.btn-search img {
    width: 23px;
    height: auto;
    vertical-align: middle;
}

#header .header-wrap a.btn-cart {
    display: block;
    margin-right: 18px;
    padding-top: 12px;
}

#header .header-wrap a.btn-cart img {
    width: 20px;
    height: auto;
    vertical-align: middle;
}

#header .search-popup {
    position: fixed;
    top: 50px;
    left: 0;
    z-index: 100;
    width: 100%;
    height: 100%;
    background: #fff;
    opacity: 0;
    visibility: hidden;
}

#header .search-popup.on {
    top: 0;
    opacity: 1;
    visibility: visible;
}

#header .search-popup .search-box {
    padding: 0px 41px;
    position: relative;
}

#header .search-popup .search-box a.btn-close {
    position: absolute;
    top: 19px;
    left: 16px;
}

#header .search-popup .search-box a.btn-close img {
    width: 9px;
    height: auto;
}

#header .header-wrap .search-popup a.btn-search {
    position: absolute;
    top: 3px;
    right: 27px;
}

#header .search-popup .search-box input#keyword {
    border: 0;
    border-bottom: 2px solid #000;
    width: 100%;
    margin-top: 13px;  
    padding-left: 0;
}

#header .search-popup .search-keyword {
    margin-top: 18px;
}

#header .search-popup .search-keyword .box-title p {
    line-height: 1;
    font-size: 13px;
    color: #000;
    font-weight: 500;
}

#header .search-popup .search-keyword ul li {
    margin-top: 18px;
}

#header .search-popup .search-keyword ul li a {
    display: block;
    line-height: 1;
    font-size: 11.7px;
    color: #000;
}
.btn-side {
    display: block;    
    background: url(/design/mastideco/wib2018/mobile/img/icon/ham.png) no-repeat center;
    background-size: 24px auto;
    float:right;
    margin-top: 10px;
    margin-right:10px;
    width: 24px;
    height: 24px;
}

.fix-bottom {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #fff;
    border-top: 1px solid #e8e8e8;
    z-index: 1002;
}

.fix-bottom li {
    width: 25%;
}

.fix-bottom li a {
    display: block;
    font-size: 8.7px;
    color: #000;
    padding: 37px 0px 7px;
    line-height: 1;
    font-family: 'Roboto', 'Noto Sans Korean', "Helvetica Neue", Helvetica, NanumGothic, "Malgun Gothic", Dotum, Gulim, sans-serif;
    letter-spacing:-0.3px;
    
}

.fix-bottom li:nth-of-type(1) a {
    background: url(/design/mastideco/wib2018/mobile/img/icon/icon-home.png) no-repeat center 10px;
    background-size: 22px auto;
}

.fix-bottom li:nth-of-type(2) a {
    background: url(/design/mastideco/wib2018/mobile/img/icon/icon-bars.png) no-repeat center 12px;
    background-size: 19px auto;
}

.fix-bottom li:nth-of-type(2) a.on {
    background: #000 url(/design/mastideco/wib2018/mobile/img/icon/icon-bars-w.png) no-repeat center 12px;
    background-size: 19px auto;
    color: #fff;
}

.fix-bottom li:nth-of-type(3) a {
    background: url(/design/mastideco/wib2018/mobile/img/icon/icon-event.png) no-repeat center 6px;
    background-size: 14px auto;
}

.fix-bottom li:nth-of-type(4) a {
    background: url(/design/mastideco/wib2018/mobile/img/icon/icon-my.png) no-repeat center 9px;
    background-size: 18px auto;
}

a.btn-top {
    position: fixed;
    bottom: 65px;
    right: 10px;
    z-index: 5;
    opacity: 0;
    visibility: hidden;
}

a.btn-top.on {
    opacity: 1;
    visibility: visible;
}

a.btn-top img {
    width: 40px;
    height: auto;
}

/* 상단 카테고리 */
.hd_cate {position: fixed;top: 95px;left: 0;width: 100%;z-index: 50;background: #fff;display: flex;justify-content: space-around;align-items: center;padding: 6px 0;border-top: 1px solid #333;border-bottom: 1px solid #333;} 
.hd_cate a { display: block; font-size: 13px; font-weight: 500; } 

/* 카카오 우측 하단 고정 */
a.kakao_fixed {position: fixed;z-index: 999;bottom: 12px;right: 10px;} 
a.kakao_fixed img {width: 40px;} 
/* BASIC css end */



/* BASIC css end */