﻿@charset "utf-8";
/* CSS Document */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre, 
form,fieldset,input,textarea,p,blockquote,th,td { padding: 0; margin: 0; }   
fieldset,img { border: 0; } 
address,caption,cite,code,dfn,em,strong,th,var,i { font-weight: normal; font-style: normal; } 
ol,ul,dl,dd { list-style: none; zoom:1; } 
caption,th { text-align: left; } 
h1,h2,h3,h4,h5,h6 { font-weight: normal; font-size: 100%;} 
q:before,q:after { content:''; } 
abbr,acronym { border: 0; }
.clearbox {border:none;border-top: 1px solid transparent !important;clear: both;
font-size: 0;height: 0;line-height: 0;margin-top: -1px !important;visibility: hidden;}
/*-- All --*/
body{
	color:#6D6D6D;
	text-align:center;
	font:normal 15px/200% "Microsoft YaHei",宋体,Tahoma,Helvetica,Arial,sans-serif;
}
a{ color:#6D6D6D; text-decoration:none; outline:none;}
a:hover {color:#3F97E9; text-decoration:underline; }

/*-- Public --*/
.fl{ float:left !important; _display:inline; }
.fr{ float:right !important; _display:inline;}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
body{width: 100%;min-width: 1200px; }

.siteWidth{min-width: 1200px;max-width: 1400px;margin:0 auto;overflow:hidden;text-align:left;position:relative;}
/* #content{ width:1120px; position:relative; z-index:0; margin:0 auto; overflow:hidden;  background:#fff; padding:40px; text-align:left; margin-bottom: 40px;  } */

#header{z-index:1;width:100%;height: 650px;background: url(images/body.jpg) top center no-repeat;}
#header .siteWidth .logo-box{ overflow:visible; height: 90px;margin: 40px 0 0;}
#header .logo{display:block;width: 544px;height:90px;float: left;background: url(images/logo.png) no-repeat;}
#header .logo-dy{height: 36px;background-color: rgb(0 0 0 / 34%);border-radius: 18px;line-height: 36px;text-align: center;float: right;color: #fff;font-size: 16px;padding: 0 1.5em; margin: 7px 0 0 10px;text-decoration: none}
#header .logo-dy:hover {background: #ccc; color: #22468c}
#header .siteWidth .gx-msg{margin-top: 58px;}
#header .siteWidth .gx-msg .title{font-size: 60px;line-height: 100px;color: #fff;text-align: center;height: 100px;font-weight: 700;}
#header .siteWidth .gx-msg .intro{font-size: 20px;color: #d74236; background: url(images/slog_bg.png) no-repeat; width:650px; line-height:50px;text-align: center;height: 50px;margin: 40px auto ;font-weight: 700; padding:0 0 10px 10px; }

#header .siteWidth .gx-msg .title img{
    opacity: 0; 
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(2);
    -webkit-transition: all 2s cubic-bezier(0.48, 0.69, 0.57, 1.45);
    -moz-transition: all 2s cubic-bezier(0.48, 0.69, 0.57, 1.45);
    -o-transition: all 2s cubic-bezier(0.48, 0.69, 0.57, 1.45);
    transition: all 2s cubic-bezier(0, 0.94, 0.84, 1.06);
}
#header .siteWidth .gx-msg.inview .title img{
    opacity: 1; 
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}
#header .siteWidth .gx-msg .intro{
    opacity: 0; 
    -webkit-transform: translateY(90px);
    -moz-transform: translateY(90px);
    -ms-transform: translateY(90px);
    -o-transform: translateY(90px);
    transform: translateY(90px);
    -webkit-transition: all 1.2s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    -moz-transition: all 1.2s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    -o-transition: all 1.2s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    transition: all 1.2s cubic-bezier(0.48, 0.69, 0.67, 0.98);
}
#header .siteWidth .gx-msg.inview .intro{
    opacity: 1; 
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}
#header .siteWidth .gx-msg .intro { transition-delay:300ms}

.rowbox .hd {line-height:40px;margin-bottom: 20px;}
.rowbox .hd h4 { font-size:24px; color:#b0daf3;}
.rowbox .hd h2 { background:url(images/rowboxh2bg.png) no-repeat center; font-size:36px; font-weight:bold; color:#0085d3;}
.rowbox .hd h5 {font-size:22px;color: #727272;line-height:100px;}

.box-A .bd li{
    opacity: 0; 
    -webkit-transition: all 0.8s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    -moz-transition: all 0.8s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    -o-transition: all 0.8s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    transition: all 0.8s cubic-bezier(0.48, 0.69, 0.67, 0.98);
}
.box-A .bd li.inview{
    opacity: 1; 
}
.box-A .bd li:nth-child(1){transform: translateX(-180px) translateY(60px) rotate(-36deg);}
.box-A .bd li:nth-child(2){transform: translateX(-120px) translateY(40px) rotate(-24deg);}
.box-A .bd li:nth-child(3){transform: translateX(-60px) translateY(20px) rotate(-12deg);}
.box-A .bd li:nth-child(4){transform: translateX(60px) translateY(20px) rotate(12deg);}
.box-A .bd li:nth-child(5){transform: translateX(120px) translateY(40px) rotate(24deg);}
.box-A .bd li:nth-child(6){transform: translateX(180px) translateY(60px) rotate(36deg);}

.box-A .bd li.inview{transform: translateX(0);}

.box-A .bd li.inview:nth-child(1){-webkit-transition-delay:.5s;-moz-transition-delay:.5s;-ms-transition-delay:.5s;-o-transition-delay:.5s;transition-delay:.5s}
.box-A .bd li.inview:nth-child(2){-webkit-transition-delay:.3s;-moz-transition-delay:.3s;-ms-transition-delay:.3s;-o-transition-delay:.3s;transition-delay:.3s}
.box-A .bd li.inview:nth-child(5){-webkit-transition-delay:.3s;-moz-transition-delay:.3s;-ms-transition-delay:.3s;-o-transition-delay:.3s;transition-delay:.3s}
.box-A .bd li.inview:nth-child(6){-webkit-transition-delay:.5s;-moz-transition-delay:.5s;-ms-transition-delay:.5s;-o-transition-delay:.5s;transition-delay:.5s}



/* 产品概况 */
#content{clear: both;}
/* box-A */
.box-A { padding:50px 0;}
.box-A .hd { text-align:center;}
.box-A .hd h3{ display:inline-block; height:74px; line-height:74px; padding-bottom:10px; background:url(images/boxAhdicon.png) no-repeat; padding-left:120px; font-size:40px; color:#000; font-weight:500;}
.box-A .bd .intro {font-size:20px;line-height:40px;color:#464646;text-indent: 2em;}
.box-A .bd .iconList { padding:30px 0 30px 80px; height:135px;}
.box-A .bd .iconList li { float:left; margin:0 32px;}
.box-A .bd h4 { font-size:30px; line-height:60px; clear:both; text-align:center; color:#464646; margin-bottom:15px;}

/* box-B */
.box-B{padding: 100px 0 0;background:url(images/boxBbg.png) no-repeat center top;height: 955px;margin-bottom: 50px;}
.box-B .hd {
    margin-bottom: 180px;
}
.box-B .hd h3 { font-size:40px; color:#333; line-height:100px;}
.Advantage .hd {float:left;width:410px;margin-bottom: 0;}
.Advantage .hd li { height:68px; line-height:68px;padding-left:30px; border:1px solid #406eba; border-radius:6px; margin-bottom:20px;font-size:20px; color:#fff;}
.Advantage .hd li.on { background:#dea827; border-color:#dea827}
.Advantage .bd { position:relative; padding:0 100px; overflow:hidden; font-size:22px; line-height:50px; color:#afc7ef; height:640px;}
.Advantage .bd h4 { text-align:center; color:#fff; font-size:30px; line-height:80px;}
.Advantage .bd .pic {position:absolute;bottom:0;width: 640px;text-align:center; opacity:0; visibility:hidden;
    -webkit-transform: translateY(30px);
    -moz-transform: translateY(30px);
    -ms-transform: translateY(30px);
    -o-transform: translateY(30px);
    transform: translateY(30px);
    
    -webkit-transition: all 0.8s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    -moz-transition: all 0.8s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    -o-transition: all 0.8s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    transition: all 0.8s cubic-bezier(0.48, 0.69, 0.67, 0.98);
 }

.Advantage .bd .on .pic { opacity:1; visibility:visible;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
 }
 
/* box-C */

.box-C {background:url(images/boxCbg.jpg) no-repeat 100% bottom; margin:0 auto; max-width:1920px;}
.box-C .hd {text-align:center;background: url(images/boxhdline.png) no-repeat center 95px; margin-bottom:60px;}
.box-C .hd h3 {font-size:40px;color:#333;line-height: 100px;}
.box-C .hd h5 {}
.box-C .bd { padding-bottom:160px;min-height:260px;}
.box-C .bd .pic { float:right;}
.box-C .bd .intro { float:left; width:520px; font-size:22px; line-height:60px; color:#464646; text-indent:2em;}


.box-C .bd li{
    opacity: 0; 
    -webkit-transition: all 1.2s cubic-bezier(0.48, 0.69, 0.14, 0.99);
    -moz-transition: all 1.2s cubic-bezier(0.48, 0.69, 0.14, 0.99);
    -o-transition: all 1.2s cubic-bezier(0.48, 0.69, 0.14, 0.99);
    transition: all 1.2s cubic-bezier(0.48, 0.69, 0.14, 0.99);
}
.box-C .bd li.inview{
    opacity: 1; 
}
.box-C .bd li{transform: translateX(280px) translateY(-200px) scale(0.5);}

.box-C .bd li.inview{transform: translateX(0);}




/* box-D */
.box-D {background:#f4fafe; margin:0 auto; max-width:1920px; padding:60px 0 70px;}
.box-D .hd {text-align:center;background: url(images/boxhdline.png) no-repeat center 95px; margin-bottom:20px;}
.box-D .hd h3 {font-size:40px;color:#333;line-height: 100px;}
.box-D .bd { text-align:center;}

.box-D .bd li{
    opacity: 0; 
    -webkit-transition: all 0.5s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    -moz-transition: all 0.5s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    -o-transition: all 0.5s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    transition: all 0.5s cubic-bezier(0.48, 0.69, 0.67, 0.98);
}
.box-D .bd li.inview{
    opacity: 1; 
}
.box-D .bd li{transform: translateY(-90px);}

.box-D .bd li.inview{transform: translateX(0);}

/* box-E */
.box-E {margin:0 auto;max-width:1920px;padding: 60px 0 30px;}
.box-E .hd {text-align:center;background: url(images/boxhdline.png) no-repeat center 95px;margin-bottom: 50px;padding-bottom:30px;}
.box-E .hd h3 {font-size:40px;color:#333;line-height: 100px;}

.box-E .bd  {position:relative;height: 500px;background:url(images/boxEbg.png) no-repeat center;}
.box-E .bd li { position:absolute;; left:194px; top:0; width:250px; height:60px;background:#fff;box-shadow: 0 0 8px #d8d8d8; border-radius:10px; transition:all 0.3s;}
.box-E .bd li h3 {position:absolute;width:250px;height:60px;line-height:60px;text-align:center;z-index:9; font-size:22px; color:#333; background:#fff; border-radius:10px; padding-right:10px; transition:all 0.3s; }
.box-E .bd li em {width:80px;height:80px;position:absolute;top:50%;margin-top:-40px;box-shadow: 0 0px 8px #d8d8d8;border-radius:50%;background:#fff url(images/boxEicon.png) no-repeat center 20px;transition:all 0.3s;}
.box-E .bd li.on h3 { background-color:#124191; color:#fff;}
.box-E .bd li.on em { background-color:#124191; background-image:url(images/boxEicon_on.png)}

.box-E .bd .li3 { top:110px; left:64px; }
.box-E .bd .li5 { top:220px; left:26px; }
.box-E .bd .li7 { top:330px; left:66px; }

.box-E .bd .li2 { left:756px; }
.box-E .bd .li4 { top:110px; left:886px; }
.box-E .bd .li6 { top:220px; left:946px; }
.box-E .bd .li8 { top:330px; left:906px; }

.box-E .bd .li2 h3,
.box-E .bd .li4 h3,
.box-E .bd .li6 h3,
.box-E .bd .li8 h3 {padding-left:10px; padding-right:0px;  margin-left:-10px; }

.box-E .bd .li1 em { right:-70px; background-position: center 20px;}
.box-E .bd .li3 em { right:-70px; background-position: center -180px; }
.box-E .bd .li5 em { right:-70px; background-position: center -380px; }
.box-E .bd .li7 em { right:-70px; background-position: center -580px; }

.box-E .bd .li2 em { left:-70px; background-position: center -80px; }
.box-E .bd .li4 em { left:-70px; background-position: center -280px; }
.box-E .bd .li6 em { left:-70px; background-position: center -480px; }
.box-E .bd .li8 em { left:-70px; background-position: center -680px; }

.box-E .bd .li1.on ,
.box-E .bd .li3.on ,
.box-E .bd .li5.on ,
.box-E .bd .li7.on { margin-left:50px;  }

.box-E .bd .li2.on ,
.box-E .bd .li4.on ,
.box-E .bd .li6.on ,
.box-E .bd .li8.on { margin-left:-50px; }

/* box-F */
.box-F {background:url(images/boxFbg.png) no-repeat top center;height: 1100px;}

.box-F .service-item{margin-top: 95px;background: url(images/serviceitembg.png) no-repeat center;height: 200px;margin: 70px -40px;position: relative;}
.box-F .service-item span{width: 25%;float: left;text-align: center;position: relative;}
.box-F .service-item span p{font-size: 20px;color: #0085d3;}
.box-F .service-item span p em, .box-F .service-item span p b {font-size:32px;color: #ffc743;font-weight: 600;}
.box-F .service-item span i{display: block;height: 140px;}
.box-F .service-item font { display:block; color:#fff;}
.box-F .service-item .li2 i{background-position-y: -267px;}
.box-F .service-item .li3 i{background-position-y: 0;}
.box-F .service-item .li4 i{background-position-y: -410px;}

.box-F .hd {text-align:center;background: url(images/boxhdline.png) no-repeat center 95px;margin-bottom: 30px;padding-bottom: 30px;}
.box-F .hd h3 {font-size:40px;color:#fff;line-height: 100px;}

.box-F .bd h2 { line-height:80px; font-size:40px; color:#ffde43;}
.box-F .bd h5 {font-size:24px;color:#fff;margin-bottom: 40px;line-height: 60px;}
.box-F .bd h5 em { color:#ffde43}

.box-F .siteWidth {margin:0 auto;}
.box-F ul li{width: 240px;float: left;height: 100px;padding: 0 10px;margin: 0 15px 20px; background:#fff; border-radius:5px; text-align:center;}
.box-F ul li a { display:block; height:100px; line-height:100px;}
.box-F ul li a img {display:inline-block;vertical-align: middle; max-height:100px; max-width:240px;}


.box-F .bd li{
    opacity: 0; 
    -webkit-transform: translateY(90px);
    -moz-transform: translateY(90px);
    -ms-transform: translateY(90px);
    -o-transform: translateY(90px);
    transform: translateY(90px);
    -webkit-transition: all 0.8s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    -moz-transition: all 0.8s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    -o-transition: all 0.8s cubic-bezier(0.48, 0.69, 0.67, 0.98);
    transition: all 0.8s cubic-bezier(0.48, 0.69, 0.67, 0.98);
}
.box-F .bd li.inview{
    opacity: 1; 
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}
.box-F .bd li.inview:nth-child(1){-webkit-transition-delay:0s;-moz-transition-delay:0s;-ms-transition-delay:0s;-o-transition-delay:0s;transition-delay:0s}
.box-F .bd li.inview:nth-child(2){-webkit-transition-delay:.1s;-moz-transition-delay:.1s;-ms-transition-delay:.1s;-o-transition-delay:.1s;transition-delay:.1s}
.box-F .bd li.inview:nth-child(3){-webkit-transition-delay:.2s;-moz-transition-delay:.2s;-ms-transition-delay:.2s;-o-transition-delay:.2s;transition-delay:.2s}
.box-F .bd li.inview:nth-child(4){-webkit-transition-delay:.3s;-moz-transition-delay:.3s;-ms-transition-delay:.3s;-o-transition-delay:.3s;transition-delay:.3s}
.box-F .bd li.inview:nth-child(5){-webkit-transition-delay:.4s;-moz-transition-delay:.4s;-ms-transition-delay:.4s;-o-transition-delay:.4s;transition-delay:.4s}
.box-F .bd li.inview:nth-child(6){-webkit-transition-delay:.5s;-moz-transition-delay:.5s;-ms-transition-delay:.5s;-o-transition-delay:.5s;transition-delay:.5s}
.box-F .bd li.inview:nth-child(7){-webkit-transition-delay:.6s;-moz-transition-delay:.6s;-ms-transition-delay:.6s;-o-transition-delay:.6s;transition-delay:.6s}
.box-F .bd li.inview:nth-child(8){-webkit-transition-delay:.7s;-moz-transition-delay:.7s;-ms-transition-delay:.7s;-o-transition-delay:.7s;transition-delay:.7s}
.box-F .bd li.inview:nth-child(9){-webkit-transition-delay:.8s;-moz-transition-delay:.8s;-ms-transition-delay:.8s;-o-transition-delay:.8s;transition-delay:.8s}
.box-F .bd li.inview:nth-child(10){-webkit-transition-delay:.9s;-moz-transition-delay:.9s;-ms-transition-delay:.9s;-o-transition-delay:.9s;transition-delay:.9s}
.box-F .bd li.inview:nth-child(11){-webkit-transition-delay:1s;-moz-transition-delay:1s;-ms-transition-delay:1s;-o-transition-delay:1s;transition-delay:1s}
.box-F .bd li.inview:nth-child(12){-webkit-transition-delay:1.1s;-moz-transition-delay:1.1s;-ms-transition-delay:1.1s;-o-transition-delay:1.1s;transition-delay:1.1s}

.lxss{padding: 30px 0;text-align: center;clear: both;}
.lxss a{width: 200px;height: 60px;border-radius: 30px;display: inline-block;margin: 0 10px;text-align: center;line-height: 60px;font-size: 18px;color: #fff;font-weight: 700;background: url(images/lx-icon.png) 36px 50% no-repeat #007fc6;text-indent: 50px;}
.lxss a.sq{background: url(images/tymk-icon.png) 25px 50% no-repeat #007fc6;background-size: 14%;text-indent: 40px;}