@charset "utf-8";
/* CSS Document */

#news{ position: relative;z-index: 5; background: #fff; margin: 0 auto;}

#news .list{margin: 0 auto;}
#news .list>ul{margin: 0 auto;}
#news .list>ul>li{ position: relative; display: block; margin: 0 auto 50px auto; overflow: hidden; background: #eee; transition: all .35s; }
#news .list>ul>li>a{display: block;zoom: 1; }
#news .list>ul>li>a:before, #news .list>ul>li>a:after { content: ""; display: table; }
#news .list>ul>li>a:after { clear: both; }
#news .list>ul>li>a .img{ position: absolute; left: 0;top: 0; width: 30%; height: 100%;overflow: hidden; transition: all .35s;}
#news .list>ul>li>a .img:after{position: absolute;z-index: 3;left: 0;top:0;width: 100%;height: 100%;background: rgba(0,0,0,.6);opacity: 0; content: ''; transition: all .34s;}
#news .list>ul>li>a .img>.pic{ position: absolute;z-index: 1;  width: 100%;height: 100%; background-position: 0 0; background-size: cover;  border: 1px solid #eee; box-sizing: border-box; transition: all 1s;}
#news .list>ul>li>a .time{ width: 20%; min-width: 100px; padding:90px 50px 0 0;  color: #444;  text-align:right; box-sizing: border-box; transition: all .35s;}
#news .list>ul>li>a .time>.dd{ font-size: 5.6rem; font-weight: 700;transition: all .35s;}
#news .list>ul>li>a .time>.ym{ font-size: 2.4rem; font-weight: 700; transition: all .35s;}
#news .list>ul>li>a .con{ margin-left: 30%; width: 50%;text-align: left; box-sizing: border-box; padding:90px 50px; padding-right: 0!important; }
#news .list>ul>li>a .con>.tit{font-size: 2.4rem; color: #333;  overflow: hidden; text-overflow:ellipsis; white-space: nowrap; transition:all .35s;}
#news .list>ul>li>a .con>.txt{ margin: 15px 0; font-size: 1.4rem; color: #999; line-height: 2rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
#news .list>ul>li>a .con>.more{text-align: left;}
#news .list>ul>li>a .con>.more>span{display: inline-block; padding: 5px 16px; font-size: 1.2rem; border: 1px solid #ccc;background: #fff; transition: all .35s;}
#news .list>ul>li>a:hover .time{color: rgba(1,64,153,1);}
#news .list>ul>li>a:hover .con>.tit{color: rgba(1,64,153,1);}
#news .list>ul>li>a:hover .con>.more>span{ background: #666; border: 1px solid #666; color: #fff;}
#news .list>ul>li>a:hover .img>.pic{ transform: scale(1.2);}
#news .list>ul>li>a:hover .img:after{opacity: 1;}
#news .list>ul>li:hover{ background: #f7f7f7; transform: translateY(-6px);}



#news .view{ margin:0 auto;}
#news .view>.time{text-align:right; font-size:1.4rem; color:#999;padding:0 20px 20px 20px; border-bottom:1px solid #eee;}
#news .view>.content{margin:0 auto; padding:50px 0;}
#news .view>.content{ font-size:1.6rem; line-height:2.8rem; color:#666;}
#news .view>.content>p{margin-bottom:20px;}
#news .view>.content img{max-width:100%;height:auto;}
#news .view>.content table{ border-top:1px solid #ddd; border-left:1px solid #ddd; box-sizing: border-box; margin:0 auto; width:100%;}
#news .view>.content table td{ color:#666; font-size:1.4rem; padding:8px; text-align:center; border-right:1px solid #ddd; border-bottom:1px solid #ddd;}
#news .view>.content .tableWap{ overflow:hidden; overflow-x:auto;}
#news .view>.pageurl{margin:0 auto;padding:50px 0 80px 0;}
#news .view>.pageurl>.prev, #news .view>.pageurl>.next{ width:40%; padding:20px; text-align:left; background: #eee; overflow: hidden;text-overflow:ellipsis; white-space: nowrap;}
#news .view>.pageurl strong{font-weight:normal; vertical-align: top; font-size:1.6rem;color:#333;}
#news .view>.pageurl a{color: #666; transition: all .35s;}
#news .view>.pageurl a>span{display: inline-block; vertical-align: top; }
#news .view>.pageurl a:hover span{ text-decoration: underline; color: rgba(1,64,153,1);}








@media only screen and (max-width: 1460px){

    #news .list>ul>li>a .img{ width: 40%;}
    #news .list>ul>li>a .con{ margin-left: 40%; width: 40%;}


}

@media only screen and (max-width: 1380px){

    #news .list>ul>li>a .con{ padding:70px 50px;}

    #news .list>ul>li>a .time{ padding:70px 30px 0 0;}
    #news .list>ul>li>a .time>.dd{ font-size: 5rem;}
    #news .list>ul>li>a .time>.ym{ font-size: 2rem; }

}

@media only screen and (max-width: 1200px){

    #news .list>ul>li>a .con>.tit{font-size: 2.2rem; }


}


@media only screen and (max-width: 860px){

    #news .list>ul>li>a .img{float: none; position: relative; width: 100%;height: 400px;}
    #news .list>ul>li>a .con{float: none; width: 100%; margin-left: 0; padding: 40px !important;}
    #news .list>ul>li>a .time{ position: relative;z-index: 44;margin-top: -109px; background: rgba(1,64,153,.8); color: #fff!important; padding: 20px; text-align: center;width: auto;}
    #news .list>ul>li>a .time>.dd{ font-size: 4rem;}
    #news .list>ul>li>a .time>.ym{ font-size: 1.2rem; }

}


@media only screen and (max-width: 640px){

    #news .list>ul>li>a .img{height: 320px;}
    #news .list>ul>li>a .con>.tit{font-size: 2rem; }

    #news .view>.time{font-size:1.3rem;}
    #news .view>.content{ font-size:1.4rem; line-height:2.4rem; color:#666;}
    #news .view>.content table td{font-size:1.2rem; padding:5px; }
    #news .view>.pageurl{padding:30px 30px 50px 30px;}
    #news .view>.pageurl>.prev, #news .view>.pageurl>.next{ float:none; width:100%; box-sizing:border-box;}
    #news .view>.pageurl>.prev{padding-bottom: 10px; border-bottom: 1px solid #ddd;}
    #news .view>.pageurl>.next{padding-top: 10px;}
}

@media only screen and (max-width: 520px){

    #news .list>ul>li>a .img{height: 240px;}
    #news .list>ul>li>a .con>.tit{font-size: 1.8rem; }
    #news .list>ul>li>a .con>.txt{  font-size: 1.2rem; line-height:1.8rem;}
    #news .list>ul>li>a .time{padding: 10px; margin-top: -89px;}

}