@charset "utf-8";
@media screen and (min-width: 1910px) { 
    .formhome ul a{ height: 360px }
}

/*@media screen and (min-width: 1430px) { 
.formhome ul a{ height: 300px }
}
@media screen and (min-width: 1366px) { 
.formhome ul a{ height: 270px }
}
@media screen and (min-width: 1356px) { 
.formhome ul a{ height: 207px }
}*/

@media screen and (max-width: 1024px) { 
    .kw_tinmoi li .hinhtin{ height: 165px; overflow: hidden }
    .csschitiet img{ width: auto; height: auto; max-width: 100% }
    .tenvideo{ height: 50px; overflow: hidden }
    .product-baogia a{ height: 300px !important }
    #boxsp li.product > a{ height: 200px }
    #loadmore{ display: none !important }
}

@media screen and (max-width: 980px) { 
    .logo{display:none;}
    .csschitiettam a{ display: inline-block; }
	.thanhtruot{ background: rgba(0, 124, 195,1) }
	.thanhtruot .main{ width: 100% }
	.thanhtruot .main > .logo{ display: none }
    .rcontact{ margin-bottom: 50px!important } 
    .csschitiet{ padding: 5px 5px; margin: 5px  }
	.bx-pager-item{ display: none }
	#boxsp .videos, #boxsp li.product, #video li{ width: 48% }
	#boxsp li.product > a{ height: 275px }
	.rcontact iframe{ max-height: 300px }
	#video li div iframe{ max-height: 285px }
	.tutsdanhmuc{ padding: 0px 5px }
    .tat{ display: block; position: absolute; left: -25px; top: 5px } 
    .tat img{ max-width: 24px }
    .headmobile{ padding: 5px 0; background: #04181F; display: inline-block; width: 100%; position: fixed;top: 0; left: 0; z-index: 99999999}
    .headmobile .logomobi{ width: 50%; float: left; display: block; overflow: hidden; }
    .headmobile .logomobi img{ max-height: 50px }
    .headmobile .clickmenu{ width: 30%; float: right; text-align: right; }
    .headmobile .clickmenu img{ max-height: 40px;  cursor: pointer; margin-right: 15px}
    .leftfix{ display: none; right: 0; left: auto; width: 80%; z-index: 9999; top: 50px; height: auto; opacity: 0 }
    .formcontent{ width: 100% }
    .formhome ul{ height: 200vh; }
    .formhome ul a{ width: 100%; flex: 0 0 11.11% }
    .formhome ul a h3{ display: flex;align-items: end;justify-content: inherit;color: #fff;/* text-shadow: #FFF 0px 0px 5px, #FFF 0px 0px 10px, #FFF 0px 0px 15px, #C69735 0px 0px 20px, #C69735 0px 0px 30px, #C69735 0px 0px 40px, #C69735 0px 0px 50px;*/ font-weight: 900 }
    .height50{ display: block; height: 50px; width: 100% }
    .phone{ width: 175px; background-size: contain;bottom: 10px; }
    .fancybox-container{ z-index: 99999999 }
    .phone img{ max-width: 20px
;
    top: 12px
;
    left: 20px
;}
    .phone p{ height: 32px; font-size: 15px; padding: 9px 10px 0 61px }
    .phone .quick-alo-ph-circle{ width: 80px;height: 80px; left: -10px; top: -19px  }
    .zalo{ width: 175px; background-size: contain; bottom: 10px }
    .zalo img{ right: 17px
;
    top: 9px
;
    max-width: 23px
; }
    .zalo .quick-alo-ph-circle{ width: 80px; height:80px; right: -10px; top: -19px; left: unset; }
    .zalo p{ height: 32px; padding: 9px 50px 0 30px; font-size: 14px; border-radius: 5px 21px 21px 5px  }
    .tinkhac li .motabox{ color: #242423; text-transform: uppercase;box-shadow: 0px 4px 6px rgb(50 50 50 / 32%); border-bottom: 2px solid#ccc; height: 75px }
    h2.ten{ margin-top: 40px }
    #boxsp li.product span{ overflow: hidden; }
    .formhome1 ul a{ width: 100% }
    .hidemb{ display: none; }
    .tintuc2 .motabox{ height: 68px!important }
    #boxsp li.product span{ text-align: left; }
    .hidetc{ display: block; }

@media screen and (max-width: 768px) { 
    .product-baogia a{ height: 200px !important }
    #boxsp li.product > a{ height: 200px }
    #boxsp .videos > div > iframe, #video li div iframe{ max-height: 222px }
    ul.nhanxet li{ width: 100% }
    .footer .info, .footer .mailletter, .lcontact, .rcontact{ width: 100%; margin: 0; padding: 0; margin-bottom: 15px }
    .tagvideo iframe{  }
    .logothuonghieu li > a { display: inline-flex; position: relative; width: 31.33%; height: 125px; margin: 1%; vertical-align: top; text-align: center; outline: 1px solid #eee; background: #fff; color: #fff; align-items: center }
    #boxsp li.product .motabox a{ font-size: 16px }
    .tintuckhac{ margin-bottom: 100px }
    #boxsp li.product .motabox{ height: 48px }
    .footer .mailletter{ display: none }
    .footer .info{ text-align: center }
    .tinkhac li a{width:48%;}
    .tinkhac li > a .hinh img{     width: 100%;
    height: 210px;
    object-fit: cover;}
    .slidevideo li > a {width:48%;}
}
@media screen and (max-width: 640px) { 
    .slogan, .mangxahoi{ padding: 0; text-align: center; display: block; width: 100%; margin: 10px 0px }
    .mangxahoi, .mangxahoi ul{ float: none }
    .product-baogia a, #boxsp li.product > a{ height: 200px !important }
    .product-baogia a, #boxsp li.product > a img{ width: 100%; height: 100%; object-fit: cover; }
    #boxsp .videos > div > iframe, #video li div iframe, #boxsp .videos > div > iframe{ max-height: 175px; min-height: inherit }
    ul.nhanxet li{ margin: 5px 0px }
    .tenvideo a, .motabox a{ font-size: 14px }
    .goimobile{ display: block; z-index: 1000 }
    .hoiinfo{ border-radius: 0; box-shadow: none; border: 1px #fff solid !important }
    .goimobile{ width: 99%; padding: 0.5% }
    .goimobile ul li{ outline: 0px #ccc solid; height: 35px; border: 0px !important; cursor: pointer; display: inline-block !important }
    .setpoppupsanpham{ max-width: 80%; max-height: 80vh; margin-top: -5% }
    .imglist { padding: 0px 5px; column-count: 2 }
    .boxcall, .hoiinfo, .tophead{ display: none }
    .goimobile ul li{width: 49%; margin: 0.5%}
    .setmxh{ display: block }
    .mxhmobile{ display: block; margin-bottom: 25px; margin-top: 10px }
    .goimobile ul li:first-child{ margin-left: 0px; padding: 6px 0; font-size:18px;}
    .goimobile ul li:last-child{ margin-right: 0px }
    .wrap-logothuonghieu{ height: auto !important }
    #boxsp li.product > a:hover h3, .tutsdanhmuc > a{ font-size: 14px }
    .tutsdanhmuc > span a{ display: none }
    .tutsdanhmuc > a{ line-height: 23px }
}
@media screen and (max-width: 480px) { 
#boxsp .videos > div > iframe, #video li div iframe, #boxsp .videos > div > iframe{ max-height: 150px; min-height: inherit }
.tenvideo a, .motabox a{ font-size: 13px }
.tagvideo iframe{  max-width: 100% }
.tutsdanhmuc{ margin-bottom: 10px }
.settren img{ max-width: 100% }
.settren h2 { margin-bottom: 10px; font-size: 18px }
.logothuonghieu li > a{ height: 85px }
.cinfo h2, h2.ten,.settren h2{font-size:26px; line-height:45px}
}