@charset "utf-8";
body,div,ul,li,h1,h2,h3,h4,h5,h6,form,input,textarea,p,th,i{margin:0; padding:0;}
li,i{list-style:none;  font-style: inherit;}
input,textarea,select{font-family:inherit; font-weight:inherit; font-size:14px;}
img{border:0;}
em{font-style: initial;}
dl,dt,dd{margin: 0px; padding: 0px; list-style: none;}
.cl,.clear{height:0; overflow:hidden; clear:both;}
.fl{ float:left}
.fr{ float:right}
a:link{text-decoration:none;}
a:visited{text-decoration:none;}
a:hover{text-decoration:none;}
body,td,th{font-size: 14px;color:#333333;}
body{font-family:Microsoft YaHei; font-size: 14px; min-width:1300px; color:#333333;overflow-x: hidden;}
a{font-size:14px; color:#333333;}
.w1400 { width:1300px; margin:auto;}
.mar50{ margin:50px auto;}
.bottom30{margin-bottom:50px;}
.dis{ display: none;}
.w1000{width:1000px; float:right;}

.top{ height: 100px; background: #03467a; background-image: linear-gradient(to right, #03467a, #045ea4); width: 100%; position: relative; min-width:1300px;}
.top_r{ width: 320px; background: #fff; height: 58px; position: absolute; left: 0px; top: 0px; padding: 21px;}
.top_r strong{ font-size: 17px; color: #03467a; display: block;}
.top_r span{ font-size: 17px;letter-spacing: 3.4px;line-height: 30px;}
.top_r a{display: block; margin-right: 15px;}
.top_z{ margin-left: 310px;padding-left: 30px;}
.nav li{ float: left; margin-left: 70px; position: relative;}
.nav li>a{font-size: 16px;display: block; color: #fff; line-height: 100px; }
.nav li>a::before{content: ""; display: inline-block; width: 0px; height: 2px; background: #fff;margin-bottom: 4px; margin-right: 10px; transition: all 0.3s;}
.nav li:hover>a::before, .nav li.cur>a::before{ width: 10px;}
.top_l{position: absolute; right:1%; top: 35px;}
.search{cursor: pointer;}
.top_tel{ font-family: Arial;  font-size: 24px; color: #fff; font-weight: bold; margin-left: 20px; }
.top_tel span{vertical-align: top;margin-left: 10px;}


.nav li .menu{position: absolute; left: 0; top: 100px; background: #fff; z-index:10;}
.nav li .menu a{ width: 180px; height: 45px; border-top: 1px solid #f5f5f5; line-height: 45px; padding-left: 20px; background: url(images/12_1.png) no-repeat 180px 19px; font-size: 14px; display:block; text-align:left;}
.nav li .menu a:hover{ color: #03467a;}



@media screen and (max-width: 1700px){
    .nav li{margin-left: 50px;}
}

@media screen and (max-width: 1500px){
    .nav li{margin-left: 20px;}
}

.search_one{ position: absolute; top: 100px; z-index: 10; right: 0;  width:310px; height: 50px; display: none;}
.inputxt{outline: none;border: none;height: 100%;background: #f1f1f1;padding-left: 20px;width: 240px;float: left;height: 50px;}
.search_i input{ float: left; width: 50px;outline: none;border: none; background:#eb5e03 url(images/6.png); cursor: pointer;height: 50px;}


.title{ text-align: center; margin: 65px auto 30px;}
.title span{ font-size: 42px;}
.title span strong{ color: #03467a;}
.title p{ font-size: 17px; color: #999999;font-weight: 100; margin: 8px 0px 0px;}
.title i{display: block;width: 80px;height: 5px;margin: 25px auto 0; position: relative;}
.title i:after,.title i:before{content: '';display: block;position: absolute;width: 30px; height: 5px;top: 0;left: 0;}
.title i:after{right: 0px;left: inherit;background:#00ae3d;animation:allTitleAfter 3s infinite linear;}
.title i:before{background:#eb5e03;animation:allTitleBefore 3s infinite linear;}
.title b {width: 30px;height: 5px;background:#03467a;margin:0 auto;display:block;animation:allTitleI 3s infinite linear;}
@keyframes allTitleI{
0%{transform:translateX(0px);}
25%{transform:translateX(-25px);}
50%{transform:translateX(0px);}
75%{transform:translateX(25px);}
100%{transform:translateX(0px);}
}
@keyframes allTitleBefore{
0%{width:15px;}
25%{width:0px;}
50%{width:15px;}
75%{width:30px;}
100%{width:15px;}
}
@keyframes allTitleAfter{
0%{width:15px;}
25%{width:30px;}
50%{width:15px;}
75%{width:0px;}
100%{width:15px;}
}

.products{  background:#f6f8fb; padding-bottom: 80px; overflow: hidden;}
.pro_l{ width: 270px; box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.05);}
.pro_t{  height: 102px; background: url(images/4_03.jpg); padding-left: 30px; overflow: hidden;}
.pro_t strong{ font-size: 28px;color: #fff; display: block; margin: 21px 0px 6px;}
.pro_t span{ font-size: 12px; font-family: Arial; color: #fff; text-transform: uppercase;}
.pro_l dl{  background: #fff; }
.pro_l dl>a{ display: block; font-size: 16px; padding:0px 30px;line-height: 60px; position: relative;border-bottom: 1px solid #e8e8e8; }
.pro_l dl>a::before{ content: ""; display: block; width: 11px; height: 10px; background: url(images/5_03.png)no-repeat left; position: absolute; right: 30px; top: 25px; transition: all 0.3s;}
.pro_l dl:hover>a::before{ background-position-x:right ;}
.pro_l dl:hover>a{ color: #03467a;}
.pro_l dl>ul{border-bottom: 1px solid #e8e8e8; background: #fbfbfb;transition: all 0.3s ease-in; padding:10px 0px;}
.pro_l dl>ul a{padding-left: 50px;line-height: 30px;color: #777;font-weight: 100; background:url(images/erjibeijing.png) no-repeat 30px 2px;}
.pro_l dl>ul a:hover{ color: #03467a;}
.pro_l dl:hover ul{
    display: block;
}
.pro_l dl>ul{
    display: none;
    
}

.pro_r{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.pro_r a{ display: block; width: 320px; height: 376px;overflow: hidden;box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.03);} 
.pro_r a:nth-child(n+4){margin-top: 20px;}
.pro_r a img{ width: 100%;}
.pro_r a p{height: 55px; line-height: 55px; font-size: 16px; padding-left: 30px; position: relative; background: #fff; margin-top: 1px;} 
.pro_r a p span{position: relative; z-index: 1;}
.pro_r a p::before{display: block;content: ""; width: 18px; height: 5px; background: url(images/6_03.png)no-repeat right; right: 30px; top: 25px; position: absolute; z-index: 1; transition: all 0.3s;}
.pro_r a p::after{ content: ""; display: block; width: 0%; height: 100%; background: #03467a; color: #fff; transition: all 0.3s; position: absolute; left: 0px; top: 0px;}
.pro_r a:hover p::after{ width: 100%;}
.pro_r a:hover{ color: #fff;}
.pro_r a:hover p::before{ background-position-x:left ;}

.features{overflow: hidden;  background: url(images/8_02.jpg) no-repeat  center; position: relative;}
.features .title span,.features .title strong,.features .title p{ color: #fff;}
.fea_box{height: 466px; background: url(images/15_03.png) no-repeat center; display: flex; justify-content: space-between;}
.fea_box dl{ width: 25%; text-align: center;}
.fea_box dl .fea_q1{ width: 130px; height: 130px;  background: rgba(3, 70, 122, 0.2); border-radius: 130px; overflow: hidden; box-shadow: 0px 0px 40px rgba(3, 70, 122, 0.2);margin: 75px auto 40px; transition: all 0.3s;}
.fea_box dl .fea_q2{width: 80px; height: 80px; border-radius: 80px; background: #03467a; margin: 25px auto;  text-align: center; transition: all 0.3s;}
.fea_box dl .fea_q2 img{margin-top: 14px;}
.fea_box dl:nth-child(2) .fea_q2 img{margin-top: 19px;}
.fea_box dl:nth-child(3) .fea_q2 img{margin-top: 22px;}
.fea_box dl:nth-child(4) .fea_q2 img{margin-top: 21px;}
.fea_box dl:hover .fea_q1{ background: rgba(235, 94, 4, 0.2);box-shadow: 0px 0px 40px rgba(235, 94, 4, 0.2);}
.fea_box dl:hover .fea_q2{ background: #eb5e03;}
.fea_box dl em{ font-size: 26px;}
.fea_box dl p{ line-height: 30px; font-size: 16px; color: #777; padding: 0px 20px; margin-top: 20px;}

.case{ display: flex; justify-content: space-between;}
.case a{ width: 244px; height: 540px; overflow: hidden; position: relative;}
.case_txt{ height: 270px; background: url(images/21_03.png); position: absolute; bottom: 0; text-align: center; transition: all 0.3s;}
.case_txt em{ font-size: 26px; color: #fff; display: block; margin: 40px 0px 8px;}
.case_txt span{ font-family: Arial, Helvetica, sans-serif; color: #fff; opacity: .3;  font-size: 14px; text-transform: uppercase;}
.case_xt{width: 35px; height: 2px; background: #fff; margin: 30px auto 28px;}
.case_txt p{ font-size: 15px; color: #fff; line-height: 26px; padding: 0px 20px;}
.case a:nth-child(2) .case_txt,.case a:nth-child(4) .case_txt{ top: 0 !important;}
.case a:hover .case_txt{ background: url(images/22_03.png);}
.case_more{ display: block; width: 206px; height: 45px; line-height: 45px; border-radius: 45px; border: 1px solid #d2d2d2;  text-align: center; font-size: 16px; margin: 30px auto 80px; transition: all 0.3s;}
.case_more:hover{ background: #03467a; border-color: #03467a; color: #fff;}

.advantage{overflow: hidden; height: 855px; background: url(images/23_02.jpg)no-repeat  center;}
.advantage .title span,.advantage .title strong,.advantage .title p{ color: #fff;}
.adv_box{box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.03);}
.adv_nav{ width: 270px; float: left;}
.adv_nav li{ height: 95px; background: #03467a; padding: 45px 0px 0px 40px; cursor: pointer; border-top: 1px solid #f6f8fb;transition: all 0.3s;}
.adv_nav li:first-child{ border-top: none;}
.adv_nav li strong{font-size: 26px; color: #fff; display: block;margin-bottom: 5px;}
.adv_nav li span{ font-family: Arial, Helvetica, sans-serif; font-size: 15px; text-transform: uppercase; color: #fff; opacity: .2;}
.adv_ico{ width: 42px; height: 52px; background: url(images/23_03.png)no-repeat left top; margin-right: 25px;}
.adv_nav li.on{ background: #eb5e03;}
.adv_con{ margin-left: 270px; width: 1030px; background: #fff; height: 563px;}
.adv_con dl{ padding: 45px 50px;}
.adv_txt{ width: 345px; float: right;}
.adv_txt strong{font-size: 32px; color: #03467a; display: block; margin: 30px 0px 14px;}
.adv_txt span{ color: #c9c9c9; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-transform: uppercase;}
.adv_xt{ width: 345px; height: 2px; background: url(images/27_07.jpg) no-repeat; margin: 36px 0px 40px;}
.adv_txt p{ font-size: 15px; line-height: 26px; color: #777; padding-left: 10px; background: url(images/26_03.jpg)no-repeat 0px 10px;    margin-bottom: 15px;}
.adv_tel{ width: 345px; height: 77px; border-radius: 5px;box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.1); display: flex; align-items: center; justify-content: center;  margin-top: 40px;}
.adv_tel span{ font-weight: 100; font-size: 14px; color: #777; display: inline-block; margin: 0px 5px 0px 10px;}
.adv_tel em{ font-family: Arial, Helvetica, sans-serif; font-size: 28px;color: #03467a; }
.adv_nav li:nth-child(2) .adv_ico{ width:53px; background-position-x:-67px;}
.adv_nav li:nth-child(3) .adv_ico{ width:44px; background-position-x:-160px;}
.adv_nav li:nth-child(4) .adv_ico{ width:56px; background-position-x:-234px;}






































.Details_xq1_qt{margin-top: 80px;}


ul.small_ul li{    width: 85px !important;height: auto !important;}
.showsum{width: 100% !important;height: 100px !important;} 
.small_ul{width: 100% !important;}
.showbox{ height: auto !important;}
.showbox>div{top: 0 !important;}
ul.small_ul li img{border: 1px solid #ddd; box-sizing: border-box;}



.Details_til{ line-height: 50px; height: 50px; background: #f5f5f5;margin: 20px 0px;}
.Details_til strong{font-size: 17px;display: block;background: #044b83;color: #fff;width: 15%;text-align: center;}
.Details_xq{font-size: 16px;line-height: 32px;color: #666;font-weight: 100;}
.Details_xq td{border-color: #eee;height: 45px;}
.Details_xq1{margin: 30px 0px;}
.Details_img{ display: flex; justify-content: space-between;flex-wrap: wrap;margin-top: 15px;}
.Details_img img{width: 32%;}
.Details_img1 img{width: 24%;}
.Details_img2 img{ width:48%;}
.Details_img li{width: 24%;    text-align: center;}
.Details_img li img{ display:block; width:100%;}
.Details_img img:nth-child(n+4){ margin-top:1.333%;}
.Details_xq strong{color: #333;display: block;font-size: 16px;}
.Details_xq img.fr{width: 40%;}
.Details_xq p.fl{ width:60%;}
.Details_xq table{text-align: center;margin: 20px 0px;}
