#newslist li { position: relative; margin-bottom: 10px; transition: all linear .2s; }
#newslist li a { position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 3; }
#newslist li .border { position: relative; overflow: hidden; z-index: 2; }
#newslist li .border .photo { overflow: hidden; float: left; width: 150px; background: #151515 no-repeat 50% / contain; transition: all linear .3s; }
#newslist li .border .photo img { width: 100%; }
#newslist li .news-info { margin: 40px 40px 0 0; float: right; width: calc(100% - 250px); }
#newslist li .news-info .news-bottom .date { font-size: 16px; line-height: 120%; letter-spacing: .2em; color: #c3c3c3; }
#newslist li .news-info .news-bottom h3 { margin: 20px 0; font-size: 28px; line-height: 110%; font-weight: normal; color: #d6beaa; }
#newslist li .news-info .news-bottom .describe { overflow: hidden; height: 81px; font-size: 16px; line-height: 170%; color: #c3c3c3; }
#newslist li .news-info .news-bottom .more { padding: 7px 19px; margin-top: 30px; background: url(/images/22/index_recommend_text_bg.jpg) #000; border: 1px solid #9c6161; display: inline-block; color: #d5bda9; font-size: 13px; }
.article-info { margin-bottom: 30px; color: #6d6d6d; }
.article-info a { color: #a0a0a0; }

@media screen and (min-width:1025px) {
	#newslist li:hover { background: rgba(0,0,0,0.25); }
}
@media screen and (max-width:640px) {
	#newslist li .border .photo { width: 100px; }
	#newslist li .news-info { margin: 0 30px 0 0; width: calc(100% - 170px); }
	#newslist li .news-info .news-bottom .describe { height: 27px; }
	#newslist li .news-info .news-bottom h3 { overflow: hidden; margin: 15px 0; max-height: 44px; font-size: 20px; }
	#newslist li .news-info .news-bottom .date { font-size: 12px; }
	#newslist li .news-info .news-bottom .more { padding: 5px 15px; }
}
@media screen and (max-width:480px) {
	#newslist li .news-info { margin-right: 10px; width: calc(100% - 130px); }
}