.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;z-index:2;margin-bottom:40px}
#articleInfo15 .tit h3{font-size:25px;background: var(--primary);text-align: center;color: var(--white);padding: 10px 0;margin-bottom: 10px;}
#articleInfo15 .tit p{-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;font-size:18px;letter-spacing:2px;position:relative}
#articleInfo15 .tit p:before{content:'-';margin-right:5px}
#articleInfo15 .tit p b{font-weight:400;display:block;letter-spacing:0;font-size:15px;color:var(--primary)}
#articleInfo15 ul{position:relative;z-index:1;display:flex;flex-wrap:wrap;margin-bottom: 50px;}
#articleInfo15 ul.six li{width: calc((100%/3) - 17px);animation-name:fadeInUp;-webkit-animation-name:fadeInUp;border:1px solid #e2e2e2;position:relative;margin: 10px 20px 10px 0;}
#articleInfo15 ul.six li:after{content:'';position: absolute;right: -7px;top: calc(50% - 14px);width: 0;height: 0;border-top: 7px solid transparent;border-bottom: 7px solid transparent;border-left: 7px solid var(--primary);}
#articleInfo15 ul.six li:last-child:after{display:none;}
#articleInfo15 ul.six li:nth-child(3n){margin-right: 0;}
#articleInfo15 ul.six li:hover{border:1px solid var(--primary)}
#articleInfo15 ul li:hover:before{background-color:var(--primary)}
#articleInfo15 ul li .item{margin:10px;position:relative;background:#f1f1f1;padding: 30px 20px;z-index:2}
#articleInfo15 ul li:hover .item{background: #9c7654;}
#articleInfo15 ul li:hover .item *{color:#fff;}
#articleInfo15 ul li:hover .item:after{content:'';background-image:url(/images/40/img-bg.jpg);background-size:100%;width: 100%;height: 100%;position: absolute;top: 0;left: 0;z-index: -1;opacity: .5;}
#articleInfo15 ul li .item .circle{position:relative;margin:0 auto 15px;width:50px;height:50px}
#articleInfo15 ul li:hover .item .circle{-webkit-filter: contrast(0) brightness(150%);filter: contrast(0) brightness(200%);}
#articleInfo15 ul li .item:hover .circle{animation:flipInX 1.5s both;-webkit-animation:flipInX 1.5s both;animation-duration:1s;-webkit-animation-duration:1s}
#articleInfo15 ul li .item p{font-weight:400;font-size:18px;text-align:center;line-height:140%;margin-bottom:5px;}
#articleInfo15 ul li .item span{font-family:"Montserrat","Noto Sans TC",sans-serif;font-size:12px;color:var(--primary);text-align:center;display:block}
#articleInfo15 ul li .item article{text-align:center;font-size:14px;line-height:140%;margin-top:15px;height:40px;overflow:hidden}
#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.six li, #articleInfo15 ul.six li:nth-child(3n){width: calc((100%/2) - 12px);margin: 10px 0;}
	#articleInfo15 ul{justify-content: space-between;}
}
@media screen and (max-width:640px){
	#articleInfo15 ul.six li:after{border-style: solid;border-width: 7px 7px 0 7px;border-color: var(--primary) transparent transparent transparent;right: calc(50% - 7px);top: unset;}
	#articleInfo15 ul.six li, #articleInfo15 ul.six li:nth-child(3n){width: calc((100%/1) - 2px);margin: 10px 0;}
}