@media (max-width: 1200px) {
    menu {
        position: fixed;
        top: 0;
        transition: left 0.3s ease-in-out;
        left: -2000px;
        z-index: -1;
    }

    /* Khi menu mở */
    menu.open {
        z-index: 1000;
        left: 0;
        background-color: #ffffff;
        height: 100%;
        line-height: 100%;
        width: 300px;
        display: block;
        height: 100vh;
        border-radius: 0;
    }

    menu.open .logo {
        margin-right: 32px;
        border-bottom: 2px solid #ccc;
        /* Đường kẻ màu xám */
        padding-top: 10px;
        padding-bottom: 10px;
        /* Tạo khoảng cách giữa logo và đường kẻ */
    }

    menu.open .menu1 {
        padding-top: 10px;
        display: block;
        width: auto;
        margin: 0 32px 0 32px;
        border-bottom: 2px solid #ccc;
        padding-bottom: 10px;
    }

    menu.open .menu2 {
        position: static;
    }

    menu.open .menu1 .menuli1 {
        width: 236px;
        padding-left: 0;
        padding-right: 0;
        border-radius: 0;
    }

    menu.open .seach {
        display: flex;
        margin: 0 32px 0 32px;
        width: 236px;
        flex-direction: row;
        margin-top: 20px;
        padding-bottom: 10px;
        border-bottom: 2px solid #ccc;
    }

    menu.open .seach input {
        width: 190px;
        background-color: rgb(230, 230, 230);
    }

    menu.open .seach button {
        background-color: rgb(230, 230, 230);
    }

    menu.open .language {
        width: 236px;
        padding-top: 20px;
        margin: 0 32px 0 32px;
    }

    menu.open .language #input {
        background-color: rgb(230, 230, 230);
    }

    #menu-toggle {
        position: fixed;
        top: 10px;
        left: 15px;
        font-size: 25px;
        background: transparent;
        border: none;
        cursor: pointer;
        z-index: 1000;
    }
}

@media (min-width: 1201px) {
    #menu-toggle {
        display: none;
    }
}

@media (min-width: 901px) and (max-width: 1080px) {
    #contact-form img {
        /* display: none; */
        width: 309px;
        height: 269px;
    }

    #contact-form .contactForm {
        /* display: none; */
        width: 462px;
        height: 542px;
    }

    #contact-form .contactForm {
        padding: 16px 0 16px 0;
    }
}

@media (min-width: 810px) and (max-width: 900px) {
    #contact-form {
        margin-bottom: 128px;
    }

    #contact-form img {
        /* display: none; */
        width: 249px;
        height: 209px;
    }

    #contact-form .contactForm {
        /* display: none; */
        width: 402px;
        height: 562px;
    }

    #contact-form .contactForm {
        padding: 16px 0 16px 0;
    }
}

@media (max-width: 809px) {
    #contact-form img {
        display: none;
    }

    #contact-form .homeTitle {
        margin-bottom: 50px;
    }

    #contact-form .contactForm {
        padding: 16px 0 16px 0;
    }
}

@media (min-width: 601px) and (max-width: 809px) {
    #contact-form .homeTitle {
        font-size: 40px;
    }
}

@media (min-width: 501px) and (max-width: 600px) {
    #contact-form .homeTitle {
        font-size: 36px;
    }

    #contact-form .contactForm {
        width: 472px;
        height: 572px;
    }
}

@media (max-width: 500px) {
    #contact-form .homeTitle {
        font-size: 30px;
    }

    #contact-form .contactForm {
        width: 360px;
        height: 592px;
    }

    main .mainqgctDiv {
        font-size: 36px;
    }

    main .mainqgctDiv1 {
        font-size: 16px;
    }
}

@media (max-width: 590px) {
    #footer1 {
        display: inline;
    }

    #footer1 .footerDv {
        margin-top: 20px;
        margin-left: 40px;
        margin-bottom: 50px;
    }

    #footer2 .footerDv {
        width: 45%;
    }

    #footerImg {
        height: 1400px;
    }

    #footerTitle {
        max-height: 106px;
    }

    #footerTitle div {
        padding: 48px 0;
    }
}

@media (min-width: 591px) and (max-width: 720px) {
    #footer1 {
        margin-bottom: 120px;
    }

    #footer2 .footerDv {
        width: 47%;
    }

    #footerImg {
        height: 1130px;
    }

    #footerTitle {
        max-height: 86px;
    }

    #footerTitle div {
        padding: 36px 0;
    }
}

@media (min-width: 830px) and (max-width: 1020px) {
    #homeSeach nav {
        width: 780px;
    }

    #homeSeach nav .selectHome {
        width: 200px;
    }
}

@media (min-width: 680px) and (max-width: 829px) {
    #homeSeach nav {
        width: 640px;
        height: 76px;
    }

    #homeSeach nav .selectHome {
        width: 150px;
    }
}

@media (max-width: 679px) {
    #homeSeach nav .homeSeach{
        display: none;
    }
    .homeSeach1 {
        opacity: 0;
        /* visibility: hidden; */
        position: absolute;
        top: 30%;
        left: 0;
        left: 0;
        right: 0;
        width: 100%;
        z-index: -1;
    }

    /* Khi bật */
    .homeSeach1.open {
        opacity: 1;
        width: 300px;
        visibility: visible;
        /* transform: translateY(0); */
        z-index: 1000;
        display: block;
    }

    #homeSeach nav {
        height: 60px;
    }

    .homeSeach1.open form {
        display: block;
        background-color: #e5e5e5;
        border-radius: 20px;
        z-index: 1000;
    }

    .homeSeach1.open form .selectHome {
        width: 90%;
        margin-left: 14px;
        margin-right: 18px;
        border-radius: 10px;
    }

    .homeSeach1.open form #industry {
        margin-top: 20px;
    }

    .homeSeach1.open form button {
        width: 90%;
        border-radius: 10px;
        margin: 0px 18px 20px 18px;
    }

    #home-toggle.open {
        display: none;
    }

    #home-toggle {
        width: 100px;
        height: 40px;
        background-color: #ffffff;
        font-size: 16px;
        font-weight: 500;
        border-radius: 9999px;
        border: none;
        transition: all 0.3s ease-in-out;
        margin: auto;
    }
}

@media (min-width: 680px) {
    #home-toggle {
        display: none;
    }
    .homeSeach1{
        display: none;
    }
}

@media (min-width: 501px) and (max-width: 900px) {
    #homeMenuAdd {
        top: 57%;
        left: 67%;
    }

    #homeMenuAdd div {
        padding: 10px 16px;
    }
}

@media (max-width: 500px) {
    #homeMenuAdd {
        display: none;
    }
}

@media (max-width: 501px) {
    main .main1 {
        padding-top: 80px;
    }

    main .main1HomeTitle {
        font-size: 40px;
    }

    main .main1HomeNd {
        display: block;
    }

    main .main1HomeNd div {
        margin: auto;
    }

    main .main1HomeNd img {
        margin: -40px auto;
        height: auto;
        transform: rotate(90deg);
        transform-origin: center;
    }
}

@media (max-width: 850px) {
    main .main2 {
        max-width: 820px;
        margin: 100px 10px 50px;
    }

    main .main2 .main2Div2 {
        font-size: 15px;
        width: 90%;
    }
}

@media (min-width: 490px) and (max-width: 850px) {
    main .main2 .main2Div1 {
        width: 100%;
        font-size: 40px;
        line-height: 48px;
    }
}

@media (max-width: 489px) {
    main .main2 .main2Div1 {
        width: 100%;
        font-size: 32px;
        line-height: 38px;
    }
}

@media (min-width: 450px) and (max-width: 1000px) {
    main .main4Div1 {
        font-size: 38px;
    }

    main .main4Div2 {
        font-size: 14px;
    }
}

@media (max-width: 449px) {
    main .main4Div1 {
        font-size: 30px;
    }

    main .main4Div2 {
        font-size: 14px;
    }
}

@media (min-width: 750px) and (max-width: 1000px) {
    main .main4School {
        width: 48%;
    }

    main .main4School:nth-child(n+9) {
        display: none;
    }
}

@media (max-width: 749px) {
    main .main4School {
        width: 95%;
        margin-left: 8px;
    }

    main .main4School:nth-child(n+5) {
        display: none;
    }
}

@media (max-width: 640px) {
    main .main4Button button {
        padding: 8px 80px;
    }
}

@media (min-width: 900px) and (max-width: 1230px) {
    main .main5 {
        width: 100%;
    }

    main .main5Img1 {
        width: 40%;
    }
}

@media (max-width: 899px) {
    main .main5Img1 {
        display: none;
    }

    main .main5Img13 {
        display: none;
    }

    main .main5Div {
        width: 100%;
        margin: auto;
    }

    main .main5Title1 {
        width: 100%;
    }

    main .main5ldDiv1 {
        width: 100%;
        margin-left: 0px;
    }
}

@media (max-width: 499px) {
    main .main5Title1 {
        font-size: 38px;
        width: 100%;
    }
}

@media (min-width: 670px) and (max-width: 1020px) {
    main .main5Div3:nth-child(n+3) {
        display: none;
    }
}

@media (max-width: 669px) {
    main .main5Div2 {
        display: block;
    }

    main .main5Div3 {
        margin: 20px auto 0px;
    }
}

@media (min-width: 500px) and (max-width: 718px) {
    main .main5Title4 div {
        font-size: 36px;
    }

    main .main5Title4 a {
        padding: 12px 30px;
    }

    main .main5hbctTitle4 div {
        font-size: 32px;
    }

    main .main5hbctTitle4 a {
        padding: 10px 26px;
    }

    main .main5thctTitle4 div {
        font-size: 32px;
    }

    main .main5thctTitle4 a {
        padding: 10px 26px;
    }
}

@media (max-width: 499px) {
    main .main5Title4 div {
        font-size: 24px;
    }

    main .main5Title4 a {
        padding: 6px 24px;
    }

    main .main5hbctTitle4 div {
        font-size: 26px;
    }

    main .main5hbctTitle4 a {
        padding: 8px 20px;
    }

    main .main5thctTitle4 div {
        font-size: 26px;
    }

    main .main5thctTitle4 a {
        padding: 8px 20px;
    }

    main .main5dgdiv21 {
        margin-bottom: 60px;
    }
}

@media (max-width: 500px) {
    main .main1Title1 {
        font-size: 34px;
    }

    main .main1 {
        margin-top: 0px;
    }
}

@media (max-width: 500px) {
    main .main1HomeNd {
        display: block;
    }

    main .main1HomeNd div {
        margin: auto;
    }

    main .main1HomeNd img {
        margin: -40px auto;
        height: auto;
        transform: rotate(90deg);
        transform-origin: center;
    }

    main .main1gtDiv2 {
        display: block;
        max-width: 360px;
        margin: 40px auto;
    }

    main .main1gtDiv2 img {
        margin-top: 20px;
        max-width: 360px;
    }

    main .divgtName {
        top: 55%;
    }

    main .main2gtTitle1 {
        font-size: 42px;
    }
}

@media (min-width: 1001px) and (max-width: 1250px) {
    main .main1gtDiv2 img {
        max-width: 470px;
    }

    main .divgtName {
        top: 60%;
    }
}

@media (min-width: 600px) and (max-width: 1000px) {
    main .main1gtDiv2 {
        display: block;
        max-width: 570px;
        margin: 40px auto;
    }

    main .main1gtDiv2 img {
        margin-top: 20px;
    }
}

@media (min-width: 501px) and (max-width: 599px) {
    main .main1gtDiv2 {
        display: block;
        max-width: 460px;
        margin: 40px auto;
    }

    main .main1gtDiv2 img {
        margin-top: 20px;
        max-width: 460px;
    }

    main .divgtName {
        top: 60%;
    }
}

@media (min-width: 601px) and (max-width: 850px) {
    main .main2gtImg {
        display: none;
    }
}

@media (max-width: 600px) {
    main .main2gtImg {
        display: none;
    }

    main .maingt-big {
        display: none;
    }

    main .maingt-small {
        display: block;
    }
}

@media (min-width: 601px) {
    main .maingt-small {
        display: none;
    }
}

@media (max-width: 565px) {
    main .maingt3Title {
        font-size: 36px;
        padding-top: 80px;
        margin-left: 4px;
        margin-right: 4px;
    }
}

@media (max-width: 536px) {
    main .maingt3Div {
        margin: auto;
    }

    main .maingt3Div1 {
        padding-bottom: 80px;
    }
}

@media (max-width: 530px) {
    main .main1ldHomeNd {
        display: block;
    }

    main .main1ldHomeNd div {
        margin: auto;
    }

    main .main1ldHomeNd img {
        margin: -40px auto;
        height: auto;
        transform: rotate(90deg);
        transform-origin: center;
    }

    main .main1ldHomeTitle {
        font-size: 40px;
    }
}

@media (min-width: 1201px) and (max-width: 1288px) {
    main .main1lqDiv1 {
        height: 450px;
    }
}

@media (min-width: 1005px) and (max-width: 1144px) {
    main .main1lqDiv1 {
        height: 460px;
    }
}

@media (min-width: 651px) and (max-width: 842px) {
    main .main1lqDiv1 {
        height: 468px;
    }
}

@media (min-width: 655px) and (max-width: 800px) {
    main .main1lqDiv {
        max-width: 83%;
    }

    main .main1lqDiv1 {
        margin-right: 22px;
        margin-left: 22px;
    }
}

@media (min-width: 601px) and (max-width: 654px) {
    main .main1lqDiv1 {
        margin-right: 20px;
        margin-left: 20px;
    }
}

@media (min-width: 540px) and (max-width: 600px) {
    main .main1lqDiv1 {
        height: 468px;
    }
}

@media (min-width: 501px) and (max-width: 539px) {
    main .main1lqDiv1 {
        height: 445px;
    }
}

@media (max-width: 500px) {
    main .mainldSlider {
        width: 300px;
    }
}

@media (max-width: 587px) {
    main .main2ldDiv {
        height: 700px;
        overflow-y: auto;
        scroll-behavior: smooth
    }

    main .main2ldDiv::-webkit-scrollbar {
        width: 4px;
        /* làm nhỏ chiều rộng thanh cuộn */
    }

    main .main2ldDiv::-webkit-scrollbar-thumb {
        background-color: rgba(191, 189, 189, 0.4);
        /* màu đỏ mờ đi */
        border-radius: 10px;
    }

    main .main2ldDiv::-webkit-scrollbar-track {
        background-color: transparent;
        /* nền trong suốt */
    }
}

@media (min-width: 850px) and (max-width: 986px) {
    main .main3ldDiv1 {
        max-height: 120px;
    }

    main .main3ldDiv1 div {
        height: 120px;
    }
}

@media (min-width: 601px) and (max-width: 849px) {
    main .main3ldDiv {
        display: none;
    }

    main .main3ldDiv2 {
        max-width: 100%;
        margin: auto;
    }
}

@media (max-width: 600px) {
    main .main3ldDiv {
        display: none;
    }

    main .main3ldDiv2 {
        max-width: 320px;
        width: 320px;
        margin: auto;
    }

    main .main3ldDiv2 img {
        width: 320px;
        height: 165px;
    }

    main .main3ldDiv3 {
        display: block;
        max-height: none;
    }

    main .main3ldDiv4 {
        height: auto;
    }

    main .main3ldDiv5 {
        padding-top: 8px;
        margin-left: 0;
    }

    main .main3ldDiv2 a {
        display: block;
        max-height: none;
    }

    main .main3ldDiv2 .main3ldDiv24 {
        display: block;
        max-height: none;
    }

    main .main3ldDiv2 #main3ldDiv2 {
        height: auto;
    }
}

@media (max-width: 1000px) {
    main .main1dvctDiv {
        width: 100%;
    }

    main .main1dvctDiv1 {
        display: none;
    }
}

@media (min-width: 1141px) {
    #hb-toggle {
        display: none;
    }
}

@media (max-width: 1140px) {
    .main1hbDiv {
        position: absolute;
        display: none;
        top: 100%;
        left: 0;
        width: 0%;
        opacity: 0;
        z-index: -1;
    }

    .main1hbDiv.open {
        opacity: 1;
        width: 300px;
        top: 150%;
        visibility: visible;
        transform: translateY(0);
        z-index: 1000;
        margin: auto;
        background-color: #e5e5e5;
        border-radius: 10px;
        display: block;
    }

    .main1hbDiv.open .select2323 {
        width: 90%;
        margin: 10px 12px;
    }

    .main1hbDiv.open .select2323 .dropdown-toggle{
        border-radius: 10px;
    }

    .main1hbDiv.open form {
        display: block;
    }

    .main1hbDiv.open #nameIndustry {
        margin-top: 10px;
    }

    .main1hbDiv.open button {
        width: 90%;
        margin: 8px 12px 20px;
        border-radius: 10px;
    }

    #hb-toggle.open {
        display: none;
    }

    #hb-toggle button {
        width: 180px;
        height: 40px;
        background-color: #ffffff;
        font-size: 18px;
        font-weight: 500;
        border-radius: 9999px;
        /* Bo tròn hoàn toàn */
        border: none;
        transition: all 0.3s ease-in-out;
        margin: auto;
    }

    #hb-toggle:hover {
        color: #ff0000;
    }
}

@media (max-width: 850px) {
    main .main1hbctDiv {
        width: 100%;
    }

    main .main1hbctDiv1 {
        width: 100%;
    }

    main .main1hbctDiv2 {
        display: none;
    }
}

@media (max-width: 850px) {
    main .main1thDiv {
        max-width: 372px;
    }

    main .main1thName {
        font-size: 32px;
    }

    main .main2qgctDiv1 {
        max-width: 372px;
    }

    main .main2qgct2Div1 {
        max-width: 372px;
    }
}

@media (max-width: 700px) {
    main .main1thctDiv1 {
        font-size: 30px;
    }

    main .main1thhdDiv1 {
        display: block;
    }

    main .main1thhdDiv2 {
        padding-top: 40px;
    }
}

@media (min-width: 500px) and (max-width: 700px) {
    main .main1thhdDiv {
        font-size: 30px;
        line-height: 1.2;
    }
}

@media (max-width: 499px) {
    main .main1thhdDiv {
        font-size: 26px;
        line-height: 1.2;
        margin-bottom: 0px;
    }
}

@media (max-width: 434px) {
    main .main1thName2 {
        padding-top: 28px;
    }
}

@media (max-width: 548px) {
    header .mainlienhdiv {
        left: 4%;
    }
}

@media (max-width: 500px) {
    main .main1qgct2Div {
        font-size: 38px;
    }
}

@media (min-width: 499px) and (max-width: 850px) {
    main .main2qgct2 .main2qgct2Div2 {
        width: 100%;
        font-size: 40px;
        line-height: 48px;
    }

    main .main2qgct2 .main2qgct2Div3 {
        font-size: 15px;
        width: 90%;
    }
}

@media (max-width: 490px) {
    main .main2qgct2 .main2qgct2Div2 {
        width: 100%;
        font-size: 32px;
        line-height: 38px;
    }

    main .main2qgct2 .main2qgct2Div3 {
        font-size: 15px;
        width: 90%;
    }
}

@media (max-width: 1090px) {
    main .main1skctDiv1 {
        display: none;
    }

    main .main1skctDiv {
        width: 100%;
    }
}

@media (max-width: 700px) {
    header .mainskDiv1 {
        display: none;
    }

    header .mainskDiv2 {
        max-width: 70%;
        margin: auto;
    }
}

@media (max-width: 550px) {
    main .mainseachDiv {
        display: block;
        max-height: none;
        display: flex;
        flex-direction: column;
        gap: 16px;
        /* khoảng cách giữa ảnh và nội dung */
    }

    main .mainseachDiv>div:first-child {
        width: 100%;
    }

    main .mainseachDiv>div:last-child {
        width: 100%;
        height: auto;
    }

    main .mainseachDiv img {
        height: auto;
        max-height: none;
    }
}

@media (max-width: 500px) {
    main .main3hbDiv {
        padding: 0 12px;
    }
}

@media (max-width: 830px) {
    main .city-itemqgct {
        margin: 16px auto 20px;
    }
}

@media (min-width: 831px) and (max-width: 1212px) {
    main .city-itemqgct {
        margin: 16px auto 20px;
    }
}

@media (min-width: 500px) and (max-width: 699px) {
    main .slider-containerqgct2 {
        margin-left: 20px;
        margin-right: 20px;
    }

    main .btn-nextqgct2 {
        margin-right: 12px;
    }

    main .btn-prevqgct2 {
        margin-left: -10px;
    }
}

@media (max-width: 499px) {
    main .btn-nextqgct2 {
        margin-right: 10px;
    }
}

@media (max-width: 550px) {
    main .main12qgdiv {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media (max-width: 550px) {
    main .main12qgdiv2 {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media (min-width: 701px) and (max-width: 1020px) {
    main .slider-container2 {
        width: 46.5%;
    }
}

@media (max-width: 700px) {
    main .slider-container2 {
        width: 93%;
    }

    main #btn-next1{
        margin-right: -10px;
    }

    main #btn-prev1{
        margin-left: -10px;
    }
}
@media (max-width: 520px) {
    main .selectThhd {
        width: 100%;
    }

    main button{
        width: 100%;
    }
}