.banner-news{ background: url(../images/banner-news.jpg) no-repeat center center / cover;}
/* newslist */
.newslist{ width: 100%;}
.newslist ul{ width: 100%; display: flex; flex-wrap: wrap; margin-top: 72px;}
.newslist li{ width: 100%; margin: 0 0 46px 0; height: 2.25rem; position: relative;}
.newslist li:nth-child(4n){ margin:  0 0 46px 0;}
.newslist li a{ width: 100%; height: auto; transition: all 0.3s ease 0.1s;}
.newslist li .img a:hover img{ opacity: 0.7;}

.newslist li .img{ width: 300px; position: absolute; left: 0; top: 0;}
.newslist li .img img{ width: 100%;}

.newslist li dl{ width: 100%; float: right; padding-left: 340px; box-sizing: border-box;}
.newslist li dl dt{ width: 100%; font-size: .2rem; color: #6c6c6c; line-height: 24px; height: 48px; overflow: hidden; font-family: "Avenir-Next-LT-Pro"; transition: all 0.3s ease 0.1s;}
.newslist li dl a:hover dt{ color: #72a248;}
.newslist li dl dd{ width: 100%; font-size: 14px; color: #aaa; line-height: 24px; height: 48px; overflow: hidden; transition: all 0.3s ease 0.1s;}
.newslist li dl a:hover dd{ color: #000;}
.newslist li dl .date{width: 100%; color: #000; font-size: 14px; margin: 20px 0 16px; line-height: .3rem;}
.newslist li dl .date span{ background: #72a248; color: #fff; padding: 0 16px 0 21px; display: inline-block; margin-right: 26px; position: relative; z-index: 1;}
.newslist li dl .date span::after{ content: ""; position: absolute; right: -9px; top: 0; background: #72a248; width: 30px; height: 30px; transform: skewX(-20deg); z-index: -1;}

.newslist center{ font-size: 16px;}

.newsview img { max-width: 100%; }
.newsview{width: 100%; display: block; min-height: 80vh; position: relative; box-sizing: border-box; padding: .5rem 0;}
.newsview .tit{ width: 100%; text-align: left; font-size: 24px; line-height: 36px; margin-bottom: .2rem; color: #000; font-family: "Avenir-Next-LT-Pro";}
.newsview .xinxi{width: 100%; text-align: left; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; font-size: .13rem; letter-spacing: 1px; line-height: 30px; padding: 10px 0; color: #888;}
.newsview .xinxi span{ padding-right: 10px;}
.newsview .ms{ font-size: .15rem; line-height: 1.5; color: #666; padding:10px 0;}
.xx_more{ color: #fff; padding: 0 38px; line-height: 48px; display: inline-block; z-index: 2; overflow: hidden; position: relative; font-size: 14px; text-transform: uppercase;}
.xx_more::before{ content: ""; background: #72a248; width: 110%; height: 100%; position: absolute; right: 10px; top: 0; transform: skewX(-15deg); z-index: -1; transition: all 0.3s ease-in-out;}
.xx_more:hover::before{ background: #000;}
@media screen and (max-width: 1366px) {
    .about-common .main{ box-sizing: border-box;}
}

@media screen and (max-width: 1280px) {
    .about-common .main{ width: 100%; box-sizing: border-box;}
    .about-common .main > .text{ padding-left: 0; width: 60%;}
}
@media screen and (max-width: 1112px){
    .about-common .main > .text{ width: 100%; padding-left: 0;}
}



@media screen and (max-width: 736px) {
    .nav-list > ul{ width: 100%; float: left;}
    
    .newslist li{ margin: 0 0 .4rem 0; height: auto;}
    .newslist li a{ width: 100%; height: auto; transition: all 0.3s ease 0.1s;}
    .newslist li .img{ width: 100%; position: relative;}
    .newslist li .img img{ width: 100%;}
    .newslist li dl{ padding-left: 0;}
    .newslist li dl dt{ line-height: .24rem; height: auto; max-height: .48rem;}
    .newslist li dl dd{ font-size: .14rem; height: .48rem;}
    .newslist li dl .date{ margin: .2rem 0 .16rem; line-height: .3rem;}
    .newslist li dl .date span{ background: #72a248; color: #fff; padding: 0 .16rem 0 .21rem; display: inline-block; margin-right: .26rem; position: relative; z-index: 1;}
    .newslist li dl .date span::after{ content: ""; position: absolute; right: -.09rem; top: 0; background: #72a248; width: .3rem; height: .3rem; transform: skewX(-20deg); z-index: -1;}
}