/* CSS Document */
.flex-container {
  display: flex;
  flex-direction: row;
  font-size: auto;
  text-align: center;
/*	background:#b4e572;*/
font-family: 'Kanit', sans-serif;
	margin-top: 1%;

}
.main{
	padding:1%;
	width:80%;
	height:auto;
	background:#b4e572;
/*	background:#b4e572;*/
/*	object-fit: cover;*/
	font-size: calc(15px + 0.390625vw);
}
.f1{
  flex: 50%;
  height: 100%;
	background:#b4e572;
  font-size: calc(8px + 0.390625vw);
}
.f1_1{
	
	text-align: justify;
	margin-left: 5%;
	margin-right: 5%;
	
}
.f2{
  flex: 50%;
	height: 100%;
	background:#b4e572;
	font-size: calc(8px + 0.390625vw);
}
.f2_1{
	text-align: justify;
	margin-left: 5%;
	margin-right: 5%;
}
.f1 > img, .f2 > img{
	width:90%;
	height:80%;
	object-fit: cover
}
span{
	font-family: 'Kanit', sans-serif;
}
.footer {
	height:auto;
   position: absolute;
/*   left: 0;*/
/*   margin-top:0.4vw;*/
   margin-left:10%;
   margin-right:10%;
   width: 80%;
   background-color: black;
   color: #fff;
   text-align: center;
	font-size: calc(8px + 0.390625vw);
}
@media(max-width:1023px){
	  .flex-container {
    flex-direction: column;
	width:100%
  }	
	.main{
	width:100%;
}
	.footer {
	width:100%;
	margin-left:0%;
    margin-right:0%;
	}
	.f1, .f2{
/*	font-size: calc(10px + 0.390625vw);*/
	}
}