#newsList ul{display:flex;flex-wrap: wrap;}
#newsList li {margin: 20px;box-shadow: 0 0 10px rgb(0 0 0 / 15%);border-radius: 5px;overflow: hidden;width: calc((100%/3) - 40px);}
#newsList li .img a.photo img , #bookBox ul li a.photo img { width: 100%; }
#newsList li .info{padding: 40px;}
#newsList li .info p.time{font-size:13px;color: #383838;}
#newsList li .info >span{width:50px;height: 2px;background: #eee;display: block;margin: 15px 0;}
#newsList li .info article{color: #212020;height: 69px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;text-align: justify;font-size: 15px;line-height: 150%;}
#newsList li .info p a span {margin: 0;}
#newsList li .info p font { font-family: 'Rubik', sans-serif; color: #656565; }
#newsList li .info h3 a {margin-bottom: 10px;height: auto;font-weight: 400;font-size: 20px;color: #434343;-webkit-line-clamp: 1;}
#newsList p.more {margin-top: 30px;text-align: center;}
#newsList p.more a {background: #144371;display: inline-flex;color: #fff;padding: 15px 40px;font-size: 15px;outline: none;letter-spacing: 2px;border-radius: 50px;align-items: center;}
#newsList p.more:hover a{background: #ccd7c7;color: #1d1d1d;}

@media screen and (min-width:1281px) {
	#newsList ul li:hover .img a.photo img {background: rgb(32 32 32 / 10%);}
}
@media screen and (max-width:1024px) {
	#newsList li{width: calc((100%/2) - 40px);}
}
@media screen and (max-width:768px) {
	#newsList ul li {width: calc((100%/2) - 30px);margin: 15px;}
}
@media screen and (max-width:500px) {
	#newsList ul li { width: 100%; }
}