#newslist{margin:50px 0 20px;position:relative;z-index:2}
#newslist ul li{float:left;width:calc(100%/3)}
#newslist .border{margin:18px;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-align-content:center;align-content:center}
#newslist .border .photo{width:100%}
#newslist .border .photo a{display:block;background-repeat:no-repeat;background-position:50% 50%;background-size: cover;background-color: #030303;position:relative;}
#newslist .border .photo a img{width:100%}
#newslist .border .photo .news-bottom{position:absolute;top:0;left:0;color:#fff;background: rgba(23, 23, 23, 0.76);width:100%;height:100%;transition:all linear .3s;opacity:0;}
#newslist .border .photo .news-bottom .info,.news-date{position:absolute;width:50px;left:calc(50% - 56px);top:calc(50% - 52px);border: 1px solid rgba(255, 255, 255, 0.23);padding:20px 30px;}
#newslist .border .photo .news-bottom .info p,.news-date p{text-align:center;font-family:'Lusitana',serif;font-size:15px}
#newslist .border .photo .news-bottom .info p.year,.news-date p.year{font-size:24px}
#newslist .border .photo .news-bottom .info span,.news-date span{display:block;width:30%;height:1px;background:#fff;margin:6px auto 10px}
#newslist ul li .news-info{width:100%;overflow:hidden;margin-top:20px}
#newslist .border .news-info h3{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:left;margin:13px 0;float:right;width:calc(100% - 85px)}
#newslist .border .news-info h3 a{color: #ffffff;font-size:18px;}
#newslist .border .news-info p{color: #8a8a8a;font-size:15px;line-height:20px;overflow:hidden;height:40px;margin:0 20px;width:calc(100% - 40px);}
#newslist .border .news-info p.describe{clear:both;padding-top:10px;margin:0;width:100%;text-align:center}
#newslist .news-date{position:initial;left:0;top:0;border:0;padding:0;float:left;width:72px}
#newslist .border .news-info .news-date p{height:20px;margin:0;width:auto}
#newslist .news-date p.year{margin:10px 20px;height:18px}
#newslist .news-date span{background: rgba(201, 186, 160, 0.43);width:100%;}
.article-info{margin-bottom:30px}
.article-info ul li b a{
    color: #8a8a8a;
}
@media screen and (min-width: 1025px) {
#newslist .border .photo:hover .news-bottom{opacity:1}
#newslist .border .photo .news-bottom .info{transition:linear all .3s;transform:scale(0.8)}
#newslist .border .photo:hover .news-bottom .info{transform:scale(1)}
}
@media screen and (max-width: 1280px) {
#newslist ul li{width:50%}
}
@media screen and (max-width: 640px) {
#newslist .border{margin:10px}
#newslist .news-date{width:100%;overflow:hidden}
#newslist .border .news-info h3{width:100%;margin:5px 0 0}
#newslist .border .news-info p.describe{padding:0;text-align:left}
#newslist .border .news-info .news-date p{float:left}
#newslist ul li .news-info{margin-top:10px}
#newslist .news-date span{width:1px;height:15px;margin:2px 10px 0;float:left}
#newslist{margin:0 0 20px}
}