﻿@media(max-width: 1600px){
    #footer .info_ft {width: 350px}
    #footer .col_mnb, #footer .mxh_hotline {width: calc((100% - 480px)/3)}
}

@media(max-width: 1199px){
    .container {width: calc(100% - 20px);min-width: 0}
    #open_menu {display: block;width: 34px;height: 34px;z-index: 11;background-color: var(--main-color);float: right;margin-left: 10px;text-align: center;line-height: 34px;position: relative}
    #open_menu:before {content: "\f0c9";font: 18px FontAwesome;color: white}
    #open_menu.active:before {content: "\f00d"}

    #menu {position: absolute;top: 100%;left: 0;width: 100%;box-sizing: border-box;z-index: 111;background-color: var(--main-color);padding: 0;margin: 0;display: none;overflow: auto}
    #menu li {list-style: none;display: block;position: relative}
    #menu > li > a {display: block;text-decoration: none;color: white;padding: 12px 20px;font: 15px 'FB'}
    #menu > li > a img {max-width: 24px;max-height: 20px;margin-right: 10px}
    #menu > li {border-top: 1px solid rgba(255,255,255,0.3)}
    #menu > li:first-child {border-top: none}
    #menu ul {padding: 0;margin: 0;display: none}
    #menu ul li {border-top: 1px solid rgba(255,255,255,0.3)}
    #menu ul a {display: block;text-decoration: none;color: white;padding: 10px 10px 10px 30px;position: relative}
    #menu ul ul a {padding-left: 50px}
    #menu li.display > a {background-color: var(--other-color)}
    #menu .hasSub > a {padding-right: 50px}
    #menu .hasSub.show > a {background-color: var(--other-color)}
    #menu .openMN {width: 50px;height: 43px;position: absolute;top: 0;right: 0;text-align: center;color: white;font: 30px 'FB';line-height: 34px}
    #menu .openMN:before {content:"";display: block;width: 16px;height: 2px;background-color: white;position: absolute;left: calc(50% - 8px);top: calc(50% - 1px)}
    #menu .openMN:after {content: "";display: block;width: 2px;height: 16px;background-color: white;position: absolute;left: calc(50% - 1px);top: calc(50% - 8px)}
    #menu .openMN.show:after {display: none}

    body {padding-top: 62px}
    #header {position: fixed;top: 0;left: 0;width: 100%;z-index: 6;background-color: white;box-shadow: 0 2px 5px rgba(0,0,0,0.2)}
    #header .logo {width: 100px}
    #header .logo .imgc0:before {padding-bottom: 42px}
    #header .right {padding: 14px 0}
    #header .search input {width: 120px;padding: 0 10px;height: 32px;font-size: 14px}
    #header .search a {font-size: 0;box-sizing: border-box;height: 32px;padding: 1px 12px 0 12px}
    #header .search a i {font-size: 15px}
    #header .hotline {display: none}


    #slide_home {margin-bottom: 30px}
    #slide_home .slick-prev, .list_dt .slick-prev, .slide_cate .slick-prev, .slide4 .slick-prev {left: 10px}
    #slide_home .slick-next, .list_dt .slick-next, .slide_cate .slick-next, .slide4 .slick-next {right: 10px}
    .bao_tt {margin-bottom: 15px}
    .bao_tt .title {font-size: 20px}
    .slide_cate, .slide4 {overflow: hidden}
    .slide_cate .title {font-size: 14px;padding-left: 10px}

    .spHome, .cusHome, .sp_CateHome {margin-bottom: 40px}
    .list_sp:not(.slick-slider) .item {width: calc((100% - 60px)/3)}
    .list_sp:not(.slick-slider) .item:nth-child(5n+1) {margin-left: 30px;clear: none}
    .list_sp:not(.slick-slider) .item:nth-child(3n+1) {margin-left: 0;clear: both}

    #footer .info_ft, #footer .col_mnb, #footer .mxh_hotline {width: calc(50% - 20px)}
    #footer .col_mnb:nth-child(2) {margin-right: 0}
    .road {margin-bottom: 30px}
    .bao_nd {padding: 20px 30px}

    .list_news:not(.slick-slider) .item {width: calc((100% - 60px)/3)}
    .list_news:not(.slick-slider) .item:nth-child(4n) {margin-right: 30px}
    .list_news:not(.slick-slider) .item:nth-child(3n) {margin-right: 0}

    .list_dt:not(.slick-slider) .imgc0 {width: calc((100% - 80px)/5)}
    .list_dt:not(.slick-slider) .imgc0:nth-child(6n) {margin-right: 20px}
    .list_dt:not(.slick-slider) .imgc0:nth-child(5n) {margin-right: 0}
}

@media(max-width: 767px){
    .list_sp:not(.slick-slider) .item {width: calc(50% - 5px);margin: 0 0 30px 10px}
    .list_sp:not(.slick-slider) .item:nth-child(3n+1), .list_sp:not(.slick-slider) .item:nth-child(5n+1) {margin-left: 10px;clear: none}
    .list_sp:not(.slick-slider) .item:nth-child(2n+1) {margin-left: 0;clear: both}
    #footer .info_ft, #footer .col_mnb, #footer .mxh_hotline {width: 100%;margin-right: 0}
    #footer .title {margin-bottom: 15px}
    #footer .mxh_footer {margin-top: 0}
    .bao_nd {padding: 0;box-shadow: none}
    .title_CT {font-size: 18px}
    #CommonCuoiChiTietTin .apd {float: none;padding-bottom: 10px;overflow: hidden}
    #fixRight {width: 35px;right: 5px}

    #fixRight a#page_head {width: 35px;height: 35px;line-height: 35px;font-size: 12px}
    .spIndex .block_sp {padding: 30px 0}
    .list_cate a {line-height: 28px;padding: 0 10px;margin: 3px}
    .road {white-space: nowrap;overflow: auto}

    .albumProduct, .infoProduct {width: 100%;margin-bottom: 30px}
    .albumProduct .imgc0 {width: calc((100% - 30px)/4);margin: 10px 10px 0 0}
    .albumProduct .imgc0:nth-child(1), .albumProduct .imgc0:nth-child(2) {width: calc(50% - 5px)}
    .albumProduct .imgc0 .viewAll {font-size: 13px}
    .albumProduct .imgc0 .viewAll b {display: block}
    .infoProduct {padding: 0;box-shadow: none}
    .infoProduct .title_CT {font-size: 24px}
    .bao_other .title {font-size: 20px}
    .bao_other .viewAll {display: none}
    .formTV .bg_form {padding: 20px}

    .list_news:not(.slick-slider) .item {width: 100%;margin-right: 0}
    .list_news .title {height: auto}
    .col_left, .col_right {width: 100%}
    .newsRight {margin-bottom: 0}

    .list_dt:not(.slick-slider) .imgc0 {width: calc(50% - 10px)}
    .list_dt:not(.slick-slider) .imgc0:nth-child(5n) {margin-right: 20px}
    .list_dt:not(.slick-slider) .imgc0:nth-child(2n) {margin-right: 0}
    .list_dt:not(.slick-slider) {margin-bottom: 30px}
    .nameCty {font-size: 24px}
    .infoCty {display: block}
    .infoCty .item {width: 100%;padding: 10px;margin: 0 0 10px 0}
    .form_lh, .map_lh {width: 100%;margin-bottom: 30px}
    .form_lh .item:nth-child(2), .form_lh .item:nth-child(3), .form_lh .item.captcha {width: 100%}
    .map_lh .iframeMap {height: 300px}
    .nd_alert .title {font-size: 24px}
    .nd_alert {margin: 30px auto}
}