.news{display: flex;}
.left-navpic{width: 530px; height: 460px; overflow: hidden; margin-right: 20px;}
.left-navpic img{width: 100%; height: 100%;} 
.right-list{width: calc(1200px - 550px); height: 460px; overflow: hidden;}
.hot-container{width: 100%; height: 90px; background: #55a66a; color: #ffffff;}
.hot-container a{display:flex; width: 100%; height: 100%; background: #55a66a; color: #ffffff; padding: 8px 20px; overflow: hidden; flex-direction: row; box-sizing: border-box;}
.hot-title{width: 70px; height: 100%; font-size: 24px; display: flex; align-items: center; justify-content: center;}
.hot-title span{display: block;}
.hot-content{width: calc(100% - 70px);height: 70px; padding-left: 16px; padding-right: 20px; border-left: #ffffff 1px solid; text-align: justify; overflow: hidden;}
.title{width: 100%; font-size: 18px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; text-align: justify;}
.intro{display: -webkit-box; width: 100%;font-size: 14px; text-overflow: ellipsis;  overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-align: justify；}
.news-container{width: 100%; height: calc(100% - 90px);}
.title-container{width: 100%; height: 50px; display: flex; justify-content: space-between; align-items: flex-end;}
.title-container .title{width: calc(100% - 60px); display: flex;}
.title-container .title span{font-size: 24px; font-weight: bold; color: #107b2d; border-bottom: #107b2d 4px solid; box-sizing: border-box;}
.title-container a{display: flex; width: 60px; color: #8d8d8d; align-items: center; justify-content: center; padding-bottom: 4px;}
.more{font-size: 14px; color: #8d8d8d;}
.content-container{width: 100%;}
.content-item:first-child{border-top: #d5d5d5 1px solid;}
.content-item{border-bottom: #d5d5d5 1px solid; display: flex; flex-direction: row; padding-top: 17px; padding-bottom: 17px; color: #202020;}
.content-item:hover{background: #55a66a; color: #ffffff;}
.content-item:hover .content-date span{color: #ffffff;}
.content-item:hover .intro{color: #ffffff;}
.content-item .intro{color: #888888}
.content-date{width: 130px; display: flex; align-items: center; justify-content: center; flex-direction: column; font-size: 40px; font-weight: bold;}
.content-date span{display: block; color: #888888; font-size: 14px; box-sizing: border-box;}
.content-title{width: calc(100% - 130px); padding-right: 30px; box-sizing: border-box;}
.content-title .title{width: 100%;}
.content-title .intro{width: 100%;}
.banner-wrap{width: 100%; height: 120px; background: url("../images/index/banner.png") center no-repeat; margin-top: 20px;}
.other-container{display: flex; height: 260px; margin-top: 20px; margin-bottom: 50px;}
.other-container a{display: block; width: 400px; height: 260px;}
.other-container a img{width: 100%; height: 100%;}
#intro{background: url(/images/index/intro.png) center no-repeat;}
#service{background: url(/images/index/service.png) center no-repeat;}
#member{background: url(/images/index/member.png) center no-repeat;}
#intro:hover{background: url(/images/index/intro_active.png) center no-repeat;}
#service:hover{background: url(/images/index/service_active.png) center no-repeat;}
#member:hover{background: url(/images/index/member_active.png) center no-repeat;}