.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}
#articleInfo15 .tit h3{text-align:center;font-size:33px}
#articleInfo15 .tit font{padding:0 20px;background:#fff;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}
#articleInfo15:hover .tit h3,#articleInfo15:hover .tit font{letter-spacing:5px}
#articleInfo15 ul{overflow:hidden;position:relative;display: flex;flex-wrap: wrap;justify-content: center;margin-bottom: 70px;}
#articleInfo15 ul li{width: calc((100%/4));animation-name:fadeInUp;-webkit-animation-name:fadeInUp}
#articleInfo15 ul li .item{padding:20px 30px}
#articleInfo15 ul li .item .circle{position:relative;margin:0 auto 15px;width: 135px;height: 135px;border: 4px var(--primary) solid;border-radius:50%;display: flex;align-items: center;justify-content: center;}
#articleInfo15 ul li .item .circle img{width:80px;}
#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: 20px;color: var(--primary);}
#articleInfo15 ul li .item article{text-align: justify;font-size: 16px;margin-top: 10px;}
#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)}
#articleInfo16 .item{overflow:hidden;position:relative;margin:15px 0 30px;display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;}
#articleInfo16 .item > div{float:left;width: 45%;animation-name:fadeInLeft;-webkit-animation-name:fadeInLeft}
#articleInfo16 .item:nth-child(2n) > div{float:right}
#articleInfo16 .item:nth-child(2n) .photo{animation-name:fadeInRight;-webkit-animation-name:fadeInRight;order: 2;}
#articleInfo16 .item .photo{overflow:hidden;border-radius: 25px;height: 350px;}
#articleInfo16 .item .photo img{width:100%;height: 100%;object-fit: cover;}
#articleInfo16 .item .info{width: 50%;animation-name:fadeInRight;-webkit-animation-name:fadeInRight}
#articleInfo16 .item:nth-child(2n) .info{animation-name:fadeInLeft;-webkit-animation-name:fadeInLeft}
#articleInfo16 .item .info h5{padding:10px 15px;border-top:2px #000 solid;border-bottom:1px #000 solid;font-size:14px;color:#444}
#articleInfo16 .item .info h3{padding:15px;font-size:20px;color:#87623e}
#articleInfo16 .item .info article{margin:0 15px;font-size: 18px;}

@media screen and (max-width:1024px){
	#articleInfo15 ul li{width:50%}
}
@media screen and (max-width:768px){
	#articleInfo16 .item .photo{width: 100%;margin-bottom: 20px;}
	#articleInfo16 .item .info{width:100%;}
	#articleInfo16 .item:nth-child(2n) .photo{order:0;}
}
@media screen and (max-width:480px){
	#articleInfo15 ul li{width:100%}
	#articleInfo15 .imgBox p{margin:10px 0;width:100%}
}