.gridContainer{
  background-color: #fff;
}
#lp{
    position: absolute;
    width: 100%;
    height: 10.4rem;
    top: 0;
    left: 0;
    z-index: 999;
    background-color: #000;
}
.swiper-slide{overflow: hidden;}
.swiper-slide > img{width: 100%;}
._ab{position: absolute;top: 0;left: 0;}
._op0{opacity: 0;}
._re{position: relative;}
._loadingZ{-webkit-animation: _loading 2s linear infinite;animation: _loading 2s linear infinite}
@-webkit-keyframes _loading
{
    0%   {-webkit-transform:rotate(0deg);}
    100% {-webkit-transform:rotate(360deg);}
}
@keyframes _loading
{
    0%   {transform:rotate(0deg);}
    100% {transform:rotate(360deg);}
}
/*向下的箭头*/
.downLoad{
  width: .52rem;
  height: .37rem;
  position: absolute;
  left: 2.94rem;
  top: 9.36rem;
  z-index: 2;
  background-image: url(../qing/images/arrow.png);
  -webkit-background-size: 100% 100%;
  background-size: 100% 100%;
  display: none;
}
.downLoad{-webkit-animation: topDown 2s infinite;}
@-webkit-keyframes topDown{
  0%{-webkit-transform:translate3d(0,0,0);}
  100% { -webkit-transform:translate3d(0,-50%,0);}
}
.left_right{
    position: absolute;
    top:9rem;
    left:50%;
    margin-left: -1rem;
    width: 2rem;
    height:0.95rem;
    z-index: 99;
    opacity: 0;
}
.left_right.active{
    -webkit-animation:left_right_active 1s linear 2 0s both;
}
@-webkit-keyframes left_right_active{
    0%{-webkit-transform:scale(1);opacity: 0;}
    50%{-webkit-transform:scale(1.2);opacity: 1;}
    100%{-webkit-transform:scale(1);opacity: 0;}
}
.Mp3Con {
    position: absolute;
    right: 5%;
    top: .3rem;
    z-index: 999;
    opacity: 0.5;
    transition: all 2s;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
}
.Mp3ConAnimate {
  animation: roundIng 10s linear infinite;
  -webkit-animation: roundIng 10s linear infinite;
  -moz-animation: roundIng 10s linear infinite;
}
@keyframes roundIng {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes roundIng {
  0% {
    -webkit-transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}
@-moz-keyframes roundIng {
  0% {
    -moz-transform: rotate(0);
  }
  100% {
    -moz-transform: rotate(360deg);
  }
}



/*常用动画*/
@-webkit-keyframes fadeIn
{
    0%  {opacity: 0}
    100%  {opacity: 1}
}
@-webkit-keyframes fadeOut
{
    0%  {opacity: 1}
    100%  {opacity: 0}
}
@-webkit-keyframes leftFadeIn
{
    0%  {-webkit-transform:translate(-.2rem, 0);opacity: 0}
    100%  {-webkit-transform: translate(0, 0);opacity: 1}
}
@-webkit-keyframes bottomFadeIn
{
    0%  {-webkit-transform:translate(0, -.2rem);opacity: 0}
    100%  {-webkit-transform: translate(0, 0);opacity: 1}
}
@-webkit-keyframes rightFadeIn
{
    0%  {-webkit-transform:translate(.2rem, 0);opacity: 0}
    100%  {-webkit-transform: translate(0, 0);opacity: 1}
}
@-webkit-keyframes topFadeIn
{
    0%  {-webkit-transform:translate(0, .2rem);opacity: 0}
    100%  {-webkit-transform: translate(0, 0);opacity: 1}
}


.gridContainer{
    color: #fff;
}
.preloadeImg{
    visibility: hidden;
    height:0rem;
    overflow: hidden;
    position: absolute;
    top:0px;
    left:0rem;
}
.switch{
    position: fixed;
    top:0.22rem;
    right:0.22rem;
    z-index: 99999;
    width: 0.46rem;
    height:0.46rem;
}
/*p0*/
.p0 .bg{
    position: absolute;
    top:0px;
    left:0px;
}
.p0 .p0_top{
    position: absolute;
    top:0.8rem;
    left:50%;
    width: 4.96rem;
    -webkit-transform:translate3d(-50%,0rem,0rem);
    z-index: 20;
}
.p0 .line1{
    position: absolute;
    top: -0.1rem;
    left: -0.4rem;
    width: 2.27rem;
    height:3.87rem;
    z-index: 1;
    -webkit-transform:translate3d(2.27rem,-3.87rem,0rem);
}
.p0.pa .line1{
    -webkit-animation:line1 0.6s ease 0s both;
}
@-webkit-keyframes line1{
    0%{-webkit-transform:translate3d(2.27rem,-3.87rem,0rem);}
    100%{-webkit-transform:translate3d(0rem,0rem,0rem);}
}
.p0 .line2{
    position: absolute;
    top:0.17rem;
    left:5.10rem;
    width: 0.35rem;
    height:0.56rem;
    -webkit-transform:translate3d(0.9rem,-1.07rem,0rem);
}
.p0.pa .line2{
    -webkit-animation:line2 0.4s ease 0.2s both;
}
@-webkit-keyframes line2{
    0%{-webkit-transform:translate3d(0.9rem,-1.07rem,0rem);}
    100%{-webkit-transform:translate3d(0rem,0rem,0rem);}
}
.p0 .line3{
    position: absolute;
    top: -1.6rem;
    right: -1.1rem;
    width: 2.84rem;
    height:4.87rem;
    -webkit-transform:translate3d(1.84rem,-2.87rem,0rem);
}
.p0.pa .line3{
    -webkit-animation:line3 0.4s ease 0.4s both;
}
@-webkit-keyframes line3{
    0%{-webkit-transform:translate3d(1.84rem,-2.87rem,0rem);}
    100%{-webkit-transform:translate3d(0rem,0rem,0rem);}
}
.p0 .middle{
    position: absolute;
    top:3.65rem;
    left:0px;
    width: 6.40rem;
    height: 2.64rem;
    z-index: 5;
    opacity: 0;
}
.p0.pa .middle{
    -webkit-animation:fadeIn 0.6s ease 1s both;
}
.p0 .yuan1{
    position: absolute;
    top: 4.15rem;
    left: -0.4rem;
    width: 3.38rem;
    height:0.96rem;
    z-index: 10;
    -webkit-transform:scale(0);
}
@-webkit-keyframes yuan {
    0%{-webkit-transform:scale(0);}
    100%{-webkit-transform:scale(1);}
}
.p0.pa .yuan1{
    -webkit-animation:yuan 0.6s linear 0.4s both;
}
@-webkit-keyframes person{
    0%{-webkit-transform:rotateX(90deg);}
    100%{-webkit-transform:rotateX(0deg);}
}
.p0 .person1{
    position: absolute;
    left:1.02rem;
    top:4.05rem;
    width: 0.39rem;
    height:0.46rem;
    z-index: 15;
    opacity: 0;
    /*-webkit-transform-origin:bottom;*/
}
.p0.pa .person1{
    -webkit-animation:fadeIn 0.4s linear 0.6s both;
}
.p0 .yuan2{
    position: absolute;
    top:5.41rem;
    left:0.5rem;
    width: 2.63rem;
    height:1.18rem;
    z-index: 10;
    -webkit-transform:scale(0);
}
.p0.pa .yuan2{
    -webkit-animation:yuan 0.4s linear 0.8s both;
}
.p0.pa .person2{
    -webkit-animation:fadeIn 0.4s linear 1s both;
}
.p0 .yuan3{
    position: absolute;
    top:4.80rem;
    left:2.45rem;
    width: 1.44rem;
    height:0.71rem;
    z-index: 10;
    -webkit-transform:scale(0);
}
.p0.pa .yuan3{
    -webkit-animation:yuan 0.4s linear 1.2s both;
}
.p0 .yuan4{
    position: absolute;
    top:5.43rem;
    left:4.39rem;
    width: 0.73rem;
    height:0.34rem;
    z-index: 10;
    -webkit-transform:scale(0);
}
.p0.pa .yuan4{
    -webkit-animation:yuan 0.4s linear 1.4s both;
}
.p0.pa .person3{
    -webkit-animation:fadeIn 0.4s linear 1.6s both;
}
.p0 .yuan5{
    position: absolute;
    top:4.69rem;
    left:4.83rem;
    width: 3.61rem;
    height:1.61rem;
    z-index: 10;
    -webkit-transform:scale(0);
}
.p0.pa .yuan5{
    -webkit-animation:yuan 0.4s linear 1.8s both;
}
.p0 .person2{
    position: absolute;
    left: 1.42rem;
    top: 5.50rem;
    width: 0.84rem;
    height:0.57rem;
    z-index: 15;
    opacity: 0;
}
.p0 .person3{
    position: absolute;
    left:4.60rem;
    top:5.02rem;
    width: 0.46rem;
    height:0.54rem;
    z-index: 15;
}
/*p1*/
.p1 .bg{
    position: absolute;
    top:0rem;
    left:0rem;
}
.p1 .map{
    position: absolute;
    top:1.6rem;
    left:3.8rem;
    width: 10.38rem;
}
.p1.pa .map{
    -webkit-animation:map 6s linear infinite 0s both;
}
@-webkit-keyframes map{
    0%{-webkit-transform:rotate(0deg);}
    100%{-webkit-transform:rotate(360deg);}
}
/*p2*/
.p2 .bg{
    position: absolute;
    top:0rem;
    left:0rem;
}
.p2 .logo1{
    position: absolute;
    /*top:6rem;
    left:1.43rem;*/
    top:6.18rem;
    left:1.57rem;
    width: 1.53rem;
    height:1.38rem;
    -webkit-transform:translate3d(-5rem,0rem,0rem);
}
.p2.pa .logo1{
    -webkit-animation:logo1 0.4s ease 0s both;
}
@-webkit-keyframes logo1{
    0%{-webkit-transform:translate3d(-5rem,0rem,0rem);}
    100%{-webkit-transform:translate3d(0rem,0rem,0rem);}
}
.p2  .logo2{
    position: absolute;
    top:6.18rem;
    left:3.44rem;
    width: 1.56rem;
    height:1.56rem;
    -webkit-transform:translate3d(-5rem,0rem,0rem);
}
.p2.pa .logo2{
    -webkit-animation:logo2 0.4s ease 0s both;
}
@-webkit-keyframes logo2{
    0%{-webkit-transform:translate3d(5rem,0rem,0rem);}
    100%{-webkit-transform:translate3d(0rem,0rem,0rem);}
}
.p2  .logo3{
    position: absolute;
    top:7.8rem;
    left:1.43rem;
    width: 4.22rem;
    height:0.88rem;
    opacity: 0;
}
.p2.pa .logo3{
    -webkit-animation:logo3 0.4s ease 0.2s both;
}
@-webkit-keyframes logo3{
    0%{opacity: 0;}
    100%{opacity: 1;}
}
/*<--p3-->*/
.p3 .bg{
    position: absolute;
    top:0rem;
    left: 0rem;
}
.p3 .wen1{
    position: absolute;
    top:1.00rem;
    left:0.73rem;
    width: 1.54rem;
    height:1.98rem;
    -webkit-transform:scale(0);
}
.p3.pa .wen1{
    -webkit-animation:wen 0.4s ease 0.4s both; 
}
@-webkit-keyframes wen{
    0%{-webkit-transform:scale(0);}
    100%{-webkit-transform:scale(1);}
}
.p3 .wen2{
    position: absolute;
    top:1.00rem;
    left:3.70rem;
    width: 2.43rem;
    height:1.97rem;
    -webkit-transform:scale(0);
}
.p3.pa .wen2{
    -webkit-animation:wen 0.4s ease 0.6s both; 
}
.p3 .wen3{
    position: absolute;
    top:6.64rem;
    left:0.29rem;
    width: 2.82rem;
    height:2.24rem;
    -webkit-transform:scale(0);
}
.p3.pa .wen3{
    -webkit-animation:wen 0.4s ease 0.8s both; 
}
.p3 .wen4{
    position: absolute;
    top:6.64rem;
    left:4.19rem;
    width: 1.80rem;
    height:1.82rem;
    -webkit-transform:scale(0);
}
.p3.pa .wen4{
    -webkit-animation:wen 0.4s ease 1s both; 
}
.p3 .biao1{
    position: absolute;
    top:3.98rem;
    left:2.01rem;
    width: 1.48rem;
    height:1.29rem;
    -webkit-transform:translate3d(-2rem,-2rem,0rem);
}
.p3.pa .biao1{
    -webkit-animation:biao1 0.4s ease 0s both;
}
@-webkit-keyframes biao1 {
    0%{-webkit-transform:translate3d(-2rem,-2rem,0rem);}
    100%{-webkit-transform:translate3d(0rem,0rem,0rem);}
}
.p3 .biao2{
    position: absolute;
    top:3.38rem;
    left:3.06rem;
    width: 1.47rem;
    height:1.29rem;
    -webkit-transform:translate3d(2rem,-2rem,0rem);
}
.p3.pa .biao2{
    -webkit-animation:biao2 0.4s ease 0s both;
}
@-webkit-keyframes biao2 {
    0%{-webkit-transform:translate3d(2rem,-2rem,0rem);}
    100%{-webkit-transform:translate3d(0rem,0rem,0rem);}
}
.p3 .biao3{
    position: absolute;
    top:5.18rem;
    left:2.01rem;
    width: 1.47rem;
    height:1.29rem;
    -webkit-transform:translate3d(-2rem,2rem,0rem);
}
.p3.pa .biao3{
    -webkit-animation:biao3 0.4s ease 0s both;
}
@-webkit-keyframes biao3 {
    0%{-webkit-transform:translate3d(-2rem,2rem,0rem);}
    100%{-webkit-transform:translate3d(0rem,0rem,0rem);}
}
.p3 .biao4{
    position: absolute;
    top: 4.58rem;
    left:3.06rem;
    width: 1.47rem;
    height:1.29rem;
    -webkit-transform:translate3d(2rem,2rem,0rem);
}
.p3.pa .biao4{
    -webkit-animation:biao4 0.4s ease 0s both;
}
@-webkit-keyframes biao4 {
    0%{-webkit-transform:translate3d(2rem,2rem,0rem);}
    100%{-webkit-transform:translate3d(0rem,0rem,0rem);}
}
/*<--p4-->*/
.p4{
  background-color: #009dd7;
}
.p4 .main{

}
.p4 .fly{
  /*position: absolute;
  top: 0;
  left: 0;
  right: 0;*/
  padding-top: 3.12rem;
  /*padding-bottom: 15.12rem;;*/
}
.p4 .p4_left_right{
    margin-top: -1rem;
    margin-bottom:1rem;
    margin-left: 50%;
    -webkit-transform:translate3d(-50%,0rem,0rem);
    width: 2rem;
    height:0.95rem;
    z-index: 99;
}

/*p5*/
.p5 .bg{
    position: absolute;
    top:0rem;
    left:0rem;
}
.p5 .logo1{
    position: absolute;
    top:5.07rem;
    left:0.35rem;
    width: 5.83rem;
    height:0.90rem;
    -webkit-transform:rotateX(-270deg);
}
.p5.pa .logo1{
    -webkit-animation: p5_logo 0.5s ease-out 0s both;
}
@-webkit-keyframes p5_logo{
    0%{-webkit-transform:rotateX(-270deg);}
    100%{-webkit-transform:rotateX(0deg);}
}
.p5 .logo2{
    position: absolute;
    top:6.18rem;
    left:0.35rem;
    width: 5.76rem;
    height:0.76rem;
    -webkit-transform:rotateX(-270deg);
}
.p5.pa .logo2{
    -webkit-animation: p5_logo 0.5s ease-out 0.4s both;
}
.p5 .logo3{
    position: absolute;
    top:7.22rem;
    left:0.35rem;
    width: 5.76rem;
    height:0.52rem;
    -webkit-transform:rotateX(-270deg);
}
.p5.pa .logo3{
    -webkit-animation: p5_logo 0.5s ease-out 0.8s both;
}
.p5 .logo4{
    position: absolute;
    top:7.95rem;
    left:0.35rem;
    width: 5.90rem;
    height:0.59rem;
    -webkit-transform:rotateX(-270deg);
}
.p5.pa .logo4{
    -webkit-animation: p5_logo 0.5s ease-out 1.2s both;
}
.p5 .logo5{
    position: absolute;
    top:8.74rem;
    left:0.35rem;
    width: 5.72rem;
    height:0.98rem;
    -webkit-transform:rotateX(-270deg);
}
.p5.pa .logo5{
    -webkit-animation: p5_logo 0.5s ease-out 1.6s both;
}

/*p6*/
.p6 .bg{
    position: absolute;
    top:0rem;
    left:0rem;
}
.p6 .list1{
    position: absolute;
    top:1.71rem;
    left:0.27rem;
    width: 6.14rem;
    height:1.40rem;
    -webkit-transform:translate3d(6.14rem,0rem,0rem);
}
.p6.pa .list1{
    -webkit-animation:p6_list 0.4s ease 0s both;
}
@-webkit-keyframes p6_list{
    0%{-webkit-transform:translate3d(6.14rem,0rem,0rem);}
    50%{-webkit-transform:translate3d(0rem,0rem,0rem);}
    75%{-webkit-transform:translate3d(0.1rem,0rem,0rem);}
    100%{-webkit-transform:translate3d(0rem,0rem,0rem);}
}
.p6 .list2{
    position: absolute;
    top:3.31rem;
    left:0.27rem;
    width: 6.14rem;
    height:1.45rem;
     -webkit-transform:translate3d(6.14rem,0rem,0rem);
}
.p6.pa .list2{
    -webkit-animation:p6_list 0.4s ease 0.2s both;
}
.p6 .list3{
    position: absolute;
    top:4.97rem;
    left:0.27rem;
    width: 6.14rem;
    height:1.40rem;
    -webkit-transform:translate3d(6.14rem,0rem,0rem);
}
.p6.pa .list3{
    -webkit-animation:p6_list 0.4s ease 0.4s both;
}
.p6 .list4{
    position: absolute;
    top:6.56rem;
    left:0.27rem;
    width: 6.14rem;
    height:1.40rem;
    -webkit-transform:translate3d(6.14rem,0rem,0rem);
}
.p6.pa .list4{
    -webkit-animation:p6_list 0.4s ease 0.6s both;
}
.p6 .list5{
    position: absolute;
    top:8.15rem;
    left:0.27rem;
    width: 5.72rem;
    height:1.40rem;
    -webkit-transform:translate3d(6.14rem,0rem,0rem);
}
.p6.pa .list5{
    -webkit-animation:p6_list 0.4s ease 0.8s both;
}
/*p7*/
.p7 .bg{
    position: absolute;
    top:0rem;
    left:0rem;
}
.p7 .erweima{
    position: absolute;
    top:0.94rem;
    left:0.96rem;
    width: 4.48rem;
    height:5.52rem;
}
.p7 .logo{
    position: absolute;
    top:2.74rem;
    left:2.76rem;
    width: 0.96rem;
    height:0.96rem;
}
.p7.pa .logo{
    -webkit-animation:p7_logo 0.8s ease 0s both;
}
@-webkit-keyframes p7_logo{
    0%{-webkit-transform:scale(1);}
    33.33%{-webkit-transform:scale(1.2);}
    66.66%{-webkit-transform:scale(0.9);}
    100%{-webkit-transform:scale(1);}
}
.p7 .tel{
    position: absolute;
    top:5.14rem;
    width: 100%;
    text-align: center;
    font-size: 0.22rem;
    color:#333333;
}
.p7 .kefu{
    position: absolute;
    top:5.58rem;
    width: 100%;
    text-align: center;
    font-size: 0.20rem;
    color:#333333;
}
.p7 .xiaoshou{
    position: absolute;
    top:6.03rem;
    width: 100%;
    text-align: center;
    font-size: 0.20rem;
    color:#333333;
}