.wow{animation:fadeIn 1.5s both;-webkit-animation:fadeIn 1.5s both;animation-duration:1s;-webkit-animation-duration:1s}
.delay1{animation-delay:0.5s;-webkit-animation-delay:0.5s}
.delay2{animation-delay:1.0s;-webkit-animation-delay:1.0s}
#articleInfo20 .item{display:flex;justify-content:space-between;flex-wrap:wrap;margin:0 17px 40px;align-items: center;border: 1px #ccc solid;border-radius: 25px;padding: 30px;}
#articleInfo20 .item .photo{width:55%;border-radius:25px;overflow:hidden}
#articleInfo20 .item:nth-child(2n) .photo{order:2;}
#articleInfo20 .item .photo img{width:100%}
#articleInfo20 .item .info{width:40%}
#articleInfo20 .item .info h3{font-size:20px;background:var(--primary);border-radius:50px;padding:20px 40px;display:flex;align-items:center;justify-content:space-between}
#articleInfo20 .item .info h5{font-size:16px;color: #e26cb6;padding: 20px 40px 0;}
#articleInfo20 .item .info article{margin: 10px 40px 0;line-height:200%}
#articleInfo20 ul{display:flex;flex-wrap:wrap;justify-content:center;margin-bottom: 30px;}
#articleInfo20 ul li{padding:25px;width: calc((100%/2) - 85px);border:1px #ccc solid;animation-name:fadeInDown;-webkit-animation-name:fadeInDown;transition:all linear 0.3s;margin:15px;border-radius:25px}
#articleInfo20 ul li h3{font-size:19px;background: var(--primary);padding: 15px 0;text-align:center;letter-spacing:1px;border-radius:50px;margin-bottom: 15px;}
#articleInfo20 ul li h5{font-size:16px;color: #e26cb6;text-align:center;}
#articleInfo20 ul li article{text-align: center;margin-top: 20px;}
#articleInfo20 ul li p.photo{margin:15px 0}
#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}
#articleInfo20 .imgBox{display:flex;flex-wrap: wrap;justify-content: space-between;}
#articleInfo20 .imgBox p{width: calc(49% - 60px);border-radius: 25px;overflow: hidden;border: 1px solid #ccc;padding: 30px;}
#articleInfo20 .imgBox p img{border-radius: 25px;}

@media screen and (max-width: 1024px){
	#articleInfo20 .item .photo, #articleInfo20 .item:nth-child(2n) .photo{width:100%;order: 0;}
	#articleInfo20 .item .info{width:100%;margin-top: 40px;}
}
@media screen and (max-width:768px){
	#articleInfo20 ul li{margin-bottom:10px;width:calc(100% - 55px)}
}
@media screen and (max-width: 480px){
	#articleInfo20 .item .info h5{text-align: center;}
	#articleInfo20 .imgBox p{width: 100%;margin: 0 0 20px;}
	#articleInfo20 .item{margin: 0 0 40px;}
	#articleInfo20 .item .info article{margin: 20px 0 0;}
	#articleInfo20 .item .info h3{display:block;text-align: center;border-radius: 10px;padding: 15px;font-size: 18px;}
	#articleInfo20 .item .info h3 b{display:block;text-align: center;}
	#articleInfo20 ul li h3{border-radius: 10px;padding: 15px;font-size: 18px;}
	#articleInfo20 ul li{margin: 0 0 20px;width: calc(100% - 50px);}
}