@media screen and (max-width: 768px) {

    html,
    body {
        font-size: 4vw;
        width: 100%;
        -webkit-tap-highlight-color: transparent
    }

    a:hover {
        color: inherit;
    }

    .headerBox,
    .headerKox {
        height: 15vw;
    }

    .headerBox .box {
        width: 100%;
        padding: 0 3vw;
    }

    .headerBox .box .logoBox .logo {
        height: 10vw;
    }

    .headerBox .box .logoBox .title {
        margin-left: 3vw;
        font-size: 4.8vw;
    }

    .headerBox .box .search {
        display: none;
    }

    .headerBox .box .navs .item,
    .headerBox .box .navs .btns {
        display: none;
    }

    .headerBox .box .navs .iconfont {
        display: block;
        font-weight: bold;
        font-size: 20px;
    }

    .drawer .item {
        font-size: 4vw;
        color: var(--theme-color);
    }

    .drawer .item,
    .drawer a {
        display: block;
        height: 10vw;
        line-height: 10vw;
        font-size: 4vw;
        color: var(--theme-color);
        text-align: center;
    }

    .homeBox {
        width: 100%;
        padding: 6vw 5vw 0;
    }

    .homeBox .box {
        width: 100%;
    }

    .homeBox .logoBox .logo {
        height: 13.2vw;
    }

    .homeBox .logoBox .title {
        margin-left: 3.4vw;
        font-size: 5.6vw;
    }

    .searchBox .search {
        margin-top: 5vw;
        height: 12.5vw;
        border-radius: 12.5vw;
    }

    .searchBox .search input {
        border-radius: 12.5vw;
        font-size: 4.2vw;
        padding-left: 5vw;
    }

    .searchBox .search .btn {
        width: 15vw;
        height: 12.5vw;
    }

    .searchBox .search .btn .iconfont {
        font-size: 5.8vw;
    }

    .home {
        flex-wrap: wrap;
        margin-top: 10vw;
    }

    .home .nav {
        font-size: 4.2vw;
        padding: 0 3vw 2vw;
    }

    .home .nav img {
        width: 6vw;
        height: 6vw;
        margin-right: 2.6vw;
    }

    .home .content {
        min-height: auto;
    }

    .home .content .list {
        padding: 0 0 2vw 2vw;
    }

    .home .content .list .item {
        width: 26.8vw;
        margin: 1vw;
        padding: 1vw 0;
    }

    .home .content .list .item .img {
        height: 40vw;
    }

    .home .content .list .item p {
        margin-top: 2vw;
    }


    .home .content .list .item:hover {
        transform: translateY(0);
    }

    .home.homeNO .block {
        margin: 0;
        margin-bottom: 5vw;
        width: 100%;
        flex: auto;
    }

    .home.homeNO .content .list {
        padding: 0 3vw 3vw;
    }

    .home.homeNO .content .list .item {
        max-width: 100%;
    }


    .footerBox {
        padding: 5vw;
    }

    .footerBox .box {
        width: 100%;
    }


    .listBox {
        width: 100%;
        min-height: calc(100vh - 60vw);
        display: flex;
        flex-wrap: wrap;
        align-content: flex-start;
    }

    .listBox .screen {
        width: 100%;
        margin: 0 3vw;
    }

    .listBox .screen .fixed h3 {
        display: none;
    }

    .listBox .right {
        display: none;
    }

    .listBox .left {
        padding: 0 4vw;
    }

    .listBox h3 {
        position: relative;
        padding: 20.4vw 0 0;
        font-size: 3.8vw;
        text-align: center;
    }

    .listBox h3:after {
        display: none;
    }

    .listBox .box {
        padding: 0 4vw 6vw;
        margin-top: 4vw;
        text-align: justify;
        min-height: calc(100% - 50vw);
    }

    .listBox .Ebox {
        padding: 0 4vw 5vw;
        margin-top: 4vw;
        margin-bottom: 4vw;
        text-align: justify;
    }

    .listBox .left .Ebox .list .item:last-child {
        padding: 5vw 0 0;
    }

    .Qloading {
        padding-top: 6vw;
    }

    .Qtips {
        padding-top: 5.6vw;
    }

    .loader {
        font-size: 18px;
    }

    .Qbtn {
        padding-top: 5vw;
    }

    .listBox .left .list {
        padding: 0;
    }

    .listBox .left .list .item {
        padding: 5vw 0;
    }

    .listBox .left .list .item .title {
        font-size: 4.6vw;
        padding-bottom: 1.2vw;
    }

    .listBox .left .list .item .btns {
        justify-content: space-between;
    }

    .listBox .left .list .item .btns .btn {
        margin-right: 0;
    }

    .listBox .left .list .item .btns .btn .iconfont {
        font-size: 4.5vw;
        margin-right: 1vw;
    }

    .listBox .left .list .item .btns .btn .icon {
        width: 4.6vw;
        margin-right: 1vw;
    }

    .listBox .left .list .item .type {
        margin-top: 2vw;
    }

    .listBox .left .list .item .type::after {
        top: -1vw;
        font-size: 5.3vw;
    }


    .listBox .details {
        padding-top: 5vw;
    }

    .details .title {
        font-size: 4.8vw;
        margin-bottom: 4vw;
    }

    .details .cat {
        display: flex;
        font-size: 4.2vw;
    }

    .details .pic {
        width: 30vw;
        height: 40vw;
        margin: 2vw auto 5vw;
    }


    .searchList {
        position: fixed;
        left: 0;
        right: 0;
        z-index: 10;
        padding: 0 5vw 2vw;
        display: block;
        background-color: var(--theme-background);
    }

    .searchList .search {
        margin-top: 3vw;
    }

    .searchList .search .select {
        font-size: 3.8vw;
        line-height: 13.2vw;
        height: 12.5vw;
        width: 20vw;
        text-align: center;
        opacity: .8;
    }

    .searchList .search input {
        padding-left: 3vw;
    }

    .listBox .screen .box {
        padding: 0 4vw 6vw;
        margin-top: 17.5vw;
        display: none;
    }


    .searchDetail {
        position: fixed;
        left: 0;
        right: 0;
        z-index: 10;
        padding: 0 5vw 2vw;
        display: block;
        background-color: var(--theme-background);
    }

    .searchDetail .search {
        margin-top: 3vw;
    }

    .searchDetail .search input {
        padding-left: 5vw;
    }

    .detailBox {
        min-height: inherit;
    }

    .detailBox h3 {
        display: none;
    }

    .detailBox .details {
        padding-top: 5vw;
        margin-top: 20vw;
        min-height: inherit;
    }

    .listBox .details.samelistBox {
        padding: 3vw;
        margin-top: 0;
    }

    .detailBox h3.samelistNav {
        display: block;
        position: relative;
        padding: 30px 0 17px 15px;
        font-size: 4.2vw;
        text-align: left;
    }

    .detailBox h3.samelistNav:after {
        display: block;
    }

    .samelist .item {
        width: 100%;
    }

    .samelist .item p {
        padding: 4px 6px;
    }


    /*12.16*/
    .homeBox .subTitle {
        padding: 7vw 0 3vw;
        font-size: 3.8vw;
    }

    .searchNav {
        margin-top: 5vw;
    }

    .searchNav .tabs .tab {
        min-width: 14vw;
        padding: 0 2vw;
        line-height: 15vw;
    }

    .searchNav .tabs .tab.active:after {
        bottom: 2vw;
        width: 5vw;
    }

    .searchNav .cnTab .tab {
        min-width: 14vw;
        padding: 4vw 2vw 0;
        font-size: 3.7vw;
        white-space: nowrap;
    }

    .searchNav .search {
        margin-top: 0;
    }

    .searchNav .cnTab .tab.active:after {
        border-width: 3vw 3vw 0px 3vw;
    }

    .searchNav .cnTab .tab.active:before {
        border-width: 3.2vw 3.2vw 0 3.2vw;
    }

    .home .content .navList {
        padding: 0 0 3vw 0;
    }

    .home .content .navList .item {
        width: calc(50% - 3.6vw);
        height: 16vw;
        padding: 0 1.8vw;
        margin: 2.4vw 0 0 2.4vw;
    }

    .home .content .navList .item .navItem p {
        font-size: 3.6vw;
    }

    .home .content .navList .item .navItem span {
        font-size: 2.8vw;
    }

    .home .content .navList .item .img {
        width: 7vw;
        height: 7vw;
        margin-right: 1.8vw;
    }

    .home .navBox .n1 {
        font-size: 3.8vw;
        padding: 0 5vw 2vw 3vw;
    }

    .home .navBox .n1 img {
        width: 6.2vw;
        height: 6.2vw;
        margin-right: 2vw;
    }

    .home .navBox .n2 {
        font-size: 3.4vw;
        padding: 0 0 2vw;
        text-align: right;
    }

    .home .navBox .n2 p {
        margin-left: 1vw;
        margin-right: 3vw;
    }

    .homedhBox {
        padding: 6vw 2.4vw 0;
    }


    .pages {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 10px;
    }

    .pages .pagination {
        display: flex;
        height: 38px;
        line-height: 38px;
    }

    .pages .pagination li {
        margin-left: 8px;
        border-radius: 3px;
        text-align: center;
        background-color: #eee;
        cursor: pointer;
        list-style-type: none;
    }

    .pages .pagination li a,
    .pages .pagination li span {
        display: inline-block;
        width: 38px;
        height: 38px;
        color: #000;
    }

    .pages .pagination li.active span {
        display: inline-block;
        width: 38px;
        height: 38px;
        border-radius: 3px;
        background-color: #133ab3;
        color: #fff;
    }

    .pages .pagination li.disabled {
        display: none;
        width: 38px;
        height: 38px;
        border-radius: 3px;
        background-color: #fff;
        color: #fff;
    }
}