/* Responsive */

@media (max-width: 1200px){
    .slide-info .wrap-content{min-width: unset;}  
    .slide-name {font-size: 55px;}
    .slide-content {font-size: 35px;}
    .views-more-slide span{font-size: 14px;}
    .bgswiper .swiper-button-prev{left: -15px;}
    .bgswiper .swiper-button-next{right: -15px;} 

    .breadCrumbs .wrap-ser-b {margin-bottom: 20px;}
      
    .title-aboutus {margin-bottom: 0;}
    .title-aboutus::before {display: none;}

    .feedback {width: 80%;}

    
   /* pricing */ 
    .title-main.title-pricing{margin-bottom: 1.5rem;}
    .title-main.title-pricing .slogan{color: var(--text2);width: 100%;} 
    .bgpricing{width: 100%;}
    .pricing{padding: 0 30px;width: 50%;}  


    .btn__main span{font-size: 14px;}
}
@media (max-width: 1024px){
    #hamburger { display: block; } 
    .mb-none { display: none !important; }  
    .mb-block { display: block !important; } 
    .menu-res { display: block !important; } 
    /* .header { padding: 10px 0px; } 
    .logo-header { margin-bottom: 0; padding: 0;}   */
    .header{height: auto;position: unset;background: black;padding: 5px 0;}
    .header-top{display: block;}
    .hotline-header{width: fit-content;margin-left: auto;}
    .hotline-header p{color: white;font-size: 15px;line-height: 1.25;text-transform: uppercase;font-weight: 500;margin-bottom: 0;}
    .hotline-header span{display: block; font-size: 12px;font-family: var(--title); color: white;line-height: 1.25;} 

    .scrollToTop { bottom: 80px; right: 10px; } 
    .footer1-news,.footer2-news ,.footer3-news{width: calc(100% / 3 - 10px);}
    footer { margin-bottom: 50px; }   


    .aboutus-right{width: calc(55% - 10px);} 

    /* pricing */ 
    .pricing-list{font-size: 20px;}
}
@media (max-width: 850px){
    /* .footer-news, .image-fanpage { text-align: left !important; }  */
    .mgb-res{ margin-bottom: 30px; }
    .title-main h1,.title-main h2,.title-main span { font-size: 30px;}
    .title-detail h1,.title-detail h2,.title-detail span { font-size: 30px;} 
    .breadCrumbs .wrap-ser-b {aspect-ratio: 9/6;margin-bottom: 1rem;}
    /* slide */
    .slide-name {font-size: 35px;}
    .slide-content {font-size: 25px;}

    /* giới thiệu */
    /* Aboutus */ 
    .aboutus-left{width: 100%;margin-bottom: 30px;} 
    /* .image-aboutus {position: relative;max-width: 310px;margin-bottom: 20px;}   */
    .aboutus-right{width: 100%;} 

    /* tuyển dụng */
    /* tin tức */
    .grid-news { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }  

    /* sản phẩm */
    .grid-product { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; } 

    /* đăng ký nhận tin */
    .section-newsletter { padding: 30px 20px; } 

    /* footer */
    .wrap-instagram .title-main h2{font-size: 50px;}
}
@media (max-width: 768px) { 
    .title-main h1, .title-main h2, .title-main span,.title-detail h1, .title-detail h2, .title-detail span {font-size: 25px;}
    .bg-hotline-header{width: 50%;}
    .footer1-news{width: 100%;}
    .footer2-news ,.footer3-news{width: calc(100% / 2 - 10px);}
    .views-more-slide {display: none;}
    .title-orther .slogan {width: 100%;}
    .feedback {width: 100%;}

    .feedback h3 {line-height: 1.25;font-size: 18px;}
    .feedback p {line-height: 1.25;font-size: 14px;}
    .feedback span {font-size: 14px;line-height: 1.25;} 
    .feedback .line{margin: 10px 0;}

    .wrap-instagram .title-main h2{font-size: 40px;}

    .breadcrumb-item {font-size: 25px;}

    .pricing {padding: 0 20px; }

} 
@media (max-width: 700px){
    .title-main h1, .title-main h2, .title-main span,.title-detail h1, .title-detail h2, .title-detail span {font-size: 20px;}
    .title-main.title-pricing .decor {width: calc(101px / 2);height: calc(111px / 2);}
    
    .breadcrumb-item {font-size: 20px;}

    .bgpricing::before{display: none;}
    .pricing {padding: 0;width: 100%;}
    .pricing-list {font-size: 18px;margin-bottom: 12px;}
    .pricing-item{font-size: 15px;padding-bottom: 10px;margin-bottom: 10px;}
    .pricing-item:last-child:after{border-bottom: 1px solid var(--line);bottom:-1px;}

    .grid-product { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; } 

    .image-aboutus{max-width: 100%;}

    .title-main .slogan {font-size: 15px;}
    .wrap-instagram .title-main h2 {font-size: 30px;}

    /* slide */
    .slide-name {font-size: 20px;}
    .slide-content {font-size: 16px;}
  
    .footer2-news ,.footer3-news{width: 100%;}


    .wrap-portfolio .title-main .slogan {font-size: 25px;}
}
@media (max-width: 369px) { }