﻿@media (max-width: 767px) {
    .box-header .content,
    .box-hot .content,
    .box-cate-home .content,
    .box-menu .content,
    .hot-left,
    .box-category .content,
    .box-detail .content,
    .box-dock .content {
        width: 100%;
    }

    .box-search-head input {
        display: none;
    }

    .box-header .col-md-6 img {
        width: 100%;
    }

    .icon-search {
        width: 54px;
        height: 50px;
        display: block;
        background-repeat: no-repeat;
        background-position: center;
        position: absolute;
        top: 4px;
        right: 30px;
        background-color: #fff;
        background-image: url(../images/icon-search-wap.png);
    }

    .box-header {
        height: 54px;
        line-height: 54px;
        -webkit-box-shadow: #ddd 0px 0 15px;
        -moz-box-shadow: #ddd 0 0 15px;
        box-shadow: #ddd 0 0 15px;
    }

    .icon-menu-wap {
        display: block;
        background: url('../images/icon-menu-wap.png') no-repeat;
        width: 18px;
        height: 12px;
        position: absolute;
        right: 11px;
        top: 22px;
    }

    .state-menu .box-menu {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
        height: auto;
        position: fixed;
        top: 0px;
        left: 0px;
        width: 100%;
        z-index: 5;
        height: 100%;
        background: #fff;
    }

    .box-menu {
        webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        -o-transform: translateX(-100%);
        transform: translateX(-100%);
        background: #f8f9fa;
        -webkit-transition: all linear .2s;
        -o-transition: all linear .2s;
        transition: all linear .2s;
        overflow-y: auto;
        position: absolute;
    }

        .box-menu .menu-lv1 {
            width: 100%;
            display: block;
            background: none;
            padding-right: 60px;
        }

            .box-menu .menu-lv1:hover {
                background: none;
            }

                .box-menu .menu-lv1:hover .menu-lv2,
                .menu-lv2 {
                    display: none;
                }

        .box-menu .content {
            border-bottom: none;
            padding-top: 40px;
        }

        .box-menu .menu-lv1:hover > a {
            color: #000;
        }

    .close-menu {
        display: none;
    }

    .state-menu .close-menu {
        background: url(../images/icon-close-menu.png)no-repeat;
        width: 24px;
        height: 24px;
        position: absolute;
        right: 10px;
        top: 10px;
        display: block;
        z-index: 6;
    }

    .box-search-head {
        display: none;
    }

    .state-search .box-search-head input {
        display: block;
        height: 42px;
        width: 100%;
    }

    .state-search .right-head {
        position: unset;
    }

    .state-search .box-search-head {
        width: 91%;
        position: absolute;
        left: 0px;
        padding: 6px 15px 0 15px;
        display: block;
    }

    .state-search .btn-search {
        width: 40px;
        height: 40px;
        right: 0px;
        top: 7px;
    }

    .box-hot .content {
        padding: 0 15px;
        overflow: hidden;
    }

    .hot-left .swiper-slide {
        height: auto;
    }

        .hot-left .swiper-slide img {
            height: 300px;
        }

    .hot-right {
        width: 100%;
        margin-top: 10px;
    }

    .item-hot-right {
        width: 49%;
        float: left;
        height: auto;
    }

    .hot-right .item-hot-right:first-child {
        margin-right: 2%;
    }

    .hot-left .lnk-cate-hot, .box-monngon .lnk-cate-hot, .box-vivu .lnk-cate-hot,
    .lnk-detail-hot,
    .date-hot {
        left: 15px;
    }

    .hot-left .lnk-detail-hot {
        line-height: 22px;
        -webkit-line-clamp: 2;
        bottom: 70px;
        font-size: 18px;
        padding-right: 10px;
    }

    .date-hot {
        bottom: 35px;
    }

    .box-cate-home .content {
        padding: 20px 15px;
    }

    .item-cate-monngon a {
        display: flex;
        justify-content: center;
    }

    .item-cate-monngon img {
        width: auto;
    }

    .item-cate-monngon .lnk-detail-hot {
        bottom: 64px;
        font-size: 18px;
    }

    .box-vivu .col-md-6, .box-vivu .col-md-6:last-child {
        width: 100%;
    }

        .box-vivu .col-md-6:first-child {
            margin-bottom: 10px;
        }

    .item-hot-right .lnk-cate-right,
    .item-hot-right .detail-right {
        left: 10px;
    }

    .box-cate-home .lnk-detail-hot {
        font-size: 18px;
        -webkit-line-clamp: 2;
    }

    .box-vivu .lnk-detail-hot {
        bottom: 54px;
        line-height: 22px;
    }

    .box-vivu .lnk-cate-hot {
        bottom: 108px;
    }

    .box-cate-home {
        margin: 0;
    }

    .box-vuikhoe .box-content .col-md-3 {
        padding: 0;
        margin-bottom: 15px;
    }

    .box-muasam .col-md-8 {
        padding: 0;
    }

    .box-muasam .item-muasam,
    .box-muasam .item-muasam:first-child {
        width: 100%;
        margin: 0 0 15px 0;
        padding: 0;
    }

    .footer-ver2 .col-md-4 .nav-footer2 {
        display: none;
    }

    .logo-footer, .receive-promo, .qr-footer,
    .footer-ver2 a, .footer-ver2 .keyword {
        display: none;
    }

    .content-footer .col-md-9,
    .content-footer .col-md-12 {
        padding: 0;
    }

    .line-bottom-footer {
        height: auto;
    }

    .content-footer .col-md-12:nth-child(2) .col-md-4:last-child {
        display: none;
    }

    .box-category .content {
        padding: 0 15px;
    }

    .box-category .title {
        font-size: 20px;
        padding-bottom: 15px;
    }

    .box-slide-cate .swiper-slide {
        height: auto;
    }

    .box-slide-cate .lnk-detail-hot {
        bottom: 35px;
        line-height: 22px;
        font-size: 16px;
    }

    .box-cate-right .text-head, .box-new-cate .text-head {
        margin-bottom: 10px;
    }

    .cate-it-mnbp {
        padding: 10px 0;
    }

    .box-cate-right .text-head {
        margin-bottom: 25px;
    }

    .box-meovat .box-content,
    .box-meovat .box-content .col-md-6:nth-child(2) .item-meovat,
    .box-meovat .item-meovat img {
        height: auto;
    }

        .box-meovat .box-content .col-md-6:nth-child(2) .item-meovat {
            width: 100%;
            margin: 0 0 10px 0;
            padding: 0;
        }

        .box-meovat .box-content .col-md-6:first-child {
            padding: 0;
            margin-bottom: 10px;
        }

        .box-meovat .box-content .col-md-6:nth-child(2) {
            padding: 0;
        }

    .lnk-detail-box {
        font-size: 18px !important;
    }

    .box-meovat .item-meovat .bg-info {
        height: 130px;
    }

    .cate-it-mnbp .cate-name {
        padding: 15px 0 0;
    }

    .tool-wap {
        height: 43px;
        background: #fff;
        position: fixed;
        bottom: 0px;
        width: 100%;
        display: block;
        z-index: 2;
        border-top: 1px solid #CCE;
        display: none;
    }

        .tool-wap ul {
            overflow: hidden;
            padding: 0;
            margin: 0;
            height: 43px;
        }

        .tool-wap li {
            float: left;
            width: 20%;
            list-style: none;
            height: 36px;
        }

    .tool-share {
        background: url(/asset/blog/images/icon-share-wap.png) no-repeat;
        background-position: center 5px;
    }

    .tool-comment {
        background: url(/asset/blog/images/icon-cm-wap.png) no-repeat;
        background-position: center 5px;
    }

    .tool-overview {
        background: url(/asset/blog/images/icon-overview-wap.png) no-repeat;
        background-position: center 5px;
        width: 31px;
        height: 30px;
    }

    .overview-active .tool-overview {
        background: url(/asset/blog/images/icon-overview-wap-active.png) no-repeat;
        background-position: center 5px;
    }

    .tool-tour {
        background: url(/asset/blog/images/icon-tour-wap.png) no-repeat;
        background-position: center 5px;
    }

    .tool-top {
        background: url(/asset/blog/images/icon-top-wap.png) no-repeat;
        background-position: center 5px;
    }

    .overview-active .overview {
        position: fixed;
        bottom: 50px;
        width: 70%;
        background: #fff;
        border-radius: 10px;
        left: 13%;
        display: block;
        margin: 0;
        z-index:2;
    }

    .overview .arr-down-wap {
        background: url(/asset/blog/images/icon-down-wap.png) no-repeat;
        background-position: center 5px;
        width: 15px;
        height: 16px;
        position: absolute;
        bottom: -11px;
        left:  51%;
        display: block;
    }


    .tour-active .tool-tour {
        background: url('/asset/blog/images/icon-tour-wap-active.png') no-repeat;
        background-position: center 5px;
    }

    .overview-active .tool-overview {
        background: url('/asset/blog/images/icon-overview-wap-active.png') no-repeat;
        background-position: center 5px;
    }

    .mnbp-more {
        margin: 0 0 15px;
    }

    .detail-content .inside img {
        width: 100% !important;
        height:auto;
    }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
}
