#newslist li{float:left;margin-bottom:30px}
#newslist li .border{position:relative}
#newslist li .border .photo{position:relative;z-index:1}
#newslist li .border .photo a{display:block;background-repeat:no-repeat;background-position:50% 50%;background-size:auto 100%;position:relative;transition:all linear .3s}
#newslist li .border .photo a:hover{background-size:auto 110%}
#newslist li .border .photo a:after{content:'';position:absolute;width:100%;height:100%;left:0;top:0;display:block;background:rgba(41,42,55,0.42);z-index:2;transition:all linear .3s;display: none;}
#newslist li .border .photo a:hover:after{background:rgba(41,42,55,0)}
#newslist li .border .news-info{/* position:absolute; */top:0;left:0;width:100%;overflow:hidden;z-index:3;}
#newslist li .border .news-info .news-bottom{
    display: none;
}
#newslist li .border .news-info .news-bottom p{display:inline-block;background:#a77bb2;margin: 10px;border-radius: 5px;}
#newslist li .border .news-info .news-bottom p a{color:#fff;font-size:14px;display:block;padding:5px 15px;}
#newslist li .border .news-info h3{margin: 10px 20px 10px;text-align: center;}
#newslist li .border .news-info h3 a{color: #000;font-weight:400;font-size:17px;line-height:120%;}
@media screen and (min-width: 1367px) {
#newslist li{width:calc((100% - 60px) / 3)}
#newslist li:nth-child(3n-1){margin:0 30px 30px}
}
@media screen and (max-width: 1366px) {
#newslist li{width:calc((100% - 30px) / 2)}
#newslist li:nth-child(odd){margin:0 30px 30px 0}
}
@media screen and (max-width: 640px) {
#newslist li{width:calc((100% - 15px) / 2);margin-bottom:15px}
#newslist li:nth-child(odd){margin:0 15px 15px 0}
}
@media screen and (max-width: 480px) {
#newslist li{width:100%;margin-bottom:15px}
#newslist li:nth-child(odd){margin:0 0 15px}
}