@charset "utf-8";

#banner{width: 100%; height: 0; padding-bottom: 33.0729%; position: fixed; z-index: 1; left: 0; top: 0; background: #111;}
#banner>div{width: 100%; height: 100%; background: no-repeat center/cover; position: absolute; top: 0; z-index: 1;}
#banner .wrap{position: absolute; z-index: 2; left: 0; right: 0; margin: auto;}
#banner .con{position: relative; top: 55%;}
#banner .t2{margin: 15px 0 0 11.6%;}

/*---1440---*/
@media (max-width:1679px){

}
/*---1366---*/
@media (max-width:1439px){

}
/*---1280---*/
@media (max-width:1365px){

}
/*---MP---*/
@media (max-width:1279px){
  #banner{padding-bottom: 0; height: 80%;}
}


#space{height:0; padding-bottom: 33.0729%;}
/*---MP---*/
@media (max-width:1279px){
  #space{height: 80%; padding-bottom: 0;}
  #banner .con{top: 51%; text-align: center; transform: scale(.9);}
  #banner .t1, #banner .t2{margin: auto;}
  #banner .t2{margin-top: 15px;}
}


#path{position: relative; z-index: 2; background: #fff; color: #3e3a39; font-size: 1.7rem; padding: 60px 0 70px 0;}
#path a{color: #3e3a39;}
#path a:hover{color: #666;}


#m1{position: relative; z-index: 2; background: #191919 url('../img/east.m1.jpg') no-repeat center/cover; height: 100%;}
#m1 .wrap{padding-left: 70px; box-sizing: border-box;}
#m1 .wrap .t1{padding-top: 85px;}
#m1 .wrap .t2{margin-top: 85px;}


#list{position: relative; z-index: 2; background: #fff; padding-top: 80px;}
#list .wrap{display: flex; flex-wrap: wrap; justify-content: space-between;}
#list .wrap>a{display: block; width: calc((100% - 60px)/3); margin-bottom: 80px;}
#list .wrap>a .img{height: 0; padding-bottom: 60.87%; background: #f3f3f3; position: relative; overflow: hidden;}
#list .wrap>a .img>div{position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: #191919 no-repeat center/cover; transition: all .5s;}
#list .wrap>a:hover .img>div{transform: scale(1.07);}
#list .wrap>a .tit{background: #eee; height: 100px; line-height: 90px; font-size: 1.9rem; color: #3e3a39; text-align: center; font-weight: 300; padding: 0 15px; transition: all .3s;}
#list .wrap>a:hover .tit{background: #ddd;}


#pager{position: relative; z-index: 2; background: #fff; padding-bottom: 100px; text-align: center; font-size: 2rem; font-weight: 300;}
.pagination li{display: inline-block; margin: 0 3px;}
.pagination li.disabled{color: #ccc;}
.pagination li a, .pagination li span{display: inline-block; padding: 10px; font-size: 2rem;}
.pagination li.active{color: #000;}


/*---1440---*/
@media (max-width:1679px){
  #m1 .wrap .t1 img{height: 285px;}
  #m1 .wrap .t2{margin-top: 70px;}
  #m1 .wrap .t2 img{height: 270px;}
}
/*---1366---*/
@media (max-width:1439px){
  #path{font-size: 1.6rem;}

  #m1 .wrap .t1 img{height: 260px;}
  #m1 .wrap .t2{margin-top: 65px;}
  #m1 .wrap .t2 img{height: 250px;}

  #list .wrap>a .tit{font-size: 1.7rem;}

  .pagination li a, .pagination li span{font-size: 1.8rem;}
}
/*---1280---*/
@media (max-width:1365px){
  #path{font-size: 1.5rem;}


}
/*---MP---*/
@media (max-width:1279px){
  #path{font-size: 1.5rem; padding: 50px 15px;}

  #m1{height: 400px;}
  #m1 .wrap{padding-left: 30px;}
  #m1 .wrap .t1{padding-top: 50px;}
  #m1 .wrap .t1 img{height: 100px;}
  #m1 .wrap .t2{margin-top: 30px;}
  #m1 .wrap .t2 img{height: 160px;}

  #list{padding: 50px 15px 0 15px;}
  #list .wrap{display: block;}
  #list .wrap>a{display: block; width: 100%; margin-bottom: 50px;}
  #list .wrap>a .tit{font-size: 1.7rem;}

  #pager{padding-bottom: 80px;}
}


