@media
screen and (orientation:portrait) and (max-device-width:768px),
screen and (orientation:landscape) and (max-device-width:1024px) {
    .public-nav {
        display: none !important;
    }
    .header-wrap {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 1.12rem;
        z-index: 999;
        padding: 0 0.4rem;
        background: #ffffff;
        box-shadow: 0 20px 20px rgba(0, 0, 0, 0.1);
    }
    .header-wrap .logo {
        float: left;
        width: 1.40rem;
        height: 0.68rem;
        margin-top: 0.22rem;
    }
    .header-wrap .logo a {
        display: block;
        height: 100%;
    }
    .header-wrap .btn {
        float: right;
        font-size: 0.5rem;
        margin: 0.32rem 0 0 0;
        height: 0.5rem;
    }
    .header-wrap .btn span {
        vertical-align: top;
        display: inline-block;
        cursor: pointer;
        height: 0.5rem;
    }
    .header-wrap .btn .user-btn {
        font-size: 0.54rem;
    }
    .header-wrap .btn .nav-btn {
        margin-left: 0.36rem;
    }
    .nav-list-wrap {
        position: fixed;
        top: 0;
        right: 0;
        width: 0;
        height: 100vh;
        z-index: 9999;
        background: #fff;
        overflow: hidden;
        transition: 300ms width ease-in-out;
    }
    .nav-list-wrap.show {
        width: 100vw;
    }
    .nav-list-wrap ul {
        list-style: none;
    }
    .nav-list-wrap .nav-header {
        height: 1.12rem;
        overflow: hidden;
        padding: 0 0.45rem;
        border-bottom: 2px solid #00826b;
    }
    .nav-list-wrap .nav-header .nav-logo {
        float: left;
        width: 1.4rem;
        height: 0.68rem;
        margin-top: 0.22rem;
    }
    .nav-list-wrap .nav-header .nav-close {
        float: right;
        font-size: 0.5rem;
        margin: 0.4rem 0 0 0;
        height: 0.5rem;
    }
    .nav-list-wrap .nav-list {
        color: #333333;
        font-size: 0.32rem;
    }
    .nav-list-wrap .nav-list > li .item {
         height: 1.01rem;
         line-height: 1rem;
         border-bottom: 0.01rem solid #cccccc;
         padding: 0 0.4rem;
         overflow: hidden;
    }
    .nav-list-wrap .nav-list > li .item.active {
        background: rgba(0, 130, 107, 0.05);
    }
    .nav-list-wrap .nav-list > li .item.active a,
    .nav-list-wrap .nav-list > li .item.active span.name {
        color: rgba(0, 130, 107, 1);
    }
     .nav-list-wrap .nav-list > li a {
        width: 100%;
        height: 1.01rem;
     }
    .nav-list-wrap .nav-list > li a,
    .nav-list-wrap .nav-list > li span.name {
        float: left;
        width: calc(100% - 0.4rem);
    }
    .nav-list-wrap .nav-list > li span.icon {
        float: right;
        font-size: 0.4rem;
        padding-top: 0.32rem;
        height: 1rem;
    }
   .nav-list-wrap .nav-list > li.is-child .sub-nav-list {
       display: none;
       overflow: hidden;
   }
   .nav-list-wrap .nav-list > li.is-child .sub-nav-list li {
       padding: 0 0.4rem;
   }
}