@keyframes arrow1Go{
    0%{ bottom: -8px;}
    25%{bottom: -11px;}
    50%{bottom: -8px;}
    75%{bottom: -5px;}
    100%{bottom: -8px;}
  }
  @-ms-keyframes arrow1Go{
    0%{ bottom: -8px;}
    25%{bottom: -11px;}
    50%{bottom: -8px;}
    75%{bottom: -5px;}
    100%{bottom: -8px;}
  }
  @-moz-keyframes arrow1Go{
    0%{ bottom: -8px;}
    25%{bottom: -11px;}
    50%{bottom: -8px;}
    75%{bottom: -5px;}
    100%{bottom: -8px;}
  }
  @-webkit-keyframes arrow1Go{
    0%{ bottom: -8px;}
    25%{bottom: -11px;}
    50%{bottom: -8px;}
    75%{bottom: -5px;}
    100%{bottom: -8px;}
  }
  @-o-keyframes arrow1Go{
    0%{ bottom: -8px;}
    25%{bottom: -11px;}
    50%{bottom: -8px;}
    75%{bottom: -5px;}
    100%{bottom: -8px;}
  }
  @keyframes arrow2Go{
    0%{ bottom: 0px;}
    25%{bottom: -3px;}
    50%{bottom: 0px;}
    75%{bottom: 3px;}
    100%{bottom: 0px;}
  }
  @-ms-keyframes arrow2Go{
    0%{ bottom: 0px;}
    25%{bottom: -3px;}
    50%{bottom: 0px;}
    75%{bottom: 3px;}
    100%{bottom: 0px;}
  }
  @-moz-keyframes arrow2Go{
    0%{ bottom: 0px;}
    25%{bottom: -3px;}
    50%{bottom: 0px;}
    75%{bottom: 3px;}
    100%{bottom: 0px;}
  }
  @-webkit-keyframes arrow2Go{
    0%{ bottom: 0px;}
    25%{bottom: -3px;}
    50%{bottom: 0px;}
    75%{bottom: 3px;}
    100%{bottom: 0px;}
  }
  @-o-keyframes arrow2Go{
    0%{ bottom: 0px;}
    25%{bottom: -3px;}
    50%{bottom: 0px;}
    75%{bottom: 3px;}
    100%{bottom: 0px;}
  }
  
  /*   ----------------------------------------------------------------------------------------------------------------- AniAlpha  0-1  --------*/
  @keyframes AniAlpha{
    0%{ opacity: 0;}
    100%{opacity: 1;}
  }
  @-webkit-keyframes AniAlpha{
    0%{ opacity: 0;}
    100%{opacity: 1;}
  }
  /*   ----------------------------------------------------------------------------------------------------------------- AniAlpha_2 0-1-0   --------*/
  
  @keyframes AniAlpha_2{
    0%{ opacity: 0;}
    25%{opacity: 1;}
    50%{ opacity: 0;}
    75%{opacity: 1;}
    100%{opacity: 0;}
  }
  @-webkit-keyframes AniAlpha_2{
    0%{ opacity: 0;}
    25%{opacity: 1;}
    50%{ opacity: 0;}
    75%{opacity: 1;}
    100%{opacity: 0;}
  }
  /*   ----------------------------------------------------------------------------------------------------------------- AniAlpha_3 0-1-0   --------*/
  
  @keyframes AniAlpha_3{
    0%{ opacity: 0.2;}
    25%{opacity: 1;}
    50%{ opacity: 0.2;}
    75%{opacity: 1;}
    100%{opacity: 0.2;}
  }
  @-webkit-keyframes AniAlpha_3{
    0%{ opacity:0.2;}
    25%{opacity: 1;}
    50%{ opacity: 0.2;}
    75%{opacity: 1;}
    100%{opacity: 0.2;}
  }
  
  /*   ----------------------------------------------------------------------------------------------------------------- AniTop   从上往下位移 --------*/
  @keyframes AniTop{
      /* 0%{ opacity: 0;transform: translate(0, -30px);}
      100%{opacity: 1;transform: translate(0, 0);} */
      
      0%{ opacity: 0;transform: translate3d(0, -60px,0);}
      100%{opacity: 1;transform: translate3d(0, 0, 0);}
  }
  @-webkit-keyframes AniTop{
      /* 0%{ opacity: 0;transform: translate(0, -30px);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: translate3d(0, -60px,0);}
      100%{opacity: 1;transform: translate3d(0, 0, 0);}
  }
  @keyframes AniTop2{
      /* 0%{ opacity: 0;transform: translate(0, -30px);}
      100%{opacity: 1;transform: translate(0, 0);} */
      
      0%{ opacity: 0;transform: translate3d(0, -30px,0);}
      100%{opacity: 1;transform: translate3d(0, 0, 0);}
  }
  @-webkit-keyframes AniTop2{
      /* 0%{ opacity: 0;transform: translate(0, -30px);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: translate3d(0, -30px,0);}
      100%{opacity: 1;transform: translate3d(0, 0, 0);}
  }
  
  
  
  /*   ----------------------------------------------------------------------------------------------------------------- AniBottom   从下往上位移 --------*/
  @keyframes AniBottom{
      /* 0%{ opacity: 0;transform: translate(0, 30px);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: translate3d(0, 30px,0);}
      100%{opacity: 1;transform: translate3d(0, 0, 0);}
  }
  @-webkit-keyframes AniBottom{
      /* 0%{ opacity: 0;transform: translate(0, 30px);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: translate3d(0, 30px,0);}
      100%{opacity: 1;transform: translate3d(0, 0, 0);}
  }
  
  
  /*   ----------------------------------------------------------------------------------------------------------------- AniLeft   从左往右位移 --------*/
  
  @keyframes AniLeft{
      /* 0%{ opacity: 0;transform: translate(-30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: translate3d(-60px, 0,0);}
      100%{opacity: 1;transform: translate3d(0, 0, 0);}
  }
  @-webkit-keyframes AniLeft{
      /* 0%{ opacity: 0;transform: translate(-30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: translate3d(-60px, 0,0);}
      100%{opacity: 1;transform: translate3d(0, 0, 0);}
  }
  
  /*   ----------------------------------------------------------------------------------------------------------------- AniRight_2   从右往左位移      大距离--------*/
  
  @keyframes AniRight_2{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: translate3d(60px, 0,0);}
      100%{opacity: 1;transform: translate3d(0, 0, 0);}
  }
  @-webkit-keyframes AniRight_2{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: translate3d(60px, 0,0);}
      100%{opacity: 1;transform: translate3d(0, 0, 0);}
  }
  /*   ----------------------------------------------------------------------------------------------------------------- AniRight   从右往左位移      小距离--------*/
  
  @keyframes AniRight{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: translate3d(60px, 0,0);}
      100%{opacity: 1;transform: translate3d(0, 0, 0);}
  }
  @-webkit-keyframes AniRight{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: translate3d(60px, 0,0);}
      100%{opacity: 1;transform: translate3d(0, 0, 0);}
  }
  
  /*   ----------------------------------------------------------------------------------------------------------------- Zoom   --------*/
  
  @keyframes Zoom{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: translate3d(30px, 0,0) scale(0.5);}
      100%{opacity: 1;transform: translate3d(0, 0, 0) scale(1);}
  }
  @-webkit-keyframes Zoom{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: translate3d(30px, 0,0) scale(0.5);}
      100%{opacity: 1;transform: translate3d(0, 0, 0) scale(1);}
  }
  
  /*   ----------------------------------------------------------------------------------------------------------------- Rotation_L   左旋转 出现   --------*/
  
  @keyframes Rotation_L{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: scale(0.8) rotateZ(45deg) ;}
      100%{opacity: 1;transform:scale(1) rotateZ(0deg) }
  }
  @-webkit-keyframes Rotation_L{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform:scale(0.8) rotateZ(45deg) ;}
      100%{opacity: 1;transform:scale(1) rotateZ(0deg) }
  }
  
  
  /*   ----------------------------------------------------------------------------------------------------------------- Rotation_R   右旋转 出现   --------*/
  
  }@keyframes Rotation_R{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: translate3d(-60px, 0,0) scale(0.5) rotateZ(-80deg) ;}
      100%{opacity: 1;transform: translate3d(0, 0, 0) scale(1) rotateZ(0deg) }
  }
  @-webkit-keyframes Rotation_R{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0;transform: translate3d(-60px, 0,0) scale(0.5) rotateZ(-80deg) ;}
      100%{opacity: 1;transform: translate3d(0, 0, 0) scale(1) rotateZ(0deg) }
  }
  
  
  /*   ----------------------------------------------------------------------------------------------------------------- Flicker   --------*/
  
  @keyframes Flicker{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0.8;transform: scale(0.8) rotateZ(-0deg) ;}
      50%{ opacity: 1;transform: scale(1) rotateZ(8deg) ;}
      100%{opacity: 0.8;transform:scale(0.8) rotateZ(0deg); }
  }
  @-webkit-keyframes Flicker{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
      0%{ opacity: 0.8;transform:scale(0.8) rotateZ(0deg) ;}
      50%{ opacity: 1;transform:scale(1) rotateZ(8deg) ;}
      100%{opacity: 0.8;transform:scale(0.8)  rotateZ(0deg); }
  }
  
  /*   ----------------------------------------------------------------------------------------------------------------- Bottom_2  上下动  大距离--------*/
  @keyframes Bottom_2{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
    0%{transform:translate3d(0,0,0);}
    25%{transform:translate3d(0,-80px,0);}
    50%{transform:translate3d(0,0,0);}
    75%{transform:translate3d(0,-100px,0);}
    100%{transform:translate3d(0,0,0);}
  }
  @-webkit-keyframes Bottom_2{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
    0%{transform:translate3d(0,0,0);}
    25%{transform:translate3d(0,-100px,0,);}
    50%{transform:translate3d(0,0,0);}
    75%{transform:translate3d(0,-80px,0);}
    100%{transform:translate3d(0,0,0);}
  }
  
  /*   ----------------------------------------------------------------------------------------------------------------- Bottom_3  上下动   小距离--------*/
  @keyframes Bottom_3{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
    0%{transform:translate3d(0,0,0);}
    25%{transform:translate3d(0,-25px,0);}
    50%{transform:translate3d(0,0,0);}
    75%{transform:translate3d(0,-50px,0);}
    100%{transform:translate3d(0,0,0);}
  }
  @-webkit-keyframes Bottom_3{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
    0%{transform:translate3d(0,0,0);}
    25%{transform:translate3d(0,-50px,0,);}
    50%{transform:translate3d(0,0,0);}
    75%{transform:translate3d(0,-25px,0);}
    100%{transform:translate3d(0,0,0);}
  }
  
  /*   ----------------------------------------------------------------------------------------------------------------- Bottom_4  左右动 --------*/
  @keyframes Bottom_4{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
  
    0%{transform:translate3d(0,0,0);}
    25%{transform:translate3d(-60px,0,0);}
    50%{transform:translate3d(0,0,0);}
    75%{transform:translate3d(-80px,0,0);}
    100%{transform:translate3d(0,0,0);}
  }
  @-webkit-keyframes Bottom_4{
      /* 0%{ opacity: 0;transform: translate(30px, 0);}
      100%{opacity: 1;transform: translate(0, 0);} */
    0%{transform:translate3d(0,0,0);}
    25%{transform:translate3d(-80px,0,0);}
    50%{transform:translate3d(0,0,0);}
    75%{transform:translate3d(-60px,0,0);}
    100%{transform:translate3d(0,0,0);}
  }
  @keyframes rotateC{
    0%{transform:rotate(0deg);}
    50%{transform:rotate(180deg);}
    100%{transform:rotate(360deg);}
  }
  @-webkit-keyframes rotateC{
    0%{transform:rotate(0deg);}
    50%{transform:rotate(180deg);}
    100%{transform:rotate(360deg);}
  }
  @keyframes rotatD{
    0%{transform:rotate(0deg);}
    50%{transform:rotate(-180deg);}
    100%{transform:rotate(-360deg);}
  }
  @-webkit-keyframes rotateD{
    0%{transform:rotate(0deg);}
    50%{transform:rotate(-180deg);}
    100%{transform:rotate(-360deg);}
  }
  @keyframes rotateIn{
    0%{opacity: 0;transform: rotateY(-150deg)}
    100%{opacity: 1;transform:rotateY(0)}
  }
  @-webkit-keyframes rotateIn{
    0%{opacity: 0;transform: rotateY(-150deg)}
    100%{opacity: 1;transform:rotateY(0)}
  }
  @keyframes rotateIn2{
    0%{opacity: 0;transform: rotate(15deg)}
    100%{opacity: 1;transform:rotate(0)}
  }
  @-webkit-keyframes rotateIn2{
    0%{opacity: 0;transform: rotateZ(15deg)}
    100%{opacity: 1;transform:rotateZ(0)}
  }
  @keyframes rotateUp{
    0%{transform: rotate(0deg) }
    25%{transform: rotate(10deg)}
    50%{transform: rotate(0deg) }
    75%{;transform: rotate(-10deg) }
    100%{transform:rotate(0deg)}
  }
  @-webkit-keyframes rotateUp{
    0%{transform: rotate(0deg) }
    25%{transform: rotate(10deg)}
    50%{transform: rotate(0deg) }
    75%{;transform: rotate(-10deg) }
    100%{transform:rotate(0deg)}
  }
  @keyframes rotateDown{
    0%{transform: rotate(0deg)}
    25%{transform: rotate(-15deg)}
    50%{transform: rotate(0deg) }
    75%{;transform: rotate(15deg)}
    100%{transform:rotate(0deg)}
  }
  @-webkit-keyframes rotateDown{
    0%{transform: rotate(0deg)}
    25%{transform: rotate(15deg)}
    50%{transform: rotate(0deg) }
    75%{;transform: rotate(-15deg) }
    100%{transform:rotate(0deg))}
  }
  @keyframes rotateAll{
    0%{transform: rotateZ(0deg)}
    50%{transform: rotateZ(180deg) }
    100%{transform:rotateZ(360deg)}
  }
  @-webkit-keyframes rotateAll{
      0%{transform:  rotateZ(0deg);}
      50%{transform:  rotateZ(180deg);}
      100%{transform: rotateZ(360deg) }
  }
  @keyframes rotateAll2{
    0%{transform: rotateZ(0deg)}
    50%{transform: rotateZ(-180deg) }
    100%{transform:rotateZ(-360deg)}
  }
  @-webkit-keyframes rotateAll2{
      0%{transform:  rotateZ(0deg);}
      50%{transform:  rotateZ(-180deg);}
      100%{transform: rotateZ(-360deg) }
  }
  @keyframes SlDown{
    0%{transform: translate3d(30,0,0)}
    100%{transform: translate3d(0,0,0)}
  }
  @-webkit-keyframes SlDown{
    0%{transform: translate3d(0,0,0)}
    100%{transform: translate3d(30,0,0)}
  }
  @keyframes upAndDown{
    0%{transform: translate3d(-20px,40px,0);opacity: 0;}
    100%{transform: translate3d(0,0,0);opacity: 1;}
  }
  @-webkit-keyframes upAndDown{
    0%{transform: translate3d(-20px,40px,0);opacity: 0;}
    100%{transform: translate3d(0,0,0);opacity: 1;}
  }
  @keyframes upAndDown2{
    0%{transform: translate3d(20px,-40px,0);opacity: 0;}
    100%{transform: translate3d(0,0,0);opacity: 1;}
  }
  @-webkit-keyframes upAndDown2{
    0%{transform: translate3d(20px,-40px,0);opacity: 0;}
    100%{transform: translate3d(0,0,0);opacity: 1;}
  }
  @keyframes yaobai{
    0%{transform: translate3d(0,0px,0) scale(1) rotate(0deg)}
    25%{transform: translate3d(0,6px,0) scale(1.2) rotate(-10deg) }
    50%{transform: translate3d(0,6px,0)  scale(1.3) rotate(0)}
    75%{transform: translate3d(0,6px,0)  scale(1.2) rotate(10deg)}
    100%{transform: translate3d(0,0,0)  scale(1) rotate(0deg)}
  }
  @-webkit-keyframes yaobai{
    0%{transform: translate3d(0,0px,0) scale(1) rotate(0deg)}
    25%{transform: translate3d(0,6px,0) scale(1.2) rotate(-10deg) }
    50%{transform: translate3d(0,6px,0)  scale(1.3) rotate(0)}
    75%{transform: translate3d(0,6px,0)  scale(1.2) rotate(10deg)}
    100%{transform: translate3d(0,0,0)  scale(1) rotate(0deg)}
  }
  @keyframes shanshuo{
    0%{opacity: 1;transform:scale(1)}
    50%{opacity: 0.6;transform:scale(1.15)}
    100%{opacity: 1;transform:scale(1)}
  }
  @-webkit-keyframes shanshuo{
    0%{opacity: 1;transform:scale(1)}
    50%{opacity: 0.3;transform:scale(1.15)}
    100%{opacity: 1;transform:scale(1)}
  }
  @keyframes shanshuo3{
    0%{opacity: 1;transform:scale(1)}
    50%{opacity: 0.3;transform:scale(1)}
    100%{opacity: 1;transform:scale(1)}
  }
  @-webkit-keyframes shanshuo3{
    0%{opacity: 1;transform:scale(1)}
    50%{opacity: 0.3;transform:scale(1)}
    100%{opacity: 1;transform:scale(1)}
  }
  @keyframes zoomIn{
    0%{transform:scale(0.8);opacity: 0}
    100%{transform:scale(1);opacity: 1}
  }
  @-webkit-keyframes zoomIn{
    0%{transform:scale(0.8);opacity: 0}
    100%{transform:scale(1);opacity: 1}
  }
  @keyframes zoomIn2{
    0%{transform:scale(1.2);opacity: 0}
    100%{transform:scale(1);opacity: 1}
  }
  @-webkit-keyframes zoomIn2{
    0%{transform:scale(1.2);opacity: 0}
    100%{transform:scale(1);opacity: 1}
  }
  @keyframes zoomIn3{
    0%{transform:scale(1.05);opacity: 0}
    45%{transform:scale(0.8);opacity: 0.8}
    100%{transform:scale(1);opacity: 1}
  }
  @-webkit-keyframes zoomIn3{
    0%{transform:scale(1.05);opacity: 0}
    45%{transform:scale(0.8);opacity: 0.8}
    100%{transform:scale(1);opacity: 1}
  }
  /*@keyframes rotateIn{*/
    /*0%{transform:rotate(-30deg)translate3d(30px,-60px,0);opacity: 0}*/
    /*100%{transform:rotate(0deg)translate3d(0,0px,0);opacity: 1}*/
  /*}*/
  /*@-webkit-keyframes rotateIn{*/
    /*0%{transform:rotate(-30deg)translate3d(30px,-60px,0);opacity: 0}*/
    /*100%{transform:rotate(0deg)translate3d(0,0px,0);opacity: 1}*/
  /*}*/