
/*产品中心内页*/
.conleft{ float: left; width: 200px; margin-top: 30px;  }
.conleft img{ background: #0e4aac	; width: 200px }
.conright{ float: right; width: 960px; float: right; min-height: 500px; background:#fff; padding:0 20px; margin-top: 30px }



.listbox .listbox{ margin-bottom:20px; overflow: hidden; display: block; clear: both; background: #fff }
.listbox .pronav{ background: #0e4aac; height: 100px; line-height: 100px;  text-align: center; color: #fff; display: block; font-size:25px; font-weight: normal; }
.listbox .prosubnav{ background: #fff; overflow: hidden; border:1px solid #0e4aac; }
.listbox .prosubnav li{ line-height: 50px; background: url(../images/listiconhover.png) #e4e4e4 no-repeat 10px 20px ; 
	padding-left: 35px; border-bottom: 1px #efefef dashed ; display: block; margin:10px; color: #000; transition: 0.5s }
.listbox .prosubnav li a{ display: block; font-size: 14px; color: #000 }
.listbox .prosubnav li:hover{ background: url(../images/listicon.png) #0e4aac no-repeat 10px 20px ; color: #fff}
.listbox .prosubnav li:hover a{ color: #fff }

.question strong{border-bottom: 1px solid #ccc; display: block; margin-top: 30px; line-height: 50px; font-size: 18px; font-weight: normal;  }
.question strong a{ float: right; font-size: 12px; color: #ccc  }
.question strong a:hover{ color: #0e4aac  }
.question ul li{ height: 30px; line-height:30px; padding-left:20px; overflow: hidden; background: url(../images/icon.png) 5px 12px no-repeat;  border-bottom: 1px solid #f1f1f1 }


.procon{ float: left; width: 980px; }
.procon .proconlist li{ float: left; margin-right: 25px; width: 299px; }
.procon .proconlist li img{ width: 100%; overflow: hidden; height: 220px }
.proconlist li{ margin-bottom:30px;border:1px dashed #f8f8f8; background: #fff; text-align: center; position: relative; padding-bottom: 50px }
.proconlist li em{ background: url(../images/probg.png)  no-repeat; transition: 0.5s; opacity: 0; background-size:100% auto;  display: block; height: 100%; width: 100% ; position: absolute; top: 0; left: 0  }
.proconlist li:hover{ box-shadow: 0px  0px 10px #ccc; transition: 0.5s;}
.proconlist li p{ height: 50px; line-height: 50px; font-size: 18px; width: 100%; background: #e4e4e4 ; position: absolute; left: 0; bottom: 0; transition: 0.5s }
.proconlist li:hover p{color: #fff; background: #0e4aac; height: 90px; line-height: 90px; }
.proconlist li:hover em { opacity: 1 }


/*产品*/
.indexpor{overflow: hidden; }
.check_tit{ text-align: center; margin-bottom: 30px;margin-top: -50px; color: #CCC;  }
.check_tit a{ cursor: pointer; margin:0 5px 20px 5px;
 text-align: center; font-size: 13px;   transition: 0.5s; color: #333; border: 1px solid #ccc; padding: 8px 30px}
.check_tit a:hover,.check_tit a.on{ color: #fff;  background: #0e4aac }



.check_con{ z-index: 1; width: 1200px; }
.check_con ul{ clear:both; overflow: hidden; padding-top: 10px }


.check_con ul li{ float:left; width:380px;  overflow: hidden;   transition: 0.8s; margin-right: 29px  }
.check_con ul li:nth-child(3n){ margin-right: 0 }
.check_con ul li img{ height: 300px; width: 100%; overflow: hidden;}
.check_list  li a{ display: block; margin-bottom:20px;   }
.check_list  li a strong{  width: 100%; line-height: 30px;   font-size: 15px; color: #000;   }
.check_list  li a strong span{ font-size: 14px; display: block; font-weight:normal; color: #999; line-height: 20px; height: 40px; overflow: hidden;}




.arrow {margin:0 auto; width: 330px; margin-top: 50px}
.arrow .btn { width: 50px; height: 50px; cursor: pointer; } 
.arrow .btnl {background: url(../images/jtl02.png) no-repeat center; float: left; }
.arrow .btnr {background: url(../images/jtr02.png) no-repeat center;float: left; }
.arrow .btnl:hover {background: url(../images/jtl03.png) no-repeat center;}
.arrow .btnr:hover {background: url(../images/jtr03.png) no-repeat center;}
.arrow a.more{ border: 1px solid #ccc ; float: left; display: inline-block;  height: 40px; line-height: 40px; margin: 0;margin-top:5px;}
.Box {position: relative; overflow: hidden; width: height:300px; overflow: hidden; margin: 100px  auto}
.Box .content {width: 100%;margin: 0 auto;}
.Box .Box_con {position: relative;}

.Box .Box_con .conbox {position: relative;}
.Box .Box_con .conbox ul {position: relative;list-style: none; padding-bottom: 20px;}
.Box .Box_con .conbox ul li {float: left; width: 400px;height: 400px;margin-right: 20px; background: #fff; 
	position: relative; overflow-x: hidden;  }
.Box .Box_con .conbox ul li::-webkit-scrollbar {
    display: none;
}
.Box .Box_con .conbox ul li:hover{  }	
.Box .Box_con .conbox ul li .pimg{ width: 400px;height: 400px; overflow: hidden; position: absolute; top: 70px; transition: 0.2s }
.Box .Box_con .conbox ul li img {display: block;width: 400px;height: 400px;transition: all 0.5s; overflow: hidden; }
.Box .Box_con .conbox ul li:hover .pimg{  top: 0 }
.Box .Box_con .conbox ul li:hover img {transform: scale(1.1); height: 400px; top: 0;}


.Box .Box_con .conbox ul li span{ line-height: 70px; height: 70px; background: #fff; text-align: center; 
	display:block;  color: #333; width: 90%; background: #f8f8f8; position: absolute; left: 0; bottom: 0; padding: 0 5%; 
	font-size: 18px; border-bottom: 1px solid #ccc; transition: 0.2s; color: #000}
.Box .Box_con .conbox ul li:hover span{ height: 0; overflow:hidden;  }

.moretext{ position: absolute; left: 0; top: 0; width: 0; height: 100%; background:rgba(0,0,0,0.4); color: #fff; text-align: center;  }
.moretext em{ color: #fff; display:block;  position: absolute; top: 0; height: 90px; top: 50px; text-align: center; 
	overflow: hidden; left: -400px;  overflow: hidden;  line-height: 30px; padding: 0 10% }
.Box .Box_con .conbox ul li:hover .moretext em{left: 0; width: 80%; text-align: center; font-size: 20px; color: #fff; transition: all .28s ease-in .3s;  }
.moretext i{ color: #fff; transition: all .28s ease-in .2s;  
	background: rgba(0,0,0,0.5) ;
	 border-radius: 50%;
	  height: 50px; width: 50px;
	   display: inline-block;
	   font-size: 20px;
	   line-height: 50px;
	    bottom: 200px;
	    position: absolute;
	    left: -50px;

	     }
.Box .Box_con .conbox ul li:hover  .moretext i{ left: 50% ; margin-left: -25px}

.Box .Box_con .conbox ul li:hover .moretext {  width: 100%; height: 100%; }
.Box .Box_con .conbox ul li:hover span{ height: 0; }

.moretext center{ height: 0; width: 100%; background: #333; bottom: 0; position: absolute; transition: all .28s ease-in .1s; }
/*.moretext:hover center{height: 70px;   }*/

.moretext a.innermore{ color: #fff;  background: #0e4aac; bottom: 50px; height: 100px; line-height: 100px ;
 position: absolute; transition: all .28s ease-in .1s;  width: 0; overflow: hidden; }
.Box .Box_con .conbox ul li:hover .moretext a.innermore{ width: 100%; }







.messagebox{ background: url(../images/index_22.jpg) no-repeat center top fixed; background-size: 100% 100%; padding: 100px 0; overflow: hidden;  }

.aboutbox{width: 500px; float: left;  color: #fff }
.aboutbox strong{ font-size: 50px; display: block; font-weight:normal; }
.aboutbox span{  font-size: 18px; line-height: 40px }
.aboutbox p{ margin: 60px auto; line-height: 25px; height: 150px; overflow: hidden;  }

.aboutbox a{ border-radius: 10px;  color: #6ea0f1; background: #000; padding:5px 20px }
.aboutbox a:hover{  color: #fff; }
/*留言板*/
.message {
  background: #fff;
  width: 460px;
  padding: 20px;
  margin: 0 auto;
  margin-top:30px;
  float: right;
}
.message p{
  text-align: center;
}
.message p strong{
  font-size: 30px;
  display: block;
  color: #000;
}
.message p em{
  color: #eeb819;
  font-size: 14px;

}
.message form{
  margin-top: 20px;
}

.message form label{ 
  display: block;
  margin-bottom: 20px
   }
   
.message form label span{ 
  width: 100px; 
display: inline-block; 
text-align: left;
font-size: 16px;
 }

.message form label input{
  border: none;
  border: 1px solid #ccc;
  border-radius: 5px;
  min-height: : 40px; 
  line-height: 40px;
  padding-left: 5px;
  background: #f1f1f1;
  width: 300px
}

.message form label.button{ 
  width: 100%;
  height: 40px; 
  background: #333333;
  color:#fff; 
  display: block;
  border-radius: 5px;
  text-align: center;
  line-height: 40px;
 }


 .message form label.button input{
  border: none;
  background: none;
  color: #fff;
  cursor: pointer;
 }


.message form label textarea{
  border: none;
  border: 1px solid #ccc;
  border-radius: 5px;
  line-height: 40px;
  padding-left: 5px;
  background: #f1f1f1;
  width: 300px}
a.more{ font-size: 18px; position: relative; padding:  0 10px; color: #999;  text-align: center; display: block; margin: 10px auto; width: 180px }
a.more i{ position: absolute; height: 1px; width: 100%; background: #999; left: 0; top: 11px; transition: 0.5s }
a.more:hover i{ width: 0 }
a.more:hover{ color: #0e4aac; }




/*选择我们*/
.check{ background:url(../images/checkbg.jpg); display:block; overflow: hidden; }
.check_title{ background: #0e4aac; margin: 0 auto; padding-bottom: 50px; margin-bottom: 50px  }
.check_title strong{ color: #fff;}
.check_title span{ color: #3c73cc;}
.checktit{ text-align: center; margin: 80px 0 }
.checktit p{  font-size:40px; color: #f18847; font-weight: bold; }
.checktit span{  font-size:40px; color: #bdbdbd; font-size:22px; }
.checkcon{  }
.checkcon dl{ margin-bottom:50px; display: block; clear:both; overflow: hidden; }
.checkcon dl dt { float: left ; width: 400px; padding-left:50px; margin-right:100px;}
.checkcon dl dd{ float: left; width: 600px; text-align: center; }
.checkcon dl dt div strong{ font-size:22px; font-weight: bold; color: #000; 
	display: block; line-height: 40px   }
.checkcon dl dt div{ margin-bottom: 50px; color: #979797 }
.checkcon dl dt div span{ font-size:18px;  color: #666; 
	margin-bottom: 12px; display: inline-block;   }
.checkcon dl dt div p{ line-height: 30px; font-size: 14px; max-height: 120px;  overflow: hidden; padding-left: 30px;
 background: url(../images/png.png) no-repeat left 5px; color: #000 }
.checkcon dl:nth-child(2n) dt{ float: right; }





/*新闻资讯*/

.newstit{ background: url(../images/i_news_bg.jpg) no-repeat center top; margin: 0; padding: 30px 0 50px 0 }
.newstit strong{ color: #fff }
.newstit span{ color: #0e4aac }
.news{ display: block; overflow: hidden;  overflow:hidden; }
.news ul{ overflow: hidden; padding-top: 100px;}
.news ul li{ float: left; overflow: hidden; width:580px; margin-right:30px;  margin-bottom: 30px }
.news ul li:nth-child(2n){ margin-right:0; }
.news ul li img{ height: 100px; width:160px; float: left;  margin-right: 10px }

.news ul li .newtext{ float: left;width:410px }
.news ul li strong{ display: block; height: 30px; line-height:30px; 
	font-size: 16px; }
.news ul li a:hover {  color: #000 }
.news ul li em{ color: #999 }
.news ul li p{ line-height: 22px;  height: 44px; overflow: hidden; color: #999 }
.news ul li i{transition:0.8s; height: 1px; background: #333; width: 0; overflow: hidden; 
	display: block;}
.news ul li:hover i{ width: 100% }


