@charset "utf-8";

#banner{width:100%; height: 470px; background: #fafafa no-repeat center/cover;}
#banner .wrap{position: relative; top: 41.6%; left: -10px; font-size: 4.2rem; font-family: 'Microsoft Jhenghei', 'Microsoft YaHei'; color: #2b2b2b;}
#banner .wrap>span{display: inline-block;}


#space{height: 100px;}

@media (max-width:1279px){ /*mp*/
  #banner{display: none;}
  #mp-head{background: #0071bb; height: 80px;}
  #space{height: 120px;}
}

/* 栏目菜单 */
#child{background: none; padding: 0; position: relative; top: -40px;}
#child .wrap>a{width:33.33%;}

@media (max-width:1279px){ /*mp*/
  #child .wrap{height: 48px;}
  #child .wrap>a{line-height: 47px; font-size: 1.3rem;}
  #child .wrap>a::after{height: 1.3rem; top: 17px;}
}


/* 简介 */
#about{padding: 30px 0 0 0;}
#about .m1{background: url('../images/building.png') no-repeat right bottom; position: relative; padding-bottom: 260px;}
#about .m1::after{content: ''; display: block; width: 100%; height: 220px; background: rgba(0, 70, 150, 0.9); position: absolute; left: 0; bottom: 0; z-index: 1;}
#about .m1>.wrap>.tit,#honor .wrap>.tit{font-size: 3.9rem; color: #2b2b2b; font-family: 'Microsoft Jhenghei', 'Microsoft YaHei';}
#about .m1>.wrap>.tit-en,#honor .wrap>.tit-en{color: #bbb; font-size: 1.5rem; font-family: 'Montserrat'; margin-top: 12px;}
#about .m1>.wrap>.desc{margin: 60px 0; font-size: 1.7rem; font-weight: 300; line-height: 2.1; max-width: 55%;}
#about .m1 .wrap .desc p{font-size: 1.6rem; margin-bottom: 25px; line-height: 2.1; font-weight: 300;}


#about .m1 .brand{width: 100%; height: 220px; position: absolute; left: 0; bottom: 0; z-index: 2;}
#about .m1 .brand>.wrap{display: flex; justify-content: space-between; align-items: center; height: 100%;}
#about .m1 .brand>.wrap .slogan{color: #fff; font-size: 3.8rem;}
#about .m1 .brand>.wrap .slogan span{font-weight: bold; vertical-align: middle; display: inline-block; letter-spacing: .1rem; position: relative; top: -4px;}
#about .m1 .brand>.wrap .slogan i{font-style: normal; font-size: 1.2rem; vertical-align: middle; display: inline-block; margin: 0 25px; position: relative; top: -4px;}


/* 荣誉 */
#honor{padding: 30px 0 120px 0;}

.cert-list{margin-top: 30px;display: flex; flex-wrap: wrap; }
.cert-list>li{width:20%; height:320px; border:1px solid #eee; margin:0 0 -1px -1px; transition:all .3s; box-sizing:border-box;background-color: #fff;}
.cert-list>li>a{display:block; width:100%; height:100%; overflow:hidden; position:relative;}
.cert-list>li>a>.img{width:auto; height:240px; margin:auto; margin-top: 20px; text-align:center; overflow:hidden;}
.cert-list>li>a>.img>img{max-width:90%;max-height:100%;}
.cert-list>li>a>p{height:50px; padding:0 10px; line-height:48px; text-align:center; font-size:13px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; position:relative; z-index:2; transition:all .25s;}
.cert-list a:after{ position:absolute; z-index:9; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0) url("../images/icon-zoom.png") no-repeat; background-position:50% -50%; content:''; transition:all .35s;}
.cert-list a:hover:after{background:rgba(0,0,0,.7) url("../images/icon-zoom.png") no-repeat;background-position:50% 50%;}



@media (max-width:1679px){ /*1440*/
  #about .m1>.wrap>.tit{font-size: 3.8rem;}
  #about .m1>.wrap>.tit-en{font-size: 1.4rem;}
  #about .m1>.wrap>.desc{font-size: 1.6rem;}

}
@media (max-width:1439px){ /*1366*/
  #banner{height: 450px;}

  #about .m1>.wrap>.desc{font-size: 1.5rem;}

}
@media (max-width:1365px){ /*1280*/

}
@media (max-width:1279px){ /*mp*/
  #about{padding: 0 15px 0 15px;}

  #about .m1{background: none; padding-bottom: 180px;}
  #about .m1::after{height: 150px;}
  #about .m1>.wrap>.tit,#honor .wrap>.tit{font-size: 2.4rem;}
  #about .m1>.wrap>.tit-en, #honor .m1>.wrap>.tit-en{font-size: 1.2rem; margin-top: 6px;}
  #about .m1>.wrap>.desc{margin: 30px 0; font-size: 1.5rem; line-height: 1.7; max-width: unset;}


  #about .m1 .brand{height: 150px;}
  #about .m1 .brand>.wrap{display: block;}
  #about .m1 .brand>.wrap .slogan{font-size: 2rem; text-align: center; margin-top: 10px;}
  #about .m1 .brand>.wrap .slogan span{font-weight: bold;}
  #about .m1 .brand>.wrap .slogan i{transform: scale(.5); margin: 0 5px;}
  #about .m1 .brand>.wrap .slogan i:nth-of-type(2){display: none;}
  #about .m1 .brand>.wrap .logo{text-align: center; padding-top: 20px;}
  #about .m1 .brand>.wrap .logo>img{height: 60px;}

  #honor{padding: 0 15px 20px 15px;}
  .cert-list>li{width:50%; height:auto;}
  .cert-list>li>a>.img{width:auto; height:auto;}

}