@charset "utf-8";
.wrapper{
  min-width:320px;
  max-width:1920px;
  margin:auto;
  position: relative;
}
#header,#footer,.width{
  max-width:1770px;
  margin:auto;
}
.among{
  padding: 3% 5%;
}
.header{
  position: absolute;
  left: 0;
  top: 0;
  z-index: 999;
  right: 0;
  padding: 0 5%;
  transition: all .5s;
  border-bottom: 1px solid rgba(255,255,255,.17);
}
.header .logo{
  float: left;
  background: #FFF;
}
.header .logo a img{
  height: 37px;
  padding: 18px 9px 18px 10px;
}
.header .info{
  float: right;
  font-size: 0;
  letter-spacing: -1px;
  padding-left: 30px;
  margin: 28px 0 0;
  background: url(../images/tel.png) left no-repeat;
}
.header .info li{
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  height: 28px;
  font-size: 14px;
  line-height: 28px;
  color: #FFF;
  position: relative;
  z-index: 998;
}
.header .info li:nth-child(2){
  margin: 0 6px;
}
.header .info li span{
  font-family: '宋体';
}
.header .info li:last-child:after{
  content: '';
  display: inline-block;
  vertical-align: top;
  width: 26px;
  height: 21px;
  margin: 4px 0 0 6px;
  background: url(../images/wx.png);
}
.header .info li img{
  position: absolute;
  right: 0;
  top: 34px;
  display: none;
  width: 108px;
  border: 1px solid #d8d8da;
}
.header .info li:hover img{
  display: block;
}
.footer{
  padding: 3% 5%;
}
.footer .box{
  float: left;
  width: calc(46% - 54px);
  margin-right: 4%;
}
.footer .box > span{
  display: block;
  margin-bottom: 20px;
  font-size: 18px;
  line-height: 28px;
}
.footer .box > font{
  display: block;
  font-size: 36px;
  line-height: 1.5;
}
.footer .box > div,
.footer .box > div *{
  font-size: 15px;
  line-height: 2.1;
}
.footer .box1{
  float: right;
  margin-top: 48px;
}
.footer .box1 img{
  width: 108px;
}
.footer .box1 span{
  display: block;
  font-size: 12px;
  text-align: center;
}
.footer i{
  display: block;
  height: 0;
  border-bottom: 1px solid #dedede;
  padding-top: 2%;
  clear: both;
}
.footer .links{
  font-size: 0;
  letter-spacing: -1px;
  position: relative;
  margin-top: 1.2%;
}
.footer .links span{
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  font-size: 12px;
  width: 66px;
  font-weight: bold;
}
.footer .links p{
  margin-left: 60px;
}
.footer .links1{
  margin: 2% 0 0;
}
.footer .links1 span{
  top: 20px;
}
.footer .links1 p{
  margin: -20px 0 0 40px;
}
.footer .links p a{
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  font-size: 12px;
  margin-right: 15px;
}
.footer .links1 p a{
  border: 1px solid #e5e5e5;
  margin: 20px 0 0 20px;
  width: 9%;
  max-width: 138px;
}
.footer .links1 p a img{
  width: 100%;
}
.footer1{
  background: #000405;
  padding: 14px 5%;
}
.footer1 *{
  font-size: 12px;
  color: #FFF;
}
#footer .copyright{
  float: left;
}
#footer .nav{
  float: right;
}
#footer .nav span{
  font-family: '宋体';
}
.banner{
  position: relative;
  overflow: hidden;
}
.banner a{
  display: block;
  overflow: hidden;
  position: relative;
}
.banner a img{
  width: 100%;
}
.banner a b{
  background: url(../images/bg.png) center no-repeat;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 1;
  -webkit-background-size: cover;
  background-size: cover;
}
.banner a li{
  position: absolute;
  bottom: 0;
  z-index: 2;
  width: 100%;
  max-width: 1770px;
  margin-bottom: 4%;
  white-space: nowrap;
}
.banner .box{
  padding: 0 5%;
}
.banner1 a li{
  margin-bottom: 6.5%;
}
.banner1 a li font{
  font-weight: bold;
}
.banner a li span{
  display: block;
  font-size: 16px;
  color: #fff;
  line-height: 3.5;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 60px;
}
.banner a li font{
  display: block;
  font-size: 48px;
  line-height: 50px;
  color: #fff;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
.banner .arrow{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 3;
  text-align: center;
}
.banner .swiper-slide-active{
  z-index: 10;
}
.banner > a img,
.banner .swiper-wrapper .swiper-slide-active a img{
  animation:mymoveBig 3s 1;
  animation-fill-mode: both;
}
@keyframes mymoveBig{
  0% {transform: scale(1.0);}
  100% {transform: scale(1.04);}
}
.banner > a li span,
.banner .swiper-wrapper .swiper-slide-active a li span{
  animation:mymove 1s 1;
  animation-delay: 0.5s;
  animation-fill-mode: both;
}
.banner > a li font,
.banner .swiper-wrapper .swiper-slide-active a li font{
  animation:mymove1 1s 1;
  animation-delay: 0.8s;
  animation-fill-mode: both;
}
@keyframes mymove{
  0% {bottom:0;opacity: 0;}
  100% {bottom:60px;opacity: 1;}
}
@keyframes mymove1{
  0% {bottom:-50px;opacity: 0;}
  100% {bottom:0;opacity: 1;}
}
.messageBox{
  background: url(../images/bg.jpg) center no-repeat;
  background-size: cover;
}
.messageBox ul > span{
  display: block;
  font-size: 28px;
  color: #040404;
  line-height: 1.2;
}
.messageBox ul > font{
  display: block;
  font-size: 13px;
  color: #696969;
}
.messageBox{
  padding: 5% 5% 3.2%;
}
.messageBox li{
  font-size: 0;
  margin: 3% 0 1.5%;
  letter-spacing: -1px;
}
.messageBox li label{
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  background: #FFF;
  width: 15%;
  margin-right: 20px;
}
.messageBox li label input{
  display: block;
  font-size: 15px;
  border: 0;
  width: 100%;
  height: 50px;
  padding: 0 12px;
  box-sizing: border-box;
}
.messageBox li .note{
  width: calc(39% - 80px);
}
.messageBox li .code{
  width: 13%;
  letter-spacing: -1px;
}
.messageBox li .code input{
  display: inline-block;
  vertical-align: top;
  width: calc(100% - 70px);
}
.messageBox li .code img{
  cursor: pointer;
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  height: 30px;
  width: 70px;
  margin: 10px 0 0;
}
.messageBox li > input{
  display: inline-block;
  vertical-align: top;
  cursor: pointer;
  font-size: 15px;
  height: 50px;
  background: #2d89d7;
  color: #FFF;
  border: 0;
  width: 18%;
  padding: 0;
}
.messageBox.box{
  padding: 5.5% 5% 4%;
  background-image: url(../images/bg1.jpg);
}
.messageBox.box ul{
  position: relative;
}
.messageBox.box ul > span{
  margin-right: 20%;
}
.messageBox.box ul > span,
.messageBox.box ul > font{
  color: #FFF;
}
.messageBox.box ul > p{
  color: #FFF;
  font-size: 16px;
  line-height: 1.8;
  margin-top: 2%;
}
.messageBox.box div{
  position: absolute;
  top: 0;
  right: calc(18% - 108px);
}
.messageBox.box div img{
  display: block;
  width: 108px;
  margin: 0 auto;
}
.messageBox.box div span{
  font-size: 12px;
  display: block;
  text-align: center;
  color: #FFF;
  margin-top: 5px;
}
.aside .list{
  font-size: 0;
  letter-spacing: -1px;
  position: relative;
  padding-left: 8px;
}
.aside .list:before{
  content: '';
  display: block;
  position: absolute;
  background: #1f1f1f;
  width: 32px;
  height: 1px;
  top: 50%;
  left: 0;
}
.aside .list a{
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  font-size: 15px;
  line-height: 30px;
  color: #7e7e7e;
  padding-right: 15px;
  margin-left: 26px;
  background: url(../images/arrow.png) right no-repeat;
}
.aside .list a.on,
.aside .list a:hover{
  color: #1f1f1f;
  font-weight: bold;
}
.content{
  margin: 2% 0 0;
  min-height: 400px;
}
.loadMore{
  text-align: center;
  margin-top: 3%;
  font-size: 0;
  letter-spacing: -1px;
}
.loadMore a{
  display: none;
  vertical-align: top;
  font-size: 14px;
  letter-spacing: 5px;
  cursor: pointer;
  line-height: 46px;
  width: 30%;
  max-width: 208px;
  margin: 0 1%;
  border: 1px solid #5c5c5c;
}
.loadMore a.top{
  display: inline-block;
}
.loadMore a:after{
  content: '';
  display: inline-block;
  vertical-align: top;
  width: 9px;
  height: 5px;
  margin: 21px 0 0 8px;
  background: url(../images/arrow1.png);
}
.loadMore a:hover{
  color: #2984ef;
  border-color: #2984ef;
}
.loadMore a:hover:after{
  background-image: url(../images/arrow1_hover.png);
}
.list_case a{
  display: block;
  float: left;
  width: 31%;
  margin: 3% 0 0 3.5%;
}
.list_case a:nth-child(-n+3){
  margin-top: 0;
}
.list_case a:nth-child(3n+1){
  clear: both;
  margin-left: 0;
}
.list_case a dd{
  position: relative;
}
.list_case a dd img{
  width: 100%;
}
.list_case a dd ul{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: all .5s;
  background: rgba(0,0,0,.25);
}
.list_case a dd ul li{
  position: absolute;
  left: 10px;
  right: 10px;
  top: 70%;
  margin-top: -14px;
  text-align: center;
  font-size: 22px;
  line-height: 28px;
  color: #FFF;
  transition: all .3s;
}
.list_case a:hover dd ul li{
  top: 50%;
}
.list_case a p{
  padding: 3% 10px;
  position: relative;
}
.list_case a p span{
  display: block;
  color: #000;
  font-weight: bold;
  line-height: 1.8;
  transition: all .3s;
}
.list_case a p font{
  display: block;
  color: #666;
  transition: all .3s;
}
.list_case a:hover dd ul{
  opacity: 1;
}
.list_case a p:after{
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 0;
  background: #2984ef;
  transition: all .3s;
}
.list_case a:hover p:after{
  width: 100%;
}
.list_case a:hover p *{
  color: #FFF!important;
  position: relative;
  z-index: 1;
}
.caseBox{
  padding: 4% 5%;
}
.caseBox .more{
  display: inline-block;
  vertical-align: top;
  font-size: 12px;
  color: #4d4d4d;
  line-height: 44px;
  padding: 0 22px;
  margin-top: 3%;
  border: 1px solid #4e4e4e;
}
.caseBox .more:after{
  content: '';
  display: inline-block;
  vertical-align: top;
  width: 24px;
  height: 11px;
  margin: 15px 0 0 50px;
  background: url(../images/arrow2.png);
}
.caseBox .more:hover{
  color: #2984ef;
  border-color: #2984ef;
}
.caseBox .more:hover:after{
  background-image: url(../images/arrow2_hover.png);
}
.type-name > span{
  display: block;
  font-size: 24px;
  color: #1d1d1d;
  line-height: 1.6;
}
.type-name > div{
  margin: 1.5% 0 0;
  max-width: 870px;
}
.type-name > div,
.type-name > div *{
  font-size: 16px;
}
.type-name1{
  position: relative;
}
.type-name1 .name{
  display: block;
  font-size: 30px;
  color: #1b1b1b;
  line-height: 34px;
  margin-bottom: 3%;
}
.type-name1 .name1{
  display: block;
  font-size: 24px;
  color: #7d7d7d;
  line-height: 1;
  margin-bottom: 1%;
}
.type-name1 > p{
  position: absolute;
  right: 0;
  bottom: 3px;
  font-size: 0;
  letter-spacing: -1px;
}
.type-name1 > p a{
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  font-size: 14px;
  line-height: 28px;
  padding-right: 15px;
  margin-left: 26px;
  background: url(../images/arrow.png) right no-repeat;
}
.type-name1 > p a:last-child{
  background: none;
  padding-right: 0;
  text-decoration: underline;
}
.type-name1 > p a:hover{
  font-weight: bold;
}
.type-name2 span{
  display: block;
  text-align: center;
  font-size: 30px;
  font-weight: bold;
  color: #2984ef;
  line-height: 1.2;
}
.type-name2 font{
  display: block;
  text-align: center;
  font-size: 16px;
  color: #161616;
  margin-top: 1%;
}
.listBox{
  margin-top: 5%;
}
.listBox > span{
  display: block;
  float: left;
  font-size: 30px;
  color: #090909;
  font-weight: bold;
}
.listBox ul{
  float: right;
  width: 86%;
}
.listBox ul a{
  float: left;
  display: block;
  width: 30.3333%;
  margin: 3% 0 0 3%;
  padding: 2% 1.5% 1.5%;
  border: 1px solid #e6e6e6;
  box-sizing: border-box;
}
.listBox ul a:nth-child(-n+3){
  margin-top: 0;
}
.listBox ul a span{
  display: block;
  font-size: 24px;
  color: #373737;
  text-align: center;
  line-height: 1.4;
}
.listBox ul a li{
  font-size: 13px;
  line-height: 24px;
  height: 96px;
  -webkit-line-clamp: 4;
}
.listBox ul a img{
  height: 82px;
  margin-top: 6%;
  margin-bottom: 6%;
}
.listBox ul a img:nth-child(3){
  display: none;
}
.listBox ul a:hover{
  background: url(../images/bg2.jpg) center no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
}
.listBox ul a:hover span{
  color: #3cfff6;
}
.listBox ul a:hover li{
  color: #FFF;
}
.listBox ul a:hover img:nth-child(2){
  display: none;
}
.listBox ul a:hover img:nth-child(3){
  display: block;
}
.listBox ul.box a:hover{
  background: #f6a800;
}
.listBox ul.box a:hover span{
  color: #FFF;
}
.listBox i{
  display: block;
  clear: both;
  padding-bottom: 5%;
  border-bottom: 1px solid #dedede;
}
.processBox{
  padding: 3% 5% 5%;
  background: #f8f8f8;
}
.processBox .tn{
  text-align: center;
  font-size: 30px;
  color: #1e1e1e;
  line-height: 1.4;
}
.processBox .tn:after{
  content: '';
  display: block;
  margin: 1% auto 0;
  width: 30px;
  height: 1px;
  background: #1e1e1e;
  border-top: 1px solid #d1d1d1;
  border-bottom: 1px solid #6e6e6e;
}
.processBox .box a{
  display: block;
  float: left;
  width: 192px;
  background: #FFF;
  position: relative;
  margin: 5% 0 0 calc((100% - (192px * 6)) / 5);
}
.processBox .box a:nth-child(1){
  margin-left: 0!important;
}
.processBox .box a span{
  display: block;
  font-size: 16px;
  text-align: center;
  line-height: 1.2;
  color: #1e1e1e;
  margin-bottom: 22%;
}
.processBox .box a b{
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 48px;
  line-height: 50px;
  top: -25px;
  color: #1e1e1e;
  font-weight: normal;
  font-family: Verdana;
}
.processBox .box a img{
  height: 70px;
  margin: 30% auto 25%;
}
.aboutBox{
  padding: 4% 5% 6%;
}
.aboutBox .width{
  position: relative;
}
.aboutBox .box{
  max-width: 990px;
}
.aboutBox .box .img{
  position: absolute;
  right: 0;
  top: 0;
  width: 187px;
}
.aboutBox .box1{
  border-top: 1px solid #c4c4c4;
  margin-top: 4%;
  padding-top: 4%;
}
.aboutBox .box1 > span{
  display: block;
  float: left;
  font-size: 30px;
  color: #464646;
  line-height: 1.2;
}
.aboutBox .box1 > div{
  float: right;
  width: 68%;
}
.aboutBox .box1 > div > ul{
  float: left;
  width: 23.3333%;
  margin: 3% 0 0 10%;
}
.aboutBox .box1 > div > ul:nth-child(-n+3){
  margin-top: 0;
}
.aboutBox .box1 > div > ul:nth-child(3n+1){
  margin-left: 0;
  clear: both;
}
.aboutBox .box1 > div > ul > span{
  display: block;
  font-size: 18px;
}
.aboutBox .box1 > div > ul li{
  margin: 2% 0 0;
}
.aboutBox .box1 > div > ul li,
.aboutBox .box1 > div > ul li *{
  font-size: 15px;
  line-height: 24px;
}
.contactBox .name{
  font-size: 16px;
  line-height: 2.4;
  font-weight: bold;
}
.contactBox .box .img{
  float: right;
  width: 187px;
}
.contactBox .box,
.contactBox .box *{
  font-size: 15px;
  line-height: 2.4;
}
#mapBox{
  height: 500px;
  margin: 3% 0 2%;
  border: 1px solid #EEE;
}
.amap-maptype-item{
  line-height: 20px;
}
.list_news a{
  display: block;
  float: left;
  background: #fafafa;
  transition: all .3s;
  width: 48%;
  position: relative;
  margin: 3% 0 0 4%;
  box-sizing: border-box;
  padding: 25px 2% 30px calc(2% + 120px);
}
.list_news a:nth-child(-n+2){
  margin-top: 0;
}
.list_news a:nth-child(2n+1){
  margin-left: 0;
}
.list_news a span{
  font-size: 20px;
  font-weight: bold;
  color: #3a3a3a;
  line-height: 40px;
}
.list_news a p{
  font-size: 14px;
  line-height: 24px;
  color: #7b7a7a;
  height: 48px;
  margin: 3% 0 5%;
  -webkit-line-clamp:2;
}
.list_news a i{
  display: block;
  width: 33px;
  height: 10px;
  background: url(../images/icon.png) center no-repeat;
}
.list_news a dd{
  position: absolute;
  width: 120px;
  left: 0;
  top: 30px;
}
.list_news a dd b{
  text-align: center;
  display: block;
  font-size: 48px;
  font-weight: normal;
  line-height: 1.1;
}
.list_news a dd font{
  text-align: center;
  display: block;
  font-size: 16px;
  color: #838383;
  line-height: 1.1;
}
.list_news a:hover{
  background: #f3f3f3;
}
.hotBox{
  margin-bottom: 3%;
  text-align: right;
  position: relative;
}
.hotBox > span{
  display: block;
  font-size: 30px;
  font-weight: bold;
  color: #1b1b1b;
  margin-bottom: 1.5%;
  text-align: left;
  line-height: 40px;
}
.hotBox a{
  display: block;
  background: #fafafa;
  transition: all .3s;
  box-shadow:0 0 5px #bfbfbf;
  margin-bottom: 5px;
  font-size: 0;
  letter-spacing: -1px;
}
.hotBox a dd{
  display: inline-block;
  vertical-align: middle;
  letter-spacing: 0;
  width: 820px;
  height: 500px;
}
.hotBox a dd img{
  width: 100%;
  height: 100%;
  background: center no-repeat;
  background-size: cover;
}
.hotBox a dd img:nth-child(2){
  display: none;
}
.hotBox a ul{
  display: inline-block;
  vertical-align: middle;
  letter-spacing: 0;
  width: calc(90% - 820px);
  margin: 0 0 0 5%;
}
.hotBox a ul b{
  display: block;
  font-size: 36px;
  color: #989898;
  line-height: 1;
}
.hotBox a ul font{
  display: block;
  font-size: 18px;
  color: #777676;
  font-weight: bold;
  line-height: 1.5;
}
.hotBox a ul span{
  font-size: 24px;
  color: #373737;
  font-weight: bold;
  margin: 30px 0;
}
.hotBox a ul li{
  font-size: 16px;
  color: #717171;
  line-height: 30px;
  height: 90px;
}
.hotBox a ul i{
  display: block;
  width: 33px;
  height: 10px;
  margin-top: 80px;
  background: url(../images/icon.png) center no-repeat;
}
.hotBox a:hover{
  background: #f3f3f3;
}
.hotBox .arrow{
  font-size: 18px;
  font-weight: bold;
  position: absolute;
  right: 0;
  top: 0;
  line-height: 40px;
}
.hotBox .arrow:after{
  color: #929292;
}
.hotBox .arrow span{
  margin: 0;
  width: auto;
  height: auto;
  border-radius: 0;
  background: none;
  display: none;
}
.hotBox .arrow span.active{
  display: inline-block;
}
.hotBox .arrow span:nth-child(1):after{
  content: '01';
}
.hotBox .arrow span:nth-child(2):after{
  content: '02';
}
.hotBox .arrow span:nth-child(3):after{
  content: '03';
}
.hotBox .arrow span:nth-child(4):after{
  content: '04';
}
.hotBox .arrow span:nth-child(5):after{
  content: '05';
}
.hotBox .arrow span:nth-child(6):after{
  content: '06';
}
.hotBox .arrow span:nth-child(7):after{
  content: '07';
}
.hotBox .prev,
.hotBox .next{
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  width: 50px;
  line-height: 50px;
  color: #FFF;
  font-family: '宋体';
  cursor: pointer;
  font-size: 26px;
  text-align: center;
  margin: 10px 0 0 10px;
  background: #c6c6c6;
  transition: all .3s;
}
.hotBox .prev:hover,
.hotBox .next:hover{
  background: #3c3c3c;
}
.newsBox{
  background: #f7f7f7;
  padding: 4% 5%;
}
.newsBox .box{
  float: left;
  width: 615px;
  position: relative;
}
.newsBox .box a{
  display: block;
  background: #FFF;
  transition: all .3s;
}
.newsBox .box a dd img{
  width: 100%;
  height: 375px;
  background: center no-repeat;
  background-size: cover;
}
.newsBox .box a dd img:nth-child(2){
  display: none;
}
.newsBox .box a ul{
  margin: 50px 20px 0;
}
.newsBox .box a ul span{
  font-size: 18px;
  font-weight: bold;
  line-height: 40px;
}
.newsBox .box a ul font{
  display: block;
  font-size: 12px;
  margin: 10px 0 15px;
}
.newsBox .box a ul li{
  color: #322f2f;
  line-height: 26px;
  height: 78px;
  margin-bottom: 18px;
}
.newsBox .box a:hover{
  background: #ececec;
}
.newsBox .box .arrow{
  display: none;
}
.newsBox .box .prev,
.newsBox .box .next{
  position: absolute;
  top: 375px;
  width: 50px;
  height: 50px;
  z-index: 1;
  cursor: pointer;
  overflow: hidden;
  background: url(../images/arrow2.png) center no-repeat;
}
.newsBox .box .prev{
  left: 7px;
  transform:rotate(180deg);
}
.newsBox .box .next{
  right: 7px;
}
.newsBox .box .prev:hover,
.newsBox .box .next:hover{
  background-image: url(../images/arrow2_hover.png);
}
.newsBox .box1{
  float: left;
  display: block;
  background: #FFF;
  height: 190px;
  transition: all .3s;
  width: calc((94% - 615px) / 2);
  margin: 20px 0 0 3%;
  box-sizing: border-box;
  padding: 0 20px;
}
.newsBox .box1:nth-child(3),
.newsBox .box1:nth-child(4){
  margin-top: 0;
}
.newsBox .box1 span{
  font-size: 16px;
  font-weight: bold;
  margin: 18px 0 0;
  color: #010101;
}
.newsBox .box1 font{
  display: block;
  font-size: 12px;
  margin: 10px 0;
  color: #5e5e5e;
}
.newsBox .box1 li{
  color: #6f6f6f;
  line-height: 26px;
  height: 78px;
}
.newsBox .box1:hover{
  background: #ececec;
}
.homeBox{
  padding: 3% 5% 0;
}
.homeBox .box{
  margin-top: 3%;
}
.homeBox .box div{
  float: left;
  box-shadow:0 0 20px #bfbfbf;
  background: #FFF;
  width: 30.6%;
  margin-left: 4.1%;
}
.homeBox .box div:nth-child(1){
  margin-left: 0!important;
}
.homeBox .box div img{
  width: 100%;
}
.homeBox .box div ul{
  padding: 3% 5%;
}
.homeBox .box div ul span{
  display: block;
  margin-bottom: 2%;
}
.homeBox .box div ul span a{
  font-size: 24px;
  font-weight: bold;
  color: #3a3a3a;
}
.homeBox .box div ul span a:hover{
  color:#2984ef;
}
.homeBox .box div ul li{
  font-size: 0;
  letter-spacing: -1px;
  min-height: 180px;
}
.homeBox .box div ul li p{
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  width: 45%;
  padding: 8px 0;
  margin-left: 5%;
}
.homeBox .box div ul li p:nth-child(2n+1){
  margin-left: 0;
}
.homeBox .box div ul li p a{
  font-size: 15px;
  line-height: 20px;
}
.homeBox .box div ul li p a:before{
  content: '- ';
}
.homeBox .line{
  clear: both;
  padding-bottom: 4%;
  border-bottom: 1px solid #dedede;
}
.mailBox{
  padding: 5% 5% 4%;
}
.mailBox .box{
  font-size: 0;
  letter-spacing: -1px;
  text-align: center;
}
.mailBox .box a{
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  width: 16%;
  margin: 3% 0 0 5%;
}
.mailBox .box a:nth-child(1){
  margin-left: 0;
}
.mailBox .box a img{
  width: 46%;
  max-width: 130px;
}
.mailBox .box a span{
  display: block;
  color: #181818;
  font-size: 20px;
  margin: 3% 0;
}
.mailBox .box a font{
  display: block;
  font-size: 14px;
  line-height:1.8;
  color: #7d7d7d;
}
.mailBox .box1{
  font-size: 0;
  letter-spacing: -1px;
  text-align: center;
}
.mailBox .box1 a{
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  font-size: 16px;
  width: 168px;
  line-height: 38px;
  border: 1px solid #2984ef;
  border-radius: 40px;
  margin: 4% 1.2% 0;
  cursor: pointer;
}
.mailBox .box1 a:hover{
  background: #2984ef;
  color: #FFF;
}
.cdnBox{
  padding: 5% 5% 7%;
  background: url(../images/bg3.jpg) center no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
}
.cdnBox .type-name2 *{
  color: #FFF;
}
.cdnBox .box{
  max-width: 800px;
  margin-top: 4%;
}
.cdnBox .box,
.cdnBox .box *{
  font-size: 16px;
  color: #FFF;
  line-height: 2.2;
}
.cdnBox .box1{
  font-size: 0;
  letter-spacing: -1px;
}
.cdnBox .box1 a{
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  width: 142px;
  font-size: 14px;
  line-height: 38px;
  text-align: center;
  color: #FFF;
  border: 1px solid #FFF;
  margin: 6% 12px 0 0;
}
.cdnBox .box1 a img,
.cdnBox .box1 a span{
  display: none;
}
.cdnBox .box1 a:hover{
  border-color: #2984ef;
  background: #2984ef;
}
.sslBox{
  padding: 5% 5%;
}
.sslBox .type-name2 span{
  color: #232323;
}
.sslBox .box{
  text-align: center;
  font-size: 0;
  letter-spacing: -1px;
}
.sslBox .box a{
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  width: 15%;
  max-width: 250px;
  margin: 3% 2% 0;
}
.sslBox .box a img{
  width: 100%;
}
.sslBox .box1{
  float: left;
  width: 50%;
  margin-top: 3%;
}
.sslBox .box1 > span{
  display: block;
  font-size: 18px;
  font-weight: bold;
}
.sslBox .box1 ul{
  font-size: 0;
  letter-spacing: -1px;
  margin-top: 2.5%;
}
.sslBox .box1 ul img{
  width: 31px;
  height: 33px;
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
}
.sslBox .box1 ul li{
  width: calc(100% - 41px);
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  font-size: 14px;
  line-height: 32px;
  margin: 1px 0 0 10px;
}
.sslBox .box1 ul li span{
  color: #3fa13e;
}
.sslBox .box2{
  float: right;
  width: 43%;
  max-width: 749px;
  margin-top: 3%;
}
.sslBox .box2 img{
  width: 100%;
}
.domainBox{
  padding: 5% 5%;
  background: url(../images/bg4.jpg) center no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
}
.domainBox *{
  color: #FFF!important;
}
.domainBox .box{
  margin-top: 4%;
}
.domainBox .box,
.domainBox .box *{
  font-size: 16px;
}
.serviceBox{
  padding: 5%;
}
.serviceBox .width{
  position: relative;
}
.serviceBox .box{
  float: left;
  width: 48%;
  margin-left: 4%;
}
.serviceBox .box:nth-child(1),
.serviceBox .box:nth-child(5){
  margin-left: 0;
}
.serviceBox .box > span{
  display: block;
  font-size: 30px;
  font-weight: bold;
  color: #393939;
  line-height: 1.2;
}
.serviceBox .box > font{
  display: block;
  font-size: 16px;
  color: #393939;
  margin-top: 2%;
}
.serviceBox .line{
  margin: 4% 0;
  height: 1px;
  background: #d5d5d5;
  display: block;
  position: relative;
  z-index: 1;
}
.serviceBox .line:after{
  content: '';
  display: block;
  background: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 33px;
  height: 127px;
  margin: -64px 0 0 -17px;
}
.serviceBox .line1{
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 1px;
  background: #d5d5d5;
}
.serviceBox .width > b{
  display: block;
  background: #000;
}
.serviceBox .box > div{
  font-size: 0;
  letter-spacing: -1px;
}
.serviceBox .box > div > ul{
  display: inline-block;
  vertical-align: middle;
  letter-spacing: 0;
  width: 52%;
  margin-right: 7%;
}
.serviceBox .box > div > ul,
.serviceBox .box > div > ul *{
  color: #636363;
  font-size: 16px;
  line-height: 2.2;
}
.serviceBox .box > div > ul.box1 > .name{
  font-size: 18px;
  display: block;
  font-weight: bold;
  color: #1d1d1d;
  margin-top: 5%;
}
.serviceBox .box > div > ul.box1 > .name:nth-child(1){
  margin-top: 0;
}
.serviceBox .box > div > img{
  display: inline-block;
  vertical-align: middle;
  width: 41%;
}
.location{
  margin-bottom: 3%;
  padding-bottom: 1%;
  border-bottom: 1px solid #dedede;
}
.location span:after{
  content:" > ";
  font-family:"宋体";
}
.leftBox{
  float: left;
  width: 62%;
}
.leftBox > h1{
  font-size: 24px;
  color: #373737;
}
.leftBox .info{
  color: #777676;
  margin-top: 1.5%;
  padding-bottom: 0.8%;
  position: relative;
  border-bottom: 1px solid #c4c4c4;
}
.leftBox .info span{
  white-space: nowrap;
}
.leftBox .info .shareBox{
  position: absolute;
  right: 0;
  top: -3px;
}
.leftBox .info1{
  margin-top: 10%;
  padding-top: 2%;
  border-top: 1px solid #c4c4c4;
}
.leftBox .cont{
  margin-top: 3%;
}
.rightBox{
  float: right;
  width: 30%;
}
.rightBox > span{
  display: block;
  font-size: 24px;
  margin-top: 10%;
  border-bottom: 1px solid #e5e5e5;
}
.rightBox > span:nth-child(1){
  margin-top: 0;
}
.rightBox .type{
  display: block;
  font-size: 16px;
  line-height: 2.8;
  border-bottom: 1px dashed #e5e5e5;
}
.rightBox .list{
  display: block;
  padding: 3% 0;
  border-bottom: 1px dashed #e5e5e5;
}
.rightBox .list span{
  display: block;
  font-size: 16px;
  line-height: 1.6;
}
.rightBox .list font{
  display: block;
  color: #999;
  line-height: 1.6;
  margin-top: 3%;
}
.detailedBox > h1{
  font-size: 30px;
}
.detailedBox > h2{
  margin-top: 3%;
  padding-top: 3%;
  font-size: 14px;
  font-weight: normal;
  border-top: 1px solid #dedede;
}
.detailedBox .info{
  color: #00a197;
  margin: 2% 0;
}
.detailedBox .info1{
  position: relative;
  min-height: 28px;
  margin-top: 2%;
  text-align: right;
}
.detailedBox .info1 img{
  display: inline-block;
  vertical-align: top;
  width: 140px;
}
.detailedBox .info1 a{
  position: absolute;
  left: 0;
  bottom: 0;
  padding-left: 28px;
  display: block;
  background: url(../images/icon1.png) left no-repeat;
}
.detailedBox .cont{
  max-width: 1070px;
  margin: 0 0 0 4%;
}
.detailedBox .cont1{
  margin-top: 3%;
  overflow-x: auto;
}
.detailedBox .btn{
  border-top: 1px solid #dedede;
  font-size: 0;
  letter-spacing: -1px;
  margin-top: 3%;
  padding-top: 3%;
}
.detailedBox .btn a{
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  line-height: 42px;
  margin-right: 3%;
  font-size: 14px;
  padding: 0 3%;
  border: 1px solid #4e4e4e;
}
.detailedBox .btn a:nth-child(1):before{
  content: '<　　';
  font-family: '宋体';
}
.detailedBox .btn a:nth-child(2):after{
  content: '　　>';
  font-family: '宋体';
}
.detailedBox .btn a:hover{
  border-color: #2984ef;
}
.picBox{
  margin-top: 3%;
}
.picBox > ul{
  position: relative;
}
.picBox .swiper-container{
  max-width: 1000px;
  margin: 0 auto;
}
.picBox img{
  max-width: 100%;
}
.picBox .prev,
.picBox .next{
  position: absolute;
  cursor: pointer;
  top: 50%;
  margin-top: -21px;
  width: 40px;
  line-height: 40px;
  border: 1px solid #CCC;
  border-radius: 100%;
  z-index: 1;
  font-size: 20px;
  font-weight: bold;
  color: #CCC;
  text-align: center;
  font-family: '宋体';
}
.picBox .prev{
  left: 0;
}
.picBox .next{
  right: 0;
}
.picBox .prev:hover,
.picBox .next:hover{
  background: #000;
  border-color: #000;
  color: #FFF;
}
.picBox .arrow{
  text-align: center;
  margin-top: 3%;
  height: 5px;
}
.picBox .arrow span{
  border-radius: 0;
  width: 20px;
  height: 5px;
  background: #d6d6d6;
}
.picBox .arrow span.active{
  background: #1f1f1f;
}
.floatBox{
  position: fixed;
  right: 0;
  top: 50%;
  z-index: 1000;
  width: 50px;
}
.floatBox ul{
  width: 50px;
  height: 50px;
  display: block;
  margin-top: 4%;
  position: relative;
}
.floatBox ul.wechat{
  border-radius: 6px 0 0 6px;
  background: #797979 url(../images/icon2.png) center no-repeat;;
}
.floatBox ul.wechat li{
  display: none;
}
.floatBox ul.wechat:hover{
  border-radius: 0;
  background-color: #009cdc;
}
.floatBox ul.wechat:hover li{
  display: block;
  position: absolute;
  right: 100%;
  bottom: 0;
  background: #009cdc;
  padding: 10px;
  border-radius: 6px 6px 0 6px;
}
.floatBox ul.wechat:hover li img{
  width: 108px;
}
.floatBox ul.wechat:hover li span{
  display: block;
  text-align: center;
  color: #FFF;
  font-size: 14px;
  line-height: 14px;
  margin-top: 8px;
}
.floatBox ul.qq a{
  position: absolute;
  left: 0;
  top: 0;
  font-size: 0;
  cursor: pointer;
  letter-spacing: -1px;
  white-space: nowrap;
  border-radius: 6px 0 0 6px;
  background: #797979;
}
.floatBox ul.qq:hover a{
  width: 148px;
  left: -98px;
  background: #009cdc;
}
.floatBox ul.qq a b{
  width: 50px;
  height: 50px;
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  background: url(../images/icon3.png) center no-repeat;
}
.floatBox ul.tel li{
  position: absolute;
  left: 0;
  top: 0;
  font-size: 0;
  letter-spacing: -1px;
  white-space: nowrap;
  border-radius: 6px 0 0 6px;
  background: #797979;
}
.floatBox ul.tel:hover li{
  width: 178px;
  left: -128px;
  background: #009cdc;
}
.floatBox ul.tel li b{
  width: 50px;
  height: 50px;
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  background: url(../images/icon4.png) center no-repeat;
}
.floatBox ul.qq a span,
.floatBox ul.tel li span,
.floatBox ul.tel li a{
  display: inline-block;
  vertical-align: top;
  letter-spacing: 0;
  line-height: 50px;
  font-size: 16px;
  color: #FFF;
}
.floatBox ul.top a{
  width: 50px;
  height: 50px;
  display: block;
  cursor: pointer;
  border-radius: 6px 0 0 6px;
  background: #797979 url(../images/icon5.png) center no-repeat;
}
.floatBox ul.top a:hover{
  background-color: #009cdc;
}