@import "https://fonts.googleapis.com/css?family=Archivo+Black";
#newslist li{display:inline-block;vertical-align:top;width: calc(33.5% - 3px);margin-right:-4px;}
#newslist li .border{margin: 0 12px 24px;}
#newslist li .border .photo a{display:block;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;position:relative}
#newslist li .border .photo a img{width:100%;transition:all linear .3s}
#newslist li .border .photo a p{position:absolute;top:0;left:0;background: #393939;color:#fff;font-size:14px;line-height:120%;overflow:hidden;padding:25px;max-width:30px;}
#newslist li .border .news-info{background:#fff;padding:30px}
#newslist li .border .news-info .news-bottom{color: #e61111;font-size:7pt;line-height:110%;font-family:'Archivo Black',sans-serif;}
#newslist li .border .news-info h3 a{font-size:16px;line-height:100%}
#newslist li .border .news-info h3:first-letter{font-size:28px;display:inline-block;line-height:100%}
#newslist li .border .news-info .describe{color:#858585;font-size:15px;line-height:150%;margin:22px 0;/* max-height:132px; *//* overflow:hidden; */max-height: initial;overflow: hidden;/* text-overflow: ellipsis; */-webkit-line-clamp: 2;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;}
#newslist li .border .photo a:after{content:'VIEW';position:absolute;top:calc(50% - 12px);left:calc(50% - 17px);font-family:'Archivo Black',sans-serif;color:#fff;font-size:12px;font-weight:400;transition:all linear .3s;transform:rotateY(270deg);opacity:0}
#newslist li .border .photo:hover a img{background:rgba(0,0,0,0.46)}
#newslist li .border .photo:hover a:after{opacity:1;transform:rotateY(360deg)}
#NewsBox .NewsMore p a:hover span{transform:scaleX(-1)}
.article-info {
    margin-bottom: 30px;
}
.article-info a{
    color: #5d5d5d;
}
@media screen and (max-width: 1440px) {
#newslist li{width:calc(33% - 4px);}
}
@media screen and (max-width: 1280px) {
}
@media screen and (max-width: 1024px) {
#newslist li{width:50%;}
#newslist li .border{margin:0 10px 20px}
}
@media screen and (max-width: 640px) {
#newslist li .border .news-info{padding:20px}
#newslist li .border .news-info .describe{margin:15px 0 22px;max-height:45px}
#newslist li .border .photo a p{padding:10px}
}
@media screen and (max-width: 480px) {
#newslist li .border .news-info .news-bottom{font-size:5pt}
#newslist li .border .news-info h3{overflow:hidden;height:55px}
#newslist li .border .news-info .describe{margin:10px 0 18px}
#newslist li .border{margin: 0 5px 8px}
}