/* BASIC css start */
.top-banner {
    position:fixed;
    top:0px;
    left:0px;
    z-index:1001;
    width:100%;
    overflow:hidden;
}
.top-banner .banner-list {
}
.top-banner .banner-list a {
    display:inline-block;
    width:100%;    
}
.top-banner .banner-list a img {
    width:100%;
}
.top-banner .close-btn {
    position:absolute;
    top:-8px;
    right:-5px;
    z-index:1000;
    width:36px;
    height:36px;
}

.top-banner .close-btn img {
    width:100%;
    height:100%;
}

.header {
    position:fixed;
    top:0px;
    left:0px;
    z-index:1010;
    width:100%;
    height:50px;
    background:#f6e3e7;
    text-align:center;
}
.header .logo {
    display:inline-block;
    width:100px;
    height:50px;
    background:url('/design/ocato/renewal/mobile/img/header/header-logo.png') no-repeat center center;
    background-size:auto 50px;
    text-indent:-999em;
    overflow:hidden;
}
.header .menu-open {
    position:absolute;
    top:0px;
    left:3px;
    width:41px;
    height:50px;
    background:url('/design/ocato/renewal/mobile/img/header/header-menu-open-icon.png') no-repeat center center;
    background-size:auto 50px;
    text-indent:-999em;
    overflow:hidden;
}
.header .search-open {
    position:absolute;
    top:0px;
    left:86px;
/*    left:36px;    */
    width:39px;
    height:50px;
    background:url('/design/ocato/renewal/mobile/img/header/header-search-icon.png') no-repeat center center;
    background-size:auto 50px;
    text-indent:-999em;
    overflow:hidden;
}
.header .app{
    position:absolute;
    top:0px;
    left:47px;
    width:40px;
    height:50px;
    background:url('/design/ocato/renewal/mobile/img/header/header-app-down.png') no-repeat center center;
    background-size:auto 40px;
    text-indent:-999em;
    overflow:hidden;
}
.header .cart {
    position:absolute;
    top:0px;
    right:40px;
    width:40.5px;
    height:50px;
    background:url('/design/ocato/renewal/mobile/img/header/header-cart-icon.png') no-repeat center center;
    background-size:auto 50px;
    text-indent:-999em;
    overflow:hidden;
}
.header .cart span {
    position:absolute;
    top:17px;
    left:0px;
    width:100%;
    color:#333333;
    font-size:10px;
    line-height:13px;
    text-align:center;
    text-indent:0px;
}
.header .mypage {
    position:absolute;
    top:0px;
    right:3px;
    width:38px;
    height:50px;
    background:url('/design/ocato/renewal/mobile/img/header/header-mypage-icon.png') no-repeat center center;
    background-size:auto 50px;
    text-indent:-999em;
    overflow:hidden;
}

.menu-modal {
    position:fixed;
    top:0px;
    left:-100%;
    z-index:5001;
    width:100%;
    height:100%;
    background:#eeeeee;
    opacity:0;
}
.menu-modal.active {
    left:0px;
}

.menu-modal .modal-content {
    position:relative;
    display:block;
    width:100%;
    height:100%;
    overflow-y:scroll;
}

.menu-modal .modal-login-box {
    background:#f6e3e7;
}
.menu-modal .modal-login-box .modal-header {
    position:relative;
    font-size:0px;
}
.menu-modal .modal-login-box .modal-header .logo {
    display:inline-block;
    font-size:0px;
}
.menu-modal .modal-login-box .modal-header .logo img {
    width:auto;
    height:47px;
}
.menu-modal .modal-login-box .modal-header .menu-close {
    position:absolute;
    top:0px;
    right:10px;
    width:38px;
    height:47px;
    font-size:0px;
}
.menu-modal .modal-login-box .modal-header .menu-close img {
    width:38px;
    height:47px;
}

.menu-modal .modal-login-box .modal-body {
    padding:2.5px 0px 20px 0px;
}
.menu-modal .modal-login-box .modal-body p {
    padding:0px 10px;
    color:#333333;
    font-size:14px;
    line-height:17px;
    text-align:left;
}
.menu-modal .modal-login-box .modal-body p strong {
    font-weight:bold;
}
.menu-modal .modal-login-box .modal-body .btn-list {
    margin-top:12px;
    padding:0px 5px 0px 10px;
}
.menu-modal .modal-login-box .modal-body .btn-list ul:after {
    display:block;
    clear:both;
    content:"";
}
.menu-modal .modal-login-box .modal-body .btn-list ul li {
    float:left;
    width:33.33%;
    padding-right:5px;
    box-sizing:border-box;
}
.menu-modal .modal-login-box .modal-body .btn-list ul li a {
    display:inline-block;
    width:100%;
    height:40px;
    background:white;
    border:1px solid #333333;
    color:#333333;
    font-size:14px;
    font-weight:bold;
    line-height:38px;
    text-align:center;
    box-sizing:border-box;
}
.menu-modal .modal-login-box .modal-body .btn-list ul li a.login-btn {
    display:inline-block;
    width:100%;
    height:40px;
    background:#333333;
    color:white;
    font-size:14px;
    font-weight:bold;
    line-height:40px;
    text-align:center;
    box-sizing:border-box;
}

.menu-modal .menu-section {
    background:white;
}
.menu-modal .menu-section ul:after {
    display:block;
    clear:both;
    content:"";
}
.menu-modal .menu-section ul li {
    float:left;
    width:50%;
    border-top:1px solid #dddddd;
    box-sizing:border-box;
}
.menu-modal .menu-section ul li:nth-child(1), .menu-modal .menu-section ul li:nth-child(2) {
    border-top:none;
}
.menu-modal .menu-section ul li:nth-child(2n+1) {
    border-right:1px solid #dddddd;
}
.menu-modal .menu-section ul li a {
    display:inline-block;
    width:100%;
    font-size:0px;
    line-height:45px;
    text-align:left;
}

.menu-modal .menu-section ul .big a{
    line-height:60px;
}
.menu-modal .menu-section ul .big a img{
    height:60px;
}

.menu-modal .menu-section ul li a img {
    width:auto;
    height:45px;
}

.menu-modal .customer-info:after {
    display:block;
    clear:both;
    content:"";
}
.menu-modal .customer-info .width50 {
    width:50%;
    padding:10px 0px;
    background:#333333;
    text-align:center;
    box-sizing:border-box;
}
.menu-modal .customer-info .width50:nth-child(1) {
    border-right:1px solid white;
}
.menu-modal .customer-info .width50 p {
    color:white;
    font-size:12px;
    line-height:15px;
}
.menu-modal .customer-info .width50 p strong {
    font-family:'Roboto';
    font-size:16px;
    line-height:20px;
    font-weight:normal;
    letter-spacing:0.5px;
}
.menu-modal .customer-info .width50x2 {
    width:100%;
    padding:10px 0px;
    background:#333333;
    text-align:center;
    box-sizing:border-box;
}
.menu-modal .customer-info .width50x2:nth-child(1) {
    border-right:1px solid white;
}
.menu-modal .customer-info .width50x2 p {
    color:white;
    font-size:12px;
    line-height:15px;
}
.menu-modal .customer-info .width50x2 p strong {
    font-family:'Roboto';
    font-size:16px;
    line-height:20px;
    font-weight:normal;
    letter-spacing:0.5px;
}
.menu-modal .customer-info .width100 {
    width:100%;
    height:50px;
    background:#aaaaaa;
    color:#ffffff;
    font-size:16px;
    font-weight:bold;
    line-height:50px;
    text-align:center;
}

.menu-modal .customer-info .width50qna {
    width:50%;
    height:50px;
    background:#aaaaaa;
    color:#ffffff;
    font-size:15px;
    font-weight:bold;
    line-height:50px;
    text-align:center;
    box-sizing:border-box;
}

.menu-modal .customer-info .width50qna:nth-child(3){
    border-right:1px solid white;
}

.header-area {
    min-height:50px;
}
/* 카테고리 슬라이더 */
.category-scroll {
    overflow:hidden;
    position:relative;
    border-top:1px solid #ccc;
    border-bottom:1px solid #ccc;
    
}
.category-scroll .swiper-slide {
    display:inline-block;
    width:auto;
    margin:0px 4.7px;
    color:#333;
    font-size:12.5px;
    font-weight:bold;
    line-height:43px;
}
.category-scroll .swiper-slide:first-child {
    margin-left:10px;
}
.category-scroll .swiper-slide:last-child {
    margin-right:50px;
}
.scroll_btn{
    position:absolute;
    right:0px;
    top:0px;
    width:43px;
    height:43px;
    z-index:888;
    background:url('/design/ocato/renewal/mobile/img/main/menu_scroll_btn.jpg')no-repeat center center;
    background-size:43px 43px;
    border-left:1px solid #ccc;
}

.list_category {overflow:hidden;}
.list_category li {float:left; width:25%; height:32px; padding:8px 0; border-bottom:1px solid #ddd; box-sizing:border-box;}
.list_category li a {display:block; border-right:1px solid #ddd; text-align:center; text-overflow: clip; white-space: nowrap; overflow: hidden;}
.list_category li:nth-child(4) a {border-right:0px none;}
.list_category li:nth-child(8) a {border-right:0px none;}



#ly_lastView{ position:fixed; left:0; bottom:0; width:100%; background:#FFF; border-top:1px solid #e797a8; z-index:100;  display:none;}    
#ly_lastView .h_layerHead{height:58px; box-sizing:border-box; position:relative;}
#ly_lastView .h_layerHead h3{padding:16px 24px; font-size:15px; line-height:21px; color:#555;  font-family: 'Noto Sans KR', sans-serif; font-weight:500;}
#ly_lastView .h_layerHead .btn_close{position:absolute; top:0; right:0; width:58px; height:58px; display:block; background:url(/design/ocato/mimg/btn_X_12.png) center no-repeat; font-size:0; overflow:hidden; text-indent:-100px;}
#ly_lastView .list_lastView{padding:0 24px 30px;}
#ly_lastView.st1 .list_lastView{padding:0 24px 81px;}
#ly_lastView .list_lastView ul{overflow:hidden; font-size:0;}
#ly_lastView .list_lastView ul li{display:inline-block; vertical-align:top; margin-left:9px; margin-bottom:16px; width:calc((100% - 27px) / 4);}
#ly_lastView .list_lastView ul li:nth-of-type(4n+1){margin-left:0;}
#ly_lastView .list_lastView ul li a{display:block;}
#ly_lastView .list_lastView ul li a img{display:block; width:100%; box-sizing:border-box;}    
/* BASIC css end */