/* Home Responsive */

@media screen and (max-width: 1680px) {
    .customer-help .list-help ul li .background-icon {
        padding: 20px;
    }

    #main-menu > li > a {
        margin-right: 35px;
    }
}

@media screen and (max-width: 1580px) {
    .section-event .event .main-event-container .main-event .main-event-content .main-event-countdown {
        padding: 25px;
    }

    .main-event-countdown {
        top: calc(50% - 50px);
    }

    .section-tour .create-tour-container {
        background: url(../images/CreateTour.png) no-repeat;
        background-size: cover;
        background-position: 50% 50%;
    }

    .section-tour .create-tour .btn-explore-now {
        left: 740px;
        top: 67px;
    }

    .customer-help .list-help ul li .background-icon {
        padding: 15px;
    }
}

@media screen and (max-width: 1500px) {
    #main-menu > li > a {
        font-size: 15px;
    }
}

@media screen and (max-width: 1440px) {
    .nav-brand .logo{
        font-size: 17px;
    }
    .mainbackgroud-container .footer-extra .download-app a {
        margin-left: 10px;
        margin-top: 5px;
    }

    .news-order-main .order-details .btn-special a, .confirm-form .main-btn .btn-special a {
        padding: 10px 30px;
    }

    .confirm-form {
        padding: 20px 30px;
    }
        
    #main-menu > li > a {
        margin-right: 20px;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-detail {
        margin-bottom: 50px;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-countdown {
        padding: 20px;
    }

    .main-event-countdown {
        top: calc(50% - 35px);
    }

    .section-utilities .utilities-option .utilities .utilities-list li {
        padding-right: 30px;
        padding-left: 30px;
    }

    .section-tour .create-tour-container {
        background: url(../images/CreateTour.png) no-repeat;
        background-size: cover;
        background-position: 50% 50%;
    }

    .section-tour .create-tour .btn-explore-now {
        left: 790px;
        top: 67px;
    }

    .customer-help .list-help ul li .background-icon {
        padding: 10px;
    }

    .mainbackgroud-container .footer-extra .download-app {
        flex-direction: column;
    }

    .customer-help .list-help ul li {
        padding-right: 20px;
    }

    .Luhanh-price {
        display: flex;
        flex-direction: column;
    }

    .Luhanh-price .price {
        margin-bottom: 20px;
    }

    .group-btn .btn-special {
        padding: 0 2.5px;
    }
}

@media screen and (max-width: 1368px) {
    .section-event .event .main-event-container .main-event .main-event-content .main-event-countdown {
        padding: 15px;
        top: calc(50% - 25px);
    }

    .vr3d-gallery .vr3d, .image-gallery .image-library, .video-gallery .video-library {
        flex: 0 0 calc(100% / 3);
        max-width: calc(100% / 3);
        padding: 0px 15px;
        padding-bottom: 40px;
    }

    #owl-slideQC .item .img-bg .content-news .container-content .new_summary,
    .explore-content .tab-content .tab-content-container .tab_pane_content .tab_pane_summary,
    .utilities-list ul li .utilities-news .utilities-caption .utilities-summary,
    .news .news-summary  {
        font-size: 14px;
    }

    #main-menu > li > a {
        font-size: 16px;
    }

    h1 {
        font-size: 32px;
    }

    .destination-main .destination-grid .introdution h1 {
        line-height: 40px;
        text-align: left;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-title,
    .explore-content .tab-content .tab-content-container .tab_pane_content .tab_pane_title,
    .explore-content .tab-content .tab-content-container .tab_pane_title {
        font-size: 22px;
    }

    .utilities-list ul li .utilities-news .utilities-caption .utilities-title {
        font-size: 18px;
        line-height: 24px;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-detail {
        margin-bottom: 35px;
    }

    .section-utilities .utilities-content .utilities-list ul {
        overflow-x: scroll;
        padding-bottom: 20px;
    }
    
    .utilities-list ul li {
        max-width: calc((100%) / 4);
        flex: 0 0 calc((100%) / 4);
    }

    .main-news-container .main-news-group .content-main-news .main-news-title {
        font-size: 18px;
        line-height: 24px;
        margin-top: 10px;
        margin-bottom: 5px;
    }

    .news .news-date {
        font-size: 14px;
        margin-bottom: 5px;
    }

    .sub-news-group .content-sub-news .sub-news-title {
        font-size: 14px;
        -webkit-line-clamp: 1;
        margin-bottom: 3px;
    }

    .section-tour .create-tour .btn-explore-now {
        left: 690px;
        top: 67px;
    }

    .customer-help .list-help ul li {
        padding-right: 10px;
    }

    .white-list ul li .white-inner-title a {
        font-size: 14px;
    }

    .sub-event-container .sub-event .sub-event-content .sub-event-title {
        font-size: 14px;
    }

    .Luhanh-vote .Luhanh-count {
        font-size: 12px;
    }

    .tour-input > div:not(:last-child) {
        margin-right: 20px;
    }
}

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

    .confirm-form,
    .order-help {
        flex: 0 0 100%;
        max-width: 100%;
    }

    section {
        margin: 0 10px;
    }

    .section-map,
    .Slider-banner,
    .section-explore {
        margin: 0;
    }

    .section-event .event .main-event-container .main-event .main-event-banner {
        height: 400px !important;
    }

    #main-menu > li > a {
        font-size: 14px;
    }

    #main-menu > li > a {
        margin-right: 18px;
    }

    .news-comment .voting,
    .tour-rating .tour-status,
    .order-now-information {
        flex-direction: column;
    }

    .tour-rating .tour-status div, 
    .order-now-information div {
        margin-bottom: 5px;
    }

    .div-history .history-main ul li {
        flex: 0 0 calc(100% / 2);
        max-width: calc(100% / 2);
    }
}

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

    .user-action {
        right: 0;
        top: 50px;
    }

    .personal-info .info-details .avatar {
        margin-right: 30px;
    }

    .news-order-main .order-details {
        flex-direction: column;
    }

    .news-order-main .order-details > div {
        width: 100% !important;
    }

    .news-order-main .order-details .main-btn {
        height: 50px;
    }

    .room-price-table table tr .room-info img {
        width: 100%;
    }

    .room-price-table table tr .room-info {
        flex-direction: column;
    }

    .room-price-table table tr .room-info a {
        justify-content: center;
        margin-top: 5px;
    }

    .helping-list-details .list-help ul li {
        flex: 0 0 calc(100% / 3);
        max-width: calc(100% / 3);
    }

    .moving-map,
    .map-action {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .map-action {
        height: 800px;
    }

    .header .contra-nav {
        display: block;
        position: relative;
    }

    .header .contra-nav label {
        display: block;
        margin-top: 18px;
    }

    .nav-brand {
        display: flex;
    }

    #main-menu-state:not(:checked) ~ #main-menu {
        display: none;
    }

    .inner-header #main-menu-state:not(:checked) ~ .nav-action {
        display: flex;
    }

    #main-menu-state:checked ~ #main-menu {
        width: 100%;
        border-top: 1px solid var(--title);
        margin-top: 20px;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
    }

    .header {
        height: auto !important;
        position: static;
    }

    #main-menu > li > a.current {
        background-size: 35px 35px;
    }

    .nav-action {
        position: absolute;
        right: 50px;
        top: 10px;
    }

    .inner-header .nav-action {
        top: 20px;
        bottom: unset;
        right: 60px;
    }

    #main-menu > li {
        float: left;
    }

    .section-utilities .utilities-option .utilities .utilities-list li {
        padding-right: 10px;
        padding-left: 10px;
    }

    .utilities-list ul li {
        max-width: calc((100%) / 3);
        flex: 0 0 calc((100%) / 3);
    }

    .section-tour .create-tour .btn-explore-now {
        left: 534px;
        top: 80px;
    }

    .section-help .help-main .customer-help,
    .section-help .help-main .related-link {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .section-help .help-main .customer-help {
        justify-content: space-between;
    }

    .customer-help .list-help ul li .background-icon {
        padding: 25px;
    }
    
    .customer-help .list-help ul li {
        padding-right: 30px;
    }

    .section-help .help-main .related-link {
        margin-top: 30px;
    }

    .mainbackgroud-container .main-footer-container {
        flex-wrap: wrap;
    }

    .mainbackgroud-container .footer-extra {
        display: flex;
        flex-grow: 1;
        flex-direction: row;
        padding-top: 20px;
    }

    .mainbackgroud-container .footer-extra ul {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-between;
        flex-grow: 1;
    }

    .mainbackgroud-container .footer-extra .download-app {
        flex-direction: row;
    }

    .subbackground-container .sub-footer .Copyright {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .subbackground-container .sub-footer {
        flex-direction: column;
    }

    .built-in {
        width: 100%;
        padding-top: 10px;
    }

    .subbackground-container .sub-footer .built-in {
        justify-content: flex-start;
    }

    .subbackground-container .sub-footer {
        align-items: center;
    }

    .destination-main .destination-grid {
        display: flex;
        flex-wrap: wrap;
    }

    .destination-main .destination-grid .destination-content {
        flex: 0 0 calc(50% - 10px);
        max-width: 50%;
    }

    .destination-content:nth-child(3) .destination-news .destination-caption .destination-summary, .destination-content:nth-child(4) .destination-news .destination-caption .destination-summary {
        -webkit-line-clamp: 3;
    }

    .destination-content .destination-news .destination-caption .destination-summary,
    .destination-content:nth-child(5) .destination-news .destination-caption .destination-summary {
        -webkit-line-clamp: 5;
    }

    .detail-main ul li {
        flex: 0 0 calc(100% / 2);
    }

    .detail-main ul {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: 0px;
        margin-bottom: 10px;
    }

    .white-list ul li .white-link {
        flex-direction: column;
    }

    .white-list ul li .help-link {
        flex-direction: row;
    }

    .white-list ul li .white-image {
        margin-right: 0;
        margin-bottom: 5px;
        width: 100%;
        flex: unset;
    }

    .inner-event-other .details-event-main ul li {
        padding-bottom: 15px;
    }

    .inner-event-summary .event-summary {
        padding-bottom: 20px;
    }

    .inner-event-container {
        margin-bottom: 20px;
    }

    .inner-header #main-menu-state:checked ~ #main-menu {
        border-top: 1px solid #fff;
    }

    .inner-header .main-menu-btn-icon, .inner-header .main-menu-btn-icon:before, .inner-header .main-menu-btn-icon:after {
        background: #f2726a;
    }

    .detail-main ul li {
        padding: 0 10px 20px;
    }

    .inner-header #main-menu > li > a.current {
        background-image: none;
    }

    .section-news .inner-news {
        margin-bottom: 0;
    }
    
    .inner-vacation-information ul li {
        flex: 0 0 calc(100% - 30px);
        overflow-wrap: anywhere;
    }

    .details-other-main ul li {
        flex: 0 0 calc(100% / 3);
    }

    .details-other-main ul {
        margin: 0 -12px;
        flex-wrap: nowrap;
        overflow-x: scroll;
    }

    .details-other-main.details-long-list ul {
        margin: 0 -12px;
        flex-wrap: wrap;
        overflow-x: unset;
    }

    .details-other-main.details-long-list ul li {
        padding: 0 10px 8px;
        text-align: left;
    }

    .inner-infoLuhanh-main ul li {
        width: calc(100% / 1);
    }
    
    .inner-news-main {
        margin-bottom: 40px;
    }

    .ChiTiet-content-container .nav-tabs li a {
        padding: 12px 30px;
    }

    .news-comment .voting,
    .tour-rating .tour-status,
    .order-now-information {
        flex-direction: row;
    }

    .tour-rating .tour-status div, 
    .order-now-information div {
        margin-bottom: 0;
    }

    .checkbox-list ul li {
        flex: 0 0 100%;
    }

    .sidebar-title {
        font-size: 20px;
    }

    .absolute-btn {
        top: 50%;
    }
} 

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

@media (min-width: 992px) {
    #main-menu {
        clear: none;
    }
}

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

    .div-history .history-main ul {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        margin-bottom: 20px;
    }

    .div-history .history-main ul li {
        padding-bottom: 15px;
    }

    .history-header .history-tour-inner-info {
        flex-direction: column;
    }

    .history-header .history-tour-inner-info .history-tour-inner-image {
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px;
    }

    .history-header .history-tour-inner-info .history-tour-inner-details {
        justify-content: space-between;
    }

    .history-tour-inner-details .history-tour-thing {
        margin-right: 0;
    }

    .details-other-main.details-long-list ul li {
        flex: 0 0 calc(100% / 2);
    }

    .helping-list-details .list-help ul {
        flex-wrap: nowrap;
        overflow-y: hidden;
        overflow-x: auto;
    }

    .helping-list-details .list-help ul li img {
        width: 80px;
        height: 80px;
    }

    .helping-list-details .list-help ul li .help-list-details {
        padding: 10px;
    }

    .help-name {
        font-size: 16px;
        text-align: center;
    }

    .section-event .event .main-event-container .main-event .main-event-banner,
    .section-event .event .main-event-container .main-event .main-event-content {
        flex: 0 0 100%;
        max-width: 100%;
    }

    #owl-slideQC .item .img-bg .content-news .container-content {
        border-left: 3px solid #FFFFFF;
        padding-left: 15px;
        width: 70%;
    }

    #owl-slideQC .item .img-bg .content-news {
        padding-bottom: 70px;
        padding-left: 55px;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-countdown {
        position: unset;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-detail {
        margin-top: 30px;
    }

    .section-event .event .main-event-container .main-event .main-event-content,
    .section-event .event .main-event-container .main-event .main-event-content .main-event-date, 
    .section-event .event .main-event-container .main-event .main-event-content .main-event-address {
        justify-content: center;
        align-items: center;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-title {
        text-align: center;
    }

    .section-event .event .main-event-container .main-event .main-event-banner img {
        filter: none
    }

    .explore-content .tab-content .tab-content-container {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .explore-content .tab-content .tab-content-container {
        height: 280px;
        padding: 20px;
    }

    .explore-content .tab-content .tab-content-container .tab_pane_img img {
        height: 180px !important;
    }

    .explore-content .tab-content .tab-content-container .tab_pane_content {
        height: 180px;
    }

    .explore-content .tab-content #Gioi_thieu .tab-content-container .tab_pane_img img {
        height: 230px !important;
    }

    .explore-content .tab-content #Gioi_thieu .tab-content-container .tab_pane_content {
        height: 230px;
    }
    
    .vr3d-gallery .vr3d, .image-gallery .image-library, .video-gallery .video-library {
        flex: 0 0 calc(100% / 2);
        max-width: calc(100% / 2);
        padding: 0px 10px;
        padding-bottom: 20px;
    }

    .vr3d-gallery .vr3d:nth-last-child(3), 
    .vr3d-gallery .vr3d:nth-last-child(4), 
    .image-gallery .image-library:nth-last-child(3), 
    .image-gallery .image-library:nth-last-child(4), 
    .video-gallery .video-library:nth-last-child(3), 
    .video-gallery .video-library:nth-last-child(4) {
        padding-bottom: 20px;
    }

    .section-utilities .utilities-option .utilities .utilities-list {
        flex-wrap: wrap;
    }

    .section-utilities .utilities-option .utilities .utilities-list li {
        border: none;
        padding: 0;
        padding-bottom: 20px;
        flex: 0 0 calc(100% / 2);
        max-width: calc(100% / 2);
    }

    .utilities-list ul li {
        max-width: calc((100%) / 2);
        flex: 0 0 calc((100%) / 2);
    }

    .section-news .main-news-container,
    .section-news .sub-news-container {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .section-news .main-news-container {
        margin-bottom: 20px;
    }

    .sub-news-group .content-sub-news .sub-news-title {
        -webkit-line-clamp: 2;
        margin-bottom: 5px;
    }

    .sub-news-group .content-sub-news .sub-news-summary .news-summary {
        -webkit-line-clamp: 3;
    }

    .section-tour .create-tour .btn-explore-now {
        left: 425px;
        top: 91px;
    }

    .section-tour .create-tour-container {
        background-position: 54% 50%;
    }

    .customer-help .list-help ul li .background-icon {
        padding: 15px;
    }

    .customer-help .list-help ul li {
        padding-right: 20px;
    }

    .footer-information {
        padding-bottom: 20px;
    }

    .explore-content .tab-content .tab-content-container.flex-item .row {
        flex-wrap: wrap;
    }

    #main-menu > li > a {
        font-size: 16px;
    }

    .home-search {
        width: 100%;
        padding: 0 55px;
    }

    .btn-sidebar,
    .btn-close {
        display: block;
    }

    .btn-close {
        margin-bottom: 10px;
    }

    .div-sidebar {
        flex: 0 0 100%;
        width: 100%;
        top: 0;
        height: 100vh;
        position: fixed;
        right: -100%;
        transition: all 0.5s;
        display: block;
        z-index: 100;
        padding-top: 30px;
        overflow: hidden auto;
        max-width: 100%;
    }

    .div-sidebar.show {
        display: block;
        right: 0;
        background: #fff;
    }

    .div-news,
    .div-main {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .btn-sidebar {
        position: absolute;
        top: -50px;
        right: 15px;
        font-size: 30px;
        z-index: 9;
    }

    .white-list ul li .white-link {
        flex-direction: row;
    }

    .white-list ul li .white-image {
        margin-right: 16px;
    }

    
    .inner-search {
        width: 100%;
    }

    .search-title {
        flex-direction: column;
        align-items: flex-start;
    }

    .white-list ul li .white-image {
        margin-right: 16px;
        margin-bottom: 0;
        flex: 0 0 calc(100% / 3);
    }

    .checkbox-list ul li {
        flex: 0 0 50%;
    }
}

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

    #main-menu-state:checked ~ #main-menu {
        display: block;
    }

    .history-inner-details {
        margin-bottom: 40px;
    }

    .confirm-main {
        margin-bottom: 40px;
    }

    .room-explore {
        margin-bottom: 40px;
    }

    .section-news .sub-news-container ul li:last-child {
        margin-bottom: 0;
    }

    .section-news .inner-news {
        margin-bottom: 10px;
    }

    .section-destination .main-btn .btn-special span::before {
        content: 'Xem thêm';
        font-size: 14px;
    }

    .section-destination .main-btn .btn-special span {
        font-size: 0;
    }

    .destination-main .destination-grid .introdution {
        padding: 30px;
    }

    .choose-list-details ul {
        height: 295px;
    }

    .moving-map {
        order: 1;
        margin-top: 5px;
    }

    .choose-list-details ul li {
        padding-right: 20px;
        width: 600px;
        overflow-x: auto;
    }

    .checkbox-list.li-quarter ul li {
        flex: 0 0 calc(100% / 3);
        padding: 0 10px;
    }


    .main-btn .btn-special .comment-details {
        font-size: 16px;
    }

    .tour-item-timeline-body ul li {
        flex-direction: column;
    }

    .tour-item-timeline-body .place-tour-img {
        width: 100%;
        margin: 10px 0;
    }

    .personal-info .info-details {
        flex-direction: column;
        align-items: center;
    }

    .personal-info .info-details .avatar {
        margin-bottom: 30px;
    }

    .personal-info .user-info-action .user-function > div:not(:last-child) {
        margin-bottom: 40px;
        margin-left: 0;
    }

    .pagination {
        margin-bottom: 50px;
    }

    #room-price {
        overflow-x: auto;
    }

    .room-price-table {
        width: 710px;
    }

    .room-price-table table{
        padding-bottom: 2px;
    }

    .helping-list-details .list-help ul li {
        flex: 0 0 calc(100% / 2);
        max-width: calc(100% / 2);
    }

    .map-action {
        height: 500px;
    }

    #main-menu > li {
        float: none;
    }

    .home-search {
        top: 45%;
    }

    .mainbackgroud-container .footer-extra .download-app {
        flex-direction: column;
    }

    .mainbackgroud-container .footer-extra {
        padding-top: 0px;
        padding-left: 15px;
    }

    .sm-blue a .sub-arrow {
        position: absolute;
        top: 50%;
        margin-top: -17px;
        left: auto;
        right: 4px;
        width: 34px;
        height: 34px;
        overflow: hidden;
        font: bold 16px/34px monospace !important;
        text-align: center;
        text-shadow: none;
        background: #fff;
        border-radius: 4px;
    }
    
    .sm-blue a .sub-arrow::before {
        content: '+';
    }

    #main-menu > li > ul {
        position: unset;
        background: none;
        box-shadow: none;
        border-radius: 10px;
        border: 1px solid rgb(242 114 106 / 30%);
        padding: 15px 15px 5px 15px;
    }

    #main-menu > li > ul > li {
        border-bottom: 1px solid rgb(242 114 106 / 30%);
        padding-bottom: 5px;
        margin-bottom: 5px;
    }

    #main-menu > li > ul > li:last-child {
        border-bottom: none;
        padding-bottom: 5px;
        margin-bottom: 0;
    }

    #main-menu > li > a.current {
        background: none;
        color: var(--title)
    }

    #main-menu > li > a {
        line-height: 24px;
        padding: 10px 0;
    }

    #main-menu > li > a {
        margin-right: 0;
    }

    #main-menu > li > .has-submenu.highlighted {
        color: #FFC700
    }

    .nav-action {
        position: absolute;
        right: 50px;
        top: 10px;
        display: flex;
    }

    .inner-header .nav-action {
        display: flex;
    }

    .inner-header #main-menu-state:not(:checked) ~ .nav-action {
        display: flex;
    }

    .inner-header .sm-blue a .sub-arrow {
        background: none;
    }

    .inner-header #main-menu > li > ul {
        border: 1px solid rgb(255 255 255 / 50%);
    }

    .inner-header #main-menu > li > ul > li:not(:last-child) {
        border-bottom: 1px solid rgb(255 255 255 / 50%);
    }

    .inner-header #main-menu li a {
        color: #fff;
    }

    #main-menu-state:not(:checked) ~ .nav-action {
        display: block;
    }

    #owl-slideQC .item .img-bg .content-news {
        padding-bottom: 75px;
        padding-left: 55px;
        padding-right: 55px;
    }

    #owl-slideQC .item .img-bg .content-news .container-content {
        width: 100%;
    }

    .section-tour .create-tour-container {
        background-position: 23% 50%;
    }
    
    .section-tour .create-tour .btn-explore-now {
        position: unset;
        margin-top: 30px;
    } 
    
    .section-tour .create-tour {
        width: 100%;
    }

    .section-utilities .utilities-option::after {
        content: none
    }

    .inner .group-btn {
        flex-direction: column;
    }

    .inner .group-btn div:not(:last-child) {
        margin-bottom: 10px;
    }

    .inner .slide-news .inner-slide-caption .inner-slide-summary {
        height: calc(100% - 190px);
    }

    .inner .slide-news .inner-slide-caption .inner-slide-summary span {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 7;
        overflow: hidden;
    }      

    .inner.main-section-inner .group-btn {
        flex-direction: row;
    }

    .inner.main-section-inner .group-btn div:not(:last-child) {
        margin-bottom: 10px;
    }

    .inner.main-section-inner .slide-news .inner-slide-caption .inner-slide-summary {
        height: calc(100% - 100px);
    }

    .sp-mask, 
    .sp-image-container {
        height: 500px !important;
    } 

    .room-container .sp-mask, 
    .room-container .sp-image-container {
        height: 100vh !important;
    } 

    .filter-order {
        width: 80%;
    }
    
    .inner-news-main {
        margin-bottom: 30px;
    }

    .inner-news-content {
        margin-bottom: 30px;
    }

    .ChiTiet-content-container .nav-tabs .nav-link {
        width: 100%;
    }

    .ChiTiet-content-container .nav-tabs {
        flex-direction: column;
    }
}

@media screen and (max-width: 700px) {
    .div-history .history-main ul li {
        flex: 0 0 calc(100% / 1);
        max-width: calc(100% / 1);
    }

    .confirm-form {
        padding: 20px 20px;
    }
}

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

    .inner {
        margin-bottom: 50px;
    }

    .history-inner-details {
        margin-bottom: 20px;
    }

    .history-main {
        margin-bottom: 30px;
    }

    .mainbackgroud-container {
        padding-bottom: 10px;
    }

    .confirm-main {
        margin-bottom: 20px;
    }

    .order-support div {
        font-size: 16px;
        line-height: 22px;
        margin-bottom: 10px;
    }

    .order-information-title, .person-info-title {
        margin-bottom: 10px;
    }

    .person-info > div:last-child .form-group {
        margin-bottom: 10px;
    }

    .order-information {
        margin-bottom: 10px;
    }

    .room-explore {
        margin-bottom: 20px;
    }

    .room-explore .nav-tabs li a {
        margin-right: 20px;
    }

    .chuyenmuc-list ul li {
        padding-bottom: 10px;
    }

    .news-banner-img span, .news-img span {
        padding-bottom: 10px;
    }

    p {
        margin-bottom: 10px;
    }

    .mainbackgroud-container .information {
        line-height: 24px;
    }

    .details-other-main .sub-other-banner {
        height: 250px !important;
    }

    .history-tour-inner-details ul li:not(:last-child) {
        padding-bottom: 15px;
    }

    .section-help .main-btn .btn-special.btn-red {
        margin-top: 0px;
    }

    .section-news .news {
        margin-bottom: 40px;
    }

    .section-map .map-main .location-pick {
        margin-top: 20px;
        padding-bottom: 10px;
    }

    .section-destination .main-btn .btn-special span::before {
        content: 'Xem thêm';
        font-size: 0;
    }

    .section-destination .main-btn .btn-special span {
        font-size: 14px;
    }

    .destination-main .destination-grid {
        flex-wrap: nowrap;
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: 15px;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-detail {
        margin-top: 0px;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-detail {
        margin-bottom: 15px;
    }

    .home-search {
        padding: 0 20px;
    }

    .detail-main ul li {
        flex: 0 0 calc(100% / 1);
    }

    .tour-input-hobby-list li:nth-last-child(3) .label-checkbox, 
    .tour-input-hobby-list li:nth-last-child(4) .label-checkbox {
        margin-bottom: 20px;
    }

    .checkbox-list.li-quarter ul li {
        flex: 0 0 50%;
        padding: 0 10px;
    }

    .tour-input {
        flex-direction: column;
    }

    .tour-input > div:not(:last-child){
        margin-bottom: 15px;
    }

    .tour-input > div {
        width: 100%;
    }

    .tour-item-timeline-body ul li {
        margin-right: 40px;
    }

    .history-inner-details .tour-item-timeline-body ul li {
        margin-right: 0px;
    }

    .place-tour-action {
        right: -33px;
    }
    
    .account-details {
        padding: 20px;
    }

    .personal-info .user-info-action .user-thing {
        margin-right: 10px;
    }

    .personal-info .user-info-action .user-function {
        flex-direction: column;
        align-items: center;
    }

    .personal-info .user-info-action .user-function > div:not(:last-child) {
        margin-bottom: 40px;
        margin-right: 0;
    }

    .news-comment .voting {
        flex-wrap: wrap;
    }

    .confirm-comment {
        flex-direction: column;
    }

    .section-event .main-btn .btn-special.btn-red {
        margin-top: 25px;
    }

    .tour-item-edit {
        margin-left: 0;
    }

    .tour-item-timeline-header {
        margin-left: -40px;
    }
    
    .maptest {
        margin-left: -40px;
    }

    .pagination {
        margin-bottom: 30px;
    }

    .confirm-form .main-btn .btn-special a {
        font-size: 18px;
    }

    .order-captcha {
        flex-direction: column;
        align-items: center;
    }

    .room-container .sp-thumbnail-container {
        height: 60px !important;
        width: 90px !important;
    }

    .room-container .sp-thumbnails {
        height: 60px !important;
    }

    .details-other-main.details-long-list ul li {
        flex: 0 0 calc(100% / 1);
    }

    .main-event-content .main-event-detail .btn-event a {
        padding: 9px 20px;
    }

    .section-event .event .main-event-container .main-event .main-event-banner {
        height: 250px !important;
    }

    .explore-content .nav-tabs .nav-item .nav-link,
    .explore-content .nav-tabs .nav-item .nav-link.active {
        padding: 5px 15px;
    }

    .explore-content .tab-content .tab-content-container .tab_pane_content .tab_pane_summary {
        padding-right: 0;
    }

    .vr3d-gallery .vr3d, .image-gallery .image-library, .video-gallery .video-library {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .vr3d-gallery .vr3d:nth-last-child(2), 
    .image-gallery .image-library:nth-last-child(2), 
    .video-gallery .video-library:nth-last-child(2) {
        padding-bottom: 20px;
    }

    .explore-content .tab-content .tab-content-container {
        height: 415px;
        padding: 20px;
    }

    .explore-content .tab-content #Gioi_thieu .tab-content-container .tab_pane_content,
    .explore-content .tab-content .tab-content-container .tab_pane_content {
        height: auto;
    }

    .explore-content .tab-content .tab-content-container.flex-item {
        flex-wrap: wrap
    }

    .explore-content .tab-content #Gioi_thieu .tab-content-container .tab_pane_content {
        height: 150px;  
    }

    .explore-content .tab-content #Gioi_thieu .tab-content-container .tab_pane_img img {
        margin-bottom: 10px;
    }

    .sub-news-group .content-sub-news .sub-news-title {
        -webkit-line-clamp: 2;
        margin-bottom: 3px;
    }

    .sub-news-group .content-sub-news .sub-news-summary .news-summary {
        -webkit-line-clamp: 2;
    }

    .destination-main .destination-grid .destination-content {
        flex: 0 0 calc(100% - 10px);
        max-width: 100%;
    }

    .destination-content .destination-news .destination-caption .destination-summary {
        -webkit-line-clamp: 4 !important;
    }

    .destination-main .destination-grid .destination-content .destination-caption {
        padding: 20px;
    }

    .section-help .help-main .customer-help {
        flex-direction: column;
        padding: 20px;
        align-items: center;
    }

    .customer-help .list-help ul li .background-icon {
        padding: 25px;
    }

    .section-help .help-main .customer-help .banner-help {
        margin-bottom: 15px;
    }

    .mainbackgroud-container .footer-extra ul {
        justify-content: left;
    }

    .mainbackgroud-container .footer-extra .count {
        align-items: flex-start;
    }

    .slide-function .function {
        align-items: flex-start;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .slide-function .function .timer {
        flex: 0 0 100%;
        margin-right: 0;
    }
    
    .section-event .event {
        margin-top: 30px;
        margin-bottom: 30px;
    }

    .section-utilities .utilities-content {
        margin-bottom: 30px;
    }

    .section-news .inner-news {
        margin-bottom: 30px;
    }

    .section-destination .destination-main {
        margin-bottom: 25px;
    }

    .slide-function {
        bottom: 20px;
        left: 35px;
    }

    .slide-function .function > div{
        margin-bottom: 5px;
    }

    #owl-slideQC .item .img-bg .content-news {
        padding-bottom: 105px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .details-other-main ul li {
        flex: 0 0 calc(100% / 2);
    }

    .section-map .map-main {
        margin-bottom: 40px;
    }

    .inner-news-main {
        margin-bottom: 20px;
    }

    .inner-news-content {
        margin-bottom: 20px;
    }

    .main-inner-location-detail {
        text-align: center;
    }

    .absolute-btn {
        position: unset;
        margin-top: 30px;
        margin-bottom: 10px;
    }
        .inner-header #main-menu li a {
        color: #33396d;
    }
}

@media screen and (max-width: 460px) {
    .main-visual.hung-yen-banner {
        box-shadow: none;
        position: relative;
        overflow: visible;
        height: auto;
        min-height: auto;
        margin-top: 0px;
        padding-top: 0px;
    }
    .contra-nav .nav-action .user-nav .login {
        padding: 8px;
        font-size: 12px;
    }

    .contra-nav .nav-action .specialty {
        padding: 8px;
        font-size: 12px;
    }
    .main-visual.hung-yen-banner .visual-rolling {
        height: auto;
        min-height: auto;
    }
    .main-visual.hung-yen-banner .visual-rolling > .swiper-container {
        height: auto !important;
        min-height: auto;
    }
    .tin-tuc-su-kien {
        padding: 0px;
        margin-bottom: 30px;
    }
    .title-hyn .caption {
        font-size: 17px;
        line-height: 20px;
    }
    .tin-tuc-su-kien .main-news{
        margin-bottom: 10px;
    }
    .home-news {
        padding-top: 0px;
        min-height: auto;
    }
    .tin-tuc-su-kien .sidebar-news{
        gap: 10px;
    }
    .tin-tuc-su-kien .view-all {
        font-size: 13px;
    }
    .tin-tuc-su-kien .title-hyn {
        margin-bottom: 0px;
        gap: 15px;
    }
    .tin-tuc-su-kien .main-content {
        padding: 10px;
    }
    .tin-tuc-su-kien .news-date {
        font-size: 13px;
        margin-bottom: 5px;
    }
    .tin-tuc-su-kien .main-title {
        margin-top: 0px;
        line-height: 20px;
        font-size: 15px;
    }
    .tin-tuc-su-kien .main-title a {
        font-size: 14px;
        margin-bottom: 0px;
        font-weight: 700;
    }
    .tin-tuc-su-kien .main-image {
        max-height: 200px;
    }
    .tin-tuc-su-kien .main-excerpt{
        font-size: 14px;
    }
    .tin-tuc-su-kien .sidebar-info {
        padding: 0 10px;
    }
    .tin-tuc-su-kien .sidebar-date {
        font-size: 13px;
        margin-bottom: 5px;
        line-height: 20px;
    }
    .tin-tuc-su-kien .sidebar-item{
        padding: 5px;
    }
    .tin-tuc-su-kien .sidebar-title {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 0px;
    }
    .list-vr360 {
        margin-bottom: 30px;
        padding: 15px 8px;
    }
    .list-vr360 .vr360-subtitle {
        font-size: 14px;
        margin-top: 5px;
        line-height: 20px;
    }
    .list-vr360 .vr-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .list-vr360 .vr360-img{
        max-height: 200px;
        height: auto;
    }
    .list-vr360 .vr360-img img{
        max-height: 200px;
    }
    .list-vr360 .vr360-title{
        padding: 10px;
    }
    .list-vr360 .vr360-title .vr360title{
        font-size: 15px;
    }
    .list-vr360 .vr360-title .vr360-content{
        font-size: 14px;
    }
    .discover .explore-grid {
        grid-template-columns: 1fr;
        gap: 15px;
        margin-bottom: 30px;
    }
    .discover .explore-grid .explore-card{
        padding: 10px;
    }
    .discover .explore-grid .explore-card img{
        margin-bottom: 0px;
    }
    .discover .explore-grid p{
        font-size: 14px;
        line-height: 20px;
    }
    .discover .explore-grid h3 {
        font-size: 16px;
        margin-bottom: 5px;
        line-height: 20px;
    }
    .lich-trinh {
        margin-bottom: 30px;
    }
    .lich-trinh .cards-container{
        gap: 15px;
    }
    .lich-trinh .title-hyn .view-all{
        font-size: 13px;
    }
    .lich-trinh .cards-container .card{
        gap: 15px;
    }
    .lich-trinh .card-image{
        height: 200px;
    }
    .lich-trinh .tag{
        padding: 5px 10px;
    }
    .lich-trinh .tags{
        padding: 15px 15px 10px;
    }
    .lich-trinh .card-title{
        padding: 0px 15px 10px;
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 0px;
        margin-top: 0px;
        height: auto;
    }
    .lich-trinh .points, .lich-trinh .price {
        font-size: 14px;
    }
    .lich-trinh .info{
        padding: 5px 15px;
    }
    .app-download {
        flex-direction: column;
        align-items: flex-start;
        padding: 15px;
        border-radius: 14px;
        gap: 10px;
        margin-bottom: 0;
    }

    .app-download .app-content {
        width: 100%;
    }

    .app-download .app-content h2 {
        font-size: 17px;
        line-height: 20px;
        margin-bottom: 15px;
    }

    .app-download .app-content p {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 10px;
        max-width: 100%;
    }

    .app-download .app-mockup {
        width: 100%;
        max-width: 260px;
        margin: 0 auto;
        display: block;
        transform: none;
        border-width: 5px;
    }

    .app-download .app-buttons {
        width: 100%;
        display: flex;
        flex-direction: row;
        gap: 12px;
        margin-top: 20px;
    }

    .app-download .app-btn {
        width: 100%;
        justify-content: center;
        padding: 10px;
        font-size: 13px;
        border-radius: 12px;
        flex: 1;
    }

    .app-download .app-btn svg {
        width: 22px;
        height: 22px;
    }
    .partner-section .caption h2 {
        line-height: 20px;
        font-size: 17px;
        font-weight: 800;
        font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;
    }
    .partner-section .partner-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .partner-section .partner-card{
        height: 150px;
        padding: 15px;
    }
    .map-section .showmapLCI {
        flex-direction: column;
        gap: 0;
    }
    .map-section .showitem_tab .nav-pills {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 8px;
        align-items: flex-start;
    }
    .map-section .showmapLCI > [class*="col-"] {
        flex: 0 0 100% !important;
        float: none !important;
    }
    .map-section .showmapLCI .col-md-5{
        padding: 15px;
        border-right: 0px;
        width: 100%;
        max-width: 100%;
    }
    .map-section .showitem_tab > .panel-label {
        font-size: 17px;
        margin-bottom: 10px;
        padding-bottom: 0px;
    }

    .map-section .showitem_tab .nav-pills > li {
        width: auto;
    }

    .map-section .showitem_tab .nav-pills > li > a {
        gap: 5px;
        padding: 10px;
        white-space: nowrap;
        border-radius: 4px;
    }

    /* Thu nhỏ icon */
    .map-section .map-cat-icon {
        width: 20px;
        height: 20px;
        font-size: 14px;
    }

    .map-section .map-cat-name,
    .map-section .map-cat-count {
        font-size: 14px;
    }

    /* Chiều cao map */
    .map-section #map,
    .map-section .showmapLCI .col-md-11 {
        min-height: 350px;
    }
    .inner .slide-news .inner-slide-caption .inner-slide-summary {
        display: none;
    }

    .section-news .news {
        margin-bottom: 20px;
    }

    .div-news .slide-head h1 {
        font-size: 26px;
        padding-right: 10px;
        text-align: left;
    }

    .slide-head a {
        font-size: 14px;
        padding-left: 10px;
    }

    .btn-sidebar {
        top: -34px;
    }

    .breadcrumb {
        margin-bottom: 0;
    }

    .section-utilities .utilities-option .utilities .utilities-list li a {
        justify-content: flex-start;
    }
    
    .destination-main .destination-grid .introdution h1 {
        line-height: 40px;
        text-align: left;
        font-size: 30px;
    }

    .tour-input-hobby-list li:nth-last-child(2) .label-checkbox {
        margin-bottom: 20px;
    }

    .checkbox-list.li-quarter ul li {
        flex: 0 0 100%;
        padding: 0 10px;
    }

    .main-mytour-detail .btn-mytour a {
        padding: 12.5px 60px;
        font-size: 16px;
    }

    .pagination {
        margin-bottom: 20px;
    }

    .mainbackgroud-container .footer-extra .count {
        display: none
    }
    
    /* .room-container .show-more-info {
        width: 100%;
    } */

    .count {
        display: none;
    }

    .customer-help .list-help ul li {
        padding-right: 10px;
    }
    
    .customer-help .list-help ul li p {
        font-size: 14px;
    }

    .helping-list-details .list-help ul li {
        flex: 0 0 calc(100% / 1);
        max-width: calc(100% / 1);
    }

    .section-map .map-main {
        margin-bottom: 30px;
    }

    .mainbackgroud-container .footer-extra .download-app {
        align-items: flex-start;
        padding-top: 0px;
        margin-bottom: 0;
    }

    .footer-list {
        display: none;  
    }

    .mainbackgroud-container .footer-extra .download-app {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .mainbackgroud-container .footer-extra .download-app .footer-title{
        flex: 0 0 100%;
    }

    .mainbackgroud-container .footer-extra {
        padding-left: 0;
    }

    .main-event-countdown .divlock .tdDate .pDate {
        font-size: 30px;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-countdown {
        width: 360px;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-countdown {
        padding: 10px;
    }

    .section-utilities .utilities-option .utilities .utilities-list li {
        padding: 10px !important;
    }

    .utilities-list ul li {
        max-width: 100%;
        flex: 0 0 100%;
    }

    .destination-content .destination-news .destination-caption .destination-summary {
        -webkit-line-clamp: 3 !important;
    }

    .customer-help .list-help ul li .background-icon {
        padding: 10px;
    }

    .section-utilities .utilities-option .utilities .utilities-list li {
        max-width: 100%;
        flex: 0 0 100%;
    }

    .detail-main ul li {
        flex: 0 0 calc(100% / 1);
    }

    .sub-news-summary {
        display: none;
    }

    .inner-news-option {
        flex-direction: column;
    }

    .inner-news-option {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .inner-news-content .news-caption {
        flex-direction: column;
        align-items: flex-start;
    }

    .inner-news-content .news-share {
        padding-bottom: 10px;
    }

    .Luhanh-content {
        flex-direction: column;
    }

    .inner-event-banner {
        overflow: unset;
        background: var(--text);
        padding: 15px;
    }

    .inner-event-banner .inner-event-image {
        height: auto !important;
    }

    .inner-event-info {
        position: unset;
        bottom: unset;
        left: unset;
    }

    .inner-event-banner .overlay {
        display: none;
    }

    .search-content {
        width: 300px;
        right: -20px;
    }
    .event-past-badge {
        width: 360px;
        padding: 10px;
        position: relative;
        top: 0px;
        left: 0px;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-countdown {
        width: 360px
    }
    .details-news .inner-news-container .btn-place-link-container {
        display: block;
    }
}

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

    .inner-location-summary.inner-slide-summary {
        display: none;
    }

    .tour-route-distance {
        margin-right: 15px;
    }

    .explore-title h1 {
        text-align: center;
    }

    .div-news .slide-head h1 {
        font-size: 24px;
    }

    .section-destination .main-btn .btn-special span::before {
        content: 'Xem thêm';
        font-size: 14px;
    }

    .section-destination .main-btn .btn-special span {
        font-size: 0;
    }

    .place-tour-info-time .place-tour-open {
        flex-direction: column;
    }
    
    .place-tour-info-time .place-tour-open div:not(:last-child) {
        margin-bottom: 5px;
    }

    .destination-main .destination-grid .introdution h1 {
        font-size: 28px;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-countdown {
        width: 300px;
    }

    .main-event-countdown .divlock .tdDate .pDate {
        font-size: 25px;
    }

    .section-event .event .main-event-container .main-event .main-event-banner {
        height: 250px !important;
    }

    .destination-content .destination-news .destination-caption .destination-summary {
        display: none !important;
    }

    .group-btn {
        flex-direction: column;
        width: 93%;
    }

    .group-btn > div:not(:last-child) {
        margin-bottom: 10px;
    }

    .inner .slide-news .inner-slide-caption .inner-slide-summary {
        height: calc(100% - 170px);
    }

    .inner-news-main {
        margin-bottom: 10px;
    }

    .inner-news-content {
        margin-bottom: 10px;
    }

    .section-news .inner-news {
        margin-bottom: 10px;
    }

    .section-event .event {
        margin-top: 30px;
        margin-bottom: 10px;
    }

    .section-map .map-main {
        margin-bottom: 20px;
    }

    .search-content {
        width: 285px;
    }
    .event-past-badge {
        width: 290px;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-countdown {
        width: 290px
    }
    .main-event-countdown .divlock .tdDate .pDate {

        font-size: 25px;
    }
    .main-event-countdown .divlock > div:not(:last-child) .ptDate {
        margin-right: 10px;
    }
    .nav-brand .logo img {
        width: 60px;
        height: auto;
        object-fit: contain;
    }
    .inner-header .nav-action{
        right: 45px;
    }
    .nav-action .search-nav{
        margin-right: 10px;
    }
    .language-choice img {
        width: 20px;
        height: 20px;
        margin-right: 2px;
    }
    .user-avatar a {
        width: 30px;
        height: 30px;
    }
}

@media screen and (max-width: 325px) {
    .search-content {
        width: 200px;
    }

    .language-choice img {
        width: 20px;
        height: 20px;
        margin-right: 0px;
    }
    .user-avatar a {
        width: 25px;
        height: 25px;
        margin-right: 0px;
    }
    .user-expand-more .material-icons-outlined{
        font-size: 1rem;
    }
    .inner-header .nav-action {
        right: 40px;
    }
    .nav-action .search-nav {
        margin-right: 8px;
    }
    .language-choice .language-now{
        margin-right: 2px;
    }
    .nav-action .search-nav #search-modal img {
        width: 17px;
        height: 17px;
    }
    .contra-nav .nav-brand {
        width: 40%;
        text-align: center;
    }

    .contra-nav .nav-brand a {
        display: inline-block;
        width: 100%;
    }
    .contra-nav .main-menu-btn {
        order: 1;
        margin-left: auto;
    }
    .event-past-badge {
        width: 260px;
    }

    .section-event .event .main-event-container .main-event .main-event-content .main-event-countdown {
        width: 260px
    }
    .main-event-countdown .divlock .tdDate .pDate {
        font-size: 20px;
    }
    .main-event-countdown .divlock > div:not(:last-child) .ptDate {
        margin-right: 10px;
    }
    
}

#main-menu-state {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    border: 0;
    padding: 0;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
}

#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon {
    height: 0;
    background: transparent;
}
  
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:before {
    top: 0;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
  
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:after {
    top: 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}