@charset "utf-8";


#news{margin: 0 auto;}
#news .wrap{margin: 0 auto; max-width: 1600px;padding: 100px 0;}

#news .topup{background: #f3f3f3;margin: 0 auto;padding: 40px 0;}
#news .topup .swiper{margin: 0 auto; padding: 0;}
#news .topup .swiper .swiper-slide>a{display: block; position: relative;z-index: 50;}
#news .topup .swiper .swiper-slide>a .img{width: 40%;}
#news .topup .swiper .swiper-slide>a .img>img{width: 100%;height: auto;}
#news .topup .swiper .swiper-slide>a .box{ width: 60%;box-sizing: border-box;padding: 50px 0 0 100px; text-align: left;}
#news .topup .swiper .swiper-slide>a .box>.time{font-size: 1.4rem; color: #1e2687; }
#news .topup .swiper .swiper-slide>a .box>.title{ padding: 10px 0; height: 100px; position: relative; font-size: 3rem; line-height: 4rem; color: #000; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;overflow: hidden; transition: all .35s;}
#news .topup .swiper .swiper-slide>a .box>.text{ margin-top: 10px; font-size: 1.6rem; color: #666; line-height: 2.8rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;overflow: hidden;}
#news .topup .swiper .swiper-slide>a .box>.more{padding-top: 15px;}
#news .topup .swiper .swiper-slide>a .box>.more>p{ position: relative; display: inline-block; padding: 10px 30px; font-size: 1.5rem; background: #1e2687; color: #fff; border-radius: 5px; overflow: hidden; border: 1px solid #1e2687; transition: all .35s;}
#news .topup .swiper .swiper-slide>a .box>.more>p:after{position: absolute;z-index: 1; left: 0; top: 0; width: 0;height: 100%; background: #333; content: '';transition: all .35s;}
#news .topup .swiper .swiper-slide>a .box>.more>p>i{position: relative;z-index: 10; display: inline-block;vertical-align: middle;}
#news .topup .swiper .swiper-slide>a .box>.more>p>span{position: relative;z-index: 10; display: inline-block; margin-right: 16px;vertical-align: middle;}
#news .topup .swiper .swiper-slide>a:hover .box>.title{color: #1e2687;}
#news .topup .swiper .swiper-slide>a:hover .box>.more>p{ color: #fff; border-color: #333;}
#news .topup .swiper .swiper-slide>a:hover .box>.more>p:after{width: 100%;}
#news .topup .swiper .swiper-pagination{text-align: right;}
#news .topup .swiper .swiper-pagination .swiper-pagination-bullet{ width: 10px;height: 10px; border: 2px solid #000;}
#news .topup .swiper .swiper-pagination .swiper-pagination-bullet-active{ border-color: #1e2687; background: none;}

#news .lists{margin: 0 auto;}
#news .lists>ul{margin: 0 auto;}
#news .lists>ul>li{ position: relative; z-index: 10; display: block; float: left; width: 31.33%; margin-right: 3%; margin-bottom: 3%;  overflow: hidden; box-sizing: border-box; transition: all .35s;}
#news .lists>ul>li:nth-child(3n){ margin-right: 0;}
#news .lists>ul>li a{display: block; position: relative; text-align: left;}
#news .lists>ul>li a>.img{overflow: hidden;}
#news .lists>ul>li a>.img>img{transition: all 1s;}
#news .lists>ul>li a>.box{ position: relative; z-index: 10; box-sizing: border-box; padding: 30px 0; overflow: hidden;transition: all .35s;}
#news .lists>ul>li a>.box>.time{ position: relative;z-index: 10;}
#news .lists>ul>li a>.box>.time>span{display: inline-block; text-transform: uppercase; font-size: 1.4rem; color: #333;}
#news .lists>ul>li a>.box>.title{ padding: 10px 0; height: 56px; position: relative; font-size: 1.8rem; line-height: 2.4rem; color: #000; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;overflow: hidden; transition: all .35s;}
#news .lists>ul>li a>.box>.more{padding-top: 15px;}
#news .lists>ul>li a>.box>.more>p{ position: relative; display: inline-block; padding: 10px 30px; font-size: 1.5rem; color: #666; border-radius: 5px; overflow: hidden; border: 1px solid #ddd; transition: all .35s;}
#news .lists>ul>li a>.box>.more>p:after{position: absolute;z-index: 1; left: 0; top: 0; width: 0;height: 100%; background: #1e2687; content: '';transition: all .35s;}
#news .lists>ul>li a>.box>.more>p>i{position: relative;z-index: 10; display: inline-block;vertical-align: middle;}
#news .lists>ul>li a>.box>.more>p>span{position: relative;z-index: 10; display: inline-block; margin-right: 16px;vertical-align: middle;}
#news .lists>ul>li a:hover .box>.title{color: #1e2687;}
#news .lists>ul>li a:hover .box>.more>p{border-color: #1e2687; color: #fff;}
#news .lists>ul>li a:hover .box>.more>p:after{width: 100%;}
#news .lists>ul>li a:hover .img>img{transform: scale(1.1);}

#news .view{margin: 0 auto;}
#news .view .details{ margin: 0 auto;}
#news .view .details>.title{font-size: 4rem; line-height: 4.6rem; color: #333;}
#news .view .details>.summary{text-align: left; border-bottom: 1px solid #ddd;padding: 20px 0;}
#news .view .details>.summary>div{float: left;margin-right: 30px; font-size: 1.6rem; color: #999;}
#news .view .details>.summary>.time{ line-height: 38px;}
#news .view .details>.summary>.visit{ line-height: 38px;}
#news .view .details>.summary>.social a{ width: 30px; height: 30px; line-height: 30px; font-size: 16px; transition: all .35s;}
#news .view .details>.summary>.social a:hover{ background: #1e2687; border-color: #1e2687; transform: translateY(-3px);}
#news .view .details>.content{ padding: 50px 0; font-size: 1.6rem; line-height: 2.8rem; color: #666;}
#news .view .details>.content>p{margin-bottom: 15px;}
#news .view .details>.content .table-container{position: relative;}
#news .view .details>.content .table-container>.table-wrapper{ position: relative; overflow:hidden; overflow-x:auto;}
#news .view .details>.content .table-container:after{ display: none; position: absolute;z-index: 10; left: 0; bottom: -30px; font-size: 1.1rem; color: #ccc; content: '拖动表格进行浏览';}
#news .view .details>.content table{  box-sizing: border-box; width: 100%!important; min-width: 1200px; border: 1px solid #ddd;}
#news .view .details>.content table td{border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; color: #666; font-size: 1.6rem;padding:15px;}
#news .view .details>.content img{max-width: 100%;height: auto;}
#news .view .pageurl{ background: #f6f6f6; padding: 80px 0;}
#news .view .pageurl>.wrap{ padding: 30px 0; border-top: 1px solid #ddd;border-bottom: 1px solid #ddd;}
#news .view .pageurl .prev, #news .view .pageurl .next{ display: block; float: left; width: 40%;}
#news .view .pageurl .next{text-align: right;}
#news .view .pageurl .prev a, #news .view .pageurl .next a{display: block; padding: 6px 0; font-size: 1.4rem; color: #666;}
#news .view .pageurl .prev a>i, #news .view .pageurl .next a>i{display: inline-block; vertical-align: middle; background: #ddd; width: 32px;height: 32px;line-height: 32px; text-align: center; border-radius: 100%; margin-right: 6px;}
#news .view .pageurl .next a>i{margin-right: 0; margin-left: 6px;}
#news .view .pageurl .prev a>strong, #news .view .pageurl .next a>strong{ position: relative; padding-right: 12px; font-weight: normal; vertical-align: middle;}
#news .view .pageurl .prev a>strong:after, #news .view .pageurl .next a>strong:after{position: absolute;z-index: 1; right: 0;top: 50%; transform: translateY(-50%); width: 10px; height: 10px; line-height: 10px; content: '：';}
#news .view .pageurl .prev a>span, #news .view .pageurl .next a>span{ display: inline-block;vertical-align: middle; width: 70%; overflow: hidden;text-overflow:ellipsis;white-space: nowrap; padding-left: 6px; color: #999; transition: all .35s;}
#news .view .pageurl .prev a>span.no, #news .view .pageurl .next a>span.no{color: #999!important; text-decoration: none!important;}
#news .view .pageurl .prev a:hover span, #news .view .pageurl .next a:hover span{color:#b20013;}
#news .view .pageurl .prev a:hover i, #news .view .pageurl .next a:hover i{background: #b20013; color: #fff;}
#news .view .pageurl .back{display: block; float: left; width: 20%; text-align: center;}
#news .view .pageurl .back a{display: block; font-size: 1.4rem; color: #666;}
#news .view .pageurl .back a>i{display: inline-block; vertical-align: middle;height: 44px;line-height: 44px; text-align: center;}
#news .view .pageurl .back a>span{ display: inline-block;vertical-align: middle; padding-left: 6px; color: #666; transition: all .35s;}

@media only screen and (max-width: 1380px){

    #news .topup .swiper .swiper-slide>a .box{ padding: 20px 0 0 100px;}
    #news .topup .swiper .swiper-slide>a .box>.text{ -webkit-line-clamp: 2;}


}

@media only screen and (max-width: 1280px){

    #news .wrap{padding: 50px 0;}

    #news .topup .swiper .swiper-slide>a .box>.title { height: 70px; font-size: 2.4rem; line-height: 3rem; }
    #news .topup .swiper .swiper-slide>a .box>.more>p{ padding: 8px 25px; font-size: 1.4rem;}


    #news .lists>ul>li a>.box>.time>span{font-size: 1.2rem;}
    #news .lists>ul>li a>.box>.title{ font-size: 1.6rem;}
    #news .lists>ul>li a>.box>.more>p{ padding: 8px 25px; font-size: 1.4rem;}



    #news .view .details>.title{font-size: 3.2rem; line-height: 4rem;}


}

@media only screen and (max-width: 1080px){

    #news .topup .swiper .swiper-slide>a .img{width: 50%;}
    #news .topup .swiper .swiper-slide>a .box{ width: 50%; padding-left:50px; }


    #news .lists>ul>li{ width: 48%; margin-right: 0;}
    #news .lists>ul>li:nth-child(even){float: right;}


}

@media only screen and (max-width: 860px){

    #news .topup .swiper .swiper-slide>a .img{width: 100%; float: none;}
    #news .topup .swiper .swiper-slide>a .box{ width: 100%; float: none; padding:30px 0; }

    #news .view .details>.title{font-size: 3rem; }
    #news .view .details>.summary>div { font-size: 1.4rem;}
    #news .view .details>.content{ padding: 30px 0; font-size: 1.4rem; line-height: 2.4rem;}



    #news .view .pageurl .prev a>span, #news .view .pageurl .next a>span{  width: 60%;}


}



@media only screen and (max-width: 780px){

    #news .lists>ul>li a>.box{ padding: 20px 20px 0 20px;}
    #news .lists>ul>li a>.box>.title{ font-size: 1.5rem;}
    #news .lists>ul>li a>.box>.text{ font-size: 1.2rem;}

    #news .view .pageurl { padding: 50px 0; }
    #news .view .pageurl .prev a>span, #news .view .pageurl .next a>span{display: none;}
    #news .view .pageurl .prev a>strong:after, #news .view .pageurl .next a>strong:after {display: none;}
    #news .view .pageurl .prev a>strong, #news .view .pageurl .next a>strong { padding-right: 0;}

}
@media only screen and (max-width: 640px){




    #news .topup .swiper .swiper-slide>a .box>.time { font-size: 1.2rem;}
    #news .topup .swiper .swiper-slide>a .box>.title { font-size: 2rem; line-height:2.4rem;}
    #news .topup .swiper .swiper-slide>a .box>.text { font-size: 1.4rem;line-height: 2rem;}
    #news .topup .swiper .swiper-slide>a .box>.more>p{ padding: 8px 20px; font-size: 1.2rem;}




    #news .lists>ul>li{ width: 100%;  float: none; margin-bottom: 30px;}
    #news .lists>ul>li:nth-child(even){float: none;}
    #news .lists>ul>li a>.box>.more>p{ padding: 8px 20px; font-size: 1.2rem;}

    #news .view .details { padding: 30px 0; }
    #news .view .details>.title {font-size: 2.4rem;line-height: 3rem;}
    #news .view .details>.content {  padding: 30px 0;  font-size: 1.4rem;  line-height: 2rem; }



    #news .view .pageurl .prev, #news .view .pageurl .next{ width: 35%;}
    #news .view .pageurl .back{width: 30%;}








}


@media only screen and (max-width: 520px){




}





