
.container{
    margin: auto;
    max-width: 100%;
    padding: 0 10px;
}

@media screen and (min-width: 576px){
    .container{
        max-width: 540px;
    }

}

@media screen and (min-width: 768px){
    .container{
        max-width: 720px;
    }
}


@media screen and (min-width: 992px){
    .container{
        max-width: 960px;
    }


}

@media screen and (min-width: 1200px){
    .container{
        max-width: 1140px;
    }
}

@media screen and (min-width: 1400px){
    .container{
        max-width: 1320px;
    }
       
}

@media screen and (max-width: 1400px){
    .banner_context .title{
        font-size: 44px;
    }
    
}

@media screen and (max-width: 1200px){
    .header_hide, .header_fixed{
        display: none;
    }
   
    .nav-mobile{
        display: flex;
    }

    .header_elementor{
        padding: 0;
    }

    .header_search{
        min-width: auto;
        background: none;
        border: none;
    }

    .header_search button{
        background-color: transparent;
        color: #000;
        position: relative;
        right: -12px;
    }

    .logo{
        padding: 6px 0;
        gap: 4px;
    }

    .logo-img {
        width: 60px;
        height: 60px;
    }

    .logo-text h4{
        font-size: 10px;
    }

    .logo-text h2{
        font-size: 24px;
    }

    .banner{
        margin-top: 0;
    }

    .search_option{
        flex-direction: column;
    }

    .search_context{
        width: 100%;
        padding: 0 20px;
        margin-bottom: 14px;
    }

    .search_context::after{
        display: none;
    }

    .search_inner{
        width: 100%;
        padding: 0 20px;
    }

    .ft_elementor{
        flex-direction: column;
    }

    .ft_info{
        width: 100%;
    }

    .ft_redirect{
        width: 100%;
    }

    .intro_elementor{
        flex-direction: column;
    }
    .intro_image, .intro_context{
        width: 100%;
    }
    
    .box-main{
        flex-direction: column;
    }

    .box_register{
        width: 100%;
        justify-content: flex-start;
    }
}

@media screen and (max-width: 992px){

    .box_search{
        padding-left: 0;
    }
    
    .search_context{
        font-size: 14px;
    }

    .search_img{
        display: none;
    }

    .search_option{
        width: 100%;
        padding: 10px 0;
        justify-content: space-between;
    }

    .group-input{
        margin-bottom: 4px;
    }

    .study_program{
        grid-template-columns: repeat(2,1fr);
        gap: 20px;
    }

    .home_news-image img{
        height: 500px;
    }

    .home_news-context{
        display: none;
    }

    .banner_context .subtitle{
        font-size: 14px;
        margin-bottom: 6px;
    }

    .banner_context .title{
        font-size: 26px;
        margin-bottom: 6px;
    }

    .hidden_btn{
        display: none;
    }

    .about_elementor{
        grid-template-columns: repeat(1,1fr);
    }

    .history_item{
        flex-direction: column;
    }
    .history_year, .history_context{
        width: 100%;
    }

    .shape_circle, .shape_line{
        top: 105px;
    }
    
    .teacher_elementor{
        grid-template-columns: repeat(1,1fr);
    }

    .box_teacher{
        flex-direction: column !important;
    }
    .teacher_context, .teacher_image{
        width: 100%;
    }

    .study_details{
        grid-template-columns: 1fr;
    }

    .res_banner .title{
        font-size: 30px !important;
    }

    .box_people-2{
        grid-template-columns: repeat(3,1fr);
    }

    .news_body{
        grid-template-columns: repeat(2,1fr);
    }

    .contact-main{
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .news__details{
        flex-direction: column;
        gap: 10px;
    }

    .menu-social{
        flex-direction: row;
    }

    .news__details-body, .news__details-nav{
        width: 100%;
    }
    
    .container-search{
        padding: 0 14px;
    }
}


@media screen and (max-width: 768px){
    .section{
        padding: 30px 0;
    }
    .home_news-image img{
        height: 350px;
    }


    .ft_middle-inner{
        flex-direction: column;
        gap: 20px;
    }

    .study_box{
        width: 100%;
    }

    .study_details{
        grid-template-columns: 1fr;
    }

    .study_rectangle-head{
        font-size: 26px;
    }

    .study_rectangle{
        padding: 30px 10px;
    }

    .box_people-2{
        grid-template-columns: repeat(2,1fr);
    }

    .banner_context .desc{
        display: none;
    }

    .banner_context .title{
        font-size: 20px !important;
    }

}

@media screen and (max-width: 576px){

    .logo-img{
        width: 48px;
        height: 48px;
    }

    .logo-text h2 {
        font-size: 20px;
    }

    .logo-text h4 {
        font-size: 8px;
    }
    
    .search_lits{
        flex-direction: column;
    }

    .search_age, .search_course, .btn_view-more{
        width: 100%;
    }
    
    .study_program{
        grid-template-columns: repeat(1,1fr);
    }

    .gallery_space{
        position: relative;
        padding: 0;
        margin-bottom: 10px;
    }

    .gallery_space-item{
        border-radius: 20px;
    }

    .clear_space{
        height: 0;
    }

    .context_space{
        padding: 20px;
    }

    .head_space-title{
        font-size: 26px;
    }

    .wrapper_title .title{
        font-size: 26px;
    }

    .teacher_item{
        padding: 24px 14px;
    }

    .head_register{
        font-size: 22px;
    }

    .form_register{
        padding: 20px;
    }

    .header_top-main{
        height: auto;
    }

    .header_top-item{
        font-size: 13px;
        padding: 4px 0;
        display:-webkit-box;
        -webkit-line-clamp:1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        word-break: break-word;
    }

    .home_news-image img {
        height: 250px;
    }

    .ft_redirect{
        grid-template-columns: repeat(1,1fr);
    }

    .ft_middle-inner {
        align-items: flex-start;
    }

    .ft_policy{
        flex-direction: column;
    }

    .ft_policy-link::after{
        display: none;
    }

    .banner_context .title{
        font-size: 20px;
    }

    .banner_context .subtitle{
        font-size: 12px;
    }

    .history_elementor{
        padding: 20px 20px 20px 64px;
    }

    .history_shape {
        left: -60px;
        width: 60px;
    }

    .shape_line{
        width: 24px;
    }

    .teacher_context{
        padding: 30px 20px;
    }

    .study_status{
        gap: 20px;
    }

    .study_status-item{
        width: auto;
        padding: 0;
    }

    .study_status-number{
        font-size: 50px;
    }

    .banner_context .title{
        font-size: 18px !important;
    }

    .box_people-2{
        grid-template-columns: repeat(1,1fr);
    }

    .intro_elementor{
        gap: 20px;
    }
    .intro_context-title{
        font-size: 26px;
    }

    .news_body{
        grid-template-columns: repeat(1,1fr);
    }

    .news__details-name{
        font-size: 26px;
    }
    
    .teacher_name{
        font-size: 18px;
    }
    
    .teacher_desc{
        padding: 16px;
    }
    
    .teacher_avt > img{
        width: 60px;
        height: 60px;
    }
    .teacher_icon{
        width: 40px;
        height: 40px;
        font-size: 18px;
    }
    
    .header_top-text{
        margin-right: 10px;
    }
    
    .header_top-link{
        height: 30px;
        font-size: 11px;
        margin: 4px 0;
    }
    
    .header_top-left{
        width: calc(100% - 152px);
        padding:0;
    }
    
    .header_top-right{
        width: 152px;
        padding:0;
    }
    
    .about_inner-head .title{
        font-size: 28px;
    }
    
    .about_inner-head .icon svg{
        width:60px;
    }
    
    .about_inner{
        padding: 24px;
    }
    
    .about_inner-head{
        margin-bottom: 10px;
    }
    
    .header_top-link img{
        width: 24px;
    }
    
    .box-contact{
        width: 100%;
    }
}


