.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;}
.delay3 {animation-delay: 1.5s;-webkit-animation-delay: 1.5s;}
.delay4 {animation-delay: 2.0s;-webkit-animation-delay: 2.0s;}
.delay5 {animation-delay: 2.5s;-webkit-animation-delay: 2.5s;}

#articleInfo15 h2 {text-align: center;font-size: 28px;font-weight: 300;color: #9c8062;letter-spacing: 5px;}
#articleInfo15 ul {overflow: hidden;position: relative;margin: 0px 0 30px;z-index: 1;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;list-style: none;padding-left: 0;}
#articleInfo15 ul li {position: relative;margin: 20px 0;width: 16.6%;height: 320px;}
#articleInfo15 ul li .item {padding: 20px 10px;}
#articleInfo15 ul .Img {margin: 0 auto;position: relative;width: 163px;height: 143px;padding: 16.5px 0px;-webkit-box-sizing: border-box;box-sizing: border-box;}
#articleInfo15 ul .Img:before {position: absolute;width: 140px;height: 140px;border-radius: 50%;border: 2px #dadada dotted;top: 0px;left: 8px;content: "";-webkit-animation: round 50s linear infinite;animation: round 50s linear infinite;}

/* animation */
@keyframes round { from { transform: rotate(0); } to { transform: rotate(1turn); } }
@-webkit-keyframes round { from { -webkit-transform: rotate(0); } to { -webkit-transform: rotate(1turn); } }
@keyframes newsfix1 { from { transform: translateY(0); } to { transform: translateY(10px); } }
@-webkit-keyframes newsfix1 { from { -webkit-transform: translateY(0); } to { -webkit-transform: translateY(10px); } }
@keyframes newsfix2 { from { transform: translateX(0); } to { transform: translateX(-10px); } }
@-webkit-keyframes newsfix2 { from { -webkit-transform: translateX(0); } to { -webkit-transform: translateX(-10px); } }

#articleInfo15 ul .Img .num {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;position: absolute;top: 8px;left: 7px;width: 43px;height: 43px;background-color: #ffffff;border-radius: 50%;-webkit-box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.21);box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.21);z-index: 10;color: #9c8062;}
#articleInfo15 ul .Img .pic {width: 100%;background-color: #1b4144;border-radius: 50%;-webkit-transition: all .4s ease;-o-transition: all .4s ease;transition: all .4s ease}
#articleInfo15 ul .Img .pic img {display: block;width: 100%;-webkit-transition: all .4s ease;-o-transition: all .4s ease;transition: all .4s ease}
#articleInfo15 ul li:nth-child(6){border-right: none;}
#articleInfo15 ul li .item .circle {position: relative;margin: 0 auto 15px;width: 110px;height: 110px;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;background-color: #9c8062;box-sizing: border-box;text-align: center;font-size: 55px;line-height: 90px;}
#articleInfo15 ul li .item .circle img{-webkit-filter: contrast(0) brightness(200%);filter: contrast(0) brightness(200%);width: 60px;height: 60px;}
#articleInfo15 ul li .item .circle i{color: #fff;}
#articleInfo15 ul .Txt {padding: 20px 0px 0;text-align: center;font-size: 14px;font-weight: 500;font-family: "Noto Sans TC", sans-serif;color: #000000;}
#articleInfo15 ul .title {position: relative;padding: 7px 0;margin-bottom: 5px;font-size: 17px;font-weight: 500;color: #414242;text-align: center;}
#articleInfo15 ul .title:before {content: "";position: absolute;bottom: 0;left: calc(50% - 8px);width: 16px;height: 1px;background-color: #1b4144}
#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: 15px;font-weight: 300;}


@media screen and (max-width: 1280px) {
	#articleInfo15 ul li{width: 33.3%;}
}


@media screen and (max-width: 768px) {
	#articleInfo15 ul li .item {padding: 5px;}
}
@media screen and (max-width: 640px) {
	#articleInfo15 ul li {width: 50%;height: 270px;}
	#articleInfo15 ul li:nth-child(2) .item {border-left: 0;}
}
@media screen and (max-width: 480px) {
	#articleInfo15 ul li {/* width: 100%; */height: 240px;}
}
