@charset "utf-8";
/*头部内容区域*/
.firstscreen{ position: relative;}
header { width: 100%;z-index: 999;height: 7rem;line-height: 7rem;position:absolute;top: 0;left: 0;display: flex;justify-content: space-around; align-items: center;}
.fixed {position: fixed;top: 0;left: 0;box-shadow: 22px 0px 16px 0px rgb(0 0 0 / .1);line-height: 7rem;background: #fff;transition: all 0.25s ease;}
.logo{ width: 15rem;}
.indextop{background: rgba(0, 0, 0, .3);}
.tel{color: #fff; margin-left: 3rem; padding-left: 3rem; position: relative;  font-weight: bold;}
.tel::before{ content: ''; width: 1px;height: 14px; background-color: #fff; display: block; position: absolute; left: 0; top: 42%;}
.tel .icon{ font-size: 2rem; margin-right: 1rem;}
.top-xs{ display: none;}


/*导航栏目*/
.menubox{display: flex; height: 100%;} 
nav{-webkit-transition: 0.5s;-moz-transition: 0.5s;-o-transition: 0.5s;transition: 0.5s;height: 100%;line-height: 7rem;display: block;}
.navbar li.dropdown {display: inline-block;position: relative; margin-right: 2rem;} 
.navbar li:after {content: "";width: 0px;height:0.1rem;position: absolute;bottom: 1rem;left: 0px; z-index:999; background:#fff; transition: all 0.5s ease 0s;}
.navbar li:hover:after {width: 100%;} 
.navbar .toplink {text-decoration: none; height: 100%; text-align: center;  display: block;-webkit-transition: 0.5s;-moz-transition: 0.5s;-o-transition: 0.5s;transition: 0.5s;color: #fff;}
.navbar .subnav{display: none;position: absolute;top:7rem;width:10rem;background:#fff;color: #1d1b1b;box-shadow: 0 1.5rem 27px 0 rgba(0, 0, 0, 0.1);left:0;z-index: 900;transform: translateX(-18%); border-radius: 3px;}
.navbar li.dropdown:hover .subnav {display: block;-webkit-transition: 0.5s;-moz-transition: 0.5s;-o-transition: 0.5s;transition: 0.5s;}
.navbar .subnav a{display: block;font-size: 1.4rem; line-height: 4rem;text-align: center; margin-bottom: 1px; color: #1d1b1b;}
.navbar .subnav a:hover{ background: #2973e3; color: #fff;}
.san {width: 0;height: 0;border-left: 7px solid transparent;border-right: 7px solid transparent;border-bottom: 10px solid rgba(255,255,255,.95);position: absolute;top: -8px;left: 50%;transform: translateX(-50%);}

  /*swpier--bannerb部分*/
.banner .swiper {width: 100%;height:auto;z-index: 0;} 
.banner .swiper-slide {background-position: center;background-size: cover;}
.banner .swiper-slide img{width:100%;height:auto; transition:1s linear 2s;transform:scale(1.1,1.1); display: block;}
.banner .swiper-slide-active img,.swiper-slide-duplicate-active img{transition:6s linear;transform:scale(1,1);}	
.banner .swiper-button-next,.banner .swiper-button-prev{ color: #fff !important;}
.banner .swiper-pagination-bullet{ font-size: 1.6rem !important;}
.banner .swiper-pagination{ bottom: 12rem;}

.number{ background: #fff; box-sizing: border-box;box-shadow: 0 1.5rem 27px 0 rgba(0, 0, 0, 0.1); border-radius: .8rem; padding: 3rem 0; z-index: 900; position: relative; margin-top: -8rem;}
.number ul{display: flex; justify-content: space-around; align-items: center;}
.number ul li{z-index: 0;position: relative; }
.number ul li em{font-size: 3rem;position: absolute;top: 2rem;right: 1rem;font-style: normal;color: #2973e3;}
.number ul li .shu{display:block;height: 8rem;margin: 0 auto;position: relative;}
.number li p{font-size: 1.8rem;}
.dataNums{position: absolute;display: block;height: 8rem;text-align:center;left: -50%;margin-left: 40%;width: 100%;line-height: 8rem;z-index: 999;top: 1rem;}
.dataNums .dataOne{width: 3.2rem;height:6rem;text-align: center;font-family: "Arial";list-style: none;line-height: 6rem;display: inline-block;}
.dataNums .dataBoc {position: relative; width: 100%; height: 100%; overflow: hidden;}
.dataNums .dataBoc .tt {position: absolute;top: 2rem;left: 0;width: 100%;height: 2rem;}
.dataNums .tt span{width:100%;font: bold 6rem/6rem "Arial";color: #2973e3;height: 6rem;float: left;}
.tit{ text-align: center; position: relative;}
.tit::after{ display: block; content: ''; width: 5rem; height: .2rem; background: #2973e3; bottom: -1rem; position: absolute; left: 50%; margin-left: -2.5rem;}
.tit h2{ font-size: 3.6rem; font-weight: bold;}
.tit h2 b{ color:#2973e3;}
.tit p{ color: #666;}

.itembox{ background: #f2f2f2; padding-top: 15rem; margin-top: -10rem;}
.itembox .tabs .tab{width: 20%;  float: left;}
.itembox .title{ font-size: 2rem; font-weight: bold; margin-bottom: 2rem;} 
.itembox .txt{ font-size: 1.4rem;} 
.itembox .icon{width: 100%;height: 7rem;margin-bottom: 3rem;}
.itembox .icon1{ background: url(../images/icon01.png) no-repeat center center;}
.itembox .icon2{ background: url(../images/icon02.png) no-repeat center center;}
.itembox .icon3{ background: url(../images/icon03.png) no-repeat center center;}
.itembox .icon4{ background: url(../images/icon04.png) no-repeat center center;}
.itembox .icon5{ background: url(../images/icon05.png) no-repeat center center;}
.itembox  .tab01 a:hover .icon1{ background: url(../images/icon01_h.png) no-repeat center center;}
.itembox  a:hover .icon2{ background: url(../images/icon02_h.png) no-repeat center center;}
.itembox  a:hover .icon3{ background: url(../images/icon03_h.png) no-repeat center center;}
.itembox  a:hover .icon4{ background: url(../images/icon04_h.png) no-repeat center center;}
.itembox  a:hover .icon5{ background: url(../images/icon05_h.png) no-repeat center center;}
.itembox .tab a:hover{ color: #fff;}
.itembox .tabs a{border-radius:.8rem; color: #fff; height: 35rem; display: block;transition: all ease 0s; padding: 4rem 3rem 0;text-align: center; box-sizing: border-box;color: #1d1b1b;}
.itembox .tab01 a:hover{background: -webkit-linear-gradient(right top, #1c6ade , #6ba2fd);  }
.itembox .tab02 a:hover{background: -webkit-linear-gradient(right top, #e32a35 , #fe6c74);}
.itembox .tab03 a:hover{background: -webkit-linear-gradient(right top, #5853f5 , #7975fa);}
.itembox .tab04 a:hover{background: -webkit-linear-gradient(right top, #ff740b , #ffb45e);}
.itembox .tab05 a:hover{background: -webkit-linear-gradient(right top, #50c316 , #90db6b);}

.liucheng{ padding: 3rem 0;}
.liucheng .TabADS { display: flex; justify-content: space-between; align-items: baseline;}
.liucheng .TabADS .row{ float: left;height: 22rem; width:16%;  border-radius: .8rem; box-sizing: border-box;  padding: 3rem; background: #eee; position: relative; text-align: center;}
.liucheng .TabADS .row:nth-child(5){ margin-right:0;}
.liucheng .TabADS .row:hover{background: -webkit-linear-gradient(right top, #1c6ade , #6ba2fd); cursor: pointer; color: #fff;}
.liucheng .TabADS .row:hover  span::after{ background: #fff;} 
.liucheng .TabADS .row:hover  span{ color: #fff;}
.liucheng .TabADS .row:after{content: "→"; display: block; position: absolute; right: -4rem; top: 10rem; font-size:2rem; color: #666;}
.liucheng .TabADS .row:nth-child(5)::after{ display: none;}
.liucheng .row h5{ font-size: 2rem; font-weight:bold;}
.liucheng .row span{ display: block; font-size: 1.2rem; color: #999; position: relative;}
.liucheng .row span::after{ width: 4rem; height: .1rem; background: #666; position: absolute; margin-left: -2rem; left: 50%; bottom: -.5rem; content:""; display: block;}
.liucheng .row p{ margin-top: 1.5rem;}
.liucheng .btn { width: 28rem; margin: 5rem auto 0; font-size: 2rem; font-weight: bold;}
.liucheng .btn a{ width: 100%;  display: block; border-radius: 10rem; background: -webkit-linear-gradient(right top, #1665dc , #6ca3fd); text-align: center; line-height: 5rem; color: #fff; }



.tongdian {width: 100vw;height: 50rem; background-image: url(../images/tongdian.jpg);background-position: center center; background-repeat: no-repeat; display: flex; justify-content: center; position: relative; padding-top: 6rem; box-sizing: border-box;}
.tongdian .tit{ color: #fff;}
.tongdian .tit::after{ display: none;}
.marsk {/* 遮罩层 */ position: absolute; width: 100%; height: 100%;   left: 0; top: 0; z-index: 1; display: flex;}
#myChar { position: absolute; left: 50%; top: 60%; transform: translate(-50%, -50%); z-index: 2;}
#myChar a:hover{ border: none;}

.jz_kehu{ background: url(../images/jzkh_bg.jpg) no-repeat center top; padding:10rem 0;}
.jz_kehu .left{ width: 58rem; background: #fff; border-radius: .8rem; box-shadow: 0 1.5rem 27px 0 rgba(0, 0, 0, 0.1); padding: 5rem; box-sizing: border-box;min-height: 50rem;}
.jz_kehu .left h2{ font-size: 4.8rem; font-weight: bold; margin-bottom: 2rem;}
.jz_kehu .left h2 span{ color: #1665dc;}
.jz_kehu .left p{ font-size: 3rem; line-height: 3.8rem; font-weight: lighter; margin-bottom: 8rem;}
.jz_kehu .left ul li{ width: 9rem; height: 9rem;   border-radius: 9rem; line-height: 9rem; text-align: center;  display: inline-block; margin-right: 2rem;  font-size: 2rem; color: #fff;}
.jz_kehu .left ul li:first-child{ background: #1665dc;}
.jz_kehu .left ul li:nth-child(2){background: #3584fb;}
.jz_kehu .left ul li:nth-child(3){background: #5599ff;}
.jz_kehu .left ul li:nth-child(4){background: #7fbbff;}
.jz_kehu .right{width: 55%;padding-top: 2rem;}
.jz_kehu .right .row{width: 38%;height: 16rem;float: left;position: relative;padding-left: 10%;}
.jz_kehu .right .row .icon{position: absolute;left: 8%;top: 1rem;font-size: 3rem;color: #1665dc;}
.jz_kehu .right .row h3{ font-size: 2rem; font-weight: bold;}
.jz_kehu .right .row p{line-height: 2.4rem; color: #666; font-size: 1.4rem;}

.ad{ background: url(../images/sbwd.jpg) no-repeat center top;height: 30rem; box-sizing: border-box; text-align: center; color: #fff; padding: 5rem 0;}
.ad .f18{ color: rgba(255, 255,255, 0.35);}
.ad .btn{ margin: 0 auto;width: 30rem;}
.ad .btn a{ display: block; width: 100%; font-weight: bold; font-size: 2.4rem; border-radius: 5rem; line-height: 5rem; text-align: center; color: #fff;background: -webkit-linear-gradient(right top, #00c2f3 , #f23296); }
.case{ padding-bottom: 5rem;}
.case .swiper-slide{ display: flex; justify-content: space-around; align-items: baseline;}
.case .swiper-slide ul li{ display: inline-block; margin: 0 1rem;} 

.new .tit2 b{ font-size: 3rem;}
.new .left{ width: 40rem;}
.new .nimg img{ border-radius: .8rem;}
.new .right{ width: 95rem;}
.new  h1{ font-size: 1.8rem; font-weight: bold;}
.new .right ul li{ width: 45%;  float: left; }
.new   p{ font-size: 1.6rem; color: #999;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient: vertical;}
.new .right ul li a{ display: block;padding-left:5%; box-sizing: border-box;padding: 1rem;  border-radius: .8rem;}
.new .right ul li a:hover{ background: #fff; }
.new .right ul li .date{ font-size: 1.4rem;}

.bottom{ background: #222; color: rgba(255,255,255,.25); padding-top: 3rem;}
.bottom a{color: rgba(255,255,255,.25); }
.bottom a:hover{color: rgba(255,255,255,.65); }
.bottom .copyright{text-align: center; line-height: 5rem; border-top: #333 1px solid;} 
.bottom .left{ width: 18%;}
.bottom  dl{ width:12rem; float: left; padding-top: 1.5rem;}
.bottom  dl dt{ font-weight: bold;color: rgba(255,255,255,.65);}
.bottom .right i{ font-size: 2rem; margin-right: 1rem;}
@media (max-width:1920px) {
.wid{ width: 1400px;}
.visible-xs{ display: none;}
.fangan ul li{ border-bottom: none;}
}
 @media (max-width:1440px) {
   .wid{ width:1200px; }
    
 }
 @media (max-width:1280px) {
   .wid{ width:1000px;}
   .navbar li.dropdown{ margin-right:.5rem;}
   .jz_kehu .left{ width: 40rem; padding:3rem}
   .jz_kehu .left p{ margin-bottom: 4rem; font-size: 2.4rem;}
   .jz_kehu .left h2{ font-size: 3.6rem;}
   .jz_kehu .left ul li{ width: 7.5rem; height: 7.5rem; line-height: 7.5rem; margin-right:0.5rem;}
   .jz_kehu .right .row h3{ font-size:1.8rem;}
    
 }
 @media (max-width:1080px) {
   .wid{width: 96%;padding-left: 2%;padding-right: 2%;}
   .mb80  { margin-bottom: 5rem;}
   .mb50{ margin-bottom: 3rem;}
   .pdt80{ padding-top: 5rem;}
   .pd60{ padding-top: 4rem; padding-bottom: 4rem;}
   .top { display: none;}
   .top-xs{ display: block;}
   .top-xs{background-color: #fff;height: 5rem;position: fixed;top: 0;z-index: 991;width: 100%;padding: 1rem 0;box-shadow: 0 5px 15px rgba(0, 0 ,0, 0.15);}
    .top-xs .logo{ position:relative; z-index:990;} 
  .top-xs .logo img{height: 5rem;width: auto !important;margin-left: 1rem;}
   .tit p br{ display: none;}
   .menu-button {display: block;height: 3rem;margin: 1.2rem 1rem 0 0;cursor: pointer;position: relative;z-index: 900;}
  .menu-button .line:nth-of-type(1) {margin-top: 0;}
  .menu-button .line:nth-of-type(2) {margin-bottom: 0;}
  .menu-button .line {position: relative;display: block;width: 2.8rem;height: 0.2rem;margin: .5rem 0;background: #666;border-radius: 5px;-webkit-transition: 0.3s;transition: 0.3s;}
  .header_active .line:nth-of-type(1) {
  -webkit-transform: translateY(6.5px) rotate(-45deg);
  -ms-transform: translateY(6.5px) rotate(-45deg);
  transform: translateY(6.5px) rotate(-45deg);
}
  .header_active .line:nth-of-type(2) {opacity: 0}
  .header_active .line:nth-of-type(3) {
  -webkit-transform: translateY(-7.5px) rotate(45deg);-ms-transform: translateY(-7.5px) rotate(45deg);transform: translateY(-7.5px) rotate(45deg);}
  #menu {background: #fff;height: 100%;position: fixed;transform: translateY(-100%);top: 0;left: 0;right: 0;bottom: 0;z-index: 800;overflow-y: hidden;padding: 7rem 3rem 5rem;transition: .5s;display: block;}
  #menu ul {margin: 0 0 7rem 0;transition-delay: .2s;}
  #menu ul li {border-bottom: 1px solid rgba(0,0,0,.05);position: relative;}
  #menu ul li a {color: #333;padding: 1rem 2rem;display: inline-block;width: 90%;font-weight: bold;}
  #menu ul li a:hover {background: none; color:#01a039}
  #menu ul li i {line-height: 2.2rem;font-size: 1.4rem;display: none;width: 2.2rem;transform: translateY(0);color: #333;position: absolute;right: 0;top: 3rem;cursor: pointer;}
  #menu ul li.cur i,#menu ul li.current i {display: inline-block;}
  #menu ul li.cur .fa-angle-down { display: inline-block;transform: rotate(90deg);}
  #menu ul li.on { background: rgba(255,255,255,.05);}
  #menu ul li.on a {color: #333;}
  #menu dl {background: rgba(0,0,0,.02);display: none;}
  #menu dl dd { border-bottom: 1px solid rgba(0,0,0,.05);}
  #menu dl dd a {color: #555;display: block;padding: .5rem 1.5rem;font-weight: normal;}
  #menu dl dd i {padding: 0 6.5rem 0 0;font-size: 1.4rem;}
  .header_active #menu {transform: translateY(0);}
 
 }
 @media (max-width:768px) {
  .hidden-xs{ display: none;}
  .visible-xs{ display: block;}
   h1 { font-size:3.6rem}
   h2{ font-size: 2rem;}
  .top-xs{ height:4rem}
  .top-xs .logo img{height: 4rem;width: auto !important;}
   
 }