.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}
#articleInfo15 .tit{position:relative;text-align:center;z-index:2;margin-top:70px}
#articleInfo15 .tit h3{text-align:center;font-size: 40px;font-weight: 500;letter-spacing: 10px;line-height: 100%;}
#articleInfo15 .tit font{padding:0 20px;display:inline-block;-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-ms-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease;color: #7eafda;font-family:"Arial",Sans-serif;font-weight:bold;opacity:.85;letter-spacing:2px;font-size: 50px;text-transform:uppercase}
#articleInfo15:hover .tit h3,#articleInfo15:hover .tit font{}
#articleInfo15 ul{overflow:hidden;position:relative;margin: 0;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;border-radius: 25px;}
#articleInfo15 ul li{width:calc(100%/4);animation-name:fadeInUp;-webkit-animation-name:fadeInUp}
#articleInfo15 ul li .item{padding: 25px;}
#articleInfo15 ul li .item .circle{position:relative;margin:0 auto 15px;width: 95px;height: 95px;text-align:center;line-height: 95px;background: #fff;border-radius: 50%;display: flex;justify-content: center;align-items: center;}
#articleInfo15 ul li .item .circle img{width: 60px;-webkit-filter: grayscale(1);}
#articleInfo15 ul li .item:hover .circle{animation:flipInX 1.5s both;-webkit-animation:flipInX 1.5s both;animation-duration:1s;-webkit-animation-duration:1s}
@keyframes flipInX{0%{transform:perspective(400px) rotateX(90deg);animation-timing-function:ease-in;opacity:0}
40%{transform:perspective(400px) rotateX(-20deg);animation-timing-function:ease-in}
60%{transform:perspective(400px) rotateX(10deg);opacity:1}
80%{transform:perspective(400px) rotateX(-5deg)}
to{transform:perspective(400px)}
}@-webkit-keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);-webkit-animation-timing-function:ease-in;opacity:0}
40%{-webkit-transform:perspective(400px) rotateX(-20deg);-webkit-animation-timing-function:ease-in}
60%{-webkit-transform:perspective(400px) rotateX(10deg);opacity:1}
80%{-webkit-transform:perspective(400px) rotateX(-5deg)}
to{-webkit-transform:perspective(400px)}
}#articleInfo15 ul li .item p{text-align:center;font-size: 21px;}
#articleInfo15 ul li .item article{font-size: 14px;line-height: 160%;margin-top:20px;color: var(--gray);text-align: justify;background: #b00110;padding: 40px;border-radius: 15px;height: 200px;}
#articleInfo15 .imgBox{overflow:hidden}
#articleInfo15 .imgBox p{margin:0 1% 0 0;overflow:hidden;float:left;width:49%;animation-name:fadeInLeft;-webkit-animation-name:fadeInUp}
#articleInfo15 .imgBox p:nth-child(2){margin:0 0 0 1%;animation-name:fadeInRight;-webkit-animation-name:fadeInRight}
#articleInfo15 .imgBox p:hover img{-webkit-transform:rotate(3deg);-moz-transform:rotate(3deg);-ms-transform:rotate(3deg);-o-transform:rotate(3deg);transform:rotate(3deg)}

@media screen and (max-width:1024px){
	#articleInfo15 ul li .item article{height: 110px;}
	#articleInfo15 ul li .item{border-bottom: 1px rgb(226 226 226 / 10%) solid;}
	#articleInfo15 .tit font{line-height: 110%;text-align: center;font-size: 40px;margin-top: 20px;}
	#articleInfo15 ul li{width:50%}
}
@media screen and (max-width: 768px){
	#articleInfo15 ul li .item article{height: 160px;}
}
@media screen and (max-width:640px){
	#articleInfo15 ul li{width:50%}
	#articleInfo15 ul li .item article{height: auto;}
	#articleInfo15 ul li:nth-child(3){width:100%}
	#articleInfo15 ul li:nth-child(2) .item{border-left:0}
}
@media screen and (max-width:480px){
	#articleInfo15 .tit font{padding:0;}
	#articleInfo15 ul li{width:100%}
	#articleInfo15 ul li:nth-child(2) .item{border-right:0;border-bottom: 1px rgb(226 226 226 / 10%) solid;}
	#articleInfo15 .imgBox p{margin:10px 0;width:100%}
}