/* news */

.news .title{display: flex;justify-content: space-between;align-items: end;padding-bottom: 39px;}
.news .title h1{font-size: 32px;color: #191d2d;padding-top: 30px;}
.news .title ul li{display: inline-block;margin-left: 79px;}
.news .title ul li:first-child{margin-left: 0;}
.news .title ul li a{font-size: 16px;display: inline-block;border-bottom: 1px dashed transparent;padding-bottom: 2px;}
.news .title ul li.act a, .news .title ul li a:hover{color: #a7a7a7;border-color: #a7a7a7;}

.news .list h2{font-size: 23px;font-weight: bold;color: #191d2d;}
.news .list ul li{float: left;width: 337px;margin-right: 17px;margin-bottom: 25px;}
.news .list ul li:nth-child(4n+4){margin-right: 0;}
.news .list ul li a{display: block;}
.news .list ul li a img{width: 337px;height: 192px;object-fit: contain;}
.news .list ul li a .image-box{width: 337px;height: 192px;text-align: center;line-height: 192px;background-color: #f7f7f7;}
.news .list ul li a .image-box img{vertical-align: middle;}
.news .list ul li h3{font-size: 17px;font-weight: bold;line-height: 23px;height: 46px;overflow: hidden;margin-top: 4px;}
.news .list ul li s{line-height: 20px;color: #6b6b6b;display: block;height: 60px;overflow: hidden;margin-top: 8px;}
.news .list .page{padding-top: 22px;justify-content: center;padding-bottom: 41px;}

/* news-detail */
.news-detail{}
.news-detail .title h1{font-weight: normal;font-size: 30px;color: #191d2d;padding-top: 17px;padding-bottom: 20px;}
.news-detail .title s{font-size: 13px;color: #6b6b6b;}
.news-detail .title s::before{font-size: 16px;margin-right: 4px;}
.news-detail .title s:first-of-type{margin-right: 35px;}
.news-detail .content{padding-top: 23px;}
.news-detail .article{float: left;width: calc(100% - 296px - 18px);margin-right: 18px;font-size: 15px;color: #6b6b6b;line-height: 22px;padding-bottom: 90px;min-height: 500px;}
.news-detail .article dt{font-size: 16px;font-weight: bold;font-family: "Ebrima";}
.news-detail .article dd{line-height: 31px;color: #191d2d;font-size: 16px;}
.news-detail .article h2{font-size: 23px;color: #191d2d;padding-bottom: 17px;text-shadow: 0 0 0.5px;}
.news-detail .share{float: left;width: calc(100% - 296px - 18px);}
.news-detail .share dl{display: flex;flex-wrap: wrap;justify-content: center;text-align: center;position: relative;padding-top: 32px;}
.news-detail .share dl::before{content: '';width: 133px;height: 4px;border-radius: 3px;position: absolute;left: 50%;transform: translateX(-50%);top: 0;background-color: #e4e4e4;}
.news-detail .share dl dt{width: 100%;font-size: 15px;color: #6b6b6b;padding-bottom: 29px;}
.news-detail .share dl dd{margin: 0 15px;}
.news-detail .share dl dd a{color: #6b6b6b;font-size: 20px;padding: 5px;display: inline-block;border-radius: 5px;}
.news-detail .share dl dd a:hover{background-color: #c90000;color: #fff;}
.news-detail .relate{float: right;width: 296px;}
.news-detail .relate > div{background-color: #f7f7f7;padding: 23px 14px;margin-bottom: 13px;}
.news-detail .relate > div h2{font-size: 17px;font-weight: bold;color: #212121;padding-bottom: 20px;}
.news-detail .relate > div.cates a{display: block;color: #6b6b6b;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;margin-bottom: 18px;}
.news-detail .relate > div.cates a:hover{color: #c90000;}
.news-detail .relate > div.parts a{display: block;overflow: hidden;margin-bottom: 13px;}
.news-detail .relate > div.parts a .image-box{float: left;margin-right: 7px;width: 66px;height: 66px;background-color: #fff;text-align: center;line-height: 66px;}
.news-detail .relate > div.parts a img{display: inline-block;vertical-align: middle;max-width: 100%;}
.news-detail .relate > div.parts a h3{font-size: 15px;color: #212121;text-shadow: 0 0 0.5px;}
.news-detail .relate > div.parts a s{color: #6b6b6b;line-height: 22px;display: block;}
.news-detail .relate > div.parts a:hover h3{color: #c90000;}
.news-detail .relate > div.brand .box{background-color: #fff;text-align: center;height: 82px;line-height: 82px;margin-bottom: 18px;}
.news-detail .relate > div.brand .box img{vertical-align: middle;}
.news-detail .relate > div.brand h3{font-size: 15px;font-weight: bold;color: #212121;padding-bottom: 7px;}
.news-detail .relate > div.brand s{color: #6b6b6b;line-height: 21px;}
.news-detail .relate > div.brand a{display: inline-block;font-size: 15px;padding-bottom: 2px;border-bottom: 1px dashed #000;margin-top: 25px;}
.news-detail .relate > div.brand a:hover{border-color: #c90000;}

.news-detail .relate-blog{padding-top: 60px;}
.news-detail .relate-blog h2{font-size: 22px;font-weight: bold;padding-bottom: 25px;}
.news-detail .relate-blog ul{display: flex;flex-wrap: wrap;justify-content: space-between;}
.news-detail .relate-blog ul li{overflow: hidden;margin-bottom: 16px;width: 49%;}
.news-detail .relate-blog ul li .image-box{float: left;margin-right: 9px;width: 174px;height: 115px;text-align: center;line-height: 115px;background-color: #f7f7f7;}
.news-detail .relate-blog ul li .image-box img{max-width: 100%;vertical-align: middle;}
.news-detail .relate-blog ul li h3{font-size: 16px;font-weight: bold;color: #212121;padding-bottom: 5px;height: 46px;overflow: hidden;}
.news-detail .relate-blog ul li s{color: #6b6b6b;}
.news-detail .relate-blog ul li:hover h3{color: #c90000;}

.news-detail .relate-part{padding-top: 35px;padding-bottom: 37px;}
.news-detail .relate-part h2{font-size: 22px;font-weight: bold;padding-bottom: 35px;}

@media screen and (max-width: 768px) 
{
    /* news */
    .news{padding: 20px 2%;}
    .news .title{flex-wrap: wrap;}
    .news .title h1{padding-bottom: 20px;padding-top: 10px;}
    .news .headline .left{max-width: 100%;float: unset;margin-bottom: 26px;}
    .news .headline .middle{width: 100%;margin-left: 0 !important;float: unset;}
    .news .headline .middle img{max-width: 100% !important;}
    .news .headline .right{width: 100%;margin-top: 66px;float: unset;margin-left: 0;}
    .news .headline .right ul li img{float: unset;}
    .news .list ul li{float: unset;margin: 0 auto 20px !important;}

    /* .news-detail */
    .news-detail{padding: 20px 2%;}
    .news-detail .title h1{font-size: 20px;}
    .news-detail .article{float: unset;width: 100%;margin-right: 0;min-height: auto;}
    .news-detail .article img{max-width: 100%;}
    .news-detail .share{width: 100%;padding: 50px 0;}
    .news-detail .relate{width: 100%;}
    .news-detail .relate-blog ul li{width: 100%;margin-right: 0;}
    .news-detail .relate-blog ul li .image-box{float: unset;}
}