.index{
  background: #F6F8FA;
  margin-top: .56rem
}
.appTop { 
  position: fixed;
  top:0;
  left:0;
  z-index: 9090;
  width: 100%;
  box-shadow: 0 6px 23px 0 rgba(0, 0, 0, 0.1);
 }
.wbg{
 background: #fff
}
.appBottom{
  padding-bottom: .39rem
}
.indexBannerArea{  position: relative;}
.banner{
  position: relative;
}
.banner img{ 
  width: 100%; 
  height: auto; 
}
.bannerTry{
  position: absolute;
  bottom:1.1rem;
  left:50%;
  margin-left: -1.5rem
}
.swiper-container-horizontal>.swiper-pagination-bullets{
  bottom: .9rem
}
.swiper-pagination-bullet{
  opacity: 0.3;
  background: #FFF;
  width: 6px;
  height: 6px;
}
.swiper-pagination-bullet-active{
  background: #fff;
  width: 21px;
  opacity: 1;
  border-radius: 3px;
  transition: .3s
}
.bannerSub{
  display: flex;
  background: rgba(0, 0, 0, 0.1);
  text-align: center;
  position: absolute;
  height: .8rem;
  width: 100%;
  bottom:0;
  left: 0;
  z-index: 1
}
.bannerSub a {
  width: 33%;
  color: #FFF;
  padding-top:.21rem;
}
.bannerSub dl dt{
  font-size: .14rem;
  border-right:rgba(255, 255, 255, 0.1) 1px solid;
  font-weight: normal;
}
.bannerSub dl dd{
  font-size: .1rem;
  border-right:rgba(255, 255, 255, 0.1) 1px solid;
  line-height: .23rem
}
.bannerSub dl:nth-child(3) dt,.bannerSub dl:nth-child(3) dd{
  border-right: none
}
.indexBannerArea .spinner{ z-index: -1}
#indexBannerCon{ min-height: 1.76rem }
.indexBanner img{ width: 100%; height: auto}
.tryBtn{
  width: 2.9rem;
  height: .4rem;
  line-height: .4rem;
  margin: 0 auto;
  background: #00CCC5;
  border-radius: 2px;
  text-align: center;
}
.tryBtn a{
  display: block;
  font-size: .16rem;
  color: #FFF;
}
.tit{
  text-align: center;
  padding:.2rem 0;
}
.tit h3{
  font-size: .2rem;
  color: #212121;
  margin-bottom: .1rem
}
.tit p{
  font-size: .14rem;
  color: #666;
  line-height: .23rem
}
.productNav{
  top: .56rem;
  display: -webkit-box;
  overflow-x: scroll;
  -webkit-overflow-scrolling:touch;
  overflow-scrolling:touch;
  width: 100%;
  z-index: 9091;
}
.productNav::-webkit-scrollbar{
  display:none
}
.productNav p{
  padding: .1rem .1rem 0 .1rem;
  background: #fff;

  border-bottom: #E6E6E6 1px solid; 
}
.productNav p span{
  padding-bottom:.1rem;
  display: block;
}
.productNav p.active span{ 
  color: #00CCC5;
  border-bottom: #00CCC5 2px solid

}
.productItem{
  padding:.18rem .2rem .28rem .2rem;
}
.productItem.wbg{
  margin-top: .2rem;
  padding-bottom: .49rem
}
.productItemMore{
  display: none;
}
.productItem .img img{
  width: 100%;
  height: auto;

}
.productItem li{
  font-size: .16rem;
  color: #212121;
  margin:.1rem 0;
}
.productItem li.dep{
  font-size: .14rem;
  color: #666;
  line-height: .22rem;
}
.productExp{
  display: flex;
  justify-content: flex-start;
}
.productExp a,.productExpOne a{
  font-size: .16rem;
  width: 1.63rem;
  height: .4rem;
  line-height: .4rem;
  border-radius: 2px;
  text-align: center;
  display: block;
}
.productExp a:nth-child(1),.productExpOne a{
  border:#00CCC5 1px solid;
  color: #00CCC5;
  margin-right: .2rem
}
.productExpOne a{ width: 100% }
.productExp a:nth-child(2){
  background: #00CCC5;
  border:#00CCC5 1px solid;
  color: #fff;
}
.productMore{ 
  text-align: center;
  margin: .19rem 0
 }
.productMore a{
  padding-right: .23rem;
  background:url('../images/more.png') no-repeat right center;
  background-size: .16rem;
  font-size: .16rem;
  color: #017EE1;
}
.way{
  background: #1B2653;
}
.way .tit h3,.way .tit p{
  color: #fff
}
.wayCon {
  display: flex;
  justify-content: flex-start;
  flex-wrap:wrap;
}
.wayCon div{
  width: 1.63rem;
  text-align: center;
  margin:0 0 .23rem .1rem;
  padding-bottom: .1rem;
  background: #fff
}
.wayCon div:nth-child(odd){
  margin-left:.2rem;
}
.wayCon div dl dt img{
  width: 1.63rem;
  height: 1.3rem
}
.wayCon div dl dd:nth-child(2){
  font-size: .14rem;
  margin:.12rem 0 .06rem 0;
  color: #000;
}
.wayCon div dl dd:nth-child(3){
  font-size: .12rem;
  color: #00CCC5;
}
.reason{
  padding:.2rem 0;
}
.reasonCon{
  width: 3.43rem;
  margin:0 auto; 
}
.reasonCon div{
  color: #fff;
  width: 3.43rem;
  height: 1.92rem;
  margin-bottom: .16rem;
}
.reasonCon div:nth-child(1){
  background: url('../images/reason1.png');
  background-size: cover;
}
.reasonCon div:nth-child(2){
  background: url('../images/reason2.png');
  background-size: cover;
}
.reasonCon div:nth-child(3){
  background: url('../images/reason3.png');
  background-size: cover;
}
.reasonCon div:nth-child(4){
  background: url('../images/reason4.png');
  background-size: cover;
}
.reasonCon div dl{
  width: 2.97rem;
  margin: 0 auto;
}
.reasonCon div dl dt{
   text-align: center;
   font-size: .16rem;
   padding:.36rem 0 .1rem 0;
}
.reasonCon div dl dd{
  font-size: .14rem;
  line-height: .22rem
}
.caseCon{
  overflow-x: scroll;
  display: flex;
  justify-content: flex-start
}
.caseCon dl{
  width: 3.27rem;
  height: 4.31rem;
  margin: .2rem 0 .2rem .2rem;
  box-shadow:0px 0px 10px rgba(0, 0, 0, 0.1);
  background: #fff
}
.caseCon dl img{
  width: 3.27rem;
  height: 1.86rem;
}
.caseCon dl dd{
  font-size: .14rem;
  color: #666;
  line-height: .23rem;
  margin-top: .1rem;
  padding: 0 .2rem
}
.caseCon dl dd:nth-child(2) {
  font-size: .2rem;
  color: #212121;
}
.caseMore{ 
text-align: center;
 }
.caseMore a{
  font-size: .16rem;
  color: #999;
  padding-right: .23rem;
  background:url('../images/jump.png') no-repeat right center;
  background-size: .16rem
}
.honor{
  margin-top: .2rem;
  padding-bottom:.2rem 
}
.honorCon{
  display: flex;
  justify-content: space-around;
  flex-wrap:wrap;
}
.honorCon dl{
  width: 1.63rem;
  text-align: center;
  margin-top: .2rem;
}
.honorCon dl img{
  width: 1.62rem;
  height: .82rem;
  box-shadow:0px 0px 10px rgba(0, 0, 0, 0.1)
}
.honorCon dl dd{
  font-size: .12rem;
  color: #999;
  line-height: .19rem;
  margin-top:.1rem;
}
.nowReg{
  height: 1.58rem;
  background: url('../images/nowreg.png');
  background-size: cover;
  text-align: center;
}
.nowReg p:nth-child(1){
  font-size: .2rem;
  color: #FFF;
  padding:.4rem 0 .2rem 0;
}
.indexPhone{ 
	position: fixed; 
	top: 50%;
	right:0; 
	width:51px;
	height: 51px;
	background:#0073ff url('../images/tel.svg') no-repeat center;
	box-shadow:0px 0px 10px #0073ff;
}
.indexPhone {-webkit-animation:rightInOut 1s ease forwards;-moz-animation:rightInOut 1s ease forwards;animation:rightInOut 1s ease forwards;}
.indexPhone a{ display: block; width: 100%; height: 100%;}
@-webkit-keyframes leftInOut {
    from{
      -webkit-transform:translate(-600px);
    }
    to{
      -webkit-transform:translate(0px);
    }
}
@-moz-keyframes leftInOut {
    from{
      -moz-transform:translate(-600px);
    }
    to{
      -moz-transform:translate(0px);
    }
}
@keyframes leftInOut {
    from{
      transform:translate(-600px);
    }
    to{
      transform:translate(0px);
    }
}
@-webkit-keyframes rightInOut {
    from{
      -webkit-transform:translate(600px);
    }
    to{
      -webkit-transform:translate(0px);
    }
}
@-moz-keyframes rightInOut {
    from{
      -moz-transform:translate(600px);
    }
    to{
      -moz-transform:translate(0px);
    }
}
@keyframes rightInOut {
    from{
      transform:translate(600px);
    }
    to{
      transform:translate(0px);
    }
}
@-webkit-keyframes scaleInOut {
    from,50%,to{
      -webkit-transform:scale(1);
    }
    29%,76%{
      -webkit-transform:scale(1.1);
    }
}
@-moz-keyframes scaleInOut {
    from,50%,to{
      -moz-transform:scale(1);
    }
    29%,76%{
      -moz-transform:scale(1.1);
    }
}
@keyframes scaleInOut {
    from,50%,to{
      transform:scale(1);
    }
    29%,76%{
      transform:scale(1.1);
    }
}
@-webkit-keyframes scaleUp {
  0% {-webkit-transform: scale(0);}
	100% { -webkit-transform: scale(1); opacity: 1; }
}
@-moz-keyframes scaleUp {
  0% {-moz-transform: scale(0);}
	100% { -moz-transform: scale(1); opacity: 1; }
}
@keyframes scaleUp {
  0% {transform: scale(0);}
	100% { transform: scale(1); opacity: 1; }
}