﻿@media(max-width: 1199px){
    body {min-width: 0;width: 100%;overflow-x: hidden}
    .container {width: calc(100% - 40px);min-width: 0}

    #header .search {position: absolute;right: 80px;top: 67px;z-index: 2}
    #header .search a {background-color: #00b2ee}
    #open_menu {display: block;width: 38px;height: 38px;background: #00b2ee url(images/mn.png) no-repeat center;border-radius: 3px;float: right;margin: 18px 0 0 0}
    #open_menu.active {background-image: url(images/close.png)}
    .mainMN {position: relative;z-index: 6;clear: both}
    #menu {position: absolute;top: 134px;right: -310px;width: 300px;z-index: 5;background-color: white;padding: 0;margin: 0;box-shadow: -2px 2px 5px rgba(0,0,0,0.2);transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s}
    #menu.active {right: 0;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s}
    #menu li {list-style: none;display: block;position: relative;border-top: 1px solid #cecece}
    #menu li > a {display: block;text-decoration: none;color: #333;padding: 10px;font-family: 'RB';text-transform: uppercase}
    #menu ul {padding: 0;margin: 0;display: none}
    #menu ul li {border-top: 1px solid #dbdbdb}
    #menu ul a {display: block;text-decoration: none;color: #333;padding: 10px 10px 10px 25px;font-family: 'RCB';position: relative}
    #menu ul a:before {content:"";display: block;width: 7px;height: 7px;border: 1px solid #333;border-radius: 50%;position: absolute;left: 10px;top: 17px}
    #menu .hasSub > a {padding-right: 30px}
    #menu .openSub {width: 30px;height: 40px;position: absolute;top: 0;right: 0;background: url(images/sub.png) no-repeat center}
    #menu .hasSub.show > ul {display: block}
    #menu .hasSub.show > a {background-color: #00b2ee;color: white}
    #menu .hasSub.show .openSub {background-image: url(images/sub1.png)}

    .slick-prev {left: 0}
    .slick-next {right: 0}
    .VDindex {padding-bottom: 8%}
    .WeOther {background-size: 0, 0, auto}
    .list_WO .item {width: calc((100% - 90px)/3);margin: 0 15px}
    .vdHome {background-size: 170%, 160% !important;background-position: bottom center, bottom 30px center !important}
    .vdHome .imgc {width: 100%}
    #footer .contact_ft {width: 100%;margin-bottom: 30px}
    #footer .info {margin-left: 0;width: 300px}
    #footer .formFT {float: left;margin-left: 100px}

    .list_N:not(.slick-slider) .item {width: calc(50% - 10px)}
    .list_N:not(.slick-slider) .item:nth-child(3n+1) {margin-left: 20px;clear: none}
    .list_N:not(.slick-slider) .item:nth-child(2n+1) {margin-left: 0;clear: both}
    .blogList .item {width: calc((100% - 60px)/3)}
    .blogList .item:nth-child(4n) {margin-right: 30px}
    .blogList .item:nth-child(3n) {margin-right: 0}
    .col_left {width: 100%}
    .col_right {display: none}
    .list_news:not(.slick-slider) .item {width: calc(50% - 15px)}
    .list_news:not(.slick-slider) .item:nth-child(3n) {margin-right: 30px}
    .list_news:not(.slick-slider) .item:nth-child(2n) {margin-right: 0}
    .list_PA:not(.slick-slider) .item {width: calc((100% - 60px)/3);margin: 0 0 30px 20px}
    .list_PA:not(.slick-slider) .item:nth-child(4n) {margin-left: 20px;clear: none}
    .list_PA:not(.slick-slider) .item:nth-child(3n+1) {margin-left: 0;clear: both}
    .list_VD:not(.slick-slider) .item {width: calc(50% - 15px)}
    .list_VD:not(.slick-slider) .item:nth-child(3n+1) {clear: none;margin-left: 30px}
    .list_VD:not(.slick-slider) .item:nth-child(2n+1) {clear: both;margin-left: 0}
    #hasForm {width: 100%}
    #popup .nd_popup {max-width: calc(100% - 40px)}
    #popup img {max-width: 100%}
}
@media(max-width: 767px){
    .container {width: calc(100% - 20px)}
    #header {height: 83px}
    #header .top {height: 35px}
    #header .hotline, #header .email {display: none}
    #header .logo {left: 0;width: 150px;height: 120px;background-size: 100%}
    #header .logo img {width: 70px;margin: 3px 0 0 38px}
    #open_menu {margin-top: 5px}
    #header .search {top: 32px;right: 60px}
    #menu {top: 83px}
    #slide_home .slick-prev {left: 0}
    #slide_home .slick-next {right: 0}
    .welcome {padding: 20px 0}
    .big_tt {font-size: 20px}
    .WeOther {padding: 20px 0}
    .list_WO .item {width: 100%;margin: 0 0 30px 0}
    .list_WO .title {height: auto}
    .vdHome {padding: 30px 0;background-position: bottom center, bottom 10px center !important}
    .list_N .imgc {max-width: 100%}
    #footer .info {width: 100%;margin-bottom: 30px}
    #footer .formFT {margin-left: 40px;width: calc(100% - 40px)}
    .list_N:not(.slick-slider) .item {width: 100%;margin-left: 0 !important}
    .infoBanner span {display: none}
    .infoBanner {transform: translateY(0);-webkit-transform: translateY(0);-moz-transform: translateY(0);top: auto;bottom: 17%}
    .blogList .item {width: 100%;margin-right: 0 !important}

    .formQA {background-image: none;padding: 0 10px 20px 10px;border-radius: 10px}
    #formQA {margin-left: 0}
    .formQA .desc {margin: 0 10px 15px 10px}
    #formQA input {width: 100%}
    #CommonCuoiChiTietTin .apd a {margin-right: 10px}
    #CommonCuoiChiTietTin .right {padding-top: 10px}
    .list_news:not(.slick-slider) .item {width: 100%;margin-right: 0}
    .bao_tt .xemtc {display: none}
    .tt_cate, .tt_Detail, .title_k {font-size: 22px}
    .list_PA:not(.slick-slider) .item {width: 100%;margin-left: 0 !important}
    .album_zoom .imgc {width: calc(50% - 5px);margin: 0 10px 10px 0}
    .album_zoom .imgc:nth-child(3n) {margin-right: 10px}
    .album_zoom .imgc:nth-child(2n) {margin-right: 0}
    .list_VD:not(.slick-slider) .item {width: 100%;margin-left: 0 !important}
    .pageLH .left {width: 100%;margin-bottom: 30px}
    .pageLH .right {width: 100%}
    .pageLH .right .imgc {height: auto}
    .pageLH .right .imgc:before {padding-bottom: 100%}
}