.wow{animation-name:fadeInDown;-webkit-animation-name:fadeInDown;animation-duration:1.5s;-webkit-animation-duration:1.5s;animation-fill-mode:both;-webkit-animation-fill-mode:both;animation-duration:1s;-webkit-animation-duration:1s}
#articleInfo5 ul{position:relative;display:flex;flex-wrap:wrap;justify-content:space-between;margin-bottom:10px}
#articleInfo5 ul li{overflow:hidden;margin:6px 0;width:calc(50% - 20px);display:flex;flex-wrap:wrap}
#articleInfo5 ul li:nth-child(8),#articleInfo5 ul li:nth-child(9),#articleInfo5 ul li:nth-child(10),#articleInfo5 ul li:nth-child(11),#articleInfo5 ul li:nth-child(12){}
#articleInfo5 ul li > div{width:140px}
#articleInfo5 ul li .titBox p,#articleInfo5 ul li .titBox h3{color:#000;font-weight:600;background:#ededed;padding:10px 0;text-align:center}
#articleInfo5 ul li .titBox h3{font-size:25px;color:#206a94;transition:all 0.4s ease-in-out 0s}
#articleInfo5 ul li:hover .titBox h3{margin-top:5px}
#articleInfo5 ul li .icon{margin:8px 10px 0;width:40px;height:40px;background:#46a4da;-webkit-box-shadow:0 0 0 8px #afdcf8;-moz-box-shadow:0 0 0 8px #afdcf8;-ms-box-shadow:0 0 0 8px #afdcf8;box-shadow:0 0 0 8px #afdcf8;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;text-align:center;line-height:40px;font-size:20px;color:#fff}
#articleInfo5 ul li .info{width:calc(100% - 170px);margin:0 0 0 20px}
#articleInfo5 ul li .info h3{padding:10px;background:#46a4da;-webkit-border-radius:5px 5px 0 0;-moz-border-radius:5px 5px 0 0;-ms-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0;font-size:18px;color:#fff}
#articleInfo5 ul li:hover .info h3{-webkit-animation:animatedIcon 1s infinite linear;-moz-animation:animatedIcon 1s infinite linear;-ms-animation:animatedIcon 1s infinite linear;-o-animation:animatedIcon 1s infinite linear}
#articleInfo5 ul li .info .article{line-height:180%;padding:10px 0}

.cotixen .cottitle{font-size:max(1.8 * (1vw + 1vh) / 2,21px);font-weight:600;background:linear-gradient(to right,#f6c409,#FF9800);-webkit-background-clip:text;color:transparent;text-transform:uppercase;margin-bottom:5px}

@media screen and (max-width: 1280px) {
    #articleInfo5 ul:before {margin-left:-4px}
}

@media screen and (max-width: 768px) {
    #articleInfo5 ul li {width: calc(100% - 20px);}
}

@media screen and (max-width: 640px) {
    #articleInfo5 ul li .info .article{text-align:center}
    #articleInfo5 ul li{display:block;width:100%}
    #articleInfo5 ul:before{display:none}
    #articleInfo5 ul li .titBox{width:100%}
    #articleInfo5 ul li:hover .titBox h3{margin-top:0}
    #articleInfo5 ul li .icon{-webkit-box-shadow:0 0 0 8px #fff;-moz-box-shadow:0 0 0 8px #fff;-ms-box-shadow:0 0 0 8px #fff;box-shadow:0 0 0 8px #fff}
    #articleInfo5 ul li:hover .icon{-webkit-box-shadow:0 0 0 8px #afdcf8;-moz-box-shadow:0 0 0 8px #afdcf8;-ms-box-shadow:0 0 0 8px #afdcf8;box-shadow:0 0 0 8px #afdcf8}
    #articleInfo5 ul li .info{margin:0;width:100%}
    #articleInfo5 ul li .info:before{left:40px;top:-7px;border-top:0;border-bottom:7px solid #46a4da;border-right:7px solid transparent;border-left:7px solid transparent}
}