/* Responsive */

@media (max-width: 1200px) {

}

@media (max-width: 1001px) {
	.menu-top{
		display: none;
	}
	#hamburger, .wr-search {
		display: block;
	}

	.hotline, .wrap-menu, .menu {
		display: none;
	}

	.flex-product-main {
		display: block;
	}

	.flex-product-main .left-product {
		position: fixed;
		z-index: 999;
		top: 0px;
		left: 0px;
		transform: translateX(-250px);
		bottom: 0px;
		overflow-x: hidden;
		background: #fff;
		box-shadow: 0px 0px 5px #000;
		transition: all 0.5s;
	}

	.flex-product-main .left-product.show {
		transform: translateX(0px);
	}

	.flex-product-main .right-product {
		width: 100%;
	}

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

	.filter {
		display: block;
	}

	.align-items-mobile {
		justify-content: space-between !important;
		width: 100%;
	}
	.grid-news{
		grid-template-columns: repeat(1, 1fr);
	}
	.title-about h2, .title-main h2, .title-contact p, .title-company h2, .title-main h1{
		font-size: 20px;
	}
	.title-about span, .title-main span{
		font-size: 15px;
	}
	.ds-news h3, .ds-service h3, .ds-news-all h3, .ds-project h3{font-size: 15px;}
	.title-service a{font-size: 15px;padding: 10px;}
}

@media (max-width: 850px) {
	.content-about, .service-left{
		width: 100%;
		margin: 10px 0px;
	}
	.photo-about, .service-right{
		width: 100%;
		margin: 10px 0px;
	}
}

@media (max-width: 769px) {
	.grid-project {
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}
	.grid-video{
		grid-template-columns: repeat(2, 1fr);
	}

	.statistic{
        text-align: center;
        width: 100%;
        margin-top: 10px;
	}

	.item-ft{
		width: 100%;
		margin: 10px 0px;
	}

	.gutter-x1-0 {
		--bs-gutter-x: 10px !important;
	}

	.gutter-x-20 {
		--bs-gutter-x: 10px;
	}

	.grid-pro-detail {
		display: block;
	}

	.grid-pro-detail .left-pro-detail {
		width: 100%;
		padding: 0px;
		border-right: none;
	}

	.slick_photo1 {
		text-align: center;
	}

	.grid-pro-detail .right-pro-detail {
		width: 100%;
	}

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

	.box-footer {
		width: 100% !important;
		margin-top: 20px;
	}
}

@media (max-width: 580px) {
	.time-news-all{width: 90%;text-align: center;}
	.item-news{
		padding: 5px;
	}
	.ds-project{
		padding: 10px 5px 20px 5px;
	}
	.contact-wr .contact-input input {
		border-radius: 20px !important;
	}
	.title-about h2, .title-main h2, .title-contact p, .title-company h2 {
		font-size: 18px;
	}
}

@media (max-width: 369px) {}