
@charset "utf-8";


*{ margin: 0; padding: 0; }
html,body{ min-height:100% ; width: 100%; margin: 0 auto; color: #666;   }
body{ position: relative; background: #fff ; font-size: 14px; margin: auto; font-family: "微软雅黑"  ; overflow-x: hidden;  -webkit-font-smoothing: antialiased;
}

a{ color: #666; text-decoration: none;}
	
a:hover,
a:focus{ text-decoration: none;}
i,em{font-style: normal; }
ul{ margin: 0; padding: 0;}
li{ list-style: none;}
img{ max-width: 100%; border: none;}
/*body{ -moz-user-select:none; -webkit-user-select:none; -ms-user-select:none;  -khtml-user-select:none; user-select:none;}
html{-webkit-user-select:none;  -moz-user-select:none;  -ms-user-select:none;  user-select:none; -khtml-user-select:none;  }*/
input,select,textarea{ outline: none;}


input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { /* WebKit browsers */ color:#999999;}
input::-moz-placeholder , textarea:-moz-placeholder{ /* Mozilla Firefox 4 to 18 */ color:#999999;}
input::-ms-placeholder ,textarea::-moz-placeholder{ /* Mozilla Firefox 19+ */ color:#999999; }
input::-o-placeholder { /* Mozilla Firefox 19+ */ color:#999999; }
input::-ms-input-placeholder, textarea:-ms-input-placeholder  { /* Internet Explorer 10+ */ color:#999999;}
input[type='submit'],input[type='reset'],input[type='button'],select{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}


.over2{ display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.over3{ display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }





/* fonts特殊字体 */
@font-face {
    font-family: 'dincond-regular-webfont';
    src: url('../fonts/dincond-regular-webfont.eot');
    src: url('../fonts/dincond-regular-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/dincond-regular-webfont.woff2') format('woff2'),
    url('../fonts/dincond-regular-webfont.woff') format('woff'),
    url('../fonts/dincond-regular-webfont.ttf') format('truetype'),
    url('../fonts/dincond-regular-webfont.svg#dincond-regular-webfont') format('svg');
}

@font-face {
    font-family: 'dincond-medium-webfont';
    src: url('../fonts/dincond-medium-webfont.eot');
	src: url('../fonts/dincond-medium-webfont.eot?#iefix') format('embedded-opentype'),
	url('../fonts/dincond-medium-webfont.woff2') format('woff2'),
	url('../fonts/dincond-medium-webfont.woff') format('woff'),
	url('../fonts/dincond-medium-webfont.ttf') format('truetype'),
	url('../fonts/dincond-medium-webfont.svg#dincond-medium-webfont') format('svg');
}


@font-face {
    font-family: 'dincond-bold-webfont';
    src: url('../fonts/dincond-bold-webfont.eot');
	src: url('../fonts/dincond-bold-webfont.eot?#iefix') format('embedded-opentype'),
	url('../fonts/dincond-bold-webfont.woff2') format('woff2'),
	url('../fonts/dincond-bold-webfont.woff') format('woff'),
	url('../fonts/dincond-bold-webfont.ttf') format('truetype'),
	url('../fonts/dincond-bold-webfont.svg#dincond-bold-webfont') format('svg');
}


@font-face {
    font-family: 'din-bold-webfont';
    src: url('../fonts/din-bold-webfont.eot');
	src: url('../fonts/din-bold-webfont.eot?#iefix') format('embedded-opentype'),
	url('../fonts/din-bold-webfont.woff2') format('woff2'),
	url('../fonts/din-bold-webfont.woff') format('woff'),
	url('../fonts/din-bold-webfont.ttf') format('truetype'),
	url('../fonts/din-bold-webfont.svg#din-bold-webfont') format('svg');
}

@font-face {
    font-family: 'din-light-webfont';
    src: url('../fonts/din-light-webfont.eot');
	src: url('../fonts/din-light-webfont.eot?#iefix') format('embedded-opentype'),
	url('../fonts/din-light-webfont.woff2') format('woff2'),
	url('../fonts/din-light-webfont.woff') format('woff'),
	url('../fonts/din-light-webfont.ttf') format('truetype'),
	url('../fonts/din-light-webfont.svg#din-light-webfont') format('svg');
}

@font-face {
    font-family: 'din-medium-webfont';
    src: url('../fonts/din-medium-webfont.eot');
	src: url('../fonts/din-medium-webfont.eot?#iefix') format('embedded-opentype'),
	url('../fonts/din-medium-webfont.woff2') format('woff2'),
	url('../fonts/din-medium-webfont.woff') format('woff'),
	url('../fonts/din-medium-webfont.ttf') format('truetype'),
	url('../fonts/din-medium-webfont.svg#din-medium-webfont') format('svg');
}







.fl{ float: left;}
.fr{ float: right;}
.clear{ clear: both;}
.clearfix:after{ content: ''; display: block; clear: both; width: 0px; height: 0px; overflow: hidden;}
a,button,input{-webkit-tap-highlight-color:rgba(255,0,0,0); background:none; outline: none;}
img{vertical-align: middle;  max-width:100%; border:none;-webkit-tap-highlight-color:rgba(255,0,0,0); blr:expression(this.onFocus=this.blur());}

.wrapper{  width: 1200px; margin: auto;}


.bgwhite{ background: #fff;}

.scale .img{ overflow: hidden;}
.scale img{ transition: 1s;}
.scale:hover img{ transform: scale(1.02);}
.fushu{ position: relative; transition: all .2s linear; }
.fushu:hover{  transform: translate3d(0, -2px, 0);   box-shadow: 0px 3px 10px rgba( 34,34,34 ,0.12);}






/******header*********/










.top.fxid{ position: fixed; }
.top{ width: 100%; height: 72px; overflow: hidden;   z-index: 5;  box-sizing: border-box; padding: 0 3.3%; }

.logo{ float: left; width: 17.49vw; line-height: 72px;}
.nav{ float: right; position: relative; z-index: 1; text-align: center;  }
.nav ul{ margin-top: 13px; }
.nav li{ float: left; margin-right: 2.9vw;}
.nav li a{ position: relative; display: block; line-height: 44px; font-size: 16px; color: #000;cursor: pointer; }
.nav li a:after{ content: ''; position: absolute; left: 0; right: 0; bottom: 0; margin: auto; width: 0; height: 3px; background: #1f7dd6; transition: 0.3s;}
.nav li.active a,
.nav li:hover a{ color: #1b7ad5; font-weight: bold;}
.nav li.active a:after,
.nav li:hover a:after{ width: 7px;}



.top.white li a{ color: #fff;}
/*
.nav li.active a:after,
.nav li:hover a:after{ content: ''; position: absolute; left: 0; right: 0; bottom: 11px; width: 8px; height: 11px; background: url(../images/libg.png) no-repeat center bottom;  margin: auto;}
.nav li:nth-child(3):hover a:after{ display: none;}*/

/**.menu{ width: 205px;  margin-left: 35px; cursor: pointer; margin-top: 20px;  }**/
.menu{ width: 300px;  margin-left: 35px; cursor: pointer; margin-top: 20px;  }
.menu .sea{ width: 45%; line-height: 30px; border-bottom: 1px solid #e0e0e0; padding-left:32px; background: url(../images/sea.png) no-repeat left center;  }
.menu .sea input{ width: 100%; border: none; font-size: 14px; color: #666;}
.lg{ width:70px; }
.en{ width:20px; }
.china{ width: 130px; line-height: 24px; /* padding-left: 25px; background: url(../images/chen.png) no-repeat left center; */ padding-top: 2px; margin-top: 5px;}
.china a{width: 50px; height: 22px; display: inline-block;  font-size: 16px; color: #333; font-family: 'Myriad Pro'; line-height: 24px; vertical-align: middle;}
.china a.lg{width:70px;margin-left: -3px;font-size: 14px;}
.china a.en{width:30px;}
.china a.lg1{width:22px;background: url(../images/login.png) no-repeat center;}
/**.lg{  background: url(../images/login.png) no-repeat center;margin-right: 3px; }
**/

.banner { position: relative;  }
.ban-down{ position: absolute; left: 0; right: 0; margin: auto; width: 45px; height: 45px; border: 1px solid #eee; border-radius: 50%; z-index: 2;  text-align: center; bottom: 9.3vw;}
.ban-down img{ animation: bandown 1.5s linear infinite; }
@-webkit-keyframes bandown {
	0% {
		margin-top:0 ; opacity: 1;
	}
	to {
		margin-top: 40px ;
		opacity: 0.2;
	}
}
@keyframes bandown {
	0% {
		margin-top:0 ; opacity: 1;
	}
	to {
		margin-top: 40px ;
		opacity: 0.2;
	}
}


.banner dl{ position: absolute; left: 0; right: 0; top: 12vw; z-index: 2; text-align: center;}
.banner dt{ margin-bottom: 15px; }
.banner dd p{ font-size: 1.9vw; color: #fff; }
.banner dd span{ font-size: 1vw; color: #fff; }

.banner ul li dt,
.banner ul li dd{
	opacity:0;
	transform:translateX(50px);
	-moz-transform:translateX(50px);
	-webkit-transform:translateX(50px);
	-ms-transform:translateX(50px);
	transition:all .8s;
	-moz-transition:all .8s;
	-webkit-transition:all .8s;
	-ms-transition:all .8s;
	-o-transition:all .8s;
}

.banner ul li.active dt{transition-delay:200ms;opacity:1;transform:translateX(0);}
.banner ul li.active dd{transition-delay:500ms;opacity:1;transform:translateX(0);}





.self:before{
    content: "";
    width: 150px;
    height: 100%;
    position: absolute;
    top: 0;
    left: -185px;
    overflow: hidden;
    background: -webkit-gradient(linear,left top,right top,color-stop(0,hsla(0,0%,100%,.1)),color-stop(50%,hsla(0,0%,100%,.4)),color-stop(100%,hsla(0,0%,100%,.1)));
    -webkit-transform: skewX(25deg);
    -moz-transform: skewX(25deg);
	z-index: 55;
}
.self:hover:before{  
	-webkit-animation: shine-left 1.2s infinite;
    -moz-animation: shine-left 1.2s infinite;
    -o-animation: shine-left 1.2s infinite;
    animation: shine-left 1.2s infinite;
 }
@-webkit-keyframes shine-left {
	0% {
		left: -180px
	}
	to {
		left: 150%
	}
}
@-moz-keyframes shine-left {
	0% {
		left: -180px
	}
	to {
		left: 150%
	}
}
@-o-keyframes shine-left {
	0% {
		left: -180px
	}
	to {
		left: 150%
	}
}
@keyframes shine-left {
	0% {
		left: -180px
	}
	to {
		left: 150%
	}
}







.footer{ position: relative; background: #303030; }
.footer:after{ position: absolute; right: 0; top: 60px; width: 100%; height: 1px; background: #424242; content: '';}
.fotbox{padding: 0 7.3%;}

.fotnav li{ float: left; position: relative; margin-right: 3.9vw; line-height: 60px; }
.fotnav li:first-child{ padding-left: 0;}
.fotnav li:last-child{ padding-right: 0;}
.fotnav li a{ color: #aaa; font-size: 16px; color: #fff;}

.share{ margin-top: 20px; }
#share a{display: block; width: 20px; height: 20px; border-radius: 50%; margin: 0 0 0 1.7vw ;  padding: 0;}
#share .bds_weixin{ background: url(../images/wx.png) no-repeat center  ;}
#share .bds_tsina{  background: url(../images/wb.png) no-repeat center  ;}
#share .bds_sqq{  background: url(../images/qq.png) no-repeat center ;}
#share .scrollTop{  background: url(../images/sTop.png) no-repeat center ;}

.fotmid{ margin-top: 45px; margin-bottom: 38px;}
.erwei{ width: 100px; height: 100px; margin-right: 24px;}
.phone{ padding-left: 50px; background: url(../images/phone.png) no-repeat top left; }
.phone span{ display: block; font-size: 14px; color: #818181;}
.phone p{ font-family: Impact; font-size: 26px; color: #e2e2e2;}
.phone i{ color: #9f9f9f; font-size: 13px;}
.fotadd{ font-size: 13px; color: #696969; margin-left: 90px; padding-top: 3px; }
.fotadd p{ margin-bottom: 15px; }
.fotadd img{ width: 15px; margin-right: 9px; }

.link{ padding-top: 12px; width: 440px; }
.link p{ line-height: 35px; font-size: 13px; color: #696969;}
.link select{ width: 100%; display: block; height: 49px; font-size: 13px; color: rgba(255,255,255,0.83) ; background:#404040 url(../images/selbvg.png) no-repeat center right; border: none; padding: 0 135px 0 20px; cursor: pointer;}


.bg{line-height: 64px;  background: #2b2b2b;}
.bg p{ float: left; color: #646464; font-size: 13px;}
.bg a{ float: right; color: #646464; cursor: pointer; }


.frfix{width:60px;position:fixed;right:0px;z-index:2000;bottom: 20%;}
.frfix ul{}
.frfix ul li{cursor:pointer; height:60px;background:rgba(65,65,65,0.87); margin-top:5px;position:relative;  }
.frfix ul li .fwx{position:absolute;right:70px;top:50%;margin-top:-60px; width:100px;border-radius:3px;overflow:hidden;display:none;}
.fwx img{display:block;width:100px;  }
.frfix ul li dl{width:100%; height: 100%; position:absolute;left:0;top:0;  transition: 0; }
.frfix ul li dl dt{width:60px;text-align:center;position:absolute;left:0;top:0;transition: 0;}
.frfix ul li dl dt i{display:block;padding-top: 18px;}
.frfix ul li dl dt p{color:#fff;text-transform:uppercase;}
.frfix ul li dl dd{width:145px;height:60px;text-align:center;color:#fff;font-family:'dincond-bold-webfont';line-height:60px;position:absolute;left:50px;top:0;font-size:22px;opacity:0;}
.frfix ul li.active dl dd{ }
.frfix ul li:nth-child(2) dl{width:200px;}

.frfix ul li:nth-child(1) dt p{font-size: 12px; background: #Fff; color: #222; border-radius: 20px; opacity: 0; width: 90%; margin:3px auto 0; }
.frfix ul li:nth-child(1):hover dt p{ opacity: 1;}













.iabout{ padding-top: 64px; }
.iableft{ width: 33.85vw; margin-left: 7.3%; margin-top: 10px; }
.iabright{ width: 54.9vw; }

.ddtdd dt{ font-size: 3.125vw; line-height: 3.2vw; font-weight: bold; font-family: arial; color: #333;}
.ddtdd dd{ font-size: 1.25vw; color: #555;}
.iabcont{ line-height: 2; color: #333; margin-top: 2.3vw; max-height: 12.5vw; overflow: hidden;}

.iabmore{ position: relative;display: block; width: 230px; height: 56px; box-sizing: border-box; padding-left: 65px;   color: #888; line-height: 56px; border: 1px solid #ddd; margin-top: 5.2vw;  z-index: 1; overflow: hidden; }
.iabmore:before{ position: absolute; right: 65px; top: 22.5px; height: 11px; width: 19px ;background: url(../images/jt1.png) no-repeat center; content: ''; transition: .2s; z-index: 2;}
.iabmore:after{ position: absolute; left: -100px; top: -100px; height: 300px; width:300px; background: #1b7ad5; content: '';  z-index: -1;
 transform: rotateZ(90deg);  transition: 1s; transform-origin: top right; }
.iabmore:hover:after{ transform: rotate(-25deg);  }
.iabmore:hover:before{  background-image: url(../images/jt.png); }
.iabmore:hover { color: #Fff; border-color: #1b7ad5;  }


.prodox{ padding: 50px 7.3% 70px; background: url(../images/probg.jpg) no-repeat center;}
.dlTit{ text-align: center; color: #333;}
.dlTit dt{ font-size: 1.57vw;}
.dlTit dd{ font-size: 0.73vw; color: rgba(51,51,51,0.7); text-transform: uppercase;}
.dlTit.white{  color: #fff;}
.dlTit.white dd{ color: rgba(255,255,255,0.7); }



.prodox ul{ width: 101%;}
.prodox li{ float: left; width: 20.6vw; margin-top: 2.8vw; margin-right: 0.7vw; }
.prodox li:last-child{ margin-right: 0;}
.prodox li .img{ position: relative; height: 16.8vw; text-align: center; background: #fff; overflow: hidden;}
.prodox li .img:after{ position: absolute; left: 0; top: 0; width: 0; height: 100%; background: rgba(27,122,213,0.86); transition: 0.4s; content: ''; opacity: 0; }
.prodox li .imgimg{ height: 100%; object-fit: cover; }
.prodox li .itxt{ position: absolute; left: 0; top: -20px; width: 100%; height: 100%; z-index: 1; line-height: 1.5; color: #fff;  transition: 0.4s; opacity: 0;}
.prodox li .itxt img{ width: 2.56vw; display: block; margin: 4.4vw auto 0;}
.prodox li .itxt i{ width: 10px; height: 3px; background: #fff; display: block; margin: 15px auto;}
.prodox li .itxt p{ font-weight: bold; font-size: 0.85vw; margin: 8px 0; }
.prodox li .itxt span{ display: inline-block; border-bottom: 1px solid #fff;}
.prodox li .txt{ color: #fff; font-size: 0.85vw;  text-align: center; line-height: 50px;}

.prodox li:hover .img:after{ width: 100%; opacity: 1;}
.prodox li:hover .itxt{ top: 0; opacity: 1;}
.prodox li:hover .txt{ font-weight: bold;}


.inews{ padding: 50px 7.3% 70px; background: #f6f6f6;  }
.inews ul{ width: 101%;}
.inews li{ float: left; width: 33.33%; background: #fff; height: 26.5vw; padding: 2.08vw 4.16vw 4vw; box-sizing: border-box; margin-top: 1.8vw; border-right: 1px solid #e8e8e8; }
.inews li:last-child{ border: none;}

.idate{ }

.idate span{ display: block; font-size: 1.1vw; font-family: 'din-bold-webfont';}
.idate .insname{ margin: 15px 0 10px; font-weight: bold; color: #585858; font-size: 0.98vw;  line-height: 20px;   white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.inews li i{ font-size: 12px; color: #a6a6a6;}
.inews li p{ font-size: 13px; color: #919191; line-height: 1.8; margin: 0.8vw 0;}
.inews li em{ display: block; height: 10px ;  overflow: hidden; position: relative;}
.inews li em img{ position: absolute; height: 7px;width: auto; display: block; left: 0; top: 0; }
.inews li .img{ height: 10.35vw; text-align: center; margin-top: 0.9vw; width: 100%;}
.inews li .img img{ max-height: 10.35vw;}

.inews li:hover span,
.inews li:hover .insname{ color: #1b7ad5;} 
.inews li:hover em img{ animation: imgrto 10s linear ; }


@keyframes imgrto {
	0% {
		left: 0;
	}
	to {
		left: 100%;
	}
}

.inews .iabmore{ margin: 2.8vw auto 0;}



.lybox{}
.yleft{ width: 67.7%; background: url(../images/lybgl.jpg) no-repeat  center; height: 32.546vw; background-size: cover; box-sizing: border-box; padding: 7vw 0 0 7.2%; }
.yleft ul li{ position: relative; float: left; width: 29%; margin-right: 16px;  background: rgba(255,255,255,0.87); box-sizing: border-box; padding-left: 1.1vw; margin-bottom: 17px;}
.yleft ul li span{ line-height: 2.75vw; font-size: 0.75vw; width: 5.2vw;   color: #525252; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;  }
.yleft ul li div{ width: 10.7vw; overflow: hidden;}
.yleft ul li input{ height: 2.75vw; width: 100%;  border: none; font-size: 0.75vw;  color: #666;}
.yleft ul li.li3{ position: relative; margin-right: 0;}
.yleft ul li.li3 input{ width: 4.2vw; }
.yleft ul li.li3 i{ width: 5.2vw; position: absolute; text-align: right; right: 5px; top: 0; line-height: 2.75vw;}

.yleft ul li.li4{ width:calc( 87% + 32px);}
.yleft ul li.li4 span{ width: 6.1vw;}
.yleft ul li.li4 div{ width: 86%; }
.yleft ul li textarea{ width: 100%; height: 10vw;  font-size: 0.75vw; resize: none; background: none; box-sizing: border-box; padding: 0.9vw 0; font-family: "微软雅黑"; color: #666; border: none;}

.butn{ width:calc( 87% + 32px); text-align: center; margin-top: 2.4vw;}
.butn input{ position: relative; width: 11.7vw; height: 2.75vw; font-size: 0.75vw; color: #333333; font-weight: bold; background: #fff; border: none; cursor: pointer; z-index: 1; display: inline-block;}
.butn input[type=button]{  margin-right: 24px;}
.butn input:hover{ background: #1B7AD5;  color: #fff ;}


.yright{ width: 32.3%; background: url(../images/lybgr.jpg) no-repeat  center; height: 32.546vw; background-size: cover; box-sizing: border-box; padding-left: 2.5vw; padding-top: 6.5vw; }
.yright .dlTit{ text-align: left;} 
.yright .dlTit dd{ position: relative; padding-bottom: 2vw;}
.yright .dlTit dd:after{ position: absolute; left: 2px; bottom: 0;  width: 2px; background: #fff; height: 1vw; content: '';}


.iadd{  margin-top: 1vw;}
.iadd .iadlist{ border-bottom: 1px solid rgba(255,255,255,0.2); padding: 1.4vw 0 ; width: 22.8vw; }
.addicon{ padding-left: 2.7vw; color: #fff;  background-size: 1.2vw;}
.addicon i{ display: block; font-size: 1.24vw; font-family: 'din-medium-webfont'; font-weight: 100;}
.iadlist:nth-child(1) .addicon{ background: url(../images/lyic1.png) no-repeat left 0.75vw top;}
.iadlist:nth-child(2) .addicon{ background: url(../images/lyic2.png) no-repeat left 0.75vw top;}
.iadlist:nth-child(3) .addicon{ background: url(../images/lyic3.png) no-repeat left 0.75vw top;}
.iadlist:nth-child(3) .addicon i{ font-size: 0.95vw;}




.nban{ position: relative;}
.nban .letnav{ position: absolute; left: 0; width: 100%;  bottom: 2.8vw ; height: 64px; overflow: hidden;}
.leleft{ }
.leleft a{ float: left; margin-right: 62px; height: 62px;  line-height: 62px;padding: 0 10px; border-bottom: 2px solid #fff; }
.leleft a.home{ background: #1B7AD5; width: 123px ; text-align: center; height: 64px;  padding: 0; }
.leleft a.active,
.leleft a:hover{ border-color: #1B7AD5 ; font-weight: bold; color: #1B7AD5;  }

.leright{ line-height: 64px; color: #999999; margin-right: 14px; }
.leright a{color: #999;}



/* about  */
.about{ padding: 60px 0;}
.abTop{ }
.ableft{ width: 570px; height: 840px; overflow: hidden;}
.ableft dt{ color: #333; font-family: 'din-bold-webfont'; font-size: 60px; line-height: 60px;}
.ableft dd{ width: 215px; border-bottom: 1px solid #a1a1a1; padding-bottom: 28px; font-size: 24px; color: #999;}
.ableft img{ height: 586px;}
.abox{ font-size: 20px; line-height: 36px; color: #333333; margin: 25px 0 30px; font-weight: bold; }

.abright{ margin-top: 10px; position: relative;  height: 840px;overflow: hidden;}
.abright img{ height: 665px;}
.abright .txt{ position: absolute; bottom: 55px; background: #1B7AD5; color: #fff; padding: 55px 60px 0;font-size: 22px; line-height: 32px; color: #fff; left: 45px; 
width: 485px; height: 192px; box-sizing: border-box; text-align: center; }


.abtook{ line-height: 28px; color: #333333; margin: 45px 0 73px;}


.onwh{ height: 660px; background: url(../images/whbg.jpg) no-repeat center top;}
.onwh ul{border-left: 1px solid #456686;  box-sizing: border-box; margin-left: -1px;}
.onwh li{ position: relative; float: left; width: 240px;  height: 660px; overflow: hidden;  border-right: 1px solid #456686; box-sizing: border-box; padding: 50px 35px; cursor: pointer; z-index: 1}
.onwh li:before{ position: absolute; content: ''; left: 0; bottom: 0; width: 100%; height: 100%; background: rgba(0,49,95,0.87); z-index: -1; transition: 0.6s;}
.onwh li:after{ position: absolute; content: ''; left: 0; top: 0; width: 100%; height: 1%; background: rgba(27,122,213,0.9);   z-index: -1; opacity: 0; transition: 0.6s;}
.onwh .mtxt { text-align: center;}
.onwh .mtxt img{  width: 169px; }

.imgy{ position: absolute; top: 385px; width: 100%; left: 0; text-align: center; height: 83px; transition: 0.6s; }
.imgy i{ width: 83px; height: 83px; border-radius: 50%;  margin: auto;  display: block; line-height: 83px; transition: 0.6s;}
.imgy img{ width: 50px; height: 50px;}


.Timg{ position: absolute; width: 100%; top: 477px; box-sizing: border-box; left: 0; text-align: center; padding: 0 30px; transition: 0.5s;}
.Tname{ font-size: 24px; color: #fff; }
.Ttile{ text-transform: uppercase; font-size: 18px; color: rgba(255,255,255,0.57); opacity: 0;}
.Timg p{ line-height: 24px; max-height: 216px; overflow: hidden; color: #fff; opacity: 0; }
.Timg i{ display: block; width: 1px; height: 15px; background: rgba(255,255,255,1);  margin:19px auto;  opacity: 0; }


.jmore{ position: absolute; left: 0; right: 0; margin: auto; bottom: 75px; width: 40px; height: 40px; border-radius: 50%; overflow: hidden;}

.onwh li:hover:before{ opacity: 0; height: 1%; }
.onwh li:hover:after{ height: 100%; opacity: 1;}
.onwh li:hover .imgy{ top: 50px;}
.onwh li:hover .imgy i{ border: 1px solid rgba(255,255,255,0.4);}
.onwh li:hover .mtxt{ opacity: 0;} 
.onwh li:hover .Timg{ top: 180px; }
.onwh li:hover .Tname,
.onwh li:hover .Ttile,
.onwh li:hover .Timg p,
.onwh li:hover .Timg i{  opacity: 1; }
.onwh li:hover .jmore { background: rgba(255,255,255,0.27); }
.onwh li:hover .jmore img{animation: jrot linear 2s;  }

@keyframes jrot{
	from{ transform: rotate(0); }
	to{ transform: rotate(360deg);}
}



.ablist{  margin-top: 57px; }
.ablist ul{ margin-top: 40px; width: 1230px}

.ablist li{ float: left; width: 585px; background: #f4f4f4; margin: 0 30px 30px 0; overflow: hidden;}
.ablist li:nth-child(2n){ margin-right: 0;}
.ablist li .img{ width: 340px; height: 240px; line-height: 240px;}
.ablist li .txt{ width: 180px; margin-right: 40px;}
.ablist li .txt p{ font-size: 16px; line-height: 24px; color: #333333; font-weight: bold; margin-top: 35px;}
.ablist li .txt span{ display: block; font-size: 16px; color: #999; font-family: 'din-light-webfont'; font-weight: bold; margin-top: 21px;}
.ablist li .txt .iabmore{ width: 100%; height: 40px; line-height: 40px; padding-left: 40px; margin-top: 40px; }
.ablist li .txt .iabmore:before{ top: 15px; right: 40px; }
.ablist li:hover .iabmore:after{ transform: rotate(-25deg);  }
.ablist li:hover .iabmore:before{  background-image: url(../images/jt.png); }
.ablist li:hover .iabmore { color: #Fff; border-color: #1b7ad5;  }

.shuaxin{ width: 186px; height: 40px; line-height: 40px; color: #888; border: 1px solid #eee; margin: 17px auto 0; text-align: center; cursor: pointer;}
.shuaxin img{ width: 17px; height: 17px; margin-right: 5px; vertical-align: top; margin-top: 11px;}
.shuaxin:hover{ color: #333;}


/* 新闻  */
.news{ padding: 60px 0 20px;}
.nwstop{ padding-bottom: 74px; border-bottom: 1px solid #eee;}
.nleft{ width: 600px; height: 305px;}
.nright{ width: 565px;}
.nright h5{ font-size: 48px; color: #333; font-family: 'din-bold-webfont'; }
.nright .nstit{ font-size: 18px; color: #333333; margin-top: 20px; font-weight: bold; line-height: 30px;}
.nright p{ line-height: 24px; color: #777; margin-top: 25px;}
.nright i{ display: block; margin-top: 30px;}
.nwstop li:hover h5,
.nwstop li:hover .nstit{ color: #1B7AD5;}
.nwstop .swiper-pagination{ bottom: 25px;}
.nwstop .swiper-pagination span{ background: none; border: 1px solid #000; }
.nwstop .swiper-pagination .swiper-pagination-bullet-active{ background: #1B7AD5 ; border-color:#1B7AD5;}



.newlist{ margin-top: 47px;}
.newlist ul{ width: 1230px;}
.newlist li{ float: left; position: relative; width: 380px; margin:  0 30px 30px 0; cursor: pointer; padding-bottom: 27px; overflow: hidden;}
.newlist li:nth-child(3n){ margin-right: 0;}
.newlist li .img{ height: 195px; line-height: 195px; overflow: hidden; margin-bottom: 25px;}
.newlist li .txt{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 18px; line-height: 22px; color: #333;}
.newlist li p{ position: relative; line-height: 24px; font-size: 13px; color: #919191; padding:10px 0 ; border-bottom: 1px solid #f0f0f0;}
.newlist li p:after{ position: absolute; left: 0; bottom: 0; width: 0; height: 1px; background: #1B7AD5; content: ''; transition: 1s; }
.newlist li span{ display: block; position: absolute; bottom: -29px; left: 0; width: 100%; line-height: 22px; background: url(../images/rrr.png) no-repeat right 3px center; font-size: 13px; color: #919191; }
.newlist li:hover p:after{ width: 100%;}
.newlist li:hover .txt{ font-weight: bold; color: #1B7AD5;}
.newlist li:hover span{ bottom: 0;}




/* 4-1 产品*/
.prolist{ background: #f6f6f6; padding: 60px 0 0; }
.plTop{ padding: 40px 0 30px; border: 1px solid #eee; margin-bottom: 40px; }
.plTop ul li{ float: left; margin-left: 67px;   }
.plTop ul li span{ font-size: 16px; font-weight: bold; color: #333; margin-right: 15px;}
.plTop ul li i{ color: #333; margin-left: 2px;}
.plTop ul li div input{ margin-left: 2px; width: 70px; height: 18px; border: 1px solid #e5e5e5;  }

.buton{ display: block; width: 110px; height: 30px; border: none; box-sizing: border-box; padding-left: 35px; font-weight: bold; color: #fff; margin: 35px auto 0; 
background: #1B7AD5 url(../images/big.png) no-repeat left 22px center; cursor: pointer;}

.plfot{ margin-top: 20px; padding-bottom: 1px;}
.plnav{ width: 350px; background: #fff; min-height: 1275px; }
.plnav li{ padding: 45px 44px 35px; border-bottom: 1px solid #eee;}
.plnav li span{ display: block; font-size: 16px; color: #333; font-weight: bold; line-height: 24px; background: url(../images/jia.png) no-repeat right center; cursor: pointer;}
.plnav li .decs{ padding-top: 20px; display: none; transition: 0s;}
.plnav li .decs a{ display: block; line-height: 40px; }
.plnav li .decs i{ display: inline-block; width: 6px; height: 6px; border-radius: 50%; border: 1px solid #a7a7a7; margin-right: 10px; vertical-align: top; margin-top: 17px; }
.plnav li.on span{ background-image: url(../images/jian.png);}
.plnav li a.active,
.plnav li a:hover{ color: #1B7AD5; font-weight: bold;}
.plnav li a.active i,
.plnav li a:hover i{ background: #1b7ad5; border-color: #1b7ad5;}

.pllist{ }
.pllist ul{ width: 1230px;}
.pllist li{ float: left; width: 380px; text-align: center; margin-right: 30px; margin-bottom: 5px;}
.pllist li:nth-child(3n){ margin-right: 0;}
.pllist li .img{  height: 230px; line-height: 230px; overflow: hidden;}
.pllist li p{ font-size: 16px; color: #333; padding: 25px 0;}
.pllist li:hover p{ background: #fff;}


.m-page{ text-align: center; margin: 45px 0 ;}
.m-page a{ width: 48px; text-align: center; height: 48px; line-height: 46px; box-sizing: border-box; border: 1px solid #dcdcdc; font-size: 18px; display: inline-block; margin: 0 5px; border-radius: 50%; vertical-align: middle;}
.m-page a:hover,
.m-page a.z-crt{ background: #1B7AD5; color: #fff; border-color: #1b7ad5;}
.m-page a.mprv,
.m-page a.mnxt{ background: url(../images/page.png)  no-repeat;  border: none;}

.m-page a.mprv{ background-position: left 0  top 0; }
.m-page a.mnxt{ background-position: right 0  top 0; }

.m-page a.mprv:hover{ background-position: left -53px top 0 ; }
.m-page a.mnxt:hover{ background-position: right -53px top 0;  }






/* 4-2 产品详情*/
.prodeteils{ padding: 60px 0;}
.pleft{ width: 600px;}
.pright{ width: 550px; }
.pright dl{ font-size: 24px; color: #333;}
.pright dt{ font-weight: bold; color: #1B7AD5; margin-bottom: 3px;}

.ptit{ font-weight: bold; font-size: 16px; color: #333; margin: 50px 0 18px;}
.pcont{ line-height: 24px; color: #333333; max-height: 118px; overflow: hidden; }
.pcont p{ margin-top: 10px;}

.phop{ text-align: center; margin-top: 29px;}
.phop span{ display: inline-block; width: 270px; line-height: 60px; height: 60px; font-size: 18px; font-family: arial; color: #333333;  background: #eee;}
.pcImg{ margin-top: 50px;}
.pcImg table{ font-family: 'din-light-webfont'; width: 100%; font-size: 16px; border-left: 1px solid #dcdcdc; font-weight: bold; }
.pcImg table th{ background: #eee; height: 112px; border-right: 1px solid #dcdcdc; border-top: 1px solid #dcdcdc;border-bottom: 1px solid #dcdcdc;}
.pcImg table th p{ height: 57px; border-bottom: 1px solid #dcdcdc; line-height: 57px;}
.pcImg table th span{ display: block; height:54px; line-height: 54px; background: #bfbfbf;}

.pcImg table td{ border-bottom: 1px solid #dcdcdc; height: 45px; border-bottom: 1px solid #dcdcdc;  border-right: 1px solid #dcdcdc;  }
.pcImg table td a{ display: inline-block; color: #1b7ad5;font-family: "微软雅黑"; font-weight: normal; border-bottom: 1px solid #1b7ad5;}

/* 5-1 说明 */
.coopsay,
.user{ background: #eee; padding: 60px 0; }

.coopsay dt{ background: #1B7AD5;}
.coopsay dt span{ float: left; width: 33.33%; height: 72px; line-height: 72px; color: #Fff; font-weight: bold;  box-sizing: border-box;}
.coopsay dt .span1{  text-align: left; padding-left: 70px; }
.coopsay dt .span2{  text-align: center; }
.coopsay dt .span3{  text-align: right; padding-right: 70px; }

.coopsay dd { padding: 0 39px 0 40px; line-height: 94px; background: #fff;}
.coopsay dd span{ float: left; width: 33.33%; box-sizing: border-box; border-bottom: 1px solid #efefef;  color: #333;}
.coopsay dd span p{ max-width: 90%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.coopsay dd .span1{  text-align: left; padding-left: 30px; }
.coopsay dd .span2{  text-align: center; }
.coopsay dd .span3{  text-align: right; padding-right: 30px; }
.coopsay dd a{ display: inline-block; width: 85px; line-height: 40px; height: 40px; border-radius: 30px; color: #333; text-align: center; border: 1px solid #e5e5e5;}
.coopsay dd a.adown{ background: #1B7AD5; color: #Fff; border-color:#1B7AD5; margin-left: 10px;}

.coopsay dd:last-child  span{ border: none;}



/* 5-2 注册*/

.user .uname { text-align: center; font-size: 36px; color: #333; margin-bottom: 35px; }
.user{ }
.uleft{ width: 600px; height: 679px;}
.uright{ width: 600px; height: 679px; background: #f9fbfa; box-sizing: border-box; padding-left: 75px; padding-top: 30px;}
.uright .userIpt{ position: relative;  border-bottom: 1px solid #dedfde; width: 440px; line-height: 50px; margin-top: 15px;}
.uright .userIpt input{ width: 370px; border: none; height: 50px; font-size: 16px; color: #666; padding-left: 10px;}

.yzm{ position: absolute; right: 0; height: 100%; width: 104px;  }
.yzm img{ width: 100%;height: auto;}


.biu{ cursor: pointer; width: 440px; height: 40px; font-size: 16px; color: #fff; background: #1B7AD5; border-radius: 30px; margin-top: 40px; border: none;}



/*招聘*/
.zplist{ padding: 50px 0;}
.zplist li{ border: 1px solid #e6e6e6; margin-bottom: 10px; background:#fcfcfc url(../images/lvbtn.png) no-repeat right 25px top 15px; }
.zplist li dt{ height: 44px; line-height: 44px; font-size: 12px; color: #999999; padding: 0 20px 0 50px; cursor: pointer;}
.zplist li dt span{ font-weight: bold; font-size: 16px; width: 125px; display: inline-block; margin-right: 15px;}
.zplist li dd{ border-top: 1px solid #e6e6e6;  padding: 30px 40px  40px 50px; transition: 0s;  display: none;}
.zplist li .div1{ width: 350px;}
.zplist li .div2{ width: 400px; margin: 0 70px 0;}
.zplist li .div3{ width: 210px;}
.zplist li dd span{ display: block; font-size: 16px; color: #676767; margin-bottom: 10px;}
.zplist li dd p{ line-height: 30px; color: #939393;}
.zplist li dd a{ width: 130px; text-align: center; height: 40px; line-height: 40px; background: #1B7AD5 ; color: #fff; display: block;  margin:38px auto 5px; font-size: 12px}
.zplist li.on { background-image: url(../images/lvtop.png); }
.zplist li.on dt span{ color: #1b7ad5;}



/* 联系  */
.contus{}
.contus dl{ text-align: center; margin-bottom: 37px; }
.contus dt{ font-size: 30px; color: #333; margin-top: 62px;}
.contus dd{ font-size: 16px; color: #999; text-transform: uppercase;}

.mapplist{ border-radius:5px ; overflow: hidden; height: 560px;}
.mapp{ width: 673px; height: 552px; border: 4px solid #e5e5e5; overflow: hidden; }
.mapp img{ height: 555px;}

.mapplist .yright{ width: 519px; padding-top: 65px; height: 560px; background: url(../images/contbg1.jpg) no-repeat center; padding-left: 50px;}
.mapplist .yright dt{ font-size: 30px;}
.mapplist .yright dd{ font-size: 14px; padding-bottom: 40px;}
.mapplist .yright dd:after{ height: 20px;}

.mapplist .iadd{  margin-top: 0;}
.mapplist .iadd .iadlist{ border-bottom: 1px solid rgba(255,255,255,0.2); padding: 35px 0 22px; width: 378px; }
.mapplist .addicon{ padding-left: 50px; color: #fff;  background-size: 22px;}
.mapplist .addicon i{ display: block; font-size: 24PX; font-family: 'din-medium-webfont'; font-weight: 100;}
.mapplist .iadlist:nth-child(1) .addicon{ background: url(../images/lyic1.png) no-repeat left 14px top;}
.mapplist .iadlist:nth-child(2) .addicon{ background: url(../images/lyic2.png) no-repeat left 14px top;}
.mapplist .iadlist:nth-child(3) .addicon{ background: url(../images/lyic3.png) no-repeat left 14px top;}
.mapplist .iadlist:nth-child(3) .addicon i{ font-size: 18px;}


.contly{ margin-top: 55px; }
.contly .yleft{ width: 100%; height: 619px; background: url(../images/contbg2.jpg) no-repeat top center; padding : 120px 0 0;}
.contly .yleft li{ width: 389px;}
.contly .yleft li.li3 input{ width: 130px; }
.contly .yleft li.li4{ width: 100%;}





@media only screen and  (max-width: 1440px) {
	
	.nav li{ float: left; margin-right: 30px;}
	.nav li:last-child{ margin-right: 0;}
}

.article-title{ text-align: center; margin: 20px; font-weight: bold; font-size: 16px;}

















































































