* {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;box-sizing:border-box;}
body {background: #fff;font-family:"Microsoft YaHei","Verdana","Arial","sans-serif"; }

a {text-decoration:none;}
a:hover {text-decoration:none; }
img {border:none; }
input, 
button {font-family:"Microsoft YaHei","Verdana","Arial","sans-serif";}
ul{list-style: none;}

.clearfix:after {content: ".";display: block;height:0;clear:both;visibility: hidden;}
.clearfix { *zoom:1; }
.pull-left{float: left!important;}
.pull-right{float: right!important;}

.innerbox{width: 1200px; margin: 0 auto;}

.bannerbox{height: 800px; background: #2f79fe; background: -moz-linear-gradient(left,  #47b8b2 0%, #ffffff 100%);    background: -webkit-linear-gradient(left,  #47b8b2 0%,#2f79ff 100%);    background: -o-linear-gradient(left,  #47b8b2 0%,#2f79ff 100%);    background: -ms-linear-gradient(left,  #47b8b2 0%,#2f79ff 100%);    background: linear-gradient(to right,  #47b8b2 0%,#2f79ff 100%); }

.flexslider a:active {outline: none;}
.slides,.flex-control-nav,.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

.flexslider {width: 100%; margin: 0; padding: 0;}
.flexslider .slides > li {display: none;} 
.flexslider .slides img { display: block;}
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 

.flexslider {background: #fff; position: relative;  zoom: 1;}
.flexslider .slides {zoom: 1;}
.flexslider .slides > li { height: 800px; min-width: 1200px;}
.flexslider .slides .ban01{ background: url(../images/ban1.jpg) top center no-repeat;}
.flexslider .slides .ban02{ background: url(../images/ban2.jpg) top center no-repeat;}
.flexslider .slides .ban03{ background: url(../images/ban3.jpg) top center no-repeat;}
.flexslider .slides .innerbox{position: relative; height: 800px; margin: 0 auto;}
.flexslider .slides .btn{ position: absolute; top: 558px; left: 485px; display: block; width: 230px; height: 60px; line-height: 60px;font-size: 18px; color: #fff; letter-spacing:1px; text-align: center; overflow: hidden; background: #f0a300; border-radius: 30px;}
.flexslider .slides .ban02 .btn{  top: 550px; left: 671px;  width: 185px; height: 50px; line-height: 50px;  background: #f49800;}

.flexslider .slides .ban01 .btn{}
.flexslider .slides .ban02 .btn{}

.flex-direction-nav{ width: 100%; min-width: 1200px; position: absolute; top: 45%;}
.flex-direction-nav li a {width: 55px; height: 100px; margin: -13px 0 0; display: block; background: url(../images/icon.png) no-repeat 0 0 ; opacity: .3; position: absolute; cursor: pointer; text-indent: -9999px;}
.flex-direction-nav li a.next {background-position: -1072px -57px; right: 0px; border-radius: 0;  }
.flex-direction-nav li a.prev {background-position: -1079px -147px; left: 0px; border-radius: 0; }
.flex-direction-nav li a.disabled {opacity: .3; filter:alpha(opacity=30); cursor: default;}
.flex-direction-nav li a:hover{ background-color:rgba(0,0,0,.1); opacity: .8;  }

.flex-control-nav {width: 100%; min-width: 1200px; position: absolute; bottom: 50px; text-align: center;}
.flex-control-nav li {margin: 0 0 0 8px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-nav li:first-child {margin: 0;}
.flex-control-nav li a {width: 20px; height: 20px; display: block; background: #fff; border-radius: 15px; cursor: pointer; text-indent: -9999px;}
.flex-control-nav li a:hover {background: #f60;}
.flex-control-nav li a.active {background: #ff3; cursor: default;}

.header{ position: fixed; width: 100%; top: 0; padding:12px 0px; /*height: 50px; */line-height:50px; background: rgba(0,0,0,.65); box-shadow: 0 0 5px 0px rgba(0,0,0,.5);z-index: 999;}
.header .logo{ padding-left:15px;  }
.header .logo svg{ float: left; font-size: 48px;}
.header .logo h1{ float: left; font-size: 25px;color: rgba(255,255,255,.75); line-height: 50px; font-weight: 300;}
.header .link{ padding:7px 30px;}
.header .link a{ display: block; float: right; height: 32px; line-height: 32px; color: rgba(255,255,255,.5);}
.header .link a.btn{ background: #f0a400; color: #fff; padding: 0 20px;  border-radius: 20px; margin-left: 25px;}

.introduce{ height: 540px; background: #fff;}
.introduceCon{ padding:130px 130px 0 580px ; position: relative;}
.introduceCon:after{  position: absolute; top: 0; left: 0; display: block; width: 540px; height: 540px; content: ""; background: url(../images/icon.png) 0px -260px no-repeat; }
.introduceCon h2{font-size: 40px; font-weight: 300; padding-bottom: 20px;}
.introduceCon p{ font-size: 18px; color: #666; line-height: 34px;}

.annoyance,.annoyance .innerbox{background: #f2f2f2;}
.annoyanceCon .hd{padding: 85px 10px 80px; text-align: center;}
.annoyanceCon .hd h2{font-size: 30px; font-weight: 300;}
.annoyanceCon .bd{ padding: 0 115px 120px;}
.annoyanceCon .bd li{display: block; float: left; width: 25%;}
.annoyanceCon .bd li h5{ display: block; width: 180px; /*height: 40px;*/line-height: 40px; padding: 60px 0; margin: 0 auto; font-size: 32px; text-align: center; background: url(../images/icon.png) -940px -325px no-repeat; }
.annoyanceCon .bd li p{padding: 10px 32px; font-size: 16px; color: #666; line-height: 26px;}
.annoyanceCon .bd li.c1{padding-top: 90px;}
.annoyanceCon .bd li.c1 h5{color: #f60;}
.annoyanceCon .bd li.c2 h5{color: #2e79ff;}
.annoyanceCon .bd li.c3{padding-top: 115px;}
.annoyanceCon .bd li.c3 h5{color: #ab00fb;}
.annoyanceCon .bd li.c4{padding-top: 55px;}
.annoyanceCon .bd li.c4 h5{color: #68b000;}
.annoyanceCon .ft{ height: 85px; text-align: center; color: #36c; font-size: 24px; font-weight: 300;}
.annoyanceCon .ft .arrow{ width: 45px; height: 35px; margin: 10px auto ; background: url(../images/icon.png) -1077px 0px no-repeat; }

.function{height: 650px; background: #2f79fe;    background: -moz-linear-gradient(left,  #47b8b2 0%, #ffffff 100%);    background: -webkit-linear-gradient(left,  #47b8b2 0%,#2f79ff 100%);    background: -o-linear-gradient(left,  #47b8b2 0%,#2f79ff 100%);    background: -ms-linear-gradient(left,  #47b8b2 0%,#2f79ff 100%);    background: linear-gradient(to right,  #47b8b2 0%,#2f79ff 100%); }


/* 中等屏幕（桌面显示器，大于等于 992px） */
@media (max-width:1200px) {
.functionCon{height: 650px;   background: #2f79fe; background: -moz-linear-gradient(left,  #47b8b2 0%, #ffffff 100%);    background: -webkit-linear-gradient(left,  #47b8b2 0%,#2f79ff 100%);    background: -o-linear-gradient(left,  #47b8b2 0%,#2f79ff 100%);    background: -ms-linear-gradient(left,  #47b8b2 0%,#2f79ff 100%);    background: linear-gradient(to right,  #47b8b2 0%,#2f79ff 100%); }

}

.functionCon .hd{ padding: 75px 0; text-align: center; font-size: 36px; color: #fff; }
.functionCon .hd h2{ font-weight: 300;}
.functionCon .bd {padding: 0 50px;}
.functionCon .bd li{display: block;float: left; width: 20%; height: 350px; padding: 10px 20px 70px; color: #fff;}
.functionCon .bd li+li{border-left: 1px solid rgba(255,255,255,.2)}
.functionCon .bd li .ic{ font-size: 95px; text-align: center;}
.functionCon .bd li .ic svg{color: #fff}
.functionCon .bd li h5{ display: block; padding: 20px 0; font-size: 18px;  text-align: center;}
.functionCon .bd li p{font-size: 16px; color: rgba(255,255,255,.6); line-height: 24px;}

.process{}
.processCon{padding-bottom: 120px;}
.processCon .hd{ padding: 75px 0; text-align: center; font-size: 36px; color: #06c; }
.processCon .hd h2{ font-weight: 300;}
.processCon .bd {padding: 0 30px 0px 90px;}
.processCon .bd li{display: block; float: left; width: 300px;margin:0 60px 24px 0; padding: 10px 20px 35px; background: #fafafa; text-align: center;}
.processCon .bd li .ic{ font-size: 95px; text-align: center;color: #717171}
.processCon .bd li h5{color: #7e7e7e;}
.processCon .bd li:hover{ background: #2d7ffa; }
.processCon .bd li:hover .ic{color: #fff;}
.processCon .bd li:hover h5{color: #fff;}

.advantage,.advantage .innerbox{background: #f2f2f2;}
.advantageCon{height: 740px;}
.advantageCon .hd{ padding: 75px 0 55px; text-align: center; font-size: 36px; color: #000; }
.advantageCon .hd h2{ font-weight: 300;}
.advantageCon .bd {}
.advantageCon .bd li{display: block; float: left; width: 25%; padding: 20px 40px 10px; height: 440px;}
.advantageCon .bd li+li{border-left: 1px solid rgba(0,0,0,.08)}
.advantageCon .bd li .ic{ width: 220px; height: 220px; margin: 0 auto; background: url(../images/icon.png) 10px 0 no-repeat;}
.advantageCon .bd li.c2 .ic{ background-position: -243px 0;}
.advantageCon .bd li.c3 .ic{ background-position: -517px 0;}
.advantageCon .bd li.c4 .ic{ background-position: -796px 0;}
.advantageCon .bd li h5{ display: block; padding: 20px 0; font-size: 20px;  text-align: center;}
.advantageCon .bd li p{ font-size: 16px; color: #666; line-height: 26px;}

.footer,.footer .innerbox{background: #595959;}
.footerCon{height: 300px; padding: 50px 60px;}

.QRcode{width: 90px; height: 90px; background: rgba(255,255,255,.2); text-align: center; line-height: 90px; color: rgba(255,255,255,.4);}
.footerCon .bd{/*padding-left: 30px;*/}
.footerCon .logo{ height: 60px;}
.footerCon .logo svg{ float: left; font-size: 60px;}
.footerCon .logo h1{ font-size: 30px;color: rgba(255,255,255,.75); line-height: 60px; font-weight: 300;}
.footerCon .theme{ padding-left: 5px;  font-size: 20px;  color: rgba(255,255,255,.5);}
.footerCon .message{padding: 25px 0 0 5px; font-size: 15px;color: rgba(255,255,255,.4);}
.footerCon .message a{color: rgba(255,255,255,.4);}
/* .footerCon .message a:hover{color: rgba(255,255,255,.4);} */
.footerCon .message li{ display: block; position: relative; padding-bottom: 8px; }
.footerCon .link {padding-top:20px; }
.footerCon .link a{ font-size: 18px; color: rgba(255,255,255,.5); margin-right: 20px;}