.newsList{display: flex;flex-wrap: wrap;}
.newsList .news-item{width: 30%;margin: 0 1.58% 30px;}
.newsList .news-item a.photo{display: block;}
.newsList .news-item .info{
	padding: 0 20px 15px;
    background: #fff;
    box-shadow: 1px 1px 10px 0px #ddd;
}
.newsList .news-item .date{display: inline-block;margin-top: -40px;padding: 5px 15px;background: #775d58;color: #fff;position: relative;z-index: 1;}
.newsList .news-item .date::after{content: "";z-index: -1;position: absolute;left: 0px;top: 0px;width: 0px;height: 100%;background: #674d48;transition:  .3s;}
.newsList .news-item:hover .date::after{width: 100%;}
.newsList .news-item .info .title{font-size: 24px;-webkit-line-clamp: 1;}
.newsList .news-item .info .title a{
    color: #775d58;
    font-size: 20px;
}
.newsList .news-item .info .desc{-webkit-line-clamp:2;margin: 20px 5px;min-height: 50px;}
.newsList .news-item .info .desc a{
    color: #6d6d6d;
}
@media screen and (max-width: 980px){
	.newsList .news-item{width: 100%;}
}
@media screen and (max-width: 540px){
	.newsList .news-item .info .title{font-size: 18px;}
}
@media screen and (max-width: 414px){
	.newsList .news-item .date{font-size: 12px;padding: 5px 8px;}
}
@media screen and (max-width: 375px){
	.newsList .news-item .info{padding: 0 10px 15px;}
}