@charset "utf-8";
/* CSS Document */
*{ box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.m{ width:1200px; margin:0 auto; padding:50px 0;}

.main_left{ width:250px; float:left; box-shadow: 0 10px 20px #999; border-top-left-radius: 20px; background:#fff;}
.main_left .left_h{ width:250px; border-top-left-radius: 20px; background:url(../images/left_h_bg.jpg) no-repeat;; padding:10px 0;}
.main_left .left_h p{ text-align:center; color:#fff; text-transform:uppercase;}
.main_left .left_h .p1{ font-size:20px; font-weight:bold; line-height:1.8;}
.main_left .left_ul{ width:250px; padding:20px 0; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; position:relative; z-index:99999; border-bottom:5px solid #016BC6;}
.main_left .left_ul .li1{ border-bottom: 1px solid #f1f1f1; line-height:40px; position:relative; text-indent:20px; transition:0.2s; -webkit-transition:0.2s; background:#fff url(../images/bg_l.png) no-repeat 200px 17px;}
.main_left .left_ul .li1:hover{  background:#fafafa url(../images/bg_l.png) no-repeat 205px 17px;}
.left_bg{ width: 250px; height: 40px; line-height: 40px; background: #F8F8F8; border-left: 5px solid #016BC6; position: absolute; left: -5px; transition:0.2s; -webkit-transition:0.2s; z-index:-1; opacity:0;}
.main_left .left_ul .li1 .ul2{ width:248px; background:#f8f8f8; border:1px solid #f1f1f1; display:none; z-index:99999;}
.main_left .left_ul .li1 .ul2 .li2{ border-bottom: 1px solid #fff; background:#f1f1f1; transition:0.2s; -webkit-transition:0.2s; font-size:14px; z-index:99999; position:relative; text-indent:40px;}
.main_left .left_ul .li1 .ul2 .li2:hover{ background:#f8f8f8;}

.main_right{ width:920px; float:right; background:#fff; padding:20px;  box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-shadow: 0 10px 20px #999; z-index:0;}
.main_right .tit { height: 40px; line-height: 40px; background:#eaeaec; border-radius: 15px 0 0 0; margin-bottom:20px;}
.main_right .tit h3 { font-size: 18px; float: left; color: #fff; font-weight: normal; padding: 0 40px; background:#016BC6; border-radius: 15px 0 15px 0; }
.main_right .tit .now { float: right; color: #999; margin-right: 10px; }
.main_right .tit .now a { color: #999; }

/*about*/
.about p{ text-indent:2em; line-height:1.8; margin:5px 0; font-size:14px;}
.about img{ width:880px; margin-top:20px;}

/*news*/
.news{ width:880px;}
.nwli{ border-bottom:#ccc 1px dashed; height:150px}
.nwli.on{ background-color:#f7f7f7}
.conc_tu{ float:left; margin-top:20px; width:150px; height:113px}
.conc_zi{ float:left; margin-left:30px; margin-top:20px; width:680px}
.czi_tit{ font-size:16px; font-weight:bold; color:#000}
.czi_tit a{ color:#016BC6;}
.czi_nr{ margin-top:20px; color:#666666}
.czi_nr span{ display:block; padding-top:10px; font-size:14px; color:#016BC6;}

/*product*/
.product{}
.product_ul{ width:880px;}
.product_ul li{ width:30%; margin-right:5%; float:left; border:1px solid #ccc; position:relative; margin-bottom:20px;}
.product_ul li:nth-child(3n){ margin-right:0;}
.product_ul li img{ width:100%;}
.product_ul li .pro_t{ display:block; padding:20px; background:#f2f7fb; transition:0.5s; -webkit-transition:0.5s; font-size:14px;}
.product_ul li .line{position:absolute; background:#13418e; transition:0.5s; -webkit-transition:0.5s;}
.product_ul li .line1{left:0; top:0; height:2px; width:0;}
.product_ul li .line2{right:0; top:0; height:0px; width:2px;}
.product_ul li .line3{right:0; bottom:0; height:2px; width:0;}
.product_ul li .line4{left:0; bottom:0; height:0; width:2px;}
.product_ul li:hover .line1{width:100%;}
.product_ul li:hover .line2{height:100%;}
.product_ul li:hover .line3{width:100%;}
.product_ul li:hover .line4{height:100%;}
.product_ul li:hover p{background:#13418e; color:#fff;}
.product_ul li:hover a{color:#fff;}

/*equipment*/
.equ_ul{ width:880px; margin:40px auto;}
.equ_ul li{ width:30%; float:left; margin-right:5%; margin-bottom:20px;}
.equ_ul li:nth-child(3n){ margin-right:0;}
.equ_ul li a{ display:block; padding:5px; border:1px solid #ddd; position:relative;}
.equ_ul li a:hover{ border:1px solid #13418e;}
.equ_ul li img{ width:100%;}
.equ_ul li p{ text-align:center; margin-top:10px; font-size:14px;}
.equ_ul li p a{ color:#666;}

li .cover { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #13418e; opacity: 0; filter: alpha(opacity=0); -webkit-transition: all .2s ease; transition: all .2s ease; }
li:hover .cover { opacity: .8; filter: alpha(opacity=80); }
li .ico01 { width: 68px; height: 68px; position: absolute; top: 50%; left: 50%; margin-top: -34px; margin-left: -94px; background: url(../images/i5.png) no-repeat center center; opacity: 0; filter: alpha(opacity=0); -webkit-transition: all .4s ease; transition: all .4s ease; }
li:hover .ico01 { margin-left: -34px; opacity: 1; filter: alpha(opacity=100); }
li .ico02 { width: 68px; height: 68px; position: absolute; top: 50%; left: 50%; margin-top: -34px; margin-left: 64px; background: url(../images/i6.png) no-repeat center center; opacity: 0; filter: alpha(opacity=0); -webkit-transition: all .4s ease; transition: all .4s ease; }
li:hover .ico02 { margin-left: -34px; opacity: 1; filter: alpha(opacity=100); }

/*feedback*/
.msg{ width: 100%;}
.msg .lf{ float: left;}
.msg .ri{ float: right;}
.msg i{ width: 70px; line-height:34px; display: block; font-style: normal; font-size: 16px; float: left; letter-spacing: 3px; color: #666;}
.msg i font{ color: #dc0000;}
.msg p input{ width: 300px; height: 26px; padding:3px 12px; border:1px solid #d9d9d9; border-radius:4px; overflow: hidden; font-size: 16px;}
.msg textarea{ width:808px; border:1px solid #d9d9d9; float: left; border-radius: 4px; overflow: hidden; font-size: 16px; height: 180px; text-indent:10px;}
.submits{ display: block; width:80px; height:32px; line-height:32px; color: #fff; font-size: 16px; text-align: center; background: #016BC6; border-radius: 4px; border:0 none; overflow: hidden; margin-left:70px; cursor: pointer; transition-duration:300ms;}

/*contact*/
.contact{ width:880px; margin:0 auto;}
.contact .contact_m{ margin-bottom:30px; width:50%; float:left;}
.contact .contact_m img{ float:left; height:40px;}
.contact .contact_m .p1{ float:left; font-size:16px; padding-left:15px; margin-bottom:5px;}
.contact .contact_m .p2{ float:left; font-size:14px; padding-left:15px; width:70%;}