﻿@media(max-width: 1480px){
    #header {padding: 0 10px}
    #header .search {margin: 20px 5px 0 5px}
    #header .tk_head .logIn {max-width: 200px}
    #header .tk_head .logIn span {display: none}
}

@media(max-width: 1199px){
    .container {width: calc(100% - 20px)}

    #open_menu {display: block;width: 30px;height: 30px;position: absolute;right: 10px;top: 16px;border-radius: 50%;text-align: center;border: 1px solid var(--main-color)}
    #open_menu:before {content: "\f0c9";font: 16px 'FontAwesome';color: var(--main-color);line-height: 30px}
    #open_menu.active:before {content: "\f00d"}

    #menu {position: absolute;top: 64px;right: 0;width: 100%;box-sizing: border-box;z-index: 5;background-color: white;padding: 0;margin: 0;box-shadow: -2px 2px 5px rgba(0,0,0,0.2);display: none}
    #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}
    #menu > li > a {display: block;text-decoration: none;color: #000;padding: 10px 20px;font: 15px 'FR';text-transform: uppercase}
    #menu > li > a img {max-width: 24px;max-height: 20px;margin-right: 10px}
    #menu > li {border-top: 1px solid rgba(0,0,0,0.2)}
    #menu > li:first-child {border-top: none}
    #menu ul {padding: 0;margin: 0;display: none}
    #menu ul li {border-top: 1px solid rgba(0,0,0,0.2)}
    #menu ul a {display: block;text-decoration: none;color: #000;padding: 10px 10px 10px 35px;position: relative}
    #menu ul ul a {font-family: 'FR';padding-left: 55px}
    #menu .openSub {position: absolute;top: 0;right: 0;width: 30px;height: 40px;text-align: center;line-height: 40px}
    #menu .openSub:before {content: "\f107";font: 16px 'FontAwesome';color: #000}
    #menu .show > ul {display: block}
    #menu .show > .openSub:before {content: "\f106"}
    #menu .show > a {background-color: color-mix(in srgb, var(--main-color) 50%, transparent)}
    #cart_head {display: none !important}
    #header .gio_hang {margin: 0 10px 0 0;padding-bottom: 0}
    #header .cart {width: 30px;height: 30px;line-height: 30px}
    #header .cart i {font-size: 18px;line-height: 36px}
    #header .cart span {top: 3px;right: 3px}

    #slide_home .slick-arrow {display: none !important}
    #slide_home .imgc:before {padding-bottom: 66.66%}
    #slide_home .imgPC {display: none}
    #slide_home .imgMB {display: block}

    #wrap {padding-top: 64px}
    #header {position: fixed;z-index: 11;top: 0;left: 0;width: 100%;box-shadow: 0 2px 5px rgba(0,0,0,0.1);box-sizing: border-box;height: 64px}
    #header .logo {width: 120px;margin-top: 10px}
    #header .right {max-width: calc(100% - 130px);padding-top: 16px}
    #header .hotline {display: none}
    #header .search {margin: 0 44px 0 10px;float: right}
    #header .tk_head .logIn {margin: 0;height: 20px;border-radius: 15px;font-size: 0;padding: 5px;max-width: 160px;line-height: 0}
    #header .tk_head .logIn i {width: 20px;height: 20px;font-size: 12px;line-height: 20px;margin: 0}
    #header .search a {width: 30px;height: 30px;font-size: 14px;line-height: 30px;z-index: 3}
    #header .search input {background-color: white;z-index: 2;width: 200px;height: 30px;border-radius: 15px;font-size: 14px}
    #header .tk_head {padding-bottom: 0;margin: 0}

    .bao_tt .title {font-size: 20px;padding-bottom: 10px;margin-bottom: 15px}
    .list_cate a {font-size: 14px;padding: 0 10px;line-height: 30px}

    .blockSP, .blockNews {margin-bottom: 40px}
    .list_sp .item {width: 100%;margin: 0 0 10px 0 !important;padding: 10px 15px}

    .lyDo {padding-top: 20px;margin-bottom: 50px}
    .lyDo .left {width: 240px;float: none;margin: 0 auto 30px}
    .lyDo .list_ts {width: auto;float: none}
    .list_ts .imgc0 {margin: 0 15px 0 0;width: 90px}
    .list_ts .info {width: auto;float: none}

    .list_news .slick-prev {left: 0}
    .list_news .slick-next {right: 0}

    #footer {padding-top: 30px}
    #footer .col_ft {width: 100% !important;margin: 0 0 20px 0 !important}
    #footer .mxh_ft {margin-top: 20px}
    #footer .license {margin-top: 20px}
    #footer .title {margin-bottom: 10px}
    #fixRight {width: 40px}
    #fixRight a {margin-bottom: 7px}
    #fixRight a img {max-width: 100%}
    #page_head {width: 40px;height: 40px}
    .road {padding: 8px 0;margin-bottom: 25px;overflow: auto;white-space: nowrap}

    .newsHot .item {width: 100%;padding: 15px 0}
    .newsHot .item:first-child {margin-bottom: 30px}
    .newsHot .item:first-child .title {font-size: 18px}
    .newsHot .imgc {width: 120px}
    .newsHot .info {width: calc(100% - 130px)}
    .newsHot .title {font-size: 15px}
    .newsHot .date_view {font-size: 13px}

    .list_news:not(.slick-slider) .item {width: 100%;margin: 0 0 30px 0}
    .list_news:not(.slick-slider) .title {height: auto}
    .list_news:not(.slick-slider) {padding-bottom: 10px}

    #blockFlex {display: block}
    .col_left {width: 100%;margin-bottom: 30px}
    .col_right {width: 100%;margin-bottom: 20px}

    #CommonCuoiChiTietTin .left {float: none;overflow: hidden}
    #CommonCuoiChiTietTin .apd {float: none;clear: both;overflow: hidden}

    .other .list_news:not(.slick-slider) .item {width: 100% !important;margin: 0 0 30px 0 !important}

    .blockRight {position: static !important;margin-bottom: 30px}
    .newsRight .title {font-size: 15px}

    .infoCty {display: block}
    .infoCty .item {width: 100%;margin: 0 0 10px 0;padding: 10px}
    .infoCty .item i {width: 30px;height: 30px;line-height: 30px;margin-bottom: 0}

    .form_lh {width: 100%;margin-bottom: 40px}
    .map_lh {width: 100%}
    .map_lh .iframeMap {height: 300px}
    .title_lh {font-size: 20px}
    .form_lh .item:nth-child(2), .form_lh .item:nth-child(3) {width: 100%}
    .form_lh .item.captcha input {width: calc(100% - 153px)}
    .form_lh .item.captcha {float: none}
    .nd_alert .fa-check {width: 100px;height: 100px;font-size: 60px;line-height: 100px}
    .nd_alert .title {font-size: 20px}
    .page_xh .bao_nd {padding: 0;box-shadow: none}
    .chonXH b {display: block;margin-bottom: 10px}
    .chonXH select {width: 100%}

    .list_lst .desc .right {float: none;padding-top: 5px}
    .list_lst .ptThi {margin: 5px 0}
    .page_xh .list_lst .item {padding: 10px 0}

    .banner_sp {padding: 20px 0}
    .banner_sp .title {font-size: 22px;margin-bottom: 15px}
    .banner_sp .item {margin: 3px}
    .bao_nd {padding: 20px 10px}
    .list_dt .title {margin-bottom: 10px}

    .tn_left {width: 100%}
    .tn_right {margin-right: -300px}
    .list_quest {margin: 0 10px}
    .list_mp3 {width: 100%;float: none;height: 60px;padding: 10px 0}
    .list_mp3 audio {float: none}
    .title_btn {padding: 10px}
    .list_mp3.fixed {width: 100%}
    .list_mp3 .subMP3 {width: calc(100% + 20px);top: calc(100% + 11px);left: -10px}
    .list_mp3.fixed .subMP3 {left: 0;width: 100%}

    .infoQuest .bao_time {transform: translateX(-100%);-webkit-transform: translateX(-100%);-moz-transform: translateX(-100%);display: inline-block;width: 165px;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s}
    .infoQuest .bao_time .openTime {display: inline-block;width: 28px;height: 28px;background-color: red;border-radius: 3px;text-align: center;line-height: 30px}
    .infoQuest .bao_time .openTime:before {content: "\f100";font: 22px 'FontAwesome';color: white}
    .infoQuest.show .bao_time .openTime:before {content: "\f101"}
    #countdown {font-size: 20px;color: red;display: inline-block;line-height: 30px}

    .infoQuest {background-color: white;position: relative;z-index: 6;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s;padding: 10px}
    .infoQuest.show {transform: translateX(calc(-100% - 20px));-webkit-transform: translateX(calc(-100% - 20px));-moz-transform: translateX(calc(-100% - 20px));}
    .infoQuest.show .bao_time {transform: translateX(-37px);-webkit-transform: translateX(-37px);-moz-transform: translateX(0)}
    .infoQuest .note {display: none}
    #baiLam.fixed .infoQuest {top: 50px}

    #baiLam.fixed.absolute .infoQuest {position: fixed;bottom: auto;top: 50px}
    .infoQuest .nopBai {display: none}
    .list_nav {max-height: 460px;overflow: auto}
    .btn_MB {display: block}

    .banner_sp .desc {font-size: 20px;margin: 10px 0}
    .btn_kqt a {padding: 0 20px}
    .btn_kqt a:last-child {padding: 0 30px}

    .bangDiem {border-radius: 5px}
    .bangDiem .row_bd div {font-size: 11px;line-height: 20px}
    .col_1 {width: 80px}
    .col_2 {width: 100px}
    .col_3 {width: calc(100% - 180px)}
    .col_1, .col_2, .col_3 {padding: 5px !important}
    .list_bd .col_1 {font-size: 13px}
    .list_bd .col_2, .list_bd .col_3 {font-size: 13px}

    .list_bd .pt_col2, .list_bd .pt_col3 {width: 100%;border-right: none;padding: 5px 0}
    .list_bd .item:last-child .col_2, .list_bd .item:last-child .col_3 {display: block}

    .tk_left {width: 100%;margin-bottom: 20px}
    .tk_right {width: 100%}
    .infoAccount .editInfo {float: none;clear: both;display: block;padding-top: 10px}
    .infoAccount {padding: 20px 15px}
    .infoAccount .tt_other {margin: 0 -15px 30px -15px;padding: 0 15px 10px 15px}
    #formAccount .accIMG {display: none}
    #formAccount .accInfo {width: 100%}

    .list_ghv .item {width: 100%;margin: 30px 0}
    .page_ghv .bao_nd {padding: 20px 10px}

    .info_cart {padding: 20px 10px 0 10px}
    .info_cart .total {margin: 20px -10px 0 -10px;padding: 15px 10px}
    .btn_cart {text-align: center;margin-bottom: 30px}
    .btn_cart a {padding: 0 15px;font-size: 14px;line-height: 40px;margin: 0}

    .success .title {font-size: 22px}
    .success .desc {font-size: 14px;margin-bottom: 30px}
    .success .row_cart {font-size: 14px}
    .success .row_cart b {width: 100px;font-size: 14px}

    .success .total_cart b {float: none;display: block;margin-bottom: 20px}
    .success .btn_success a {padding: 0 15px;font-size: 15px}
    .subMember {display: none !important}

    .page_dh {margin-bottom: 50px}
    .col1, .col2, .col3, .col4 {padding: 5px 10px;width: calc(100%/3);font-size: 14px}

    .infoAccount .tt_other .right {float: none;padding-top: 10px}
    .infoAccount .tt_other .right .luotThi {display: block;padding-bottom: 10px}
    .infoAccount .tt_other .right .noteNghe, .infoAccount .tt_other .right .noteViet, .infoAccount .tt_other .right .noteDoc {margin: 0 15px 0 0}
    .infoAccount .tt_other .right .noteDoc {margin-right: 0}
    .infoAccount .tt_other .right b {font-size: 15px}
    .list_lst {margin: 0}
    .list_lst .item {padding: 15px 0}

    .xemDapan .infoQuest .bao_time {width: 70px}
    .alert_TK {font-size: 20px}

    .list_tour .item {width: 100%;margin-left: 0}
    .sub_tour a {padding-left: 15px}
    .menu_gt {width: 100%}

    .bao_gt {padding: 10px}
    .col_51, .col_52, .col_53, .col_54, .col_55 {width: 20%}
    .row_tt span, .list_gt_tv .item span {padding: 0 10px}
    .btn_test a {padding: 0 22px}
    #popupResult .nd_popup {max-width: calc(100% - 20px);box-sizing: border-box}


    .ts_home {padding: 30px 10px}
    .ts_home .big_title {font-size: 20px;margin-bottom: 20px}
    .list_ck .item {width: 100%;padding: 0;margin-bottom: 10px;text-align: left}
    .list_ck .desc {display: inline;font-size: 16px;line-height: 22px}
    .list_ck .title {display: inline;font-size: 13px;line-height: 22px}
    .list_review .slick-prev, .list_kh .slick-prev {left: 0}
    .list_review .slick-next, .list_kh .slick-next {right: 0}
    .cus_home .content {width: auto;float: none}
    .cus_home .list_cus {float: none;margin: 30px auto}
    .cus_home .content span {font-size: 14px;margin-left: 10px}
    .cus_home .list_cus .slick-prev {left: -50px}
    .cus_home .list_cus .slick-next {right: -50px}
    .formHome {display: block}
    .formHome .left, .formHome .right {width: 100%;padding: 30px 10px}
    .support, .ycTuvan {width: auto;float: none}
    .formYC .captcha img {margin: 0}
    .formYC .captcha input {width: calc(100% - 190px)}
    #footer .mxh_ft a {margin: 0 10px 10px 0}
    #footer .mn_bottom {width: 100%;margin-right: 0}

    .list_kh:not(.slick-slider) .item {width: 100% !important;margin: 30px 0 !important}

    .infoHotel .imgc {float: none;width: 100%;margin-bottom: 20px}
    .infoHotel .content {width: 100%;margin: 0 0 20px 0}
    .infoHotel .btn_price {float: none;padding-top: 0}
    .bao_lbtab {display: none}
    .list_sub .noidung li {padding: 10px}
    .list_sub .title {padding-left: 10px}

    #popupLH .form_lh {max-width: calc(100% - 20px);padding: 30px 10px 10px 10px;box-sizing: border-box}
    #slide_home .info {position: static;transform: translateY(0);-webkit-transform: translateY(0);-moz-transform: translateY(0);padding: 20px 10px 40px 10px;width: auto}
    #slide_home .note {font-size: 18px}
    #slide_home .title {font-size: 20px;margin-bottom: 10px;line-height: 28px}
    #slide_home .desc {margin-bottom: 10px}
    #slide_home .btn {font-size: 16px;line-height: 40px;border-radius: 20px;padding: 0 30px}
    #slide_home .slick-dots button {background-color: #cecece}

    .success .bao_nd .bg_nd {padding: 0 10px}
    .success .bao_tt_cart {padding: 15px 10px;margin: 0 -10px 20px -10px;font-size: 18px}

    .list_file .slick-prev {left: 0}
    .list_file .slick-next {right: 0}

    .list_file:not(.slick-slider) .item {width: calc(50% - 5px);margin: 0 10px 20px 0}
    .list_file:not(.slick-slider) .item:nth-child(5n) {margin-right: 10px}
    .list_file:not(.slick-slider) .item:nth-child(2n) {margin-right: 0}

    .detail_file .imgc {float: none;margin: 0 auto 30px auto}
    .detail_file .info {width: auto;float: none}
    .detail_file .btn a {padding: 0 !important;float: left;width: calc(50% - 5px);text-align: center;margin: 0 10px 10px 0;box-sizing: border-box}
    .detail_file .btn a:nth-child(2n) {margin-right: 0}
    .list_tuvung .item {padding: 10px;margin: 0 -10px}
    .bao_service .title_btn .right {float: none}

    .list_ctdt .item {margin: 10px 0}
}
@media(max-width: 767px){
    .list_file.slick-slider .slick-list {width: calc(100% + 10px);margin-left: -5px}
    .list_file.slick-slider .item {margin: 15px 5px}
    #popup_File .nd_popup, #popup_Alert .nd_popup {padding: 30px 20px 20px 20px}
    .blockBlog .bao_nd {border-radius: 10px}
    .list_blog a {width: 100%;margin-bottom: 15px}
    .title_gt {font-size: 16px}
    .list_tuvung .left {width: 120px}
    .list_tuvung .right {width: calc(100% - 130px)}
    .list_tuvung .desc {font-size: 14px}
    #baiLam {padding-top: 0}

    .list_tab_tour .sub_tour {padding: 20px 10px}
    .list_tab_tour .sub_tour .sub_kh {margin-left: 0}
    .list_tab_tour .sub_tour .sub_1 {width: 110px}
    .list_tab_tour .sub_tour .sub_2 {width: calc(100% - 150px)}

    .list_ldpage .desc {width: 50px}
    .list_ldpage .desc span {padding: 0 7px}
    .list_ldpage .info {padding: 20px 15px;width: calc(100% - 50px)}
    #popupLH .form_lh, #popupLP .form_lh {padding: 40px 10px 10px 10px}
    #popupLH .form_lh .title_lh, #popupLP .form_lh .title_lh {font-size: 22px}

    .qrCode {width: 100%;margin-bottom: 30px;float: none}
    .bankInfo {width: auto;float: none}
    .itemBank {padding: 10px}
    .itemBank b {width: calc(100% - 110px)}

    .danhgiaHome {display: block;padding: 20px 15px;border-radius: 10px}
    .danhgiaHome .left {width: 100%;margin-bottom: 30px}
    .danhgiaHome .big_tt .title {font-size: 24px}
    .danhgiaHome .right {width: 100%}
    .danhgiaHome .right .slideCR:first-child .slick-list {margin-top: 0}
    .danhgiaHome .right .slideCR {width: 100%;margin: 0 0 20px 0}

    .danhgiaHome:before, .danhgiaHome:after {display: none}
}