@media all and (max-width: 1499px) {
    .logo {
        top: 16px;
    }
    .logo img {
        height: 50px;
    }
}

@media all and (max-width: 1399px) {
    .menu nav ul li a {
        font-size: 14px;
    }
    .form_search input {
        font-size: 16px;
    }
    .menu nav ul li.button_contact {
        padding: 8px 30px;
    }
    .menu nav ul li.button_contact a {
        font-size: 16px;
    }
    .menu nav ul li ul li a {
        font-size: 16px;
        line-height: 24px;
    }
    .menu nav ul li ul li {
        padding: 8px 40px 8px 20px !important;
    }
    .menu nav ul li ul li::before {
        top: 14px;
    }
}

@media all and (max-width: 1299px) {
    .logo {
        top: 20px;
    }
    .logo img {
        height: 40px;
    }
    .menu nav ul li.button_contact a {
        font-size: 14px;
        line-height: 24px;
    }
}

@media all and (max-width: 1239px) {
    .container {
        width: 1000px;
    }
    
    .menu {
        display: none;
        opacity: 0;
    }
    .menu.open {
        position: fixed;
        z-index: 90;
        display: block;
        opacity: 1;
        width: 100%;
        height: calc(100% - 100px);
        top: 100px;
        left: 0;
        right: 0;
        bottom: 0;
        padding: 0;
        margin: 0;
        background: #FFFFFF;
        padding: 0;
    }
    .menu nav {
        width: 100%;
        height: 100%;
        margin: 0 auto;
        padding: 30px 0px 60px;
        overflow-y: auto;
    }
    .menu nav ul {
        clear: both;
        display: table;
        width: 360px;
        max-width: 100%;
        margin: 0 auto;
        padding: 0;
    }
    .menu nav ul li {
        display: inline-block;
        padding: 14px 20px;
        width: 100%;
    }
    .menu nav ul li.menu_home img {
        display: none;
        opacity: 0;
    }
    .menu nav ul li.menu_home span {
        display: inline-block;
        opacity: 1;
    }
    .menu nav ul li a {
        display: block;
        width: max-content;
        font-size: 16px;
        line-height: 22px;
    }
    .menu nav ul li .icon_menu {
        opacity: 1;
        display: block;
        position: absolute;
        right: 0;
        top: 0;
        width: calc(100% - 200px);
        height: 50px;
        margin: auto 0;
        background: url(../images/icon_menu.svg) no-repeat;
        background-size: 12px 7px;
        background-position: center right;
        filter: grayscale(1);
        transform: rotate(180deg);
    }
    .menu nav ul li .icon_menu.open {
        filter: none;
        background-position: center left;
        transform: rotate(0deg);
    }
    .menu nav ul li ul {
        display: none;
        opacity: 0;
        position: relative;
        top: 0;
        left: 0;
        right: 0;
        padding: 10px 15px !important;
        border-radius: 0;
        background: none;
        box-shadow: none;
        margin: 0;
    }
    .menu nav ul li:hover a::before {
        display: none;
        opacity: 0;
    }
    .menu nav ul li:hover ul {
        display: none;
        opacity: 0;
        -webkit-transform: scale(1, 0);
    }
    .menu nav ul li ul.open {
        display: block;
        opacity: 1;
        -webkit-transform: scale(1, 1);
    }
    .menu nav ul li ul li {
        position: relative;
        padding: 5px 0 !important;
    }
    .menu nav ul li.button_contact {
        display: inline-block;
        padding: 12px 20px;
        width: 100%;
        background: #FFFFFF;
        border-radius: 0;
        margin-left: 0;
    }
    .menu nav ul li.button_contact a {
        display: block;
        text-transform: uppercase;
        font-size: 16px;
        line-height: 25px;
        color: #123174;
    }
    .menu nav ul li.button_contact a::before {
        opacity: 0;
        display: block;
    }
    .menu nav ul li.button_contact.active a::before {
        opacity: 1 !important;
        display: block;
    }
    .menu nav ul li:hover ul li:hover a {
        color: #FF8303;
    }
    .menu nav ul li ul li:hover {
        background: none;
    }
    .menu nav ul li ul::before,
    .menu nav ul li ul li:hover::before,
    .menu nav ul li.active ul li a::before,
    .menu nav ul li ul li a::before {
        display: none;
    }
    .menu nav ul li ul li ul{
        width: 100%;
        position: relative;
        top: 0;
        left: 0;
        padding: 0 15px!important;
        display: block !important;
        opacity: 1 !important;
        -webkit-transform: scale(1, 1) !important;
        transform: scale(1, 1)!important;
    }
    .menu nav ul li ul li ul li a{
        font-size: 16px;
    }
    .menu nav ul li ul li a strong{
        font-weight: 500;
        color: #FF8303;
        font-size: 18px;
    }
    .menu nav ul li ul li ul{
        padding: 5px 20px !important;
    }
    .menu nav ul li ul li ul li::before{
        content: '';
        display: block !important;
        opacity: 1 !important;
        width: 5px;
        height: 5px;
        border-radius: 5px;
        background: #7C7C7C;
        position: absolute;
        left: -12px;
        bottom: 0;
        top: 0;
        margin: auto 0;
        z-index: 2;
     }
    .menu nav::-webkit-scrollbar-thumb {
        border-radius: 0;
        background-color: #FF8303;
        width: 5px;
        border: 0;
    }
    .menu nav::-webkit-scrollbar-track {
        border-radius: 0;
        background-color: rgba(240, 244, 252, 0.5);
        width: 5px;
        height: 100%;
        border: 0;
    }
    .menu nav::-webkit-scrollbar {
        border-radius: 0;
        width: 5px;
        height: 100%;
        border: 0;
        background-color: rgba(240, 244, 252, 0.5);
    }
    .form_search {
        height: 55px;
        width: 460px;
        right: -15px;
    }
    .form_search .close_search {
        width: 55px;
        height: 55px;
        background-size: 18px 18px;
    }
    .form_search input {
        font-size: 14px;
    }
    .hotline {
        left: 0;
        right: auto;
    }
    header {
        width: 100%;
        padding: 0;
        height: 100px;
    }
    .header_bottom {
        height: 55px;
    }
    .logo {
        top: 7px;
    }
    .logo img {
        height: 40px;
    }
    .button_menu {
        display: block;
        opacity: 1;
    }
    .close_popup {
        background-size: 30px 30px;
    }
    .section_home {
        margin-top: 100px;
    }
    .section_partner,
    .section_blog {
        padding: 60px 0;
    }
    .info_review p strong{
        font-size: 16px;
    }
    .section_faqs,
    footer,
    .section_review,
    .section_whychoose {
        padding: 60px 0 0;
    }
    .title h1,
    .title h2,
    .title h3 {
        font-size: 30px;
        line-height: 38px;
    }
    .title h3 {
        margin-top: 5px;
    }
    .more a {
        font-size: 14px;
        line-height: 22px;
        padding: 10px 25px;
    }
    .more a i.icon_more {
        padding-left: 15px;
    }
    .more a i.icon_more::before {
        width: 10px;
        height: 10px;
    }
    .whychoose .info_whychoose {
        padding: 30px 30px;
    }
    .whychoose .info_whychoose .text_whychoose h3 {
        margin: 10px 0 5px;
        font-size: 16px;
        line-height: 22px;
    }
    .whychoose .info_whychoose .text_whychoose p {
        display: block;
        opacity: 1;
        font-size: 14px;
        line-height: 20px;
    }
    .whychoose .info_whychoose .icon_whychoose img {
        height: 40px;
    }
    .review {
        padding: 25px;
    }
    .review .text_review .quote {
        width: 25px;
        height: 19px;
    }
    .review .text_review p {
        margin: 10px 0 15px;
        font-size: 14px;
        line-height: 22px;
    }
    .review .info_review img {
        width: 60px;
        height: 60px;
        margin-right: 10px;
    }
    .review .info_review p {
        margin: 2px 0;
        font-size: 14px;
        line-height: 22px;
    }
    .review .info_review p strong {
        font-size: 16px;
    }
    .review .info_review .rating {
        margin: 0 0 10px;
    }
    .blog_hot .info_blog_hot {
        padding: 15px 20px;
    }
    .blog_hot .info_blog_hot p strong {
        font-size: 18px;
        line-height: 24px;
    }
    .blog_hot .info_blog_hot p {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 5px;
    }
    .list_blog_new {
        margin-bottom: 30px;
    }
    .slider_blog_new {
        height: 380px;
    }
    .blog_new .img_blog_new {
        width: 100px;
        height: 80px;
    }
    .blog_new .info_blog_new {
        width: calc(100% - 110px);
    }
    .blog_new .info_blog_new p {
        max-height: 45px;
        margin-bottom: 5px;
        font-size: 14px;
        line-height: 20px;
    }
    .blog_new .info_blog_new p strong {
        font-size: 16px;
        line-height: 20px;
    }
    .faqs .title_faqs h4 {
        font-size: 18px;
        line-height: 22px;
    }
    .faqs .title_faqs::before {
        width: 20px;
        height: 20px;
    }
    .faqs .title_faqs.open::before {
        height: 2px;
    }
    .faqs .title_faqs {
        padding: 20px 50px 20px 0;
    }
    .faqs .content_faqs {
        padding: 0 0 10px;
    }
    .faqs .content_faqs .content p,
    .faqs .content_faqs .content ul li,
    .faqs .content_faqs .content ul li p,
    .faqs .content_faqs .content {
        font-size: 14px;
        line-height: 20px;
    }
    .title .icon_partner {
        width: 64px;
        height: 40px;
    }
    .partner img {
        height: 60px;
    }
    .title_register p {
        font-size: 30px;
        line-height: 40px;
    }
    .form_register form input {
        width: calc(100% - 130px);
        height: 40px;
        font-size: 14px;
        padding: 0 20px;
    }
    .form_register form button {
        height: 40px;
        width: 120px;
        font-size: 14px;
    }
    .form_register {
        width: 500px;
    }
    .logo_footer img {
        height: 60px;
    }
    .logo_footer strong {
        left: 90px;
        font-size: 20px;
        line-height: 30px;
        color: #FFFFFF;
    }
    .social ul {
        padding: 10px 0;
    }
    .contact_footer {
        width: 245px;
        margin-right: 0;
        margin-top: 40px;
    }
    .menu_footer {
        margin-left: 40px;
        margin-top: 40px;
    }
    .title_footer p {
        font-size: 18px;
        margin: 0 0 15px;
    }
    .banner_page {
        margin-top: 100px;
    }
    .caption_banner_page {
        bottom: 20px;
    }
    .caption_banner_page p {
        font-size: 40px;
        line-height: 40px;
    }
    .administrators,
    .infrastructure,
    .educational_philosophy,
    .school_overview {
        padding-top: 100px;
    }
    #content_about {
        padding: 0 0 80px;
    }
    .img_infrastructure {
        width: 25%;
    }
    .list_administrators {
        max-height: 260px;
    }
    .administrator {
        padding: 20px 0;
    }
    .administrators .content_about {
        width: 50%;
    }
    .administrator .name_admin {
        width: 40%;
    }
    .administrator .name_admin strong {
        font-size: 18px;
        line-height: 24px;
    }
    .administrator .possition_admin span {
        font-size: 16px;
        line-height: 22px;
    }
    .administrator .phone_admin {
        width: 35%;
    }
    .administrator .phone_admin a {
        font-size: 18px;
        line-height: 22px;
    }
    .administrator .phone_admin a::before {
        width: 14px;
        height: 14px;
    }
    .menu_tab ul li a {
        font-size: 14px;
        line-height: 14px;
        padding: 12px 25px;
    }
    #content,
    .section_register_admissions {
        padding: 60px 0;
    }
    #content_admissions {
        padding:  0;
    }
    .form_textarea label,
    .form_input label {
        font-size: 14px;
        line-height: 20px;
    }
    .form_textarea input,
    .form_input input {
        height: 40px;
    }
    .form_button button {
        padding: 0 25px;
        height: 40px;
        font-size: 14px;
        line-height: 24px;
    }
    .form_button button .icon_check {
        padding-left: 20px;
    }
    .form_button button .icon_check::before {
        width: 14px;
        height: 12.44px;
    }
    .list_subjects {
        width: 250px;
    }
    .title_list_subjects {
        padding: 15px 20px;
    }
    .title_list_subjects p {
        font-size: 18px;
        line-height: 20px;
    }
    .title_list_subjects p i.icon_category {
        padding-left: 30px;
    }
    .title_list_subjects p i.icon_category::before {
        width: 19.5px;
        height: 15px;
    }
    .list_subjects ul {
        padding: 0 20px;
    }
    .list_subjects ul li {
        padding: 10px 0;
    }
    .list_subjects ul li a {
        font-size: 16px;
        line-height: 20px;
    }
    .list_subjects ul li i.icon_more_category {
        width: 20px;
        height: 40px;
    }
    .list_subjects ul li i.icon_more_category::before {
        width: 12px;
        height: 8px;
    }
    .list_subjects ul li ul.active {
        padding: 15px 20px 0px;
    }
    .list_subjects ul li.active::before {
        height: 40px;
        width: calc(100% + 40px);
        left: -20px;
    }
    .list_subjects ul li ul li {
        padding: 5px 0;
    }
    .list_subjects ul li ul li a {
        font-size: 14px;
        line-height: 20px;
    }
    .list_file_outline {
        width: calc(100% - 280px);
    }
    .file_outline {
        padding: 0 0 15px;
    }
    .file_outline+.file_outline {
        padding: 15px 0;
    }
    .file_outline .img_file_outline {
        width: 80px;
        height: 80px;
    }
    .file_outline .info_file_outline p strong {
        font-size: 16px;
        line-height: 20px;
    }
    .file_outline .info_file_outline p {
        font-size: 14px;
        line-height: 20px;
    }
    .file_outline .info_file_outline {
        padding: 0 15px;
        width: calc(100% - 200px);
    }
    .file_outline .more_download {
        width: 100%;
        clear: both;
        text-align: right;
    }
    .file_outline .more_download strong {
        width: 110px;
        float: right;
        overflow: hidden;
        font-size: 14px;
        line-height: 20px;
        padding: 8px 20px;
    }
    .menu_tab ul li+li {
        margin-left: 10px;
    }
    .blog {
        padding-top: 0;
    }
    .blog .img_blog {
        width: 200px;
        height: 150px;
    }
    .blog .info_blog {
        height: 150px;
        width: calc(100% - 215px);
    }
    .blog .info_blog p {
        font-size: 14px;
        line-height: 20px;
        max-height: 60px;
        overflow: hidden;
    }
    .blog .info_blog p strong {
        font-size: 16px;
        line-height: 20px;
    }
    .title_other h2 {
        position: relative;
        margin: 0 0 15px;
        padding-bottom: 5px;
        font-size: 22px;
        line-height: 30px;
    }
    .list_blog {
        padding-top: 20px;
        width: calc(100% - 330px);
    }
    .blog_other {
        margin-top: 15px;
        width: 300px;
    }
    .blog_other .blog_hot .info_blog_hot {
        padding: 10px 0;
    }
    .blog_other .blog_hot .info_blog_hot p strong {
        font-size: 14px;
        line-height: 20px;
    }
    .swiper-button-next,
    .swiper-button-prev {
        width: 35px;
        height: 35px;
    }
    #breadcrumb {
        margin-top: 100px;
        padding: 30px 0 20px;
    }
    .blog_related.blog_other {
        margin-top: 40px;
    }
    .share strong {
        font-size: 16px;
    }
    #content_detail {
        padding: 0 0 40px;
    }
    .list_album_images {
        padding: 0;
    }
    .album_image .info_album p {
        margin: 5px 0 0;
        max-height: 42px;
        font-size: 14px;
        line-height: 20px;
    }
    .album_image .info_album p strong {
        font-size: 16px;
        line-height: 20px;
    }
    .album_image .info_album {
        height: 70px;
        margin-top: 5px;
        position: relative;
        clear: both;
    }
    .head_recruitment {
        height: 50px;
    }
    .head_recruitment div {
        padding: 15px 10px;
    }
    .recruitment div strong,
    .head_recruitment div strong {
        font-size: 16px;
        line-height: 20px;
    }
    .recruitment div.num_order,
    .head_recruitment div.num_order {
        width: 60px;
    }
    .recruitment div.quantity,
    .head_recruitment div.quantity {
        width: 100px;
    }
    .recruitment div.deadline,
    .head_recruitment div.deadline,
    .head_recruitment div.apply {
        width: 120px;
    }
    .recruitment div.position,
    .head_recruitment div.position {
        width: calc(100% - 400px);
    }
    .recruitment div {
        min-height: 40px;
        text-align: center;
        position: relative;
        width: auto;
        float: left;
        padding: 10px 10px;
    }
    .recruitment div.apply {
        width: 200px;
        height: 71px;
        padding: 15px 10px;
    }
    .recruitment div.apply {
        width: 120px;
        height: 42px;
        padding: 10px 10px;
    }
    .recruitment div.apply strong {
        font-size: 12px;
        line-height: 12px;
        padding: 10px 20px;
    }
    .recruitment div.content_recruitment .content {
        padding: 20px 60px;
    }
    .recruitment div.content_recruitment .content strong {
        font-size: 16px;
    }
    .table_recruitment {
        margin-top: 15px;
    }
    .info_contact ul li a {
        font-size: 14px;
        line-height: 20px;
    }
    .info_contact ul li a strong {
        font-size: 18px;
    }
    .info_contact ul li.phone a span {
        font-size: 24px;
        line-height: 24px;
    }
    .info_contact ul li {
        padding: 0 0 20px 60px;
    }
    .form_button,
    .form_input,
    .form_textarea {
        padding-top: 15px;
    }
    .googlamap {
        margin-top: 30px;
        height: 350px;
    }
    .swiper-pagination {
        right: 15px;
    }
    .content div {
        position: relative;
        width: 100%;
        overflow-x: auto;
    }
    .content table {
        width: 1000px !important;
        max-width: 1000px !important;
    }
    .content div::-webkit-scrollbar-thumb {
        border-radius: 0;
        background-color: #FF8303;
        height: 5px;
        border: 0;
    }
    .content div::-webkit-scrollbar-track {
        border-radius: 0;
        background-color: rgba(240, 244, 252, 0.5);
        height: 5px;
        width: 100%;
        border: 0;
    }
    .content div::-webkit-scrollbar {
        border-radius: 0;
        height: 5px;
        width: 100%;
        border: 0;
        background-color: rgba(240, 244, 252, 0.5);
    }
    footer::before {
        width: 440px;
        height: 341px;
    }
    .school_overview .img_about.fixed {
        position: relative;
    }
    .educational_philosophy .img_about.fixed {
        position: relative;
    }
    .list_subjects.fixed {
        position: fixed;
        left: calc(50% - 500px);
        top: 140px;
    }
    .slider_blog_hot .blog_hot .img_blog_hot img {
        height: 365px;
    }
    .blog_other .blog_hot .img_blog_hot img{
        height: 200px;
    }
    .list_blog_search .blog_hot .info_blog_hot{
        height: auto;
    }
    .list_blog_search .blog_hot .info_blog_hot p{
        max-height: 40px;
        overflow: hidden;
    }
    .menu_sub_admissions{
        display: none;
        opacity: 0;
        width: 100%;
        height: 100%;
        background: #FFFFFF;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 999;
    }
    .menu_sub_admissions.open{
        display: block;
        opacity: 1; 
    }
    header.header_lock{
        top: -100px;
    }
    .filter_subjects.filter_admissions {
        display: block;
        opacity: 1;    
        width: 230px;
        left: 0;
    }
    .filter_subjects.filter_admissions.fixed{
        top: auto;
        bottom: 30px;
    }
    .content_admissions{
        padding: 100px 0 0;
    }
    .menu_sub_admissions.open{
        position: fixed;
        opacity: 1;
        display: block;
        z-index: 999999;
    }
    .close_filter{
        display: block;
        opacity: 1;
    }
    .menu_sub_admissions ul{
        padding: 60px 0;
        width: 100%;
        display: block; 
        text-align: left;
        }
    .menu_sub_admissions ul li{
        text-align: left;
        border: 0 !important;
        width: 100%;
        clear: both;
        position: relative;
        float: none;
    }
    .menu_sub_admissions ul li a{
        text-align: left;
        text-transform: uppercase;
    }
    .menu_sub_admissions ul li.active a, 
    .menu_sub_admissions ul li:hover a{
        background: none;
        color: #FF8303;
    }
    .close_filter.close_filter_admissions{
        display: block;
        opacity: 1;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: auto;
        background: #123174 ;
        filter: none;
        padding: 10px 20px;
        z-index: 999;
    }
    .close_filter.close_filter_admissions::before{
        content: '';
        position: absolute;
        top: 12px;
        right: 15px;
        width: 24px;
        height: 24px;
        background: url(../images/close.svg) no-repeat;
        background-position: right center;
        background-size: cover;
        filter: brightness(0) invert(1);
    }
    .close_filter.close_filter_admissions p {
    
        margin: 0;
        position: relative;
        font-family: 'Lora', sans-serif;
        font-weight: 700;
        font-size: 20px;
        line-height: 30px;
        color: #FFFFFF;
    }

    .close_filter.close_filter_admissions p i.icon_category {
        position: relative;
        padding-left: 35px;
    }

    .close_filter.close_filter_admissions p i.icon_category::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        margin: auto 0;
        width: 26px;
        height: 20px;
        background: url(../images/category.svg) no-repeat;
        background-size: cover;
        background-position: center;
    }
}

@media all and (max-width: 1029px) {
    .container {
        width: 860px;
    }
    .list_whychoose {
        max-width: 540px;
        margin: 0 auto;
    }
    .whychoose {
        width: 50%;
    }
    .list_blog_hot {
        width: 100%;
        float: none;
        clear: both;
    }
    .list_blog_new {
        height: auto;
        margin-top: 40px;
        position: relative;
        width: 100%;
        clear: both;
        float: none;
    }
    .blog_new {
        padding: 10px 0;
    }
    .slider_blog_new {
        height: auto;
        padding-bottom: 10px;
    }
    .slider_blog_new .swiper-slide {
        width: 33.33%;
        margin-right: 20px;
    }
    .slider_blog_hot .blog_hot .img_blog_hot img{
        height: 340px;
    }
    .blog_new .img_blog_new {
        width: 100%;
        height: 180px;
    }
    .blog_new .info_blog_new {
        width: 100%;
        height: auto;
        clear: both;
        margin-top: 10px;
    }
    .title_footer p {
        font-size: 16px;
        margin: 0 0 10px;
    }
    .menu_footer ul li a,
    .info_contact_footer li a {
        font-size: 14px;
        line-height: 20px;
    }
    .form_register {
        width: 450px;
    }
    .contact_footer {
        width: 220px;
    }
    .menu_footer {
        margin-left: 30px;
    }
    .coppyright a,
    .coppyright p {
        margin: 0;
        font-size: 14px;
        line-height: 20px;
    }
    .administrators .img_about,
    .img_about {
        margin-top: 30px;
        width: 100%;
        clear: both;
        position: relative;
    }
    .administrators .content_about,
    .content_about {
        margin: 0;
        width: 100%;
        clear: both;
        position: relative;
    }
    .administrator {
        padding: 15px 0;
    }
    .img_infrastructure {
        width: 33.33%;
    }
    .close_popup {
        background-size: 25px 25px;
        background-position: top 10px right 15px;
    }
    .content_popup {
        border-radius: 20px;
        padding: 40px 20px 40px 40px;
    }
    .content_popup .list_image,
    .content_popup .content {
        padding-right: 10px;
    }
    .img_register_admissions {
        width: 100%;
        margin-top: 40px;
    }
    .form_register_admissions {
        width: 100%;
    }
    footer::before {
        width: 400px;
        height: 310px;
    }
    .school_overview .content_about .content {
        max-height: 275px;
    }
    .educational_philosophy .content_about .content {
        max-height: 265px;
    }
    .content_about .content.show {
        max-height: 100%;
    }
    .list_image {
        padding: 5px;
    }
    .list_image .image {
        width: 33.33%;
        padding: 5px;
    }
    .more_comeback a i.icon_back::before {
        width: 14px;
        height: 10.5px;
        left: 0px;
    }
    .list_subjects.fixed {
        position: fixed;
        left: calc(50% - 430px);
        top: 130px;
    }
    .blog_other .blog_hot .img_blog_hot img{
        height: 200px;
    }
    .album_image .img_album img{
        height: 200px;
    }
    .slider_review .swiper-slide{
        width: 50%;
    }
}

@media all and (max-width: 889px) {
    .container {
        width: 720px;
    }
    .title h1,
    .title h2,
    .title h3 {
        font-size: 26px;
        line-height: 32px;
        margin-bottom: 15px;
    }
    .logo_footer img {
        height: 45px;
    }
    .logo_footer strong {
        left: 70px;
        font-size: 14px;
        line-height: 24px;
    }
    .slider_blog_new .swiper-slide {
        width: 50%;
    }
    .slider_partner .swiper-slide {
        width: 25%;
    }
    .title_register p {
        font-size: 20px;
    }
    .contact_footer {
        width: 320px;
        margin-right: 30px;
    }
    .menu_footer {
        margin-left: 0;
        margin-right: 100px;
    }
    .list_subjects {
        display: none;
        opacity: 0;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: 0 auto;
        background: #FFFFFF;
        width: 100%;
        height: 100%;
        z-index: 9999;
        border-radius: 0;
        overflow-y: auto;
    }
    .list_subjects.open {
        display: block;
        opacity: 1;
    }
    .list_subjects.open .title_list_subjects {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 99;
    }
    .list_subjects.open ul {
        margin-top: 49px;
        max-height: max-content;
        overflow: auto;
    }
    .list_subjects.open::-webkit-scrollbar-thumb {
        border-radius: 0;
        background-color: #FF8303;
        width: 5px;
        border: 0;
    }
    .list_subjects.open::-webkit-scrollbar-track {
        border-radius: 0;
        background-color: rgba(240, 244, 252, 0.5);
        width: 5px;
        height: 100%;
        border: 0;
    }
    .list_subjects.open::-webkit-scrollbar {
        border-radius: 0;
        width: 5px;
        height: 100%;
        border: 0;
        background-color: rgba(240, 244, 252, 0.5);
    }
    .list_subjects.open ul li ul {
        margin: 0;
    }
    .close_filter {
        z-index: 99;
        display: block;
        opacity: 1;
        width: 50px;
        height: 50px;
        background: url(../images/close.svg) no-repeat;
        filter: brightness(0) invert(1);
        background-size: 24px 24px;
        background-position: center;
        position: fixed;
        top: 0;
        right: 0;
    }
    .list_file_outline {
        width: 100%;
    }
    .caption_banner_page {
        bottom: 10px;
    }
    .caption_banner_page p {
        font-size: 30px;
        line-height: 30px;
    }
    .list_blog {
        width: 100%;
    }
    .blog_other {
        width: 100%;
        margin-top: 30px;
    }
    .blog_other .slider_blog_hot .swiper-slide {
        width: 50%;
        padding: 0;
        margin-right: 20px;
        float: left;
    }
    .album_image,
    .slider_blog_related .swiper-slide {
        width: 50%;
    }
    .blog_other .slider_blog_hot .swiper-button-next,
    .swiper-container-rtl .swiper-button-prev,
    .blog_other .slider_blog_hot .swiper-button-prev,
    .swiper-container-rtl .swiper-button-next {
        top: 30%;
        bottom: auto;
    }
    .section_form_register {
        padding: 40px 0;
    }
    .content_popup .info_album p {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 15px;
    }
    .form_register_recruitment {
        margin: 0;
        width: 100%;
        border-radius: 0;
        padding: 30px;
    }
    #popup-register-recruitment .close_popup {
        width: 25px;
        height: 25px;
        z-index: 9999;
        left: auto;
        bottom: auto;
        right: 10px;
        top: 10px;
        filter: none;
        background-size: cover;
        background-position: center;
    }
    .form_file {
        margin-top: 15px;
    }
    .form_file label {
        line-height: 14px;
        font-size: 14px;
    }
    .form_register_recruitment .form_button {
        bottom: 25px;
    }
    .form_file input[type=file] {
        font-size: 14px;
        height: 30px;
        line-height: 30px;
    }
    .form_contact {
        margin-top: 30px;
    }
    .info_contact,
    .form_contact {
        width: 100%;
        clear: both;
        position: relative;
        float: none;
    }
    .info_contact ul {
        padding: 0;
    }
    .info_contact ul li a strong {
        font-size: 16px;
        line-height: 24spx;
    }
    .info_contact ul li {
        padding: 0 0 15px 50px;
        background-size: 40px 40px !important;
    }
    footer::before {
        width: 360px;
        height: 279px;
    }
    .filter_subjects {
        display: block;
        opacity: 1;
    }
    .menu_tab.open{
       opacity: 1;
       display: block;
    }
    .school_overview .content_about .content {
        max-height: 325px;
    }
    .educational_philosophy .content_about .content {
        max-height: 285px;
    }
    .content_about .content.show {
        max-height: 100%;
    }
    .list_image .image {
        width: 50%;
    }
    .blog_other .blog_hot .img_blog_hot img{
        height: 260px;
    }
    .album_image .img_album img{
        height: 240px;
    }
    .list_blog_search .blog_hot{
        width: 50%;
    }
    .menu_tab{
        display: none;
        opacity: 0;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        background: #FFFFFF;
        z-index: 9999;
    }
    .menu_tab ul{
        padding: 60px 0;
        width: 100%;
        position: relative;
        overflow: hidden;
    }
    .menu_tab ul li{
        padding: 0;
        width: 100%;
        float: none;
        clear: both;
        text-align: left;
    }
    .menu_tab ul li a{
        width: 100%;
        display: block;
        background: none;
        border-radius: 0;
        text-transform: uppercase; 
        text-align: left;
        font-size: 16px;
    }
    .menu_tab ul li+li{
        margin: 0;
    }
    .menu_tab ul li:hover a,
    .menu_tab ul li.active a{
        background: none;
        color: #FF8303;
        text-align: left;
    }
    .close_filter.close_filter_blog{
        display: block;
        opacity: 1;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: auto;
        background: #123174 ;
        filter: none;
        padding: 10px 20px;
    }
    .close_filter.close_filter_blog::before{
        content: '';
        position: absolute;
        top: 12px;
        right: 15px;
        width: 24px;
        height: 24px;
        background: url(../images/close.svg) no-repeat;
        background-position: right center;
        background-size: cover;
        filter: brightness(0) invert(1);
    }
    .close_filter.close_filter_blog p {
    
        margin: 0;
        position: relative;
        font-family: 'Lora', sans-serif;
        font-weight: 700;
        font-size: 20px;
        line-height: 30px;
        color: #FFFFFF;
    }

    .close_filter.close_filter_blog p i.icon_category {
        position: relative;
        padding-left: 35px;
    }

    .close_filter.close_filter_blog p i.icon_category::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        margin: auto 0;
        width: 26px;
        height: 20px;
        background: url(../images/category.svg) no-repeat;
        background-size: cover;
        background-position: center;
    }
}

@media all and (max-width: 749px) {
    .container {
        width: 560px;
    }
    .info_album p {
        font-size: 14px;
        margin: 0;
    }
    .slider_home {
        display: none;
        opacity: 0;
    }
    .slider_home_mobile {
        display: block;
        opacity: 1;
    }
    .review .info_review p {
        margin: 0;
    }
    .slider_review .swiper-slide {
        width: 100%;
    }
    .faqs .title_faqs h4,
    .blog_hot .info_blog_hot p strong {
        font-size: 16px;
    }
    .title h1,
    .title h2,
    .title h3 {
        font-size: 24px;
        line-height: 30px;
        margin-bottom: 10px;
    }
    .title .icon_partner {
        width: 48px;
        height: 30px;
    }
    .partner img {
        height: 50px;
    }
    .faqs .title_faqs::before {
        width: 15px;
        height: 15px;
    }
    .faqs .title_faqs.open::before {
        height: 1.5px;
    }
    .title_register {
        width: 100%;
        float: none;
    }
    .title_register p {
        font-size: 26px;
        line-height: 26px;
    }
    .form_register {
        margin-top: 20px;
        width: 100%;
        clear: both;
    }
    .contact_footer {
        width: 100%;
        margin-top: 30px;
    }
    .social ul {
        padding: 0;
    }
    .menu_footer {
        width: max-content;
        margin-left: 0;
        margin-right: 50px;
        margin-top: 30px;
    }
    .coppyright a,
    .coppyright p {
        margin-bottom: 5px;
        width: 100%;
        clear: both;
        float: none;
        text-align: left;
    }
    .img_infrastructure {
        width: 50%;
    }
    .content_popup {
        border-radius: 20px;
        padding: 30px 20px 30px 30px;
        height: 90%;
    }
    .recruitment div.quantity,
    .head_recruitment div.quantity {
        display: none;
    }
    .recruitment div.position,
    .head_recruitment div.position {
        width: calc(100% - 300px);
    }
    .form_textarea input,
    .form_input input {
        font-size: 14px;
    }
    footer::before {
        width: 320px;
        height: 248px;
        right: 0;
        top: 10%;
        left: auto;
        bottom: auto;
    }
    .file_outline .more_download strong i.icon_download::before {
        width: 14px;
        height: 14px;
    }
    .school_overview .content_about .content {
        max-height: 395px;
    }
    .educational_philosophy .content_about .content {
        max-height: 330px;
    }
    .content_about .content.show {
        max-height: 100%;
    }
    .pagination_subpage.right {
        margin-top: 10px;
    }
    .blog_other .blog_hot .img_blog_hot img{
        height: 200px;
    }
    .album_image .img_album img{
        height: 200px;
    }
}

@media all and (max-width: 589px) {
    .container {
        width: 430px;
    }
    .blog_hot .info_blog_hot p strong {
        font-size: 14px;
    }
    .slider_blog_new .swiper-slide {
        width: 280px;
    }
    .slider_partner .swiper-slide {
        width: 33.33%;
    }
    .whychoose .info_whychoose .text_whychoose h3 {
        font-size: 14px;
        line-height: 20px;
    }
    .administrator .possition_admin {
        width: 30%;
    }
    .form_input {
        width: 100%;
    }
    .list_whychoose {
        width: 100%;
    }
    .file_outline .info_file_outline {
        padding: 0;
        padding-left: 10px;
        width: calc(100% - 80px);
    }
    .caption_banner_page p {
        font-size: 28px;
        line-height: 28px;
    }
    .file_outline .info_file_outline p strong {
        font-size: 15px;
    }
    .blog .img_blog {
        width: 150px;
        height: 100px;
    }
    .blog .info_blog {
        height: 100px;
        width: calc(100% - 160px);
    }
    .blog .info_blog p {
        margin-bottom: 2px;
        font-size: 14px;
        line-height: 18px;
        max-height: 40px;
        overflow: hidden;
    }
    .pagination_subpage {
        margin-top: 10px;
    }
    .page-link {
        width: 34px;
        height: 34px;
        font-size: 14px;
        line-height: 34px;
    }
    .page-link.page-right::before,
    .page-link.page-left::before {
        width: 6px;
        height: 10px;
    }
    .breadcrumb-item a {
        font-size: 14px;
    }
    .date_post p {
        font-size: 14px;
    }
    .album_image {
        width: 100%;
        padding: 10px;
    }
    .slider_blog_related .swiper-slide {
        width: 280px;
    }
    .album_image .info_album {
        height: auto;
    }
    .blog_hot .info_blog_hot p {
        max-height: 45px;
        overflow: hidden;
    }
    .swiper-button-next,
    .swiper-button-prev {
        width: 30px;
        height: 30px;
    }
    .image_banner_page {
        height: 150px;
    }
    .administrator .name_admin {
        width: 100%;
        text-align: left;
    }
    .administrator .phone_admin {
        width: 50%;
        float: left;
        text-align: right;
    }
    .administrator .possition_admin {
        width: 50%;
        text-align: left;
        padding: 5px 0;
    }
    .list_administrators {
        max-height: 425px;
    }
    .administrators .content_about .title {
        text-align: center;
    }
    .blog_other .slider_blog_hot .swiper-slide {
        width: 280px;
    }
    .form_file {
        width: 100%;
    }
    .form_register_recruitment .form_button {
        bottom: 0;
        position: relative;
        clear: both;
        width: 100%;
        text-align: left;
        left: 0;
        right: 0;
    }
    footer::before {
        width: 280px;
        height: 217px;
        right: 0;
        top: auto;
        left: auto;
        bottom: 120px;
    }
    .blog_new .info_blog_new p {
        max-height: 40px;
    }
    .blog_new .info_blog_new p strong {
        font-size: 14px;
    }
    .school_overview .content_about .content {
        max-height: 515px;
    }
    .educational_philosophy .content_about .content {
        max-height: 430px;
    }
    .content_about .content.show {
        max-height: 100%;
    }
    .recruitment div.deadline,
    .head_recruitment div.deadline,
    .head_recruitment div.apply {
        display: none;
    }
    .recruitment div.apply {
        border: 0;
        position: absolute;
        bottom: 20px;
        left: 0;
        opacity: 0;
        display: none;
    }
    .recruitment.open div.apply {
        opacity: 1;
        display: block;
    }
    .recruitment div.position,
    .head_recruitment div.position {
        width: calc(100% - 60px);
    }
    .recruitment div.content_recruitment .content {
        padding: 15px 10px 60px;
    }

    .slider_blog_hot .blog_hot .img_blog_hot img{
        height: 300px;
    }
    .img_infrastructure img{
        height: 150px;
    }
    .blog_other .blog_hot .img_blog_hot img{
        height: 200px;
    }
    .album_image .img_album img{
        height: auto;
    }
    .list_blog_search .blog_hot{
        width: 100%;
    }
    .blog_other .blog_hot .img_blog_hot img {
        height: auto;
        max-height: 300px;
    }
}

@media all and (max-width: 459px) {
    .container {
        width: calc(100% - 30px);
    }
    .whychoose {
        padding: 5px;
    }
    .whychoose .info_whychoose {
        padding: 15px 20px;
    }
    .whychoose .info_whychoose .text_whychoose h3 {
        font-size: 13px;
    }
    .whychoose .info_whychoose .text_whychoose p {
        font-size: 12px;
    }
    .whychoose .info_whychoose .icon_whychoose img {
        height: 30px;
    }
    .logo_footer {
        width: 100%;
        text-align: center;
        clear: both;
        float: none;
    }
    .logo_footer img {
        position: relative;
        display: block;
        margin: 0 auto 10px;
        width: auto;
        height: 70px;
    }
    .logo_footer strong {
        left: 0;
        right: 0;
        margin: 0 auto;
        text-align: center;
        clear: both;
        position: relative;
        font-size: 20px;
        line-height: 30px;
    }
    .social {
        clear: both;
        padding-top: 20px;
        width: 100%;
        float: none;
        text-align: center;
    }
    .social ul li {
        text-align: center;
        margin: 0 5px
    }
    .blog .info_blog,
    .blog .img_blog {
        width: 100%;
        height: auto;
    }
    .blog .info_blog {
        padding: 10px 0 0;
    }
    .blog .info_blog p {
        margin-bottom: 5px;
        font-size: 14px;
        line-height: 20px;
        max-height: 60px;
    }
    .recruitment div.content_recruitment .content strong,
    .content ul li,
    .content ul li span,
    .content p {
        font-size: 14px;
        line-height: 22px;
    }
    .school_overview .content_about .content {
        max-height: 405px;
    }
    .educational_philosophy .content_about .content {
        max-height: 400px;
    }
    .content_about .content.show {
        max-height: 100%;
    }
    .recruitment div strong,
    .head_recruitment div strong {
        font-size: 14px;
        line-height: 20px;
    }

    .slider_blog_hot .blog_hot .img_blog_hot img{
        height: 260px;
    }
    .img_infrastructure img{
        height: 130px;
    }
    .blog_other .blog_hot .img_blog_hot img{
        height: 200px;
    }
}

@media all and (max-width: 390px) {
    .whychoose .info_whychoose .text_whychoose h3 {
        margin: 5px 0 0;
    }
    .review .info_review p strong {
        font-size: 14px;
    }
    .review .info_review .rating {
        margin: 3px 0;
    }
    .educational_philosophy .content_about .content {
        max-height: 390px;
    }
    .img_infrastructure img{
        height: 100px;
    }
    .blog_other .blog_hot .img_blog_hot img{
        height: 200px;
    }
}