@media screen and (max-width: 1240px) {
    .m-menu-box {
        overflow: hidden;
        width: 100%;
        flex: 1
    }

    .m-menu-box>div {
        background-color: #fff;
        height: 100%
    }

    .m-menu-box .container .menu-list {
        padding-top: 10px
    }

    .m-menu-box .container .menu-list .item {
        display: flex;
        justify-content: space-between;
        padding: 15px 0;
        border-bottom: 1px solid var(--line-color)
    }

    .m-menu-box .container .menu-list .item .title {
        font-weight: 500 !important
    }

    .m-menu-box .container .icon-list {
        display: flex;
        /* position: absolute;
        bottom: 20px;
        width: calc(100% - 48px) */
        margin-top: 80px;
    }
    .icon-menu-list{
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: 100%;
        width: 100%;
    }
    .icon-menu-list-active{
        transform: translateX(calc(-100% - 24px));
        transition: transform .3s cubic-bezier(0.25, 0.55, 0.56, 0.82);
    }
    .icon-menu-list-leave{
        transform: translateX(0%);
        /* transition: transform .3s cubic-bezier(0.1, 0.52, 0.58, 1); */
        transition: transform .3s cubic-bezier(0.25, 0.55, 0.56, 0.82);
    }
    .m-menu-box .container{
        height: 100%;
    }
    .m-menu-box .container .icon-list .item {
        flex: 1;
        text-align: center
    }

    .m-menu-box .container .icon-list .item .svg-box {
        display: flex;
        align-items: center;
        justify-content: center
    }

    .m-menu-box .container .icon-list .item .labels {
        font-weight: 400;
        font-size: 12px;
        line-height: 15px;
        text-align: center;
        color: #000
    }

    .m-menu-box .container .child-page-box {
        position: absolute;
        left: 0;
        height: calc(var(--full-height) - var(--header-height));
        width: 100%;
        top: var(--header-height);
        background-color: #fff;
        overflow-y: scroll;
        padding-bottom: 50px
    }

    
    @keyframes headerInContainer {
        from {
            transform: translateY(-20px)
        }

        to {
            transform: translateY(0)
        }
    }
    @keyframes headerIn {
        from {
            max-height: 0;
            overflow: hidden;
        }

        to {
            max-height: 100vh;
            overflow: hidden;
        }
    }
    @keyframes menuListFadeIn {
        from {
            opacity: 0;
            transform: translateY(-5px);
        }
    
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
    .m-menu-enter-active {
        animation: headerIn .4s;
        animation-timing-function: cubic-bezier(0.25, 0.55, 0.56, 0.82)
    }
    .m-menu-enter-active .icon-menu-list{
        animation: menuListFadeIn .4s;
        animation-timing-function: cubic-bezier(0.25, 0.55, 0.56, 0.82)
    }
    .m-menu-leave-active {
        animation: headerIn .4s reverse;
        /* animation-timing-function: cubic-bezier(0.42, -0.02, 0.93, 0.7) */
        animation-timing-function: cubic-bezier(0.25, 0.55, 0.56, 0.82)
    }
    .icon-menu-list{
        justify-content: flex-start;
    }

    .m-menu-leave-active .icon-menu-list{
        animation: menuListFadeIn .4s reverse;
        animation-timing-function: cubic-bezier(0.25, 0.55, 0.56, 0.82);
    }
    .m-child-enter-active {
        /* animation: fadeInRight .3s cubic-bezier(0.1, 0.52, 0.58, 1); */
        animation: fadeInRight .3s cubic-bezier(0.25, 0.55, 0.56, 0.82);
    }
    .m-child-leave-active {
        /* animation: fadeInRight .3s cubic-bezier(1, 0.58, 0.52, 0.1) reverse; */
        animation: fadeInRight .3s cubic-bezier(0.44, 0.18, 0.75, 0.45) reverse
    }

    .m-child-leave-active .close-box {
        /* opacity: 0 !important */
    }

    .empty-box-m .title {
        font-weight: 700;
        font-size: 28px;
        line-height: 36px;
        color: #333
    }

    .empty-box-m .description {
        margin-top: 20px;
        font-weight: 400;
        font-size: 16px;
        line-height: 21px;
        color: #333
    }

    .empty-box-m .description a {
        color: var(--niu-red)
    }

    .empty-box-m .butt {
        margin-top: 60px;
        width: 100%;
        height: 50px;
        display: block;
        background-color: var(--niu-red);
        color: #fff !important;
        text-align: center;
        line-height: 50px;
        border-radius: 4px;
        font-weight: 700;
        font-size: 16px
    }
}

/*# sourceMappingURL=header-menu-m.min.css.map */