/* BASIC css start */
#header.header_cate{
    position:fixed;
    width:100%;
    background:transparent;

    z-index:1000;
}
#header.header_cate h2{
    height:55px;
    line-height:55px;
    text-align:center;
}
#header.header_cate h2 > a{
    position:relative;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-family: 'Noto Sans KR';
    font-size: 18px;
    font-weight: 500;
    color: #4e4e4e;
    letter-spacing: -0.45px;
    display: inline-block;
    padding: 0 15px;
    vertical-align:middle;
}
#header.header_cate h2 > a::after{
    content:'';
    position:absolute;
    top:6px;
    right:0;
    display:inline-block;
    width: 14px;
    height: 12px;
    background-image: url('/design/ooo1069/2020_m_renew/cate_btn_menu_all.png');
    background-size: 14px auto;
    background-repeat: no-repeat;
    background-position: center left;
    background-color: #fff;
    transform: rotate(0deg);
    transition: transform 0.2s ease-in-out;
}
#header.header_cate h2 > a.active::after{
     transform: rotate(180deg);
    transition: transform 0.2s ease-in-out;
}
#header.header_cate .header__top__menus{
    position:absolute;
    top:13px;
    right:8.5px;
    font-size:0px;
}
#header.header_cate .header__top__menus a {
    display:inline-block;
    height:30px;
    vertical-align:top;
    text-align:center;
    margin-left:3.5px;
    vertical-align:top;
}
#header.header_cate .header__top__menus a img{
    width:100%;
    height:auto;
    vertical-align:top;
}
#header.header_cate .header-back{
    position:absolute;
    top:13px;
    left:6px;
    display:inline-block;
    width:30px;
    height:30px;
    background:url('/design/ooo1069/2020_m_renew/sub_header_icon_back.png')no-repeat center center;
    background-size:30px auto;
}
#header.header_cate .header__top__menus .header__top_search{
    width:30px;
    height:30px;
    background:url('/design/ooo1069/2020_m_renew/sub_header_icon_search.png')no-repeat center center;
    background-size:30px auto;
    transition: background-image 0.2s ease-in-out;
    margin-top:1px;
}
#header.header_cate .header__top__menus .header__top_search.active{
    background:url('/design/ooo1069/2020_m_renew/heder__top_menu_search_close.png')no-repeat center center;
    background-size:30px auto;
    transition: background-image 0.2s ease-in-out;
}

#header.header_cate .header__top__menus .header__top_home{
    position:relative;
    height:30px;
}
#header.header_cate .header__top__menus .header__top_home > img{
    height:100%;
    width:auto;
   
}
#header.header_cate .fullcategory-wrap {
    position:fixed;
    top:-2000px;
    left:0;
    right:0;
    z-index:49;
    min-height:calc(100% - 85px);
    overflow-y:auto;
    display:none;
}
#header.header_cate .fullcategory-wrap.active {
    bottom:0px;
    display:block;
}

#header.header_cate .fullcategory-wrap ul {
    background:#efeae6;
    border-radius: 0px 0px 0px 30px;
    box-sizing: border-box;
    padding-top:22px;
    padding-bottom:75px;
}
#header.header_cate .fullcategory-wrap ul li{
    padding:10px;
    text-align:center;
}
#header.header_cate .fullcategory-wrap ul li a{
    display:block;
    height:20px;
    line-height:20px;
    color:#4e4e4e;
    font-size:14px;
    font-family:'Heebo';
    letter-spacing:-0.35px;
    text-align:center;
}
#header.header_cate .fullcategory-wrap ul li a.free-delivery{
    position: relative;
    color: #34a571;
    padding-right: 40px;
    display:inline-block;
    font-weight:bold;
}
#header.header_cate .fullcategory-wrap ul li a.free-delivery::after{
    content:'';
    position:absolute;
    top:0;
    right:0;
    width:35px;
    height:18px;
    background:url('/design/ooo1069/2020_m_renew/icon_free_delivery_m.png')no-repeat center center;
    background-size:100% auto;
    animation-name: bounce-bottom;
    animation-duration: 2s;
    animation-delay: 2s;
    animation-direction: linear;
    animation-fill-mode: both;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in;
}

@-webkit-keyframes bounce-bottom {
    0% {transform: scale(1, 1) translateY(0);}
    10% {transform: scale(1.05, 0.9) translateY(0);}
    30% {transform: scale(.95, 1.1) translateY(-8px);}
    50% {transform: scale(1.02, .95) translateY(0);}
    57% {transform: scale(1, 1) translateY(-1px);}
    64% {transform: scale(1, 1) translateY(0);}
    100% {transform: scale(1, 1) translateY(0);}
}
.header-area {
    height:55px;
}
/* BASIC css end */