@import "./base.css";

.banner {width:100%;position: relative;}
.banner img {width:100%;}
.news-title-box {position:absolute;bottom:40%;left:0;width:100%;}
.news-title-box-inline {width:1200rem;margin:0 auto;}
.news-title-box h2 {color: #f1f1f1; font-size: 30rem; height: 40rem; line-height: 40rem;}
.news-title-box h3 {color: #f1f1f1; font-size: 20rem; height: 30rem; line-height: 30rem;}

.crm{line-height: 68rem; height: 68rem; overflow: hidden;background-color: #f1f1f1;font-size: 20rem;}
.crm i{font-size: 2rem; height: 68rem; display: inline-block; vertical-align: bottom;}
.crm span{display: inline-block;}
.crm a{line-height: 68rem; display: inline-block;}
.crm a:hover{color: #111; text-decoration: underline}

.news-list {margin-bottom:50rem;}
.news-item {margin-top:50rem;}
.news-date {float:left;width:130rem;height:130rem;background-color:#e2e2e2;color:#4d4d4d;text-align:center;display:flex;align-items:center;justify-content:center;;font-size:20rem;}
.news-content {float:left;width:1020rem;position:relative;height:130rem;border-bottom:1rem solid #4d4d4d;margin-left:50rem;}
.news-title {font-size:25rem;font-weight:bold;color:#4d4d4d;height:45rem;line-height:45rem;}
.news-desc {font-size:15rem;color:#4d4d4d;height:30rem;line-height:30rem;}
.news-more {position: absolute;right: 0;bottom: 10rem;color:#4d4d4d}

.news-item a:hover .news-date,.news-item a:active .news-date {background: #162987;color:#fff;}
.news-item a:hover .news-title,.news-item a:active .news-title {color:#162987;}

@media (max-width: 768px) {
    .banner img {height: 100rem;}
    .news-title-box {left: 10rem;bottom: 10rem;width: auto;}
    .news-title-box-inline {width: 100%}
    .news-item>a {display: flex}
    .news-content {flex:1;margin-left: 10rem;}
    .news-title {font-size: 15rem;}
    .news-desc {height:60rem;text-overflow:ellipsis;overflow: hidden;}
    .news-more {bottom: 0;}
}