@charset "utf-8";
/* CSS Document */
* { margin: 0; padding: 0;     box-sizing: border-box; }
html, body { width: 100%;     font-family: '微软雅黑'; font-size: 14px; }
img { border:none ;max-width:100%;     text-align-last: center;    vertical-align: middle; display: block;}
#map span{ overflow: inherit;  }
#map img{ max-width: none; }
a { color:#333;text-decoration:none; }
a:hover { color:#024298 ;text-decoration:none;}
ul { list-style:none;}
li{ list-style-type :none;}
.clear {clear:both;    float: none!important;    background: none;    width: 0 !important;    height: 0 !important;}
.clearfix  {clear:both;}
.w1200 { max-width:1600px; margin: 0 auto; width:90%;}
.span{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;    display: block;}
.p{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;}
.fl{float: left;}
address, caption, cite, code, dfn, em, th, var {
    font-style: normal;
    font-weight: normal;
}
table
{
    border-collapse:collapse;
}
tr{    border: 1px solid black!important;}
td{    border: 1px solid black!important;}
.banner_sy .swiper-pagination-bullet:only-child{display: inline-block!important;}
  .banner_sy  .swiper-container {
      width: 100%;
      height: 100%;
    }

    .banner_sy .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;

      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
    }

.container {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}
.nav{z-index: 999999999;    position: fixed;   transition: all .5s; overflow: hidden; background: #fff;width: 100%; top: 0; left:auto;}
.nav .logo{ width: 20%; padding: 24px 0; float: left;}
.nav .nav_ul{ float:right;     width: calc(80% - 190px ); margin: 0 190px 0 0; }
.nav .nav_ul > li { float: left; position:  relative; width: calc( 100% / 8);  }
.nav .nav_ul > li > a{ line-height:100px; font-size: 16px;  transition: all .5s; display: block; font-weight: bold; text-align: center;}
.nav .nav_ul > li > a:hover{ color: #333333; }
.nav .nav_ul > li a.en{ padding: 8px; background: #024298; display: block; line-height: normal;     margin: 31px 0; border-radius: 20px; color: #fff;}

.nav .nav_ul > li > a:after {    content: attr(data-title);    position: absolute;    top: 0;    left: 0;    transform: translateY(100%);    
	width: 100%;    height: 100%;    display: flex;    align-items: center;    justify-content: center;   color: #222; display: block;  transition: all .5s; }
.nav .nav_ul > li:hover > a{  transform: translateY(-100%) ; transition: all .5s;  }
.nav .nav_ul > li:hover > a:after{ display: block; }
.nav .nav_ul > li::before{ content: "";    display: block; width: 0%; height: 2px; position: absolute; top: 0px; left: 50%; background: #024298; transform: translateX(-50%);     transition: all .5s ease; opacity: 0;  }
.nav .nav_ul > li.on::before{ content: "";    display: block;  width: 100%; opacity: 1;height: 2px; position: absolute; top: 0; left: 0; background: #024298;  z-index: 999  ;transform: translateX(0%);   }
.nav .nav_ul > li:hover::before{ width: 100%; opacity: 1 ; }

.nav .nav_ul > li.ss > a::after{ transform: translateY(0%) ;}
.nav .nav_ul > li.ss:hover > a{  transform: translateY(0%) ; }

.nav_tel{position: absolute; top: 0; right: 0;  padding: 0 40px;} 
.nav_tel a{ margin: 25px 0 0; display: block; padding: 0 30px 0 70px; background: url(../img/c1.png) no-repeat 30px center #024298; font-size: 18px; line-height: 50px; color: #fff; font-weight:bold; float: right; z-index: 2; position: relative; background-size: 30px; border-radius:40px}


.nav .nav_ul h2{ color: #000;}
.nav .nav_ul .nav_cont{float:left; width: 74%;}
.nav .nav_ul > li > ul{ position: fixed; left: 0%; top: 100px; display: none; z-index: 999; transition: all .5s; border-top: 1px #efefef solid;  background: #fff; padding: 20px 0;}
.nav .nav_ul > li:hover > ul{ display: block; width:100%; background:url(../img/b2.jpg) no-repeat bottom center; }
.nav .nav_ul > li:hover > ul li { width:14%; margin: 30px 50px 0 0; float: left;}
.nav .nav_ul > li:hover > ul li:nth-child(5n){}
.nav .nav_ul > li:hover > ul li a{ width:100%;  display: inline; line-height: 48px; color: #000; font-size: 18px; position: relative; }
.nav .nav_ul > li:hover > ul li a:after{     content: "";    display: table; width: 20px; height: 1px; position: absolute; top: -10PX; left: 0px; background: #000;transition: all .5s; }
.nav .nav_ul > li:hover > ul li:hover a{ color: #333333; }
.nav .nav_ul > li:hover > ul li:hover a:after{     content: "";    display: table; width: 100%; height: 1px; position: absolute; top: -10PX; left: 0px; background: #000;  }
.nav .nav_ul > li > img{ padding: 30px 24px; cursor: pointer; filter: grayscale(100%) brightness(00%);}
.nav .nav_ul .nav_img{ float: right; overflow: hidden; }
.nav .nav_ul .nav_img img{ transition: all .5s;}
.nav .nav_ul .nav_img img:hover{ transform: scale(1.2); }

.banner {position: relative; margin: 100px 0 0; z-index: 1}
.banner h2{width: 300px;position: absolute;display: block;line-height: 36px;top:calc(50% - 18px);color: #fff;font-size: 32px;}
.banner h2:after{     content: "";    display: block; width: 70px; height: 3px; position: absolute; top: 60px; left: 0; background: #fff;     }

.banner_sy .w1200{position: absolute; height: 100%;     transform: translateY(30%); opacity: 0;}
.banner_sy h3{ position: absolute; top: 32% ;left: 0;     color: #fff;   padding-bottom: 10px;    font-size: 36px;    font-weight: bold}
.banner_sy h3:after{     content: "";    display: block; width: 6px; height: 40px; position: absolute; top: 10px; left: -30px; background: #024298;     }
.banner_sy h4{ position: absolute; top: calc(32% + 60px) ;left: 0; overflow: hidden;    color: #fff;    font-size: 24px;   font-weight: 100;}
.banner_sy a{ position: absolute; top: calc(32% + 90px) ;left: 0;  display: inline-block;    font-size: 16px;    background-color: #024298;    padding: 10px 20px;    text-align: center;    color: #fff;    margin-top: 3rem;}

.banner_sy .swiper-slide-active .w1200{  transition: all 2s ease .5s;    transform: translateY(0);    opacity: 1;}





.black1{ margin: 50px 0;}
.black1_tit{ position: relative; }
.black1_tit h2{ color: #000; position: relative; font-size: 36px; text-align: center; font-weight:bold;}
.black1_tit h2 em{ color: #024298; font-weight:bold;}
.black1_tit h2 span{ display: block; font-size: 16px; color: #595959; margin: 30px 0 0;}
.black1_tit h2:after{     content: "";    display: block; width: 40px; height: 3px; position: absolute; top: 60px; left: calc(50% - 20px); background: #024298;     }

.black1 .ul_fenlei{padding: 50px 0 30px; background: #fff; max-width: 1600px; margin: 0 auto; }
   .black1 .ul_fenlei{ margin: 0 auto;    width: fit-content; }
.black1 .ul_fenlei li{  float: left; margin: 0 10px 10px 0; background: #333;border-radius:20px; transition: all .5s; padding: 0 30px; }
.black1 .ul_fenlei li:nth-child(9n){margin: 0 0 10PX 0;}
.black1 .ul_fenlei li a{ display: block; line-height: 39px; text-align: center; color: #fff; }
.black1 .ul_fenlei li:hover{   background: #333333; }


.black1 ul.ul_li{ background: #fff;}
.black1 ul.ul_li li{ float: left; width: calc((100% - 98px) / 4); margin: 0 30px 30px 0; }
.black1 ul.ul_li li:nth-child(4n){ margin: 0 0 30px 0;}
.black1 ul.ul_li li .ioc{ overflow: hidden; position: relative;  border: 1px solid #f2f2f2; border-bottom: 0; }
.black1 ul.ul_li li .ioc_name{    position: absolute;    top: 0px;    left: 0px;    width: 100%;    height: 100%;    opacity: 0;       background: hsl(214deg 97% 30% / 62%);   transition: all 0.5s ease;}
.black1 ul.ul_li li .ioc_name .span1{position: relative;    top: 50%;    left: 50%;    transform: translate(-50%,-50%);    display: block;    width: 60%;    color: #fff;    text-align: center;    font-size: 1rem;    padding: 0.5rem 0;}
.black1 ul.ul_li li .ioc_name .span1::before {    content: '';    position: absolute;    top: 0px;    left: 50%;    transform: translateX(-50%);    width: 60%;    height: 1px;    background: #fff;     transition: all .5s ease;}
.black1 ul.ul_li li .ioc_name .span1::after {    content: '';    position: absolute;    bottom: 0px;    left: 50%;    transform: translateX(-50%);    width: 60%;    height: 1px;    background: #fff;    transition: all .5s ease;}
.black1 ul.ul_li li .name{ line-height: 48px; background: #fff; padding: 0 20px ;    border: 1px solid #f2f2f2;}
.black1 ul.ul_li li p{ border-bottom: 1px #ccc solid; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.black1 ul.ul_li li .span2{ display:block; text-align: left; width: 100%; background: url(../img/img3.png) no-repeat right center; transition:all .5s;}

.black1 ul.ul_li li:hover .span2{ display:block; text-align: left; width: 100%; background: url(../img/img4.png) no-repeat right center;}
.black1 ul.ul_li li:hover .ioc_name{opacity: 1;    }


.black2{ background: url(../img/b1.jpg) no-repeat #efefef; padding: 50px 0 50px; position: relative; margin: 0 0 0;}
.black2 .w1200{ position:relative;}
.black2_tit{ position: relative; }
.black2_tit h2{ color: #fff; position: relative; font-size: 36px; text-align: center;  font-weight: normal;font-weight:bold;}
.black2_tit h2 span{ display: block; font-size: 16px; color: #fff; margin: 30px 0 0;}
.black2_tit h2:after{     content: "";    display: block; width: 40px; height: 3px; position: absolute; top: 60px; left: calc(50% - 20px); background: #fff;     }

.black2_cont{ margin: 50px 0 0px; }
.black2_left{ width: 55%; float: left; padding: 20px 40px 0;}
.black2_left span{ font-size: 30px; font-weight: 700; color: #fff;}
.black2_left h3{ color: #fff; font-size: 26px;}
.black2_left p{ margin: 20px 0; line-height: 32px; color: #fff;}
.black2_left .gd{ line-height: 36px; padding: 0 40px; background:#024298; display: table; color: #fff; }

.black2_right{ width: 40%; float: right;}
.black2_right img{ width: 100%;}

.black2 .about-num {  position: absolute; bottom: -220px; left: 0;  width: 100%;  padding-top: 24px;    padding-bottom: 25px;   background-color: rgba(255, 255, 255, 1);    box-shadow: 0px 2px 10px 2px rgb(0 0 0 / 10%);}
.black2 .about-num li {    float: left;    width: 25%;    text-align: center;}
.black2 .about-num li h2 {    font-family: 'Oswald', sans-serif;    font-size: 50px;    color: #024298;    line-height: 60px;    display: inline-block;}
.black2 .about-num li p {    color: #333;    font-size: 14px;    line-height: 36px;}
.black2 .about-num .count-unit {    font-size: 14px;    color: #024298;    text-align: right;    display: inline-block;    font-style: normal;}
.black2 .about-num li .bot p {    font-size: 15px;    color: #666;    line-height: 24px;}


.black3{ margin: 120px 0 50px;}
.black3_tit{ position: relative; }
.black3_tit h2{ color: #000; position: relative; font-size: 36px; text-align: center; font-weight:bold;}
.black3_tit h2 em{ color: #024298; font-weight:bold;}
.black3_tit h2 span{ display: block; font-size: 16px; color: #595959; margin: 30px 0 0;}
.black3_tit h2:after{     content: "";    display: block; width: 40px; height: 3px; position: absolute; top: 60px; left: calc(50% - 20px); background: #024298;     }


.black3 .mySwiper_black3{ margin: 50px 0; overflow: hidden;}
.black3 .swiper-slide img{ width: 100%; }
.black3 .swiper-slide p{ text-align: center; line-height: 36px; color: #fff; background: #333; }
.black3 .swiper-slide:hover p{ background: #333333; }


.black4{ margin: 120px 0 50px;}
.black4_tit{ position: relative;  margin: 0 0 40px;}
.black4_tit h2{ color: #000; position: relative; font-size: 36px; text-align: center; font-weight:bold;}
.black4_tit h2 em{ color: #024298; font-weight:bold;}
.black4_tit h2 span{ display: block; font-size: 16px; color: #595959; margin: 30px 0 0;}
.black4_tit h2:after{     content: "";    display: block; width: 40px; height: 3px; position: absolute; top: 60px; left: calc(50% - 20px); background: #024298;     }

.black4_li{ width: calc( 50% - 20px); float: left; margin: 0 20px 20px 0; padding: 20px; background: #f2f2f2; display: flex;transition:all .5s;}
.black4_li .ico{    width: 40%;    height: 100%;    overflow: hidden;}
.black4_li .txt{ width: calc((100% - 43%)/1);    margin-left: 3%;    padding-top: 2%;}
.black4_li .txt h3{font-size: 20px;    line-height: 32px;    overflow: hidden;    text-overflow: ellipsis;    white-space: nowrap; font-weight: normal;transition:all .5s;}
.black4_li .txt p{  font-size: 14px;    margin-top: 3%;    line-height: 24px; color: #999;  overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;transition:all .5s; }
.black4_li .txt span{margin-top: 6%;    font-size: 0.75rem; display: block;  color: #999;transition:all .5s;}
.black4_li:hover{ background: #024298;}
.black4_li:hover p{ color: #fff;}
.black4_li:hover span{ color: #fff;}
.black4_li:hover h3{ color: #fff;}

.footer{ padding: 0px 0 60px ; background: #333;}
.footer ul{ float:left; width: calc( 70% / 4); padding: 40px 0 0;}
.footer ul h2{ color: #fff; font-size: 18px; line-height: 63px; border-bottom: 2px solid #fff; margin: 0 0 20px 0; display: table;}
.footer ul li{ line-height: 36px;  transition: all .5s;}
.footer ul li a{ color: #eee; }
.footer ul li:hover{padding: 0 0 0 25px;}

.footer_right{ padding: 60px 0 60px 80px; float: right; width:30%; position: relative;}
.footer_right h2{ font-size: 18px; color: #fff; margin: 0 0 10px 0; }
.footer_right .footer_tel{ font-size: 14px; color: #fff; line-height: 28px; }
.footer_right .tel400{margin: 40px 0 0; color: #fff;}
.footer_right p{ font-size: 16px; }
.footer_right i{font-style: normal; font-size: 14px; margin: 10px 0 0; display: block; }
.footer_right a{ color: #fff; margin:20px 0; padding: 0 10px 0 0; line-height: 36px; display: inline-block;}

.footer_right .ewm{ display: inline-block; margin: 20px 0 0;  position: relative;}
.footer_right .ewm span{ display: block; color: #fff; font-size: 16px; text-align: center;  line-height: 36px; }
.footer_right .ewm img { width: 50px; margin: 0 auto;}
.footer_right .ewm img.wx_img{display: none; position: absolute; top: -200px; left: 0px; width: 200px; }
.footer_right .ewm a.wx:hover img.wx_img{ display: block;  }

.foot{ background: #333; border-top: 1px solid rgba(255,255,255,0.3); color: rgba(255,255,255,0.47); line-height: 36px;}
.foot a{ color: rgba(255,255,255,0.3);  margin: 0 20px 0 0;}
.gaicp { text-align: center; margin: 0 auto;display: table; }
.gaicp img{ float: left; }
.gaicp a{ display: block; float: left;  line-height: 24px;}

.link{line-height: 32px; padding: 12px 0; margin: -56px auto 0;} 
.link a{  color: rgba(255,255,255,0.3); }

.dq{ background: #fff; padding: 30px; position: relative; top: -40px; z-index: 999999;    box-shadow: 3.42px 9.397px 20px 0px rgb(77 77 77 / 20%);    border-radius: 0px;    }
.dq > a{ border-right: 1px solid #ccc; display: block; padding: 0 30px; float: left; font-size: 18px; position: relative;} 
.dq > a.en{ color: #024298;}
.dq > a::after{     content: "";    display: block; width: 0%; height: 0%; position: absolute; bottom: -30px; left: 50%; background: #024298;  transition: all .5s;   }
.dq > a:hover::after{     content: "";    display: block; width: 80%; height:3px; position: absolute; bottom: -30px; left: 10%; background: #333333;    }
.dq > a.en::after{     content: "";    display: block; width: 80%; height:3px; position: absolute; bottom: -30px; left: 10%; background: #024298;    }
.dq .wz{   float: right; font-size: 14px; background: url(../img/b4.png) no-repeat left center;  padding: 0 0 0 34px; background-size: 21px;  color: #555;}
.dq .wz a{ margin: 0 20px; color: #555;}

.page-status{display: none!important;}
.page{width:100%;text-align:center; padding:30px 0; clear: both;}
.page span,.page a{ display:inline-block; line-height: 24px; margin-right:5px;line-height:21px; text-align:center;color:#333;font-size:12px}
.page span{font-weight:bold;color:#fff;}
.page a{color:#333; border: 1px #ccc solid; border-radius: 10px; margin: 0 10px; padding: 3px 11px;}
.page a:hover{font-weight:bold;color:#333333;}
.page span.next,.page a.next{ width:51px; height:21px; }
.page span.next{color:#C4C4C4;font-weight:normal;}
.page a.page-num-current{background:#024298; color: #fff;}

.about{ background: #fff; padding: 40px 0 80px ;}
.about .w1200{ background: #fff;}
.about .w1200 .about_tit{ position: relative; }
.about .w1200 .about_tit h2{ margin: 20px auto 50px; font-size: 36px; font-weight: bold; position: relative;width: 100%; border-bottom: 1px solid #ccc; text-align: center; padding: 0 0 20px}

.about .about_t{overflow: hidden;  }

.about_cont{ padding: 30px; width: calc(100% - 0px); background: #fff;} 

.about_list{ width: calc(100% - 0px); padding: 20px }
.about_list li{ width: calc((100% - 90px) / 4); float: left;  margin: 0 30px 30px 0; background: #f6f6f6; padding: 20px;}
.about_list li:nth-child(4n){ margin:  0 0px 30px 0;}
.about_list li .ioc{overflow: hidden; margin: 0 auto; }
.about_list li img{ width:100%; transition:all .5s;}
.about_list li p{ text-align: center; line-height: 36px ;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;  width: 100%; margin: 10px 0 0;}
.about_list li:hover img{ transform:scale(1.2); }
.about_list li:hover p{ background: #fff;}
.about_list .page{ margin: 20px 0 50px;}

.pro{ background: #f7f7f7; padding: 40px 0 80px ;}

.pro_left{ float: left; width: 20%;  }
.pro_left span{ padding: 20px 0 10px 20px; background: #024298; width: 100%; display: block; font-size: 20px; color: #fff; line-height: 32px;border-radius: 15px 15px 0 0;}
.pro_left em{ display: block; width: 100%; font-size: 14px; color: #fff; line-height: 32px;}
.pro_left li{ width: 100%; line-height: 60px; background: #fff; text-indent: 20px; position: relative;transition: all .5s; font-size: 16px; border-bottom: 1px #eee solid;}
.pro_left li a{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;    display: block; padding: 0 20px 0 0}
.pro_left li:hover{color:#333333; }
.pro_left li:hover:after{     content: "";    display: block; width: 3px; height: 100%; position: absolute; top: 0; left: 0; background: #333333;     }
.pro_left li.on:after{     content: "";    display: block; width: 3px; height: 100%; position: absolute; top: 0; left: 0; background: #024298;     }

.pro_dq{ border-radius: 15px 15px 0 0; margin: 0 0 20px; background: #fff; }
.pro_dq .wz{   float: right; font-size: 14px; background: url(../img/b4.png) no-repeat left center;  padding: 0 0 0 34px; background-size: 24px;  color: #555; line-height: 42px;}
.pro_dq .wz a{ margin: 0 20px; color: #555;}

.pro_right{float:right; width: 78%;}
.pro_right ul{}
.pro_right li{ width: calc((100% - 40px) / 3); float: left;  margin: 0 20px 20px 0; background: #fff; padding: 20px;     border-radius: 10px;}
.pro_right li:nth-child(3n){ margin:  0 0px 20px 0;}
.pro_right li p{padding: 10px 0px 5px;    border-top: 1px solid #eee;  position: relative;   font-size: 14px;    font-weight: bold;    color: #333;    text-align: center;    line-height: 30px;    overflow: hidden;    text-overflow: ellipsis;    white-space: nowrap;}
.pro_right li p::before {    content: '';    position: absolute;    top: 0px;    left: 0px;    width: 0%;    height: 1px;    background: #024298;    z-index: 1;    transition: all .5s ease;}
.pro_right li:hover p::before{ width: 100%;}


.pro_top{ background: #fff; padding: 50px;}
.pro_img{ width: 45%; float: left;}

  .pro_right  .pro_img .swiper {
        width: 100%;
        height: 300px;
        margin-left: auto;
        margin-right: auto; border: 1px solid #f2f2f2; 
      }

    .pro_right .pro_img  .swiper-slide {
        background-size: cover;
        background-position: center;
      }

    .pro_right .pro_img  .mySwiper2 {
        height: 80%;
        width: 100%;
		overflow: hidden;
      }

    .pro_right .pro_img .mySwiper {
        height: 20%;
        box-sizing: border-box;
        padding: 10px 0;
      }

     .pro_right .pro_img .mySwiper .swiper-slide {
        width: 25%;
        height: 100%;
        opacity: 0.4;
      }

     .pro_right .pro_img .mySwiper .swiper-slide-thumb-active {
        opacity: 1;
      }

    .pro_right .pro_img .swiper-slide img {
        display: block;
        width: 100%;
        /*height: 100%;*/
        object-fit: cover;
        border:1px solid #000;
      }


     .pro_right .pro_img  .swiper-slide {
        background-size: cover;
        background-position: center;
      }

     .pro_right .pro_img  .mySwiper2 {
        height: 80%;
        width: 100%;
      }

       .pro_right .pro_img  .mySwiper2 img {
         border:none;
      }
       .pro_right .pro_img  .mySwiper.mySwiper_pro_nei {
        height: 80%;
		   position: relative;
        width: calc(100%);
        padding: 0 50px;
        margin: 30px 0 0;
		   overflow: hidden;
      }
      
     .pro_right .pro_img  .mySwiper {
        height: 20%;
        box-sizing: border-box;
        padding: 10px 0;
      }

     .pro_right .pro_img  .mySwiper .swiper-slide {
        width: 25%;
        height: 100%;
        opacity: 0.4;
      }

     .pro_right .pro_img  .mySwiper .swiper-slide-thumb-active {
        opacity: 1;
      }

     .pro_right .pro_img  .swiper-slide img {
        display: block;
        width: 100%;
       /*height: 100%;*/
        object-fit: cover;
      }
.mySwiper_pro_nei .swiper-button-lock{ display: block!important; }

.pro_right .pro_img .swiper-button-next,
.pro_right .pro_img .swiper-button-prev{ color: #000;background-image: none; z-index: 999 ; width: 28px; }
.swiper-button-next:after, .swiper-button-prev:after{ font-size: 28px!important; }




.pro_tit{ width: 50%; float: right;}
.pro_tit h2{ font-size: 20px;  }
.pro_tit .info{ margin: 30px 0; line-height: 32px; color: #333;}
.pro_tit .pro_tel{ padding: 0px 24px; background: #024298;display: inline-block; color: #fff; font-size: 16px; line-height: 42px;}
.pro_tit .pro_tb a{ padding: 0px 24px; background: #cb0000;display: inline-block; color: #fff; font-size: 16px; line-height: 42px; margin:30px 0 0; }

.pro_txt{ margin: 20px 0; background: #fff;}
.pro_txt_xq{ border-bottom: 1px #ccc solid;}
.pro_txt_xq h2{ background:#024298; padding: 15px 40px; display: table; color: #fff; font-size:18px;}
.pro_cont{ padding: 30px; font-size: 16px; line-height: 34px; color: #333;}
.pro_cont span{ white-space:inherit; display: block;}
.pro_cont img{ margin: 0 auto; text-align: center; display: block;  }
.sx{ margin: 80px 0 30px; border-bottom: 1px #ccc solid; line-height: 56px;}
.sx a.s{float: left;}
.sx a.x{float: right;}

.xgcp{background: #fff; margin: 20px 0 20px; border-top: 20px #f7f7f7 solid;}
.xgcp ul{padding: 20px; overflow: hidden;}
.xgcp ul li{ width: calc((100% - 98px) / 4); float: left;  margin: 0 30px 0px 0; border: 1px solid #ccc;}
.xgcp ul li:nth-child(4n){ margin:  0 0px 0px 0;}
.xgcp ul li p{ text-align: center; line-height: 42px; color: #fff; background: #4e4e4e;font-size: 16px; }
.xgcp ul li:hover p{ background: #333333; }

.job_list{ padding: 50px;}
.job_list ul{ border-bottom: 1px solid #ccc; position: relative;}
.job_list ul li{float: left; line-height: 60px; font-size: 16px; text-indent: 10px;}
.job_list ul li.name{ width:25%;}
.job_list ul li.add{width: 20%;}
.job_list ul li.time{width: 20%;}
.job_list ul li.daiyu{width: 20%; color: #CB0003; font-weight: bold;}
.job_list ul li.gengduo{width: 15%; background: url(../img/plus.png) no-repeat right center; color: #666666; cursor: pointer;}
.job_list .job_cont{width: 100%;padding: 20px; border-top: 1px solid #ccc; display: none;}
.job_list .job_cont1{ }
.job_list .job_cont1 > p{ width: 25%; float: left; display: table; line-height: 32px;}
.job_list .job_cont2{ width: 100%; clear: both; padding: 20px 0 0; display: block;}


.contact{ background: #fff; padding: 40px 0 80px ;}
.contact .w1200{ background: #fff;}
.contact_left{ width: 40%; float: left;background:#024298;}
.contact_txt{ padding: 20px 40px 55px 19px; min-height: 500px;}
.contact_txt {  color:#fff; line-height: 38px; text-indent: 10px;  }

.contact_right{ width: 60%; float: right;}

.contact_ly{ background: #f6f6f6; padding: 60px 0; margin: 40px 0 0}
.contact_ly h2{ font-size: 36px; font-weight: bold; position: relative; text-align: center; margin: 0 0 50px;}
.contact_ly h2 strong{ color:#024298;  }
.contact_ly h2:after{     content: "";    display: block; width: 80px; height: 3px; position: absolute; top: 66px; left: calc(50% - 40px); background: #024298;     }


.contact_ly textarea{ width: 100%; padding: 15px; font-size: 14px!important; border: #d2d2d2 1px solid;}

.contact_ly input{ margin: 20px 0 0; width: 48%; line-height: 36px; text-indent: 18px; font-size: 14px!important;border: #d2d2d2 1px solid;} 
.contact_ly input:nth-child(2n-1){ float:right}
.contact_ly input:nth-child(2n){ float:left}
.contact_ly input.ewm1{ width: 100%; }
.contact_ly .ewm{ position: relative;    float: right; width: 48%; }
.contact_ly .ewm input{ width: 100%;}
.contact_ly .ewm img{ position: absolute; top: 22px; right:2px;  height: 36px;}
.contact_ly button{ width: 100%; background: #333; margin: 20px 0 0; color: #fff; border: 0; line-height: 48px; cursor: pointer; font-size: 16px; transition:all .5s;}
.contact_ly button:hover{ background: #333333; }

.news{ background: #fff; padding: 40px 0 80px ; }

.news ul .new_top_li{ padding: 20px; background: #f2f2f2; margin:  0 0 50px;}
.news ul .new_top_li .newimg{    box-shadow: 10px 10px 45px 0 rgb(0 0 0 / 0%);    width: 39%;    height: auto;    max-height: 355px;    display: inline-block;    vertical-align: middle; overflow: hidden;}
.news ul .new_top_li .newimg img{    transition: 0.5s linear 0s;    width: 100%;}
.news ul .new_top_li .newnr {    width: 54%;    display: inline-block;    vertical-align: middle;    margin-left: 5%;    margin-top: 0px;}
.news ul .new_top_li .newnr b{    transition: 0.3s ease 0s;    color: #333;    font-size: 20px;    display: block;    white-space: nowrap;    overflow: hidden;    text-overflow: ellipsis;}
.news ul .new_top_li .newnr b:before {    width: 15px;    height: 3px;    display: inline-block;    vertical-align: middle;    background: #024298;    margin-right: 15px;    content: '';}
.news ul .new_top_li .newnr p{    line-height: 26px;    max-height: 84px;    margin-left: 30px;transition: 0.3s ease 0s;    margin-top: 20px;    font-size: 14px;    color: #666;    display: -webkit-box;    -webkit-line-clamp: 3;    overflow: hidden;    -webkit-box-orient: vertical;  }
.news ul .new_top_li .newnr .i-a {    margin-left: 30px;     margin-top: 6%;   z-index: 0;     position: relative;    line-height: 50px;    width: 165px;    height: 50px;    display: block;    color: #fff;    background: #024298;    text-align: center;}
.news ul .new_top_li:hover img{     transform: scale(1.2);} 

.news ul .new_top_li:hover b{color:#333333; } 
.news ul .new_top_li:hover b:before {background:#333333; } 

.news ul .new_top_li:hover .i-a{color: #Fff;} 


.news ul .news_lis{ background: #f2f2f2; padding: 10px; width: calc( (100% - 60px) / 3 ); float: left; margin: 0 30px 30px 0; }
.news ul .news_lis:nth-child(3n){ margin: 0 0px 30px 0;}
.news ul .news_lis .img2{overflow: hidden;}
.news ul .news_lis img { width: 100%; transition:all .5s;}
.news ul .news_lis .news_lis_p{     padding: 5% 4% 4%;  margin: 0 auto ;transition:all .5s; }
.news ul .news_lis .news_lis_p h3{    transition: 0.3s ease 0s;    color: #333;    font-size: 16px;    display: block;    white-space: nowrap;    overflow: hidden;    text-overflow: ellipsis; transition:all .5s;}
.news ul .news_lis .news_lis_p p{    transition: 0.3s ease 0s;    margin-top: 3%;    font-size: 14px;    line-height: 1.7;    color: #666;    display: -webkit-box;    -webkit-line-clamp: 3;    overflow: hidden;    -webkit-box-orient: vertical;  transition:all .5s;  }

.news ul .news_lis:hover img{     transform: scale(1.2);} 
.news ul .news_lis:hover .news_lis_p{background:#333333; } 
.news ul .news_lis:hover .news_lis_p h3{color: #Fff;} 
.news ul .news_lis:hover .news_lis_p p{color: #Fff;} 

.news_txt{ padding: 0px 0 0px 50px; width:calc(100% - 310px); float: left; display: grid; position: relative; transition:all .5s;}
.news_txt p{ width: 95%; margin: 0 auto; transition:all .5s}
.news_txt p.p1{transition: 0.3s ease 0s;    color: #333;    font-size: 16px;    display: block;    white-space: nowrap;    overflow: hidden;    text-overflow: ellipsis; font-weight: bold;}
.news_txt p.p2{    transition: 0.3s ease 0s;    margin-top: 10px;    font-size: 14px;    line-height: 24px;    color: #666;  max-height: 65px; overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.news_txt::after{  content: "";    display: block; width: 50px; height: 2px; position: absolute; top: 10px; left: 0; background: #ccc;  transition:all .5s; }



.news_conts{padding: 50px; background: #fff;}
.news_conts h2{ font-size: 22px; border-bottom: 1px solid #ccc; line-height: 56px; text-align: center; font-weight: normal;}
.news_t{ line-height: 36px;}
.news_t span{ margin: 0 42px 0 0; color: #595959}
.news_into{padding: 20px; line-height: 24px; background: #f2f2f2; color: #595959; margin: 30px 0;}
.news_cont{ padding: 20px;}


.m_head{display: none; }


@media only screen and (max-width: 1500px){

	.nav .nav_ul{  float: right; margin: 0 1% 0 0; width: 75%;}
	.nav .nav_tel{ display: none!important;}
	.nav .nav_ul > li > a{ }
	.banner {
    position: relative;
    margin: 89px 0 0;
    z-index: 1;
}
}


@media only screen and (max-width: 1024px){

	.w1200 { max-width:90%; margin: 0 auto; width:90%;}
	.top{ display: none;}
	.nav{ display: none;}
	.top span{ color: #fff; line-height: 40px; float: right; padding: 0 0 0 30px; }
	.top .top_span1{ background: url(../img/top1.png) no-repeat left center;   background-size: 24px; margin: 0 0 0 10px;}
	.top .top_span2{ background: url(../img/top2.png) no-repeat left center;   background-size: 20px; }
	
	.m_head{ display: block;    background: #fff;    padding: 20px 5%;  z-index: 999;    border-bottom: 1px solid #ababab; position: fixed; width: 100%; top: 0; }
	.m_head .logo { float:left; width: 70%;}
	.m_head .logo img { }
	.m_head .num1 { float: right;}
	.m_head .num1 img{ height: 20px; margin: 14px 0 0; }
	
	.m_nav{position: fixed; right:100%; top: 0; width: 100%; background: hsla(0,0%,0%,0.6); z-index: 99999;}
	.m_nav.on{position: absolute; right:0%; top: 0;}
	.m_nav .m_ul{ width: 80%; background:  hsla(0,0%,0%,0.8); float: right; position: relative;}
	.m_nav .m_ul li{border-bottom: 1px solid #232530;}
	.m_nav .m_ul li a{    display: block;    height: 45px;    color: #fff;    line-height: 45px;    padding-left: 5%;    font-size: 16px;}
	.m_nav .close{ position: absolute; top: 20px; left:20px;}
	.m_nav .close img{cursor: pointer;      display: block;    margin: 11px auto;    transition: all .2s;    cursor: pointer;    overflow: hidden; }
	
	.m_nav ul.m_ul > li ul.ul_too{ display: none; width: 80%; float: right;}
	.m_nav ul.m_ul > li ul.ul_too li{  }
	.m_nav ul.m_ul > li ul.ul_too li a{ }
	
	.m_nav ul.m_ul > li.gd{    background: url(../img/7_15.png) 95% 15px no-repeat;}

    .black1 .ul_fenlei{ margin: 0 auto; }
  .black1 .ul_fenlei li{  margin: 0 10px 10px 0; padding: 0 30px; }
  .black1 .ul_fenlei li:nth-child(2n){ margin: 0 0px 10px 0;}
  .black1 .ul_fenlei li:nth-child(5){ margin: 0 10px 10px 0;}
  .black1 ul.ul_li li{ width: calc((100% - 20px) / 2 ); float: left; margin: 0 20px 30px 0; }
  .black1 ul.ul_li li:nth-child(2n){ margin:0 0 30px 0; }

}


@media only screen and (max-width: 768px){
	.w1200 { max-width:90%; margin: 0 auto; width:90%;}
	.top{ display: none;}
	.nav{ display: none;}
	.top span{ color: #fff; line-height: 40px; float: right; padding: 0 0 0 30px; }
	.top .top_span1{ background: url(../img/top1.png) no-repeat left center;   background-size: 24px; margin: 0 0 0 10px;}
	.top .top_span2{ background: url(../img/top2.png) no-repeat left center;   background-size: 20px; }
	
	.m_head{ display: block;    background: #fff;    padding: 20px 5%;  z-index: 9999999;    border-bottom: 1px solid #ababab; }
	.m_head .logo { float:left; width: 70%;}
	.m_head .logo img { }
	.m_head .num1 { float: right;}
	.m_head .num1 img{ height: 20px; margin: 14px 0 0; }
	
	.m_nav{position: fixed; right:100%; top: 0; width: 100%; background: hsla(0,0%,0%,0.6); z-index: 99999;}
	.m_nav.on{position: absolute; right:0%; top: 0;}
	.m_nav .m_ul{ width: 80%; background:  hsla(0,0%,0%,0.8); float: right; position: relative;}
	.m_nav .m_ul li{border-bottom: 1px solid #232530;}
	.m_nav .m_ul li a{    display: block;    height: 45px;    color: #fff;    line-height: 45px;    padding-left: 5%;    font-size: 16px;}
	.m_nav .close{ position: absolute; top: 20px; left:20px;}
	.m_nav .close img{cursor: pointer;      display: block;    margin: 11px auto;    transition: all .2s;    cursor: pointer;    overflow: hidden; }
	
	.m_nav ul.m_ul > li ul.ul_too{ display: none; width: 80%; float: right;}
	.m_nav ul.m_ul > li ul.ul_too li{  }
	.m_nav ul.m_ul > li ul.ul_too li a{ }
	
	.m_nav ul.m_ul > li.gd{    background: url(../img/7_15.png) 95% 15px no-repeat;}
	
	.banner_sy h3{ position: absolute; top: 32% ;left: 0;     color: #fff;   padding-bottom: 10px;    font-size:16px;    font-weight: bold}
	.banner_sy h3:after{     content: "";    display: block; width: 6px; height: 40px; position: absolute; top: 10px; left: -30px; background: #024298;    }
	.banner_sy h4{ position: absolute; top: calc(32% + 30px) ;left: 0; overflow: hidden;    color: #fff;    font-size: 14px;   font-weight: 100;}
	.banner_sy a{ position: absolute; top: calc(32% + 40px) ;left: 0;  display: none;    font-size: 12px;    background-color: #024298;    padding: 10px 20px;    text-align: center;    color: #fff;    margin-top: 3rem;}
	
	.banner h2{font-size: 24px;}
	.banner h2:after{top: 40px;}
	
	.black1_tit h2 strong{font-size: 28px;}
	.black1_tit h2:after{ top: 58px;}
	.black1 .black1_fenlei{ position: relative; margin: 20px 0 0;}
	.black1 .black1_fenlei a{width: calc((100% - 20px) / 2);margin: 0 0 30px 20px;}
	.black1 .black1_fenlei a:nth-child(2n-1){ margin: 0  0 20px 0; }
	
	.black1 ul{ margin: 0;}
	.black1 ul li{ width: calc((100% - 20px) / 2 ); float: left; margin: 0 20px 30px 0; }
	.black1 ul li:nth-child(2n){ margin:0 0 30px 0; }
	
	.black2_left{ width: 100%; padding: 10px;}
	.black2_right{ width: 100%; margin: 50px 0 0;}
	
	.black3{ }
	.black3 ul {background: #024298 !important;padding: 50px 0;}
	.black3 ul li{ float: left; width: calc((100% - 1px) / 2); border-left: 1px solid #Fff; height: 250px; }
	.black3 ul li:nth-child(2n-1){ border-left: none;}
	.black3 ul li .black3_cont{ padding: 10px 10px;}
	.black3 ul li .black3_cont i{border: 1px solid #Fff;}
	
	.black4 ul li{ width: 100%; margin: 0 10px 10px 0; float: left; background: #f2f2f2;position: relative;}
	.black4 ul li:nth-child(3n+1){ display: none;}
	
	.footer ul{ display: none;}
	.footer_right{ width: 100%; border: none; padding:50px 0 0;}
	.footer_right .ewm{}
	.link{ display: none;}
	
	.dq{ padding: 10px 0;}
	.dq .w1200{ padding: 10px 0;     background: #f1f1f1;}
	.dq .w1200 > a{ width: 100%; display: block; text-align: center; background: #f1f1f1; line-height: 42px; border-right: none;}
	.dq .wz{display: none!important;}
	.dq .w1200 > a::after{content:""!important;display: none; }
	.dq .w1200 > a.en::after{content:""!important;display: none; }
	
	.about_cont2{ padding: 50px 30px; text-align: center;}
	.about .about_left{ width: 100%; }
	.about .about_right{ width: 100%; padding: 100px 20px;}
	
	.about_list li{ width: calc((100% - 0px) / 1); float: left;  margin: 0 0px 30px 0;}
	.about_list li:nth-child(1n){ margin:  0 0px 30px 0;}
    
	.news .news_list li .img2{ display: none;}
	.news_txt {    padding: 0px 0 0px 00px;    width: calc(100% - 100px);}
	.news_txt::after{ display: none;}
	
	.news_list li{ padding: 20px; background: #fff; width: calc(100%); margin: 0 0px 30px 0; float: left;}
	.news_list li:nth-child(3n){ margin: 0 0px 30px 0; }
	.news_conts{padding: 10px; }
	.news_conts h2{line-height: 36px; padding: 10px 0;}
	.news_t span{ display:block ;}
	.sx{ margin: 80px 0 30px; border-bottom: 1px #ccc solid; line-height: 24px;}
	.sx a{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;    display: block; float: left!important; width: 90%; margin: 0 auto;display: block;}
	
	.pro_left{ width: 100%; }
	.pro_right{ width: 100%; margin: 50px 0 0; }
	.pro_right .pro_dq{ display: none;}
	
	.black1 ul.ul_li li{ float: left; width: calc((100% - 34px) / 2); margin: 0 30px 30px 0; }
	.black1 ul.ul_li li:nth-child(2n){ margin: 0 0 30px 0;}
	.black1 ul.ul_li li:nth-child(2n-1){ margin: 0 30px 30px 0;}
	
	.pro_right1{ width: 100%; margin: 50px 0 0; }
	.pro_right1 .pro_dq{ display: none;}
	
	.pro_top {    background: #fff;    padding:20px;}
	.pro_img{ width: 100%;}
	.pro_tit{ width: 100%; margin: 50px 00 0;}
	
	.job_list ul li{float: left; line-height: 60px; font-size: 16px; text-indent: 10px;}
	.job_list ul li.name{ width:35%;}
	.job_list ul li.add{width: 20%; display: none;}
	.job_list ul li.time{width: 45%;}
	.job_list ul li.daiyu{width: 20%; color: #CB0003; font-weight: bold;}
	.job_list ul li.gengduo{width: 15%; background: url(../img/plus.png) no-repeat right center; color: #666666; cursor: pointer; display: none}
	.job_list .job_cont1 > p{ width: 100%; float: left; display: table; line-height: 32px;}
	
	.contact_left{ width: 100%;  }
	.contact_right{ width: 100%;}
	.contact_txt {    padding: 20px 40px 55px 0px;}
	
	.foot a{  width: 100%;}
	
	.black2 .about-num li{ width: 50%;}

	.black4_li { width: 100%;}
		
	.dq{top:0;}
	.dq > a{ width: 100%; text-align: center; height: 48px ; line-height: 48px;}
	.dq > a.en::after{ bottom: 0;}
	
	.pro_right li{ width: 100%; margin: 0 0 30px;}
	.news ul .new_top_li{ display: none;}
	.news ul .news_lis{ width: 100%; margin: 0 0 30px;}
	
	.page-index{ display: none!important;}
	.page-last{ display: none!important;}
}









