#NewsBox ul { padding-top: 2vw; }
#NewsBox ul li { margin: 30px 1px 30px 0; }
#NewsBox ul li, #NewsBox ul li .lineBox { position: relative; }
#NewsBox ul li:before, #NewsBox ul li:after {position: absolute;width: 1px;height: calc(100% - 2px);display: block;background: rgba(20,35,77,.1);top: 1px;left: 0;content: "";}
#NewsBox ul li:after { left: auto; right: 0; }
#NewsBox ul li .lineBox { margin: 0 5px; }
#NewsBox ul li .lineBox font {position: relative;margin-top: -26px;display: block;text-align: center;font-size: 16px;color: var(--secondary);font-family: "PT Sans Caption", sans-serif;}
#NewsBox ul li .lineBox a {margin-bottom: -13px;display: block;text-align: center;font-size: 15px;color: #bbbbbb;font-family: 'PT Sans Caption';text-transform: uppercase;}
#NewsBox ul li .lineBox a:before {position: absolute;top: -30px;left: calc((100% - 50px) / 2);width: 50px;height: 1px;background: rgba(20,35,77,.1);content: "";}
#NewsBox ul li .lineBox:before, #NewsBox ul li .lineBox:after {position: absolute;width: calc((100% - 200px) / 2);height: 1px;display: block;background: rgba(20,35,77,.1);left: 1px;top: calc((100% - 1px) / 2);content: "";}
#NewsBox ul li .lineBox:after { left: auto; right: 1px; }
#NewsBox ul li .news-block { position: relative; padding: 50px 50px 50px 50px; }
#NewsBox ul li .news-block a.photo { position: absolute; width: calc(100% - 80px); height: calc(100% - 50px); top: 25px; left: 40px; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); opacity: 0; z-index: 10; }
#NewsBox ul li .news-block a.photo img { width: 100%; height: 100%; object-fit: cover; }
#NewsBox ul li .news-block p {color: var(--primary);}
#NewsBox ul li .news-block .h3 {margin-bottom: 25px;margin-top: 5px;height: 70px;transition-duration: .6s;font-size: 20px;line-height: 170%;letter-spacing: 1.5px;display: -webkit-box;-webkit-line-clamp: 2;color: var(--info);}
#NewsBox ul li .news-block article { height: 57px; -webkit-line-clamp: 2; transition-duration: .8s; margin-bottom: 10px; font-size: 15px; letter-spacing: 0.05em; font-weight: 400; line-height: 200%; text-align: left; color: #aca99e; }

.contentMain #NewsBox ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: 45px 0; }
#NewsBox ul li:nth-child(3n - 1):after, #NewsBox ul li:nth-child(3n - 2):after { background: transparent; }


@media screen and (min-width:981px) {
	#NewsBox ul li .news-block:hover a.photo { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; }
	#NewsBox ul li .news-block:hover .info>* { transform: translateY(-30px); opacity: 0; }
	#NewsBox ul li .lineBox a:hover { letter-spacing: .3em; }
	#NewsBox ul li .lineBox a:hover:before { top: -2px; transition-duration: .3s; }
}
@media screen and (max-width:1280px) {
	.contentMain #NewsBox ul { grid-template-columns: repeat(2, 1fr); }
	#NewsBox ul li:nth-child(3n - 1):after, #NewsBox ul li:nth-child(3n - 2):after { background: rgb(189 173 132 / 26%); }
	#NewsBox ul li:nth-child(2n - 1):after { background: transparent; }
}
@media screen and (max-width:980px) {
	#NewsBox .btn { left: auto; right: 0; }
	#NewsBox ul li .date { font-size: 28px; }
	#NewsBox ul li .info {display: inline-block;padding: 22px 15px 25px;text-align: center;position: relative;}
    #NewsBox ul li .info a{position:absolute;width: 100%;height: 100%;top: 0;left: 0;z-index: 2;}
	#NewsBox ul li .news-block { padding: 15px 20px; }
	#NewsBox ul li .news-block a.photo { width: 100%; height: 100%; top: 0; left: 0; position: relative; display: inline-block; opacity: 1; transform: translateX(0); }
	#NewsBox ul li .slick-slide:after { background: #bdad84; }
}
@media screen and (max-width:680px) {
	.contentMain #NewsBox ul { grid-template-columns: 1fr; gap: 35px 0; }
	#NewsBox ul li:nth-child(2n - 1):after { background: rgb(189 173 132 / 26%); }
}