.roof-news{padding:90px 0;}

.roof-news .tit{text-align:center;}
.roof-news .tit em{font-weight:500;font-size:24px;color:#E63A27;}
.roof-news .tit h3{margin:15px 0 0;font-size:48px;font-weight:700;line-height:1;color:#1C1632;}

.roof-news .box{margin:50px 0 0;display:flex;justify-content:space-between;}

.roof-news .left{width:49%;border:1px solid #E2E2E2;position:relative;}
.roof-news .left .pic img{width:100%;}
.roof-news .left .date{position:absolute;top:38px;right:21px;}
.roof-news .left .date span{font-size:20px;color:#fff;background:#E63A27;padding:16px 37px;}
.roof-news .left .txt{padding:20px;}
.roof-news .left .txt h5{font-size:24px;line-height:34px;color:#1C1632;font-weight:500;transition:.5s;}
.roof-news .left .txt p{margin:15px 0 0;font-size:16px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}
.roof-news .left .txt .more{margin-top: 20px;}
.roof-news .left .txt .more a{font-size:18px;color:#1C1632;font-weight:500;display:inline-flex;align-items:center;}
.roof-news .left .txt .more a i{margin-left:8px;}
.roof-news .left .txt .more a:hover{color:#0004EC;}

.roof-news .right{width:calc(51% - 50px);}
.roof-news .list{padding-bottom:30px;position:relative;}
.roof-news ul{}
.roof-news ul li+li{margin-top:30px;}
.roof-news ul li .item{display:flex;justify-content:center;border:1px solid #E2E2E2;padding:20px;}
.roof-news ul li .item .pic{width:47%;}
.roof-news ul li .item .pic img{width:100%;aspect-ratio:1.3 / 1;}
.roof-news ul li .item .txt{flex:1;margin-left:30px;}
.roof-news ul li .item .txt h5{font-size:24px;line-height:1.2;color:#1C1632;font-weight:500;transition:.5s;}
.roof-news ul li .item .txt h5 a{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;}
.roof-news ul li .item .txt p{margin:15px 0 0;font-size:16px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}
.roof-news ul li .item .txt .more{margin-top: 20px;}
.roof-news ul li .item .txt .more a{font-size:18px;line-height:34px;color:#1C1632;font-weight:500;}
.roof-news ul li .item .txt .more a:hover{color:#0004EC;}

.roof-news .swiper-pagination-bullets.swiper-pagination-horizontal{font-size:0;bottom:0;}
.roof-news .swiper-pagination-bullet {height:14px;width:14px;border-radius:50%;margin:0 7px;background:#ccc;opacity:1;}
.roof-news .swiper-pagination-bullet-active{background:#0004EC;}






@media screen and (max-width:1680px){
.roof-news{padding:80px 0;}
.roof-news .tit h3{font-size:46px;}
}

@media screen and (max-width:1550px){
.roof-news{padding:75px 0;}
.roof-news .tit h3{font-size:44px;}

}


@media screen and (max-width:1441px) {
.roof-news{padding:70px 0;}
.roof-news .tit h3{font-size:42px;}
}

@media screen and (max-width:1367px) {
.roof-news{padding:65px 0;}
.roof-news .tit h3{font-size:38px;}
}

@media screen and (max-width:1281px){
.roof-news{padding:60px 0;}
.roof-news .tit h3{font-size:36px;}

.roof-news ul li .item{padding:15px;}
.roof-news .left .txt{padding:15px;}
.roof-news .left .txt h5{font-size:20px;}
.roof-news ul li .item .txt h5{font-size:20px;}

.roof-news .left .txt .more a,.roof-news ul li .item .txt .more a{font-size:17px;}

}


@media screen and (max-width:1171px){
.roof-news{padding:50px 0;}
.roof-news .tit h3{font-size:34px;}
}

@media screen and (max-width:992px){
.roof-news{padding:40px 0;}
.roof-news .tit h3{font-size:32px;}

.roof-news .box{margin:40px 0 0;display:block;}
.roof-news .left{width:100%;}
.roof-news .right{width:100%;margin:30px 0 0;}
.roof-news ul li .item .pic{width:40%;}

}

@media screen and (max-width:768px){
.roof-news{padding:30px 0;}
.roof-news .tit h3{font-size:30px;}
.roof-news .box{margin:30px 0 0;}

.roof-news ul li + li{margin-top:20px;}

.roof-news .left .txt h5{font-size:18px;}
.roof-news ul li .item .txt h5{font-size:18px;}

.roof-news .left .txt .more a,.roof-news ul li .item .txt .more a{font-size:16px;}

}

@media screen and (max-width:576px) {
.roof-news .tit h3{font-size:28px;}
}



@media screen and (max-width:480px) {
.roof-news .tit h3{font-size:26px;}

.roof-news .left .txt {
	padding: 15px;
}


.roof-news ul li + li{margin-top:15px;}

.roof-news ul li .item{padding:10px;}
.roof-news ul li .item .txt{margin-left:20px;}

.roof-news .left .txt h5{font-size:17px;}
.roof-news ul li .item .txt h5{font-size:17px;}

.roof-news .left .txt .more a,.roof-news ul li .item .txt .more a{font-size:15px;}

.roof-news ul li .item .txt h5 a{-webkit-line-clamp:2;}
.roof-news .left .txt .more,.roof-news ul li .item .txt .more{display:none;}

}	


@media screen and (max-width:420px) {
.roof-news .tit h3{font-size:24px;}

}