#articleInfo12{overflow:hidden;margin-bottom: 40px;}
#articleInfo12 .row{float:left;width:55%}
#articleInfo12 .row h3,#articleInfo20 h3{font-size:30px;animation-name:fadeInLeft;-webkit-animation-name:fadeInLeft;line-height:170%;font-weight:500}
#articleInfo12 .row article{margin:10px 10% 0 0;animation-name:fadeInRight;-webkit-animation-name:fadeInRight;text-align:justify;letter-spacing:1px;font-weight:200}
#articleInfo12 .row h4,#articleInfo20 h4{margin:0 0 50px;font-size:60px;animation-name:fadeInLeft;-webkit-animation-name:fadeInLeft;font-family:'Kanit',sans-serif;font-weight:100;line-height:130%}
#articleInfo12 .row:nth-child(2){width:45%}
#articleInfo12 .row .topBox{overflow:hidden}
#articleInfo12 .row p{margin:0 2% 0 0;float:left;width:48%;animation-name:fadeInLeft;-webkit-animation-name:fadeInLeft}
#articleInfo12 .row p:nth-child(2){margin:0 0 0 2%;animation-name:fadeInRight;-webkit-animation-name:fadeInRight}
#articleInfo12 .row .downBox{animation-name:fadeInUp;-webkit-animation-name:fadeInUp}
#articleInfo20 ul{display:flex;flex-wrap:wrap}
#articleInfo20 ul li{padding:25px;width: calc((100%/4) - 85px);display:inline-block;animation-name:fadeInDown;-webkit-animation-name:fadeInDown;background:#fff;border-radius:20px;margin:0 20px 40px}
#articleInfo20 ul li:nth-child(4n){margin-right: 0;}
#articleInfo20 ul li h3{font-size:20px}
#articleInfo20 ul li h5{font-size:20px;color:#0a2744;margin:20px 0 5px;font-weight:500;letter-spacing:1px}
#articleInfo20 ul li article{color:#9c9898;font-size:14px;font-weight:200;text-align:justify}
#articleInfo20 ul li p.photo{width:70px}
#articleInfo20 .bottomBox h3{text-align:center;font-size:30px;animation-name:fadeInUp;-webkit-animation-name:fadeInUp}
#articleInfo20 .bottomBox p{margin:10px 0 20px;text-align:center;font-size:18px;animation-name:fadeInUp;-webkit-animation-name:fadeInUp}
#articleInfo20 .bottomBox article{animation-name:fadeInUp;-webkit-animation-name:fadeInUp}

@media screen and (max-width:1024px){
	#articleInfo12 .row h4, #articleInfo20 h4{font-size: 50px;}
	#articleInfo20 ul{justify-content: space-between;}
	#articleInfo20 ul li, #articleInfo20 ul li:nth-child(4n){width: calc((100%/2) - 60px);margin: 0 0 20px;border: 1px solid #ddd;}
}
@media screen and (max-width:768px){
	#articleInfo12 .row, #articleInfo12 .row:nth-child(2){width: 100%;}
	#articleInfo12 .row article{margin-right:0;}
}
@media screen and (max-width:480px){
	#articleInfo12 .row h4, #articleInfo20 h4{font-size: 30px;}
	#articleInfo12 .row h3, #articleInfo20 h3{font-size: 22px;}
	#articleInfo12 .row article{margin-right:0;}
	#articleInfo20 ul li, #articleInfo20 ul li:nth-child(4n){width: 100%;}
}