@charset "utf-8";
/* CSS Document */
* { margin: 0; padding: 0;     box-sizing: border-box;font-family:微软雅黑,Arial,sans-serif; }
html, body { width: 100%;      font-size: 14px; }
img { border:none ;max-width:100%;     text-align-last: center;    vertical-align: middle; display: inline-block;  object-fit: cover;}
#map span{ overflow: inherit;  }
#map img{ max-width: none; }
a { color:#333;text-decoration:none;
    transition: .4s;     line-height: 1.5;}
a:hover { color:#023f98;  }
ul { list-style:none;}
li{ list-style-type :none;}
span{transition: .4s; }
.clearfix  {clear:both;}
.w1{ max-width:86%; margin: 0 auto; width:1680px;}
.w2{ max-width:80%; margin: 0 auto; width:1680px;}
.w3{ max-width:70%; margin: 0 auto; width:1680px;}
.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-left, .fl{ float:left;}
.fl-right, .fr{ float:right;}
.left{	float: left;}
.right{	float: right;}
input{ outline: none;}
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;}
h1,h2,h3,h4,h5,h6,h7,h8{ font-weight: normal; font-size: 14px;}


/**************************       顶部           **********************************/

header{ border-bottom: #8c6d36 solid 2px; position: relative;}
header .w1{     display: flex;    justify-content: space-between;    flex-wrap: nowrap;    flex-direction: row;    align-items: center; }
header .nav { width:50%;  }
header .nav ul.nav1{ display: flex; justify-content: space-between;    flex-wrap: nowrap;    flex-direction: row; }
header .nav ul.nav1 li{ color:#023f98;  }
header .nav ul.nav1 li a{ display: block; font-size: 18px;line-height: 122px; padding: 0 20px; position: relative; }
header .nav ul.nav1 li.cur > a{ color:#023f98; }
header .nav ul.nav1 li#sj:hover > a::before {  content: ""; position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; background: url(../img/nav.png) no-repeat; width: 15px; height: 8px; }

header .nav ul.nav1 li .nav2{ display: none; position: absolute; transform: translate(20%, 0px); z-index: 99 }

header .nav ul.nav1 li:nth-child(2) .nav2{transform: translate(-37%, 0px);}
header .nav ul.nav1 li:nth-child(3) .nav2{transform: translate(-20%, 0px);}

header .nav ul.nav1 li:hover .nav2{ display: flex; }
header .nav ul.nav1 li:hover::after{ content: ""; position: absolute; top: 122px; width: 100%; height: 64px; left: 0; background: hsla(0,0%,100%,0.50);z-index: 98}
header .nav ul.nav1 li:hover:nth-child(1)::after{ display: none;}
header .nav ul.nav1 li:hover:nth-child(4)::after { display: none;}
header .nav ul.nav1 li:hover:nth-child(5)::after { display: none;}
header .nav ul.nav1 li:hover:nth-child(6)::after { display: none;}

header .nav ul.nav1 li .nav2 a{ display: block; font-size: 16px; line-height: 64px;}

.banner{ overflow: hidden; position: relative; }
.swiper-pagination-bullets{    display: flex;    justify-content: center;     align-items: center; bottom: 40px!important;}
.banner .my-bullet{ width: 15px!important; height: 15px!important; border: 2px solid hsla(0,0%,100%,0.5); margin: 0 8px;   border-radius: 50px; display: block; background: hsla(0,0%,0%,0.00) }
.banner .my-bullet.swiper-pagination-bullet-active{ width: 9px!important; height: 9px!important; border: 3px solid hsla(0,0%,100%,0.0);  background: hsla(0,0%,100%,0.5);   border-radius: 50px; display: block; }


#op1{ background: url(../img/bj.jpg) no-repeat center bottom; padding: 100px 0 53px; border-bottom: 1px solid #bcb7bd; }
#op1 .w1{}
#op1 .w1 h3{ font-size: 48px; color: #063783; font-weight: 100; text-align: center;  letter-spacing: 5px;}
#op1 .w1 p{ font-size: 18px; line-height:36px; color: #333; text-align: center; margin: 40px 0 90px;letter-spacing: 1px;}
#op1 .w1 .numberwrap{ display: flex;flex-wrap: nowrap;    justify-content: space-around; margin: 0 auto 80px }
#op1 .w1 .numberwrap .num{ text-align: center; width: 25%;}
#op1 .w1 .numberwrap .num span{ display: inline; font-size: 64px; font-weight: bold; color: #063783; }
#op1 .w1 .numberwrap .num p{ display: table; font-size: 22px; background: hsla(0,0%,100%,0.5);  padding: 0 30px; border-radius: 50px; color: #333; margin: 30px auto 0;}
#op1 .w1 .img1{ margin: 0 auto; display: block; }
#op1 .w1 .op1_a{ display: table; margin: 50px auto 10px;  color: #fff;  font-size: 14px; padding: 8px 30px; border: 1px solid #fff; border-radius: 50px;}
#op1 .w1 .op1_a:hover{ background: #fff; color: #063783;   }

#op2{ background: #f7f7f7; padding: 85px 0 40px; }
#op2 h2{ font-size: 32px; text-align: center; color: #727272; margin: 0 0 60px; }
#op2 ul{ display: flex;justify-content: space-around; }
#op2 ul li{ padding: 14px; border-radius: 10px;  background: #fff;  width: calc((100% - 120px)/3);}
#op2 ul li .ico{ overflow: hidden; }
#op2 ul li .ico img{ transition: 0.5s all; }
#op2 ul li:hover .ico img{     transform: scale(1.1);   }
#op2 ul li p{ font-size: 18px; margin: 30px 10px 20px; color: #000;white-space: nowrap; /* 不换行 */
    overflow: hidden; /* 隐藏超出内容 */
    text-overflow: ellipsis; /* 显示省略号 */ }
#op2 ul li:hover p{  color:  #063783 }
#op2 ul li span{ display: block; background: url(../img/jt.png) no-repeat 0px center; background-size: auto 100%; padding: 0 0 0 24px; font-size: 12px; color: #878787; margin: 0 0 40px;}
#op2 .w1 .op2_a{ display: table; margin: 50px auto 10px;  color: #717171;  font-size: 14px; padding: 8px 30px; border: 1px solid #717171; border-radius: 50px;}
#op2 .w1 .op2_a:hover{ background: #063783; color: #fff;   }

#op3{ background: #fff; padding: 100px 0;  }

footer{ background: #063783;  padding: 60px 0 00px;  }
footer .w1{ border-bottom: 1px hsla(0,0%,52%,0.40) solid; }
footer .f_logo{ padding: 0 0 40px;}
footer .f_logo a{ display: table; margin: 0 auto;} 
footer .f_nav{ display: flex;     justify-content: center;}
footer .f_nav > li{position: relative; padding: 0 0 20px; }
footer .f_nav li ul{ position: absolute; top: calc(90%); background: #fff; width: 80%; margin: 0 auto; padding: 10px 0; z-index: 999; left: 0;    right: 0;  display: none;}
footer .f_nav li:hover ul{ display: block; }
footer .f_nav li ul::after{ content: ""; position: absolute; background: url(../img/foot.png) no-repeat; width: 18px; height: 9px; top: -9px; left: 0; right: 0; margin: 0 auto; }
footer .f_nav li ul a{ color:#063783; width: 94%; margin: 0 auto; text-align: center; line-height: 28px;  color: #000; font-size: 14px;}
footer .f_nav li > a{ font-size: 16px; display: block; color: #fff; margin: 0 40px; }
footer .f_nav li ul a:hover{ color: #063783; }
footer .f_tel{ display: flex;     justify-content: center; position: relative; margin: 40px 0 30px;    align-items: center; align-items: stretch;}
footer .f_tel::after{ content: ""; height: 100%; width: 2px; background:hsla(0,0%,52%,0.50); position:  absolute;  }
footer .f_tel .l1{ max-width: 140px; margin: 0 44px;  }
footer .f_tel .ewm{ max-width: 140px; margin: 0 44px;  }
footer .foot_t { list-style: 32px; font-size: 10px; color: #fff; text-align: center; margin: 0 0 30px; }
footer .foot{ display: flex;     justify-content: center; line-height: 56px;  color: #fff;}
footer .foot a{color: #fff; margin: 0 0 0 24px; position: relative; display:block; line-height: 56px;}
footer .foot a::after{ content: ""; position: absolute; width: 2px; height: 16px; background: #fff; top: 20px; left: -12px ;  }
footer .foot a:hover{ color: #fff;}

.about h2{ font-size: 32px; line-height: 160px; text-align: center; color: #717171; box-shadow: 0 0 14px #E4E4E4; margin: 0 0 80px; }
.about .w1 h3{ font-size: 48px; color: #063783; font-weight: 100; text-align: center;  letter-spacing: 5px; margin: 100px 0 90px;}

.about .about_t{  }
.about .about_t .about_l{ width: 50%;  float: left; }
.about .about_t .about_l p{ text-indent: 3em!important; }
.about .about_t .about_r{ width: 40%; float: right }

.qywh h2{ font-size: 32px; line-height: 160px; text-align: center; color: #717171; box-shadow: 0 0 14px #E4E4E4; margin: 0 0 80px; }
.qywh .about_t{ margin: 0 0 200px; }
.qywh .about_t .about_l{ width: 50%;  float: left; display: flex; flex-wrap: wrap;    flex-direction: row;}
.qywh .about_t .about_l p{ width: 100%; font-size: 24px!important; line-height: 60px!important; }
.qywh .about_t .about_l span{ font-size: 24px!important; line-height: 60px!important; font-weight: 300!important;  } 
.qywh .about_t .about_l strong span{ font-weight: bold!important; }
.qywh .about_t .about_r{ width: 40%; float: right }

.about_list{ margin: 0 0 80px;}
.about_list li{ float: left; }
.about_list li{ padding: 14px; border-radius: 10px;  background: #fff;  width: calc((100% - 120px)/3); text-align: center; margin: 0 20px 20px 0;}
.about_list li:nth-child(3n){ margin: 0 20px 20px 20px; }
.about_list li:nth-child(3n-2){ margin: 0 20px 20px 20px; }
.about_list li .ico{ overflow: hidden;    padding: 30px 0; }
.about_list li .ico img{ transition: 0.5s all; margin: 0 auto; text-align: center}
.about_list li:hover .ico img{     transform: scale(1.1);   }
.about_list li p{ font-size: 18px; margin: 30px 10px 20px; color: #000;white-space: nowrap; /* 不换行 */
    overflow: hidden; /* 隐藏超出内容 */
    text-overflow: ellipsis; /* 显示省略号 */  text-align: center; }
.about_list li:hover p{  color:  #063783 }
.about_list li span{ display: block; background: url(../img/jt.png) no-repeat 0px center; background-size: auto 100%; padding: 0 0 0 24px; font-size: 12px; color: #878787; margin: 0 0 40px;}
.about_list li:hover{ box-shadow: 0 0 10px #ededed; }
    
.product{background: #F7F7F7; padding: 0 0 80px;}
.product h2{ font-size: 32px; line-height: 160px; text-align: center; color: #717171; box-shadow: 0 0 14px #E4E4E4; margin: 0 0 80px; }



.product_list{ margin: 0 0 80px;}
.product_list li{ float: left; }
.product_list li{ padding: 14px; border-radius: 10px;  background: #fff;  width: calc((100% - 120px)/3); text-align: center; margin: 0 20px 20px 0;}
.product_list li:nth-child(3n){ margin: 0 20px 20px 20px; }
.product_list li:nth-child(3n-2){ margin: 0 20px 20px 20px; }
.product_list li .ico{ overflow: hidden;    padding: 00px 0; }
.product_list li .ico img{ transition: 0.5s all; margin: 0 auto; text-align: center}
.product_list li:hover .ico img{     transform: scale(1.1);   }
.product_list li p{ font-size: 18px; margin: 30px 10px 20px; color: #000;white-space: nowrap; /* 不换行 */
    overflow: hidden; /* 隐藏超出内容 */
    text-overflow: ellipsis; /* 显示省略号 */  text-align: center; }
.product_list li:hover p{  color:  #063783 }
.product_list li span{ display: block; background: url(../img/jt.png) no-repeat 0px center; background-size: auto 100%; padding: 0 0 0 24px; font-size: 12px; color: #878787; margin: 0 0 40px;}
.product_list li:hover{ box-shadow: 0 0 10px #ededed; }
    
.product_fl ul { display:flex;     justify-content: center;}    
.product_fl ul li{ padding: 0;  margin: 0 5%!important;}

  
.news{background: #F7F7F7; padding: 0 0 80px;}
.news h2{ font-size: 32px; line-height: 160px; text-align: center; color: #717171; box-shadow: 0 0 14px #E4E4E4; margin: 0 0 80px; }

.news_list{ margin: 0 0 80px;}
.news_list li{ float: left; }
.news_list li{ padding: 14px; border-radius: 10px;  background: #fff;  width: calc((100% - 120px)/3); margin: 0 20px 20px 0;}
.news_list li:nth-child(3n){ margin: 0 20px 20px 20px; }
.news_list li:nth-child(3n-2){ margin: 0 20px 20px 20px; }
.news_list li .ico{ overflow: hidden;   }
.news_list li .ico img{ transition: 0.5s all; margin: 0 auto; text-align: center}
.news_list li:hover .ico img{     transform: scale(1.1);   }
.news_list li p{ font-size: 18px; margin: 30px 10px 20px; color: #000;white-space: nowrap; /* 不换行 */
    overflow: hidden; /* 隐藏超出内容 */
    text-overflow: ellipsis; /* 显示省略号 */  }
.news_list li:hover p{  color:  #063783 }
.news_list li span{ display: block; background: url(../img/jt.png) no-repeat 0px center; background-size: auto 100%; padding: 0 0 0 24px; font-size: 12px; color: #878787; margin: 0 0 40px;}
.news_list li:hover{ box-shadow: 0 0 10px #ededed; }
    
.page{ display: flex; justify-content: center; margin: 50px 0 0; align-items: center;}
.page a{ margin: 0 8px;}
.page a:nth-child(1){ padding: 4px 10px; border: 1px solid #333; border-radius: 50px;}
.page a:last-child{ padding: 4px 10px; border: 1px solid #333; border-radius: 50px;}
.page a:hover{  color:  #063783 }
.page a.page-num-current{  color:  #063783 }


.news_t{ padding: 30px; border: 1px solid #ccc;}
.news_t h1{    font-weight: normal;    font-size: 25px;    line-height: 40px;    color: #000;}


.news_t .top {    font-size: 14px;    line-height: 35px;    color: #888;    overflow: hidden;    border: 1px solid #eee;    margin-top: 15px;}
.news_t .top span {    padding-right: 40px;}
.news_t .top .bshare-custom {    margin: 1% 2%;}
.news_t .top .sp1 {    background: url('../img/time-bg_03.png') no-repeat;    width: 272px;    text-align: center;    font-size: 14px;    color: #9d9d9d;}
.news_t .top .sp3 {    background: url('../img/single-view.png') no-repeat left center;    padding-left: 30px;}
.news_cont{ margin: 50px 0 0;}
.fen{ width: 96%;  padding: 20px 0 20px;    border-top: 1px solid #e8e8e8;    position: relative;    overflow: hidden; margin: 50px auto 0;}
.fen a{     display: block;    white-space: nowrap;    overflow: hidden;    text-overflow: ellipsis;    color: #6b6b6b;    font-size: 14px; line-height: 48px; }
.fen a.fh {    position: absolute;    right: 0;    top: 30%;    width: 106px;    height: 40px;    background: #d2d2d2 url(../img/icon-backtolist.png) no-repeat left;    text-align: center;    line-height: 40px;    color: #fff;    padding-left: 30px;    background-size: 22%;    background-position-x: 8px;}
.fen a:hover{ color: #063783; }

.zsjm h2{ font-size: 32px; line-height: 160px; text-align: center; color: #717171; box-shadow: 0 0 14px #E4E4E4; margin: 0 0 80px; }
.zsjm .zsjm_t{ margin: 0 0 50px;  }

.contact {background: #F7F7F7; padding: 0 0 80px;}
.contact h2{ font-size: 32px; line-height: 160px; text-align: center; color: #717171; box-shadow: 0 0 14px #E4E4E4; margin: 0 0 80px; }
.contact .contact_t{ margin: 0 0 50px;   }

.contact  .cont_l{float: left; width: 50%;}
.contact .cont_l img:hover{ box-shadow: 5px 5px 5px #eee;transition: 0.8s all; }
.contact  .cont_r{float: right; width: 45%; border-bottom:1px solid #ccc; }
.contact  .cont_r .tel1{ border-top:1px solid #ccc; line-height: 48px;   padding: 28px 0; color: #595656; font-size: 16px; }
.contact  .cont_r .tel2{ border-top:1px solid #ccc; line-height: 48px;   padding: 28px 0; color: #595656; font-size: 16px; }
.contact  .cont_r h4{ font-size: 28px; color: #063783; line-height: 42px; margin: 0 0 20px;}
.m_nav{display: none;}
.menu{display: none;}
@media screen and (max-width:1600px) {
	
	header .nav{ display: none;}
	header .logo{         padding: 15px 0;width: 40%; }
	
	.menu { display: block; position: absolute; top: calc(50% - 10px); right: 0px; padding: 0 15px;      cursor: pointer;      -webkit-transition: 0.3s;      transition: 0.3s;  z-index: 2  }
    .menu .bar:nth-of-type(1) {      margin-top: 0px;    }
    .menu .bar:nth-of-type(3) {      margin-bottom: 0px;    }
    .bar { position: relative; display: block; width: 30px; height: 2px; margin: 7px auto; background-color: #333; border-radius: 10px; -webkit-transition: 0.3s; transition: 0.3s;    }
	.cross .bar:nth-of-type(1) {      -webkit-transform: translateY(9px) rotate(-45deg);      -ms-transform: translateY(9px) rotate(-45deg);      transform: translateY(9px) rotate(-45deg);    }
    .cross .bar:nth-of-type(2) {      opacity: 0;    }
    .cross .bar:nth-of-type(3) {      -webkit-transform: translateY(-9px) rotate(45deg);      -ms-transform: translateY(-9px) rotate(45deg);      transform: translateY(-9px) rotate(45deg);    }
	.m_nav { position: absolute; top: calc(100% + 0px); padding: 0 0 40px; background: #fff; width: 100%; z-index: 999; left: 0; }
	.m_nav1 > li{ width: 100%; border-bottom: 1px #eee solid; margin: 0 auto;}
	.m_nav1 > li > a{ display: table; width: 100%;margin: 0 auto; font-size: 16px; line-height: 54px; padding: 0 10%;  position: relative;}
	.m_nav1 > li#m > a::after{content: "+"; position: absolute; top: calc(50% - 27px); right: 20px; font-size: 24px;  color: #ccc;}
	.m_nav2{ display: none;}
	.m_nav2 a{ display: table; width: 100%;margin: 0 auto; font-size: 14px; line-height: 36px; border-top: 1px #eee solid; padding: 0 15%;}
	}
	@media screen and (max-width:1200px) {
	#op1{ padding: 50px 0 0 ;}
	#op1 .w1 h3{ font-size: 24px; }
	#op1 .w1 p{ font-size: 14px;    line-height: 24px;     margin: 20px 0;}
	#op1 .w1 .numberwrap {    display: flex;    flex-wrap: wrap;    justify-content: space-around;    margin: 0 auto 20px;}
	#op1 .w1 .numberwrap .num{ width: 48%; margin: 0 0 30px; }
	#op1 .w1 .numberwrap .num span{ font-size: 42px;}
	#op1 .w1 .numberwrap .num p{ font-size: 14px; padding: 0 10px; width: 100%; margin: 15px auto 0; line-height: 32px;}
	#op1 .w1 .img1{ width: 40%; max-width: 200px;}
	#op1 .w1 .op1_a{ font-size: 12px;     margin: 50px auto 30px;}
}	



@media screen and (max-width:978px) {	
	 header{ border-bottom: #8c6d36 solid 1px; }
	#op2{ padding: 40px 0 20px;}
	#op2 h2{ margin: 0 0 30px; font-size: 24px;}
	#op2 ul li{ width: 100%; margin: 0 auto 30px;}
	#op2 ul {    display: flex;    justify-content: space-around;    flex-wrap: wrap;}
	#op2 .w1 .op2_a{ font-size: 12px;     margin: 20px auto 30px;}
	footer .f_nav li > a{ font-size: 12px;     margin: 0 10px;}
	footer .foot { font-size: 12px; flex-wrap: wrap; text-align: center; }
	footer .f_logo a{ width: 50%}
	footer .foot p{ width: 100%; line-height: 24px; }
	footer .foot p a{  line-height: 24px; }
	footer .foot a::after{ display: none; }
	#op3{ padding: 30px 0; }
	.about h2{ font-size: 24px; margin: 0 0 30px; line-height: 64px;}
	.about .w1 h3{font-size: 24px; margin: 20px auto 30px;}
	.about .about_t{ margin: 0 0 50px;}
	.about .about_t .about_l{ width: 100%;}
	.about .about_t .about_l p{  font-size: 14px!important;line-height: 24px!important;}
	.about .about_t .about_l span{ font-size: 14px!important; line-height: 24px!important;}
	.about .about_t .about_r{ width: 100%; }
	
	.qywh h2{ font-size: 24px; margin: 0 0 30px; line-height: 64px;}
	.qywh .about_t .about_r{ width: 100%; }
	.qywh .about_t .about_l p{  font-size: 14px!important;line-height: 24px!important;}
	.qywh .about_t .about_l span{ font-size: 14px!important; line-height: 54px!important;}
	.qywh .about_t .about_l{ width: 100%; margin: 0 0 50px;}
	
	.about_list li { width: calc((100% - 40px) / 2); padding: 0 ; }
	.about_list li:nth-child(2n-1) {    margin: 0 40px 20px 00px; } 
	.about_list li:nth-child(2n)  {    margin: 0 0px 20px 00px; } 
	.about_list li p{  font-size: 14px!important;}
	.about_list li .ico{ padding: 0; }
	
	.product h2{ font-size: 24px; margin: 0 0 30px; line-height: 64px;}
	.product_list li { width: calc((100% - 20px) / 2); padding: 4px ; }
	.product_list li:nth-child(2n-1) {    margin: 0 20px 20px 00px; } 
	.product_list li:nth-child(2n)  {    margin: 0 0px 20px 00px; } 
	.product_list li p{  font-size: 14px!important;    margin: 10px 10px 10px}
	.product_list li .ico{ padding: 0; }
	
	.news h2{ font-size: 24px; margin: 0 0 30px; line-height: 64px;}
	.news_list li { width: calc((100% - 40px) / 2); padding: 4px ; }
	.news_list li:nth-child(2n-1) {    margin: 0 40px 20px 00px; } 
	.news_list li:nth-child(2n)  {    margin: 0 0px 20px 00px; } 
	.news_list li p{  font-size: 14px!important;    margin: 10px 10px 10px}
	.news_list li .ico{ padding: 0; }
	
	.w3{ max-width: 92%!important; }
	.fen a.fh{ position: relative;         float: right;}
	
	.contact h2{ font-size: 24px; margin: 0 0 30px; line-height: 64px;}
	.contact .cont_r{ width: 100%; }
	.contact .cont_l{ width: 100%; }
}