html{overflow:auto;overflow-y:scroll; scroll-behavior:smooth;}
body { background:#fff; font-family: "Microsoft yahei";  font-size: 14px;overflow-x:hidden, line-height: 2rem;color: #555;}
*{-webkit-margin-before:0px;-webkit-margin-after:0px;-webkit-padding-start:0px;}
img{border:none; max-width: 100%;}
a{color:#555;  text-decoration:none;}
a:hover{color:#f2972c;  text-decoration:none;transition: all .3s;}
ul,li{list-style:none;margin:0;}
h1,h2,h3,h4,h5,h6,p{margin:0;}
input,i{border:none;outline:none;}
*:focus{border:none;outline:none;}
img{max-width: 100%;}
.fl{ float: left;}
.fr{ float: right;}
.clear{clear: both;}
label{ max-width: none; }
.ellipsis{text-overflow: ellipsis;overflow: hidden;white-space:nowrap;}
.clamp{text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow: hidden;}
.wrap{width:100%;margin:0 auto;}
body{--zhu-color:#284b87;--pei-color:#f39800;}

.pc{ display: none;}
.wap{ display: block;}
@media (min-width:992px){ 
    .pc{ display: block;}
    .wap{ display: none;}
}
@media (min-width:1200px){ 
    .pc{ display: block;}
    .wap{ display: none;}
}
.inner{ width: 1400px; margin:0 auto; }
@media only screen and (max-width: 1400px){
  .inner{ width: 100%; box-sizing: border-box; padding:0 15px; }
}
@media only screen and (max-width: 640px){
  .inner{ padding:0; }
}
.w100{ width: 100%;}


@font-face {
  font-family: 'iconfont';  /* Project id 2996838 */
  src: url('//at.alicdn.com/t/font_2996838_zeqdqenfkb.woff2?t=1640922227316') format('woff2'),
       url('//at.alicdn.com/t/font_2996838_zeqdqenfkb.woff?t=1640922227316') format('woff'),
       url('//at.alicdn.com/t/font_2996838_zeqdqenfkb.ttf?t=1640922227316') format('truetype');
}



.iconfont{
    font-family:"iconfont" !important;
    font-size:16px;font-style:normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
}
/*--- header ---*/
.welcome{ height: 38px; background: #292929; line-height: 38px; overflow: hidden;}
.w-txt{ width: 90%; float: left; color: #757474;}
.fav{ width: 30%; text-align: right;  float: right; color: #979797; }
.fav span{ color: var(--pei-color); font-size: 16px; font-weight: 700;}
.fav a{color: #979797;}
.fav a:hover{color:var(--pei-color) }
@media (min-width:992px){ 
.w-txt{ width: 70%; }
}
@media (min-width:1200px){ 
.w-txt{ width: 70%; }
}
/*--- nav ---*/
.header{ padding: 15px 0;}
.logo{ width: 75%; float: left;}

@media (min-width:992px){ 
.logo{ width: 25%; }
.header{ padding: 30px 0;}
}
@media (min-width:1200px){ 
.logo{ width: 25%; }
.header{ padding: 30px 0;}
}
.nav{ width: 73%; padding-top: 35px; float: right;}
.nav li{ width: 11.1%; float: left; text-align: center;}
.nav li a{ font-size: 16px;}
.nav li a:hover{ color: #e87b2b; font-weight: 700;}
.nav ul li ul {left: -999em; width: 130px; background: #fff; padding-top: 20px; position: absolute; z-index: 99999 }
.nav ul li ul li{width: 150px;  font-size:12px; line-height:45px; height:45px;}
.nav ul li ul li a{display: block; width: 130px;w\idth: 130px;text-align:center; color:#000; text-indent:0; height:45px;}
.nav ul li ul li a:hover{ color:#fff; background: var(--zhu-color); height:45px;}
.nav ul li:hover ul {left: auto;}
.nav ul li.sfhover ul {left: auto;}

.h-right{width: 3rem;height:2.35rem;float: right; margin-top: 2rem;}
.h-right span{width: 3rem;height: 2.35rem;background: url(../images/nav-btn.png) no-repeat;background-size: 3rem 2.35rem;display: block;}
.h-right ul{display: none;}
.fancynav-mainnav{position: fixed!important;}

.banner{ overflow: hidden;}
/*--- main ---*/
.m-hd{ padding: 26px 0; overflow: hidden;}
.m-hd-list{ background: #f7f7f7; overflow: hidden;}
.m-tel{ width: 100%; padding: 15px 0 0 30px; float: left; height: 86px; background: #f39800; overflow: hidden; color: #fff;}
.m-tel .img{ float: left; width: 50px;}
.m-tel .img .iconfont{ font-size: 43px;}
.m-tel .txt{ float: left; width: calc(100% - 60px);  line-height: 20px; padding-top: 10px;}
.m-tel .txt span{ font-weight: 700; font-size: 24px;}

.key{ width: 100%; float: left; height: 56px; padding: 20px 0 0 0;}
.key span{ color: #000;}
.key a{ margin-right: 10px;}

.serch{ width: 100%; float: right; height: 30px; margin: 10px 0 0 0; border-left: none;}
.serch-box{ margin-left: 0px; height: 30px; border-bottom: 1px solid #d9d9d9; line-height: 30px;}
.search-text{ border: none; background: none; width: calc(100% - 40px); float: left;}
.go{ width: 32px; float: right; height: 30px; background: url(../images/go.png) no-repeat left center; border: none;}

@media (min-width:992px){ 
  .m-tel{ width: 22.9%;}
  .key{ width:50%; height: 86px; padding: 33px 0 0 30px;}
  .serch{ width:21%;margin: 33px 0 0 15px;border-left: 1px solid #d9d9d9;}
  .serch-box{ margin-left: 22px;}
  .m-tel .txt span{  font-size:18px;}
}
@media (min-width:1200px){ 
  .m-tel{ width: 22.9%; }
  .key{ width:50%; height: 86px; padding: 33px 0 0 30px;}
  .serch{ width:21%; margin: 33px 0 0 15px;border-left: 1px solid #d9d9d9;}
  .serch-box{ margin-left: 27px;}
  .m-tel .txt span{  font-size: 20px;}
}

@media (min-width:1400px){ 

  .m-tel .txt span{  font-size: 24px;}
}



.m-p{ width: 100%; height: auto; background: #f9f9f9; overflow: hidden;}
.m-p-sidebar{ width: 22.9%; float: left; overflow: hidden; background: none;}
@media (min-width:992px){ 
  .m-p-sidebar{background: #294b88;}
}


.m-p-sidebar .hd{ padding: 20px 0 20px 30px; color: #fff;}
.m-p-sidebar .hd span{ font-size: 30px; font-weight: 700;}
.m-p-sidebar .bd{ background: #fff; padding: 10px 0; overflow: hidden;}
.one{ width: 100%; height: 50px;margin-bottom: 15px; line-height: 65px; text-indent: 47px;}
.one a{ color: #2a497e; font-size: 24px; font-weight: 700;}
.two{ width: 100%; height: 58px; border-bottom: 1px solid #f2f3f4;  overflow: hidden;position:relative;}
.two .c11{ margin-right: 30px;  position: relative;top: 6px;left: 1px;}
.two .c11 .iconfont{ font-size: 35px;}
.two .c22{ position: absolute; right:26px; top:5px; z-index:999}
.two .c22 .iconfont{ font-size: 18px;}
.two a{ display: block; text-indent: 47px; width: 100%; height: 58px;line-height: 52px; font-size: 16px;}
.two a:hover{ color: #fff; text-indent: 55px; background: #284b87;transition: all .3s;}
.two a:hover .c22{ right:20px; transition: all .3s;}


@media (min-width:992px){ 
.two a{ text-indent: 20px; }
.two a:hover{ text-indent: 25px;}
.two .c11{ margin-right: 20px; }
.two .c22{ right:6px;}
.two a:hover .c22{ right:5px;}
}
@media (min-width:1200px){ 
  .two a{ text-indent: 47px; }
  .two a:hover{ text-indent: 55px;}
  .two .c11{ margin-right: 30px;}
  .two .c22{ right:26px;}
  .two a:hover .c22{ right:20px;}
}





.m-p-list{ width: 100%; float: right;}
.m-p-list .hd{ text-align: center; color: #334764; font-weight: 700; font-size: 20px; line-height: 25px; padding: 10px 0}
.m-p-list .md{ width: 95%; margin: 10px auto; overflow: hidden;}
.m-p-list .md li{ width: 33.3%; float: left; overflow: hidden;}
.m-p-list .md li a{ display: block; width: 95%; margin: 0 auto; height: 40px; line-height: 40px; text-align: center; background: #284b87; color: #fff;}

.m-p-list .bd{ padding: 10px 0; overflow: hidden;}
.m-p-list .bd li{ width: 48%; margin: 0 .5%; float: left;  margin-bottom: 10px;}

.m-p-list .bd a{ display: block; box-sizing: border-box; background: #fff;  position: relative; overflow: hidden; }
.m-p-list .bd a .info{ text-align: center; position: relative; height: 200px; z-index: 33; padding: 20px 0;  overflow: hidden;}
.m-p-list .bd a .info .title{font-size: 16px; color: #334764; line-height: 1.3; display: block; margin-top: 3px; }
.m-p-list .bd a .info .more{ display: inline-block; font-weight: normal; font-size: 12px; color: #999; text-transform: uppercase; line-height: 1; margin: 5px 0; }
.m-p-list .bd a .info .line{ display: none;}
.m-p-list .bd a .img{ width: 100%; padding-bottom: 70%; position: relative; overflow: hidden; top:0; transition: all .3s; }
.m-p-list .bd a .img img{ width: 100%; height: 100%; object-fit: contain; position: absolute; transition: all .3s; left:0; }
.m-p-list .bd a .content{ display: none;}
.m-p-list .bd a::before{ transition: all 0.3s ease-out; content: ""; display: inline-block; width: 1; height: 1; border-radius: 50%; background:#3b537e url(../images/p-bg.png) no-repeat top center; position: absolute; left: 50%; top:50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); }
.m-p-list .bd a:hover::before{ transition: all .3s  ease-out; width: 100%; height: 100%; border-radius: 0; }
.m-p-list .bd a:hover .title{ color: #fff; font-size: 17px; transition: all .3s;}
.m-p-list .bd a:hover .info .more{display: none;}
.m-p-list .bd a:hover .info .line{ display: block; margin: 15px auto; width: 36px; height: 2px; background: #fff;}
.m-p-list .bd a:hover .content{ display: block; width: 80%; margin: 0 auto; padding: 10px 0 20px 0; font-size: 12px; line-height: 24px; color: #fff;}
.m-p-list .bd a:hover .img{ display: none; transition: all .3s; }

@media (min-width:992px){ 
  .m-p{ height: 1069px; background: url(../images/m-product-bg.jpg) no-repeat top center;}
  .m-p-list{ width: 75%;}
  .m-p-list .hd{  font-size: 30px; line-height: 75px;}
  .m-p-list .bd li{ width: 32.3%;}
  .m-p-list .bd a .info{  height: 315px; padding: 30px 0; }
  .m-p-list .bd a .info .title{font-size: 18px;  }
  .m-p-list .bd a .info .more{  margin:6px 0; }
  .m-p-list .bd a:hover .title{font-size: 26px; }
  .m-p-list .bd a:hover .info .line{ margin: 15px auto;}
  .m-p-list .bd a:hover .content{  width: 80%; margin: 0 auto; padding: 10px 0 40px 0; font-size: 14px; line-height: 30px;}
}
@media (min-width:1200px){ 
  .m-p{ height: 1069px; background: url(../images/m-product-bg.jpg) no-repeat top center;}
  .m-p-list{ width: 75%;}
  .m-p-list .hd{ font-size: 30px; line-height: 75px;}
  .m-p-list .bd li{ width: 32.3%;}
  .m-p-list .bd a .info{  height: 315px; padding: 30px 0; }
  .m-p-list .bd a .info .title{font-size: 22px;  }
  .m-p-list .bd a .info .more{  margin: 6px 0; }
  .m-p-list .bd a:hover .title{font-size: 26px; }
  .m-p-list .bd a:hover .info .line{ margin: 15px auto;}
  .m-p-list .bd a:hover .content{  width: 80%; margin: 0 auto; padding: 10px 0 40px 0; font-size: 16px; line-height: 35px;}
}

.m-cc{display: none; width: 100%; height: 40px; background: #f5f5f5; overflow: hidden;}

.m-line{ padding: 10px 0; overflow: hidden;}
.m-linebox{ border: 16px solid #f6f6f6; background:none; height: auto; overflow: hidden;}
.m-l-1{ width: 100%; padding-left: 0;}
.m-l-1 .img{ width: 55px; padding-top: 10px; float: left;}
.m-l-1 .img .iconfont{ font-size: 55px; color: #284b87;}
.m-l-1 .txt{width: calc(100% - 65px); float: right; color: #f39800; line-height: 20px; padding-top: 30px; font-size: 14px;}
.m-l-1 .txt span{ color: #666; font-size: 12px;}
@media (min-width:992px){ 
  .m-l-1 .txt{ font-size:16px;}
  .m-l-1 .txt span{ font-size: 13px;}
}
@media (min-width:1200px){ 
    .m-l-1 .txt{ font-size:16px;}
    .m-l-1 .txt span{ font-size: 14px;}
}

@media (min-width:1400px){ 
  .m-l-1 .txt{ font-size: 24px;}
  .m-l-1 .txt span{ font-size: 16px;}
}






.m-l-2{ width: 100%; padding: 20px 0;  padding-left: 0; float: right;}
.m-l-2 li{ float: left;}
.m-l-2 .more1{ width: 33.3%;}
.m-l-2 .more1 a{display: block; width: 93%; height: 43px; background: #f39800; text-align: center; line-height: 43px; border-radius: 20px; color: #fff;}
.m-l-2 .more1 a:hover{ width: 98%;transition: all .3s;}
.m-l-2 .more2{ width: 33.3%;}
.m-l-2 .more2 a{display: block; width: 93%; height: 43px; background: #fff; border: 1px solid #f39800; border-radius: 20px; text-align: center; line-height: 43px; color: #f39800;}
.m-l-2 .more2 a:hover{ width: 98%; color: #fff; background: #f39800; transition: all .3s;}
.m-l-2 .more3{ width: 33.3%;}
.m-l-2 .more3 a{display: block; width: 93%; height: 43px; background: #f39800; text-align: center; line-height: 43px; border-radius: 20px; color: #fff;}
.m-l-2 .more3 a:hover{ width: 98%;transition: all .3s;}
@media (min-width:992px){ 
.m-line{ padding: 30px 0; overflow: hidden;}
.m-linebox{  background: url(../images/m-line.jpg) no-repeat right center; height: 132px; }
.m-l-1{ width: 25%; float: left; padding-left: 20px;}
.m-l-2{ width: 73%; padding-top: 30px; float: right; padding-left: 35px;}
.m-cc{display: block;}
}
@media (min-width:1200px){ 
.m-line{ padding: 30px 0; overflow: hidden;}
.m-linebox{  background: url(../images/m-line.jpg) no-repeat right center; height: 132px; }
.m-l-1{ width: 25%; float: left; padding-left: 20px;}
.m-l-2{ width: 73%; padding-top: 30px; float: right; padding-left: 35px;}
.m-cc{display: block;}
.m-l-2 .more1{ width: 174px; margin-right: 95px;}
.m-l-2 .more2{ width: 174px; margin-right: 33px;}
.m-l-2 .more3{ width: 174px;}
}

.m-company{ width: 100%; background: url(../images/company-bg.jpg) no-repeat center fixed; height: auto; overflow: hidden;}
.companybox{ background: url(../images/company-bg.png) no-repeat bottom center;}
.m-company .hd{ text-align: center; line-height: 26px; padding-top: 25px; color: #fff; font-size: 22px;}
.m-company .hd span{ font-size: 14px;}
.m-company .bd{ margin-top: 10px; overflow: hidden; background: #fff;}
.m-company .bd .txt{ width: 100%; float: left; padding: 15px;}
.m-company .bd .txt .title{ color: #333; font-size: 30px; font-weight: 700; padding-bottom: 10px;}
.m-company .bd .txt .content{ font-size: 15px; line-height: 30px; color: #666;}
.m-company .bd .txt .content a{ color: #f39800;}
.m-company .bd .txt .content a:hover{ color: #37507c;}
.m-company .bd .txt .cr{ padding-top: 10px; overflow: hidden;}
.m-company .bd .txt .cr li{ width: 48%; float: left; margin: 5px 1%; height: 166px; text-align: center; padding: 10px 0; border: 1px solid #afb9cb;}
.m-company .bd .txt .cr li .img{ width: 40px; height: 40px; margin: 0 auto; text-align: center; background: #37507c; border-radius: 20px; line-height: 40px;}
.m-company .bd .txt .cr li .img .iconfont{ color: #fff; font-size: 30px;}
.m-company .bd .txt .cr li .txtc1{ font-size: 20px; color: #333; padding: 8px 0; font-weight: 700;}
.m-company .bd .txt .cr li .cccline{ width: 16px; height: 2px; margin: 0 auto; background: #37507c; overflow: hidden;}
.m-company .bd .txt .cr li .txtc2{ font-size: 16px;  color: #333; line-height: 26px; padding-top: 5px;}
.m-company .bd .txt .cr li:hover{ background: #37507c; border: 1px solid #37507c;transition: all .3s;}
.m-company .bd .txt .cr li:hover .img{  background: #fff; border-radius: 20px; line-height: 40px;transition: all .3s;}
.m-company .bd .txt .cr li:hover .img .iconfont{ color: #37507c; transition: all .3s;}
.m-company .bd .txt .cr li:hover .txtc1{  color: #fff;transition: all .3s;}
.m-company .bd .txt .cr li:hover .cccline{ width:46px; background: #fff; transition: all .3s;}
.m-company .bd .txt .cr li:hover .txtc2{  color: #fff;transition: all .3s;}
.m-company .bd .wcimg{ width: 100%; float: right;}
@media (min-width:992px){ 
.m-company{  height: 828px;}
.m-company .hd{  line-height: 35px; padding-top: 95px;  font-size: 48px;}
.m-company .hd span{ font-size: 18px;}
.m-company .bd{ margin-top: 40px;}
.m-company .bd .txt{ width: 50%; float: left; padding: 30px}
.m-company .bd .txt .title{ padding-bottom: 10px;}
.m-company .bd .txt .cr{ padding-top: 10px; overflow: hidden;}
.m-company .bd .txt .cr li{ width: 21%;  margin: 0 2%;}
.m-company .bd .wcimg{ width: 50%; float: right;}
.m-company .bd .txt .cr li .img{ width: 30px; height: 30px; border-radius: 15px; line-height: 30px;}
.m-company .bd .txt .cr li .img .iconfont{font-size: 20px;}
.m-company .bd .txt .cr li .txtc1{ font-size: 14px;  padding: 8px 0;}
.m-company .bd .txt .cr li .txtc2{ font-size: 13px;  }
}
@media (min-width:1200px){ 
.m-company{  height: 828px;}
.m-company .hd{  line-height: 35px; padding-top: 95px;  font-size: 48px;}
.m-company .hd span{ font-size: 18px;}
.m-company .bd{ margin-top: 40px;}
.m-company .bd .txt{ width: 50%; float: left; padding:  50px 60px}
.m-company .bd .txt .title{ padding-bottom: 30px;}
.m-company .bd .txt .cr{ padding-top: 40px; overflow: hidden;}
.m-company .bd .txt .cr li{ width: 21%;  margin: 0 2%;}
.m-company .bd .wcimg{ width: 50%; float: right;}
.m-company .bd .txt .cr li .img{ width: 40px; height: 40px; margin: 0 auto; text-align: center; background: #37507c; border-radius: 20px; line-height: 40px;}
.m-company .bd .txt .cr li .img .iconfont{ color: #fff; font-size: 30px;}

.m-company .bd .txt .cr li .txtc1{ font-size: 20px; color: #333; padding: 8px 0; font-weight: 700;}
.m-company .bd .txt .cr li .cccline{ width: 16px; height: 2px; margin: 0 auto; background: #37507c; overflow: hidden;}
.m-company .bd .txt .cr li .txtc2{ font-size: 16px;  color: #333; line-height: 26px; padding-top: 5px;}
}

.m-ys{ background: url(../images/ys-bg.jpg) no-repeat top center; padding: 34px 0;}
.m-ys .hd{ text-align: center; line-height: 35px; color: #2a4a80; font-size: 20px;}
.m-ys .hd span{ font-size: 14px; color: #666;}
.m-ys .bd{ margin-top: 20px}
.m-ys .bd ul{   margin-top: 10px;position:relative;transition: all .5s;}
.m-ys .bd ul .img{ width: 100%; overflow: hidden;}
.m-ys .bd ul .img img{ width: 100%;}
.m-ys .bd ul .clok{ width: 100%; height: 85px; position: absolute; left:0; bottom:75px; z-index:2;transition: all 1s;}
.m-ys .bd ul .clokint{ width: 85px; height: 85px; margin: 0 auto; background: #f39800; border-radius: 50%; text-align: center; line-height: 85px;}
.m-ys .bd ul .clokint .iconfont{ color: #fff; font-size: 40px;}
.m-ys .bd ul .clokint .f32{ font-size: 50px;}
.m-ys .bd ul .clok1{ width: 100%; text-align: center; color: #fff; font-size: 24px;position: absolute; font-weight: 700; left:0; bottom:27px; z-index:2;transition: all 1s;}
.m-ys .bd ul .clok2{ display: none; width: 100%; height: 2px; position: absolute; left:0; bottom:257px; z-index:2;transition: all 1s;}
.m-ys .bd ul .clok2 span{ width: 34px; height: 2px; background: #fff; margin: 0 auto;}
.m-ys .bd ul .clok3{  display: none; width: 100%; height: 60px;position: absolute;left:0; bottom:0; z-index:2;transition: all 1s;}
.m-ys .bd ul .clok3txt{ width: 80%; margin: 0 auto; color: #fff; font-size: 18px;} 
.m-ys .bd ul .cbg{ width: 100%; height: 102px; background: #32528b; position: absolute; left:0; bottom:0; z-index:1;transition: all 1s;}

.m-ys .bd ul:hover{margin-top: 0; transition: all 1s;}
.m-ys .bd ul:hover .clok{  bottom:310px;transition: all 1.3s;}
.m-ys .bd ul:hover .clok1{ bottom:255px; transition: all 1.3s;}
.m-ys .bd ul:hover .clok2{ display: block; transition: all 1.3s;}
.m-ys .bd ul:hover .clok3{  display: block; bottom:130px; transition: all 1.3s;}
.m-ys .bd ul:hover .cbg{ height: 100%; background:rgba(0,0,0,.6);  bottom:0; transition: all 1s;}

@media (min-width:700px){ 
  .m-ys .bd ul:hover .clok1{ bottom:205px;}
  .m-ys .bd ul:hover .clok{  bottom:250px;transition: all 1.3s;}

}

@media (min-width:992px){ 
  .m-ys .bd ul:hover .clok1{ bottom:150px;}
  .m-ys .bd ul:hover .clok{  bottom:200px;transition: all 1.3s;}
  .m-ys .bd ul:hover .clok3{ bottom:50px;  font-size: 12px;}
}


@media (min-width:1100px){ 
  .m-ys{  padding: 64px 0 101px 0}
  .m-ys .hd{ line-height: 45px;  font-size: 40px;}
  .m-ys .hd span{ font-size: 18px; }
  .m-ys .bd{ margin-top: 64px}
  .m-ys .bd ul{ margin-top: 50px;}
  .m-ys .bd ul:hover .clok1{ bottom:205px;}
  .m-ys .bd ul:hover .clok{  bottom:250px;transition: all 1.3s;}
}
@media (min-width:1200px){ 
  .m-ys{  padding: 64px 0 101px 0}
  .m-ys .hd{ line-height: 45px;  font-size: 40px;}
  .m-ys .hd span{ font-size: 18px; }
  .m-ys .bd{ margin-top: 64px}
  .m-ys .bd ul{  margin-top: 50px; }
}

.m-news{ padding: 60px 0 30px 0; overflow: hidden;}
.m-news .hd{ text-align: center; font-size: 20px; color: #2a4a80;}
.m-news .bd{ padding-top: 14px;}
.o-news{ width: 100%; background: #f6f6f6; padding: 25px; margin-bottom: 10px;}
.n1 .title{ color: #333; font-size: 18px;}
.n1 .time{ color: #999; margin: 10px 0 20px 0; font-size: 16px;}
.n1 .content{ color: #666; font-size: 14px; line-height: 25px; height: 70px; overflow: hidden;}
.n1 .img{ margin-top: 32px;}
.n1 .img img{ width: 100%; height: 150px; object-fit:cover;}
.n1:hover{ background: #284b87;transition: all .5s;}
.n1:hover .title{ color: #fff;transition: all .5s; }
.n1:hover .time{ color: #fff;transition: all .5s;}
.n1:hover .content{ color: #fff;transition: all .5s;}
.n1:hover .img img{transform: scale(1.02);transition: all .5s;}
.n2{padding: 10px!important;}
.n2 ul{ border-bottom: 1px solid #e7e4e4; padding: 0 15px;}
.n2 ul .title{ color: #333; font-size: 18px; padding-top: 13px;}
.n2 ul .time{ color: #999; margin: 8px 0; font-size: 16px;}
.n2 ul .content{ height: 25px; margin-bottom: 10px; color: #666; font-size: 14px; line-height: 25px; }
.n2 ul:hover{ background: #284b87;transition: all .5s;}
.n2 ul:hover .title{ color: #fff;text-indent: 10px;transition: all .5s;}
.n2 ul:hover .time{ color: #fff; text-indent: 10px;transition: all .5s;}
.n2 ul:hover .content{ text-indent: 10px;color: #fff;transition: all .5s;}
@media (min-width:992px){ 
.m-news .hd{ font-size: 40px;}
.m-news .bd{ padding-top: 34px;}
.o-news{ width: 31.3%; margin: 0 1%; float: left;padding:30px 25px ;}
.n1 .img img{  height: 230px; }
.n2{padding:30px 25px!important;}
.n2 ul .title{  padding-top: 18px;}
.n2 ul .time{  margin: 10px 0 20px 0; }
.n2 ul .content{ margin-bottom: 21px; }
}
@media (min-width:1200px){ 
.m-news .hd{ font-size: 40px;}
.m-news .bd{ padding-top: 34px;}
.o-news{ width: 31.3%; margin: 0 1%; float: left;padding:30px 25px;}
.n1 .img img{  height: 250px; }
.n2{padding:30px 25px!important;}
.n2 ul .title{  padding-top: 18px;}
.n2 ul .time{  margin: 10px 0 20px 0; }
.n2 ul .content{ margin-bottom: 21px; }
}
/*--- sidebar ---*/ 

/*--- company ---*/

/*--- product ---*/

/*--- footer ---*/
.footer{  background: #333; padding: 20px 0; margin-bottom: 7rem;}
.f-top{ padding-bottom: 10px; border-bottom: none; overflow: hidden;}
.f-top .ft1{ width: 100%; text-align: center;}
.f-top .ft1 img{ max-width: 90%;}
.f-top .ft2{ width: 74%; float: right; text-align: right; line-height: 65px; color: #626161; font-size: 16px;}
.f-top .ft2 a{ color: #fff; font-size: 16px;}
.f-top .ft2 a:hover{ color: var(--pei-color);}
.f-bot{ padding-top: 2px;}
.ft3{ width: 100%; text-align: center;}
.ft3 ul{ padding-top: 15px; line-height: 35px; color: #666; font-size: 16px;}
.ft3 ul span{ margin-right: 5px;}
.ft4{ background: #333e52; width: 150px; height: 110px; float: right;}
.ewm1{ width: 110px; height: 110px; float: left;}
.ewm1 img{ width: 110px; height: 110px;}
.ewm2{ width: 30px; padding-top: 5px; float: right; height: 110px; font-size: 14px; color: #fff;line-height: 16px;}

@media (min-width:992px){ 
.footer{  padding: 40px 0; margin-bottom: 0;}
.f-top{ padding-bottom: 30px; border-bottom:1px solid #575757;}
.f-top .ft1{ width: 25%; float: left; text-align: left;}
.f-top .ft1 img{ max-width: 90%;}
.f-bot{ padding-top: 40px;}
.ft3{  width: calc(100% - 160px); float: left; text-align: left}

}
@media (min-width:1200px){ 
.footer{  padding: 40px 0; margin-bottom: 0;}
.f-top{ padding-bottom: 30px; border-bottom:1px solid #575757;}
.f-top .ft1{ width: 25%; float: left; text-align: left;}
.f-top .ft1 img{ max-width: 90%;}
.f-bot{ padding-top: 40px;}
.ft3{  width: calc(100% - 160px); float: left; text-align: left}
}


#end{ width:100%; background: #284b87; height: 7rem; position: fixed; bottom:0; z-index: 9999999; overflow: hidden;}
#end li{ width: 25%; height: 6rem; padding-top: .8rem;  float: left; text-align: center; overflow: hidden;}
#end li img{ max-width: 35%;}
#end li a{ color: #fff; font-size: 15px;}
#end li a:hover{ color: #f00;}

/*--- Universal ---*/
#newTitle{color:#333;font-size:24px;text-align:center; padding: 25px 0 5px 0; overflow: hidden;}
#newsContent{margin-bottom:16px;}
#newsInfo{ text-align: center; color: #999; font-size: 12px; margin-bottom:26px;}
#prev_next{ width: 95%; margin: 0 auto; padding: 35px 0 20px 0; overflow: hidden;}
#prev_next li{ width: 50%; float: left;}

.infoClass{margin:0px;margin-bottom:10px;line-height:12px;}
#infoImage{text-align:center;margin:10px 0;}
#infoImage img{padding:1px; border:1px solid #dedede;}

.message-box ul{ margin-bottom: 10px; overflow: hidden;}
.tl{ float: left; width: 15%; text-align: center;}
.tr{float: left; width: 84%; padding-left: 1rem;}
.t1{ width: 95%; border: 1px solid #cdcddc; height: 3rem;}
.t2{ width: 95%; border: 1px solid #cdcddc; height: 10rem;}
.t3{ width: 80px; height: 2.9rem; border: 1px solid #cdcdcd;}
.t4{ width: 80px; height: 3rem; vertical-align: top}
.t5{width:74px;height:31px;line-height:31px;background:#4a5b6d;border-radius:2px;border:none;text-align:center;margin-top:14px;margin-left:5px;font-size:14px;font-family:微软雅黑,黑体,sans-serif;color:#FFF;}
.t5 a{text-decoration:none;font-size:14px;font-family:微软雅黑,黑体,sans-serif;color:#FFF;display:block;}
.t5 a:hover{background:#4a5b6d;border-radius:2px; text-decoration: underline;}


.de-page-mian{overflow: hidden; text-align: center; font-size: 0; margin: 10px 0 35px;}
.de-page-mian .page-inner{display: inline-block; overflow: hidden;}
.de-page-mian .page-inner a{display: block; float: left; min-width: 26px; padding: 0 5px; height: 36px; border: 1px solid #dddddd; background: #fff; text-align: center; line-height: 36px; font-size: 14px; color: #333; margin-right: -1px; overflow: hidden;}
.de-page-mian .page-inner a.active,
.de-page-mian .page-inner a:hover{color: #fff; border-color: #237ed2; background: #237ed2;}
.de-page-mian .page-inner a.prev{margin-right: 10px; background: #fff url(../images/prev.jpg) no-repeat center;}
.de-page-mian .page-inner a.prev.on{background: #fff url(../images/prev-hover.jpg) no-repeat center;}
.de-page-mian .page-inner a.prev:hover{background-color: #fff; border-color: #dddddd;}
.de-page-mian .page-inner a.next{margin-left: 10px; margin-right: 15px; background: #fff url(../images/next.jpg) no-repeat center;}
.de-page-mian .page-inner a.next.on{background: #fff url(../images/next-hover.jpg) no-repeat center;}
.de-page-mian .page-inner a.next:hover{background-color: #fff; border-color: #dddddd;}
.de-page-mian .page-inner a.page-btn{font-size: 12px; margin-right: 0; width: 63px; margin-left: 10px;}
.de-page-mian .page-inner span{display: block; font-size: 12px; color: #333; float: left; line-height: 38px;}
.de-page-mian .page-inner input{display: block; float: left; height: 36px; width: 36px; border: 1px solid #dddddd; text-align: center; line-height: 36px; font-size: 14px; color: #333; margin: 0 5px;}

.cont{ width: 100%; padding: 15px 0; overflow: hidden;}
.cont .hd{ width: 100%; height: 58px; margin: 10px 0;  font-size: 22px;  font-weight: 700; color: #202739; overflow: hidden;}
.cont .md{ border: 1px solid #dedede; padding: 10px 20px;}
.cont .bd{ height: auto; padding: 10px; border-bottom: 1px solid #dedede; overflow: hidden;}
.cont .bd .img{ width: 30%; float: left; padding-top: 20px; text-align: center; }
.cont .bd .txt{ width: 69%; float: right; padding-top: 20px; }
.cont .bd .txt li{width: 100%;height: 31px;color: #555;line-height: 31px; background: #f1f1f1;margin-bottom: 3px;padding-left: 20px;transition: 0.4s all;}
.cont .bd .txt li a{ color: #898989; }
.cont .bd .txt li:hover{background: #f47b00; color: #fff; padding-left: 25px; }
.cont .bd .txt li:hover a{ color: #fff; }