.hc-ipad-bottom-nav-v11{
    display:none;
}


@media
(min-width:769px)
and
(max-width:1100px)
{

    html,
    body{
        max-width:100% !important;
        overflow-x:hidden !important;
    }


    body{
        padding-bottom:
            calc(
                68px
                +
                env(safe-area-inset-bottom)
            )
            !important;
    }


    body > header.header{

        width:100% !important;

        height:auto !important;
        min-height:0 !important;

        position:relative !important;

        left:auto !important;
        right:auto !important;
        top:auto !important;

        overflow:visible !important;

        z-index:1000 !important;
    }


    body > header.header > .header-inner{

        width:100% !important;
        max-width:none !important;
        min-width:0 !important;

        height:auto !important;
        min-height:0 !important;

        margin:0 !important;

        padding:
            10px
            18px
            12px
            !important;

        display:grid !important;

        grid-template-columns:
            max-content
            minmax(0,1fr)
            max-content
            !important;

        grid-template-areas:
            "ecoLogo ecoLocation ecoUser"
            "ecoSearch ecoSearch ecoSearch"
            !important;

        align-items:center !important;

        column-gap:14px !important;
        row-gap:10px !important;

        position:relative !important;

        overflow:visible !important;

        box-sizing:border-box !important;
    }


    body > header.header .logo{

        grid-area:ecoLogo !important;

        position:relative !important;

        left:auto !important;
        right:auto !important;
        top:auto !important;
        bottom:auto !important;

        width:auto !important;
        max-width:none !important;
        min-width:0 !important;

        height:auto !important;

        margin:0 !important;

        display:flex !important;

        align-items:center !important;

        transform:none !important;
    }


    body > header.header .logo img{

        width:56px !important;
        height:56px !important;

        max-width:56px !important;

        flex:0 0 56px !important;
    }


    body > header.header .logo-text{

        min-width:0 !important;
    }


    body > header.header .logo-text strong{

        font-size:28px !important;

        white-space:nowrap !important;
    }


    body > header.header .location{

        grid-area:ecoLocation !important;

        position:relative !important;

        left:auto !important;
        right:auto !important;
        top:auto !important;
        bottom:auto !important;

        width:auto !important;
        max-width:150px !important;
        min-width:0 !important;

        height:auto !important;

        margin:0 !important;

        padding:7px 10px !important;

        display:flex !important;

        align-items:center !important;

        justify-self:start !important;

        transform:none !important;
    }


    body > header.header #currentLocation{

        display:block !important;

        max-width:100px !important;

        overflow:hidden !important;

        text-overflow:ellipsis !important;

        white-space:nowrap !important;
    }


    body > header.header .header-center{

        grid-area:ecoSearch !important;

        position:relative !important;

        left:auto !important;
        right:auto !important;
        top:auto !important;
        bottom:auto !important;

        width:100% !important;
        max-width:none !important;
        min-width:0 !important;

        height:auto !important;

        margin:0 !important;
        padding:0 !important;

        display:block !important;

        transform:none !important;
    }


    body > header.header .search{

        position:relative !important;

        left:auto !important;
        right:auto !important;
        top:auto !important;
        bottom:auto !important;

        width:100% !important;
        max-width:none !important;
        min-width:0 !important;

        height:44px !important;

        margin:0 !important;

        display:flex !important;

        align-items:stretch !important;

        transform:none !important;
    }


    body > header.header .search input,
    body > header.header #ecoSearchInput{

        flex:1 1 auto !important;

        width:auto !important;
        max-width:none !important;
        min-width:0 !important;

        height:44px !important;

        box-sizing:border-box !important;
    }


    body > header.header .search button{

        position:relative !important;

        left:auto !important;
        right:auto !important;
        top:auto !important;

        flex:0 0 82px !important;

        width:82px !important;
        min-width:82px !important;
        max-width:82px !important;

        height:44px !important;

        margin:0 !important;
    }


    body > header.header .header-center .nav,
    body > header.header .nav{

        display:none !important;
    }


    body > header.header .user-box{

        grid-area:ecoUser !important;

        position:relative !important;

        left:auto !important;
        right:auto !important;
        top:auto !important;
        bottom:auto !important;

        width:auto !important;
        min-width:0 !important;

        height:auto !important;

        margin:0 !important;

        display:flex !important;

        visibility:visible !important;
        opacity:1 !important;

        justify-self:end !important;
        align-self:center !important;

        overflow:visible !important;

        transform:none !important;

        z-index:1200 !important;
    }


    body > header.header .user-btn{

        position:relative !important;

        left:auto !important;
        right:auto !important;
        top:auto !important;

        display:flex !important;

        visibility:visible !important;
        opacity:1 !important;

        align-items:center !important;
        justify-content:center !important;

        width:auto !important;
        min-width:54px !important;

        height:40px !important;

        margin:0 !important;

        padding:0 11px !important;

        white-space:nowrap !important;

        transform:none !important;

        cursor:pointer !important;
    }


    body > header.header .user-panel{

        position:absolute !important;

        top:
            calc(
                100%
                +
                9px
            )
            !important;

        right:0 !important;
        left:auto !important;

        width:280px !important;

        max-width:
            calc(
                100vw
                -
                36px
            )
            !important;

        z-index:99999 !important;
    }


    body > header.header
    .user-box.is-open
    .user-panel{

        display:block !important;

        opacity:1 !important;

        visibility:visible !important;

        pointer-events:auto !important;

        transform:
            translateY(0)
            !important;
    }


    .hc-ipad-bottom-nav-v11{

        display:flex !important;

        position:fixed !important;

        left:0 !important;
        right:0 !important;
        bottom:0 !important;

        width:100% !important;

        min-height:60px !important;

        padding:
            7px
            0
            calc(
                7px
                +
                env(safe-area-inset-bottom)
            )
            !important;

        background:#fff !important;

        border-top:
            1px solid #e5e7eb !important;

        box-shadow:
            0 -4px 18px rgba(0,0,0,.06)
            !important;

        box-sizing:border-box !important;

        z-index:2147483000 !important;
    }


    .hc-ipad-bottom-nav-v11 a{

        flex:1 1 16.6667% !important;

        min-width:0 !important;

        display:flex !important;

        flex-direction:column !important;

        align-items:center !important;
        justify-content:center !important;

        gap:3px !important;

        color:#64748b !important;

        text-align:center !important;

        text-decoration:none !important;

        font-size:12px !important;
        font-weight:800 !important;
    }


    .hc-ipad-bottom-nav-v11 i{

        display:block !important;

        font-size:20px !important;

        line-height:1 !important;
    }


    .hc-ipad-bottom-nav-v11
    a:first-child{

        color:#16a34a !important;
    }
}


.hc-ipad-pc-mall-mask-v12{
    display:none;
}

@media (min-width:761px) and (max-width:1100px){
    html.hc-ipad-pc-mall-open-v12,
    html.hc-ipad-pc-mall-open-v12 body{
        overflow:hidden !important;
    }

    .hc-ipad-pc-mall-mask-v12{

        position:fixed !important;

        inset:0 !important;

        z-index:2147483200 !important;

        padding:
            18px
            18px
            calc(
                74px
                +
                env(safe-area-inset-bottom)
            )
            !important;

        box-sizing:border-box !important;

        align-items:center !important;
        justify-content:center !important;

        background:
            rgba(
                15,
                23,
                42,
                .46
            )
            !important;
    }

    .hc-ipad-pc-mall-mask-v12.is-open{

        display:flex !important;
    }

    .hc-ipad-pc-mall-dialog-v12{

        position:relative !important;

        left:auto !important;
        right:auto !important;
        top:auto !important;
        bottom:auto !important;

        width:
            min(
                960px,
                calc(100vw - 36px)
            )
            !important;

        max-width:
            calc(
                100vw
                -
                36px
            )
            !important;

        height:
            min(
                74vh,
                680px
            )
            !important;

        max-height:
            min(
                74vh,
                680px
            )
            !important;

        margin:0 auto !important;

        padding:0 !important;

        box-sizing:border-box !important;

        overflow:hidden !important;

        background:#fff !important;

        border:
            1px
            solid
            #e5e7eb
            !important;

        border-radius:24px !important;

        box-shadow:
            0
            24px
            80px
            rgba(
                0,
                0,
                0,
                .25
            )
            !important;

        transform:none !important;
    }

    .hc-ipad-pc-mall-body-v12{

        position:relative !important;

        width:100% !important;

        height:100% !important;

        max-height:none !important;

        margin:0 !important;

        padding:0 !important;

        box-sizing:border-box !important;

        overflow:hidden !important;
    }

    .hc-ipad-pc-mall-close-v12{

        position:absolute !important;

        top:12px !important;
        right:12px !important;

        left:auto !important;
        bottom:auto !important;

        z-index:1000 !important;

        width:40px !important;
        height:40px !important;

        display:flex !important;

        align-items:center !important;
        justify-content:center !important;

        border:0 !important;

        border-radius:50% !important;

        background:#f3f4f6 !important;

        color:#111827 !important;

        font-size:27px !important;

        line-height:1 !important;

        cursor:pointer !important;

        box-shadow:
            0
            3px
            14px
            rgba(
                0,
                0,
                0,
                .08
            )
            !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu{

        display:block !important;

        position:relative !important;

        width:100% !important;
        height:100% !important;

        min-width:0 !important;
        min-height:0 !important;

        margin:0 !important;

        padding:18px !important;

        overflow:hidden !important;

        box-sizing:border-box !important;

        background:#fff !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h1,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h2,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h3,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h4,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > .menu-title,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > .menu-item{

        position:relative !important;

        left:auto !important;
        right:auto !important;
        top:auto !important;
        bottom:auto !important;

        display:flex !important;

        width:202px !important;

        max-width:202px !important;
        min-width:0 !important;

        margin-left:0 !important;
        margin-right:0 !important;

        transform:none !important;

        box-sizing:border-box !important;

        z-index:10 !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h1,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h2,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h3,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h4,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > .menu-title{

        align-items:center !important;

        min-height:38px !important;

        margin:
            0
            0
            8px
            0
            !important;

        padding:
            0
            8px
            !important;

        font-size:20px !important;
        font-weight:800 !important;

        line-height:1.3 !important;

        color:#111827 !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > .menu-item{

        min-height:46px !important;

        margin:
            0
            0
            3px
            0
            !important;

        padding:
            9px
            10px
            !important;

        align-items:center !important;

        touch-action:manipulation !important;

        cursor:pointer !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu::before{

        content:"" !important;

        position:absolute !important;

        left:220px !important;

        top:0 !important;
        bottom:0 !important;

        width:1px !important;

        background:#e5e7eb !important;

        pointer-events:none !important;

        z-index:15 !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    a,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    button{

        touch-action:manipulation;
    }

    .hc-ipad-bottom-nav-v11
    .hc-ipad-pc-mall-trigger-v12{

        color:#16a34a !important;
    }

    .hc-ipad-pc-mall-close-v12{

        z-index:1000 !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h1,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h2,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h3,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h4,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > .menu-title,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > .menu-item{

        position:relative !important;

        left:auto !important;
        right:auto !important;
        top:auto !important;
        bottom:auto !important;

        width:202px !important;
        max-width:202px !important;

        z-index:20 !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > :not(h1):not(h2):not(h3):not(h4):not(.menu-title):not(.menu-item):not(script):not(style){

        position:absolute !important;

        left:220px !important;
        right:0 !important;

        top:0 !important;
        bottom:0 !important;

        width:auto !important;
        max-width:none !important;
        min-width:0 !important;

        height:auto !important;
        max-height:none !important;
        min-height:0 !important;

        margin:0 !important;

        padding:
            54px
            22px
            24px
            24px
            !important;

        box-sizing:border-box !important;

        overflow-y:auto !important;
        overflow-x:hidden !important;

        background:#fff !important;

        transform:none !important;

        z-index:30 !important;

        scrollbar-width:thin;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > :not(h1):not(h2):not(h3):not(h4):not(.menu-title):not(.menu-item):not(script):not(style)[hidden]{

        display:none !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > .hc-material-flyout,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > [class*="flyout"],

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > [class*="panel"]{

        left:220px !important;
        right:0 !important;

        top:0 !important;
        bottom:0 !important;

        width:auto !important;
        height:auto !important;

        margin:0 !important;

        transform:none !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu::before{

        left:220px !important;

        top:0 !important;
        bottom:0 !important;

        z-index:25 !important;
    }
}

@media (min-width:761px) and (max-width:860px){
    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h1,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h2,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h3,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h4,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > .menu-title,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > .menu-item{

        width:184px !important;
        max-width:184px !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu::before{

        left:202px !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h1,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h2,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h3,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > h4,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > .menu-title,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > .menu-item{

        width:184px !important;
        max-width:184px !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu::before{

        left:202px !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > :not(h1):not(h2):not(h3):not(h4):not(.menu-title):not(.menu-item):not(script):not(style){

        left:202px !important;

        padding-left:18px !important;
        padding-right:18px !important;
    }

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > .hc-material-flyout,

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > [class*="flyout"],

    .hc-ipad-pc-mall-body-v12
    > .side-menu
    > [class*="panel"]{

        left:202px !important;
    }
}