@media (max-width: 1600px) {
	#workflow .sec1 h1{
		font-size: 180px;
	}
}
@media (max-width: 1439px) {
	#aboutus .titlepage h1{
		font-size: 120px;
		text-align: center;
		margin-top: 20px;
	}
	#workflow .sec1 h1{
		font-size: 150px;
	}
	#workflow .sec1 h2{
		font-size: 30px;
	}
	#workflow .sec1 h3{
		font-size: 70px;
		max-width: 500px;
		margin-top: 15vw;
	}
	#workflow .sec2{
		padding-top: 10vw;
		padding-bottom: 10vw;
	}
	footer{
		padding: 50px 0;
	}
	.slider-client .slick-slide a{
		font-size: 14px;
	}
	#showcase .sec1{
		padding-top: 100px;
		padding-bottom: 60px;
	}
	#showcase .sec1 h1{
		font-size: 80px;
	}
	#showcase .sec1 h2{
		font-size: 30px;
	}
	.slider-showcase .info{
		padding-left: 30%;
	}
	.slider-showcase .info .logo{
		right: 70%;
		width: 200px;
	}
	.slider-showcase .info .logo > img{
		width: 100%;
	}
	.slider-showcase .info .desc{
		padding-left: 40px;
		font-size: 16px;
	}
	.slider-showcase .info .desc .name_en{
		font-size: 30px;
	}
	.slider-showcase .info .desc .name_th{
		font-size: 18px;
	}
	#showcase .sec2 .slider-showcase::after{
		width: 70%;
	}
	#showcase .sec2 .slider-showcase .slick-list::after{
		right: 70%;
		width: 200px;
	}
	.slider-showcase .info{
		min-height: 200px;
	}
	#aboutus .mdvision h3{
		font-size: 100px;
	}
	#aboutus .mdvision h4{
		font-size: 30px;
	}
	#experience .sec1 h1{
		font-size: 120px;
	}
	#contact_us .sec1 h1{
		font-size: 120px;
	}
	#contact_us .col_left > h2{
		font-size: 28px;
	}
	#workflow .sec1{
		min-height: 0;
	}
	#workflow .sec3 h3, #workflow .sec3 h4{
		font-size: 60px;
	}
	#workflow .sec3 h4{
		margin-bottom: 15px;
	}
}
@media (max-width: 1299px) {
}
@media (max-width: 1199px) {
	.navbar-main-menu .navbar-nav>li>a{
		min-width: 140px;
	}
	#aboutus .titlepage h2{
		font-size: 24px;
		text-align: center;
	}
	#aboutus .titlepage{
		margin-bottom: 0px;
	}
	#aboutus .titlepage h1{
		font-size: 80px;
	}
	#aboutus .mdmessage .ms1{
		position: initial;
		font-size: 16px;
		width: 100%;
		margin-bottom: 15px;
		padding-top: 0;
	}
	#aboutus .mdmessage .ms2{
		padding: 30px;
		padding-left: 140px;
		padding-right: 0;
		padding-bottom: 50px;
	}
	#aboutus .mdmessage .ms2 .year{
		font-size: 80px;
	}
	#aboutus{
		padding-top: 90px;
	}
	#contact_us .sec1 h1{
		font-size: 80px;
	}
	#contact_us .col_left, #contact_us .col_right{
		min-height: 400px;
	}
	#contact_us .sec_form h3{
		text-align: center;
	}
	#contact_us .infolayour{
		padding-top: 10px;
	}
	#workflow .sec2 .stepwork > li{
		left: 20px;
		top: -10px;
	}
	#workflow .sec2 .stepwork > li.step11, #workflow .sec2 .stepwork > li.step8, #workflow .sec2 .stepwork > li.step5, #workflow .sec2 .stepwork > li.step2{
		left: 310px;
	}
	#workflow .sec2 .stepwork > li.step9, #workflow .sec2 .stepwork > li.step6, #workflow .sec2 .stepwork > li.step3{
		left: 590px;
	}
	#workflow .sec2 .stepwork > li.step1, #workflow .sec2 .stepwork > li.step3{
		top: 100px;
	}
	#workflow .sec2 .stepwork > li.step4, #workflow .sec2 .stepwork > li.step5, #workflow .sec2 .stepwork > li.step6{
		top: 350px;
	}
	#workflow .sec2 .stepwork > li.step5{
		top: 240px;
	}
	#workflow .sec2 .stepwork > li.step7, #workflow .sec2 .stepwork > li.step8, #workflow .sec2 .stepwork > li.step9{
		top: 610px;
	}
	#workflow .sec2 .stepwork > li.step8{
		top: 470px;
	}
	#workflow .sec2 .stepwork > li.step10, #workflow .sec2 .stepwork > li.step11{
		top: 860px;
	}
	#workflow .sec2 .stepwork > li.step11{
		top: 720px;
	}
	#workflow .sec3 .webtools{
		padding: 0;
		padding-left: 30px;
	}
	#workflow .sec3 .webtools > li{
		padding-right: 10px;
	}
}
@media (max-width: 1023px) {
	.navbar-toggle{
		display: block;
		border-color: #fff;
		border-radius: 0;
	}
	.navbar-toggle .icon-bar{
		background: #fff;
	}
	.navbar-collapse.collapse{
		display: none!important;
	}
	.collapse.in {
	    display: block!important;
	}
	.navbar-header{
		float: none;
	}
	.mainnav .logo{
		position: initial;
		float: left;
		padding-left: 10px;
	}
	.mainnav .logo > :not(img){
		display: block;
		white-space: nowrap;
	}
	.mainnav .logo > img{
		margin-top: 10px;
	}
	.navbar-toggle{
		margin-top: 15px;
		margin-bottom: 15px;
	}
	.mainnav .logo strong, .mainnav .logo p{
		padding-left: 50px;
	}
	.mainnav .logo strong{
		line-height: 19px;
	}
	.navbar-main-menu .navbar-nav>li>a{
		min-width: 0;
	}
	.navbar-main-menu .navbar-nav>li:nth-child(3){
		padding-right: 0;
	}
	.navbar-main-menu .navbar-nav>li:nth-child(4){
		padding-left: 0;
	}
	.navbar-main-menu .navbar-nav>li.active > a::before{
		display: none;
	}
	#contact_us .contactmap iframe{
		height: 40vw;
	}
	#workflow .sec1 h1{
		font-size: 15vw;
		margin-top: 10vw;
		max-width: 60vw;
	}
	#workflow .sec1 h2{
		font-size: 3vw;
	}
	.mainnav{
		padding:0;
	}
	.navbar-collapse{
		padding-left: 0;
		padding-right: 0;
		border-top: 1px solid rgba(255, 255, 255, 0.2);
	}
	footer{
		padding: 30px 0;
	}
	#experience .sec1 h1{
		font-size: 12vw;
		max-width: 80%;
	}
	#experience .sec1 h2{
		font-size: 5vw;
	}
	#experience .sec1{
		padding-top: 14vw;
		padding-bottom: 10vw;
	}
	#contact_us .sec1{
		padding-top: 120px;
	}
}
@media (max-width: 991px) {
	#contact_us .contactmap iframe{
		height: 70vw;
	}
	footer{
		padding: 20px 0;
	}
	footer .row > div{
		padding-bottom: 15px;
	}
	#aboutus .mdmessage .ms2{
		padding-left: 100px;
		font-size: 14px;
	}
	#aboutus .mdmessage .ms2 .year{
		font-size: 50px;
	}
	#aboutus{
		padding-top: 70px;
	}
	#contact_us .col_left > h2{
		font-size: 18px;
	}
	#contact_us .col_left > address{
		font-size: 14px;
	}
	#contact_us .col_left > p{
		font-size: 13px;
	}
	#contact_us .col_left > p strong{
		width: 130px;
	}
	#contact_us .social a{
		font-size: 14px;
	}
	#contact_us .col_left, #contact_us .col_right{
		min-height: auto;
		padding-bottom: 40px;
	}
	#contact_us .col_right > img{
		position: initial;
		width: 100%;
	}
	#contact_us .sec_form{
		padding-top: 50px;
		padding-bottom: 40px;
	}
	#contact_us .sec_form h3{
		font-size: 30px;
	}
	#contact_us .infolayour form > ul{
		margin: 0;
	}
	#workflow .sec2 > div > img{
		display: none;
	}
	#workflow .sec2 .stepwork{
		position: initial!important;
	    display:flex;
	    flex-wrap:wrap;
	    flex-direction:row;
	    justify-content:flex-start;
	    align-items:stretch;
	}
	#workflow .sec2 .stepwork > li{
		position: initial!important;
		display: block;
		float: left;
		width: 50%;
		padding: 15px;
		padding-top: 0;
		flex: 50%;
	}
	#workflow .sec2{
		background: url('/web-assets/img/bg2.jpg') center center no-repeat;
		color: #fff;
		background-size: cover;
		padding-top: 10vw;
		padding-bottom: 10vw;
	}
	#workflow .sec1{
		padding-bottom: 10vw;
	}
	#workflow .sec3 .webtools{
		display:flex;
		flex-wrap:wrap;
		flex-direction:row;
		justify-content:flex-start;
		align-items:stretch;
		padding-left: 60px;
	}
	#workflow .sec3 .webtools > li{
		flex: 50%;
	}
}
@media (max-width: 767px) {
	footer .col1{
		text-align: center;
		border-bottom: 1px solid #bbb;
		margin-bottom: 15px;
	}
	footer .col2,
	footer .col3{
		width: 50%;
		float: left;
	}
	footer .col4{
		display: block;
		clear: both;
		text-align: center;
		border-top: 1px solid #bbb;
		margin-top: 15px;
		padding-top: 15px;
	}
	#contact_us .contactmap iframe{
		height: 100vw;
	}
	#workflow .sec1 h1{
		margin-top: 5vw;
	}
	#workflow .sec1{
		background-size: contain;
		background-position: center 20vw;
	}
	#workflow .sec1 h3{
		font-size: 7vw;
		margin-top: 10vw;
		max-width: 50vw;
	}
	.navbar-main-menu .navbar-nav>li{
		display: block;
	}
	.navbar-main-menu .navbar-nav>li>a{
		width: 100%;
		font-size: 18px;
		line-height: 18px;
	}
	.mainnav .logo:hover{
		-webkit-transform: none;
		   -moz-transform: none;
		    -ms-transform: none;
		     -o-transform: none;
		        transform: none;
	}
	.navbar-collapse{
		padding-left: 15px;
		padding-right: 15px;
	}
	.slider-client .slick-slide a{
		padding: 10px 0px;
	}
	.slider-client .slick-slide a > span:not(.fas){
		display: none;
	}
	.slider-client .slick-slide a{
		font-size: 14px;
	}
	.slider-client .slick-slide a .fas{
		font-size: 22px;
	}
	#showcase .sec1 h1{
		font-size: 50px;
	}
	#showcase .sec1 h2{
		font-size: 20px;
	}
	#showcase .sec1{
		padding-top: 80px;
		padding-bottom: 40px;
	}
	#showcase .sec2 .slider-showcase .slick-list .slick-track{
		padding-top: 30px;
		padding-bottom: 30px;
	}
	.slider-showcase .info .logo{
		position: initial;
		text-align: center;
		background: #fff;
		width: 80%;
		padding: 10px 20px;
		margin: auto;
		margin-bottom: 20px;
	}
	.slider-showcase .info{
		padding-left: 0;
	}
	#showcase .sec2 .slider-showcase .slick-list::after{
		display: none;
	}
	#showcase .sec2 .slider-showcase::before{
		display: none;
	}
	#showcase .sec2 .slider-showcase::after{
		width: 100%;
	}
	.slider-showcase .info .desc{
		margin-bottom: 20px;
		padding-left: 15px;
		padding-right: 15px;
		text-align: center;
	}
	.slider-showcase .info .desc .name_en{
		font-size: 26px;
		font-weight: 400;
		margin-bottom: 10px;
	}
	#aboutus .titlepage h1{
		font-size: 50px;
	}
	#aboutus .titlepage h2{
		font-size: 18px;
		margin-top: 5px;
	}
	#aboutus .mdmessage .ms1{
		padding-left: 10vw;
		padding-right: 10vw;
		text-align: center;
	}
	#aboutus .mdvision,
	#aboutus .mdexp{
		padding-top: 5vw;
	}
	#aboutus .mdmessage .ms2{
		position: initial;
		color: #333;
		padding-left: 0;
		width: 100%;
		padding-bottom: 15px;
		padding-top: 15px;
		text-align: center;
	}
	#aboutus .mdvision{
		text-align: center;
	}
	#aboutus .mdvision h3{
		font-size: 70px;
	}
	#aboutus .mdvision h4{
		font-size: 22px;
	}
	#experience .sec1{
		padding-top: 100px;
		padding-bottom: 50px;
	}
	#contact_us .col_left{
		width: 60%;
	}
	#contact_us .col_right{
		width: 40%;
	}
	#contact_us .sec1 h1{
		font-size: 50px;
	}
	#contact_us .col_left > address br{
		display: none;
	}
	#contact_us .infolayour form > ul{
		margin-right: 0;
		margin-left: 0;
	}
	#workflow .sec3{
		padding: 10vw 0;
	}
	#workflow .sec3 h3, #workflow .sec3 h4{
		font-size: 40px;
	}
	#workflow .sec3 .webtools{
		padding: 0 15px;
	}
	#showcase .sec1 p{
		font-size: 16px;
	}
	.slider-client .slick-slide img{
		height: 9vw;
	}
}
@media (max-width: 575px) {
	#contact_us .sec_form{
		padding-top: 30px;
	}
	#aboutus .mdmessage .ms1{
		padding-left: 20px;
		padding-right: 20px;
	}
	#contact_us .infolayour form > ul > li{
		width: 100%!important;
	}
	#contact_us .btn-main{
		margin-top: 15px;
		width: 100%;
	}
	#contact_us .col_left{
		width: 100%;
		text-align: center;
	}
	#contact_us .sec1{
		padding-bottom: 0;
	}
	#contact_us .col_left > address,
	#contact_us .col_left > h2{
		text-align: center;
	}
	#contact_us .col_left .social{
		padding-top: 0;
		padding-bottom: 15px;
		text-align: center;
	}
	#contact_us .col_left > p strong{
		width: auto;
	}
	#contact_us .col_right{
		display: none;
	}
	#workflow .sec2 .stepwork > li{
		flex: 100%;
		text-align: left;
	}
	#workflow .sec3 .webtools > li{
		flex: 100%;
	}
}
@media (max-width: 550px) {
	#workflow .sec1 h1{
		margin-top: 5vw;
	}
}
@media (max-width: 540px) {
}
@media (max-width: 470px) {
}
@media (max-width: 425px) {
}