@charset "utf-8";

@keyframes baseinner {
  from {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

@-webkit-keyframes baseinner {
  from {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

@keyframes lightcx {
  from {
    opacity: 0;
    transform: translateY(350px) scale(0)
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1)
  }
}

@-webkit-keyframes lightcx {
  from {
    opacity: 0;
    transform: translateY(350px) scale(0)
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1)
  }
}

@-webkit-keyframes stoneAi1 {
  from {
    opacity: 0;
    -webkit-transform: translateX(-150px)
  }

  to {
    opacity: 1;
    -webkit-transform: translateX(0)
  }
}

@keyframes stoneAi1 {
  from {
    opacity: 0;
    transform: translateX(-150px)
  }

  to {
    opacity: 1;
    transform: translateX(0)
  }
}

@-webkit-keyframes stoneAi2 {
  from {
    opacity: 0;
    -webkit-transform: translateX(150px)
  }

  to {
    opacity: 1;
    -webkit-transform: translateX(0)
  }
}

@keyframes stoneAi2 {
  from {
    opacity: 0;
    transform: translateX(150px)
  }

  to {
    opacity: 1;
    transform: translateX(0)
  }
}

@-webkit-keyframes left_right_frame {
  0% {
    -webkit-transform: rotateY(-2deg)
  }

  100% {
    -webkit-transform: rotateY(2deg)
  }
}

@keyframes left_right_frame {
  0% {
    transform: rotateY(-2deg)
  }

  100% {
    transform: rotateY(2deg)
  }
}

@keyframes ciclescale {
  from {
    -moz-transform: scale(0, 0);
    -webkit-transform: scale(0, 0);
    transform: scale(0, 0)
  }

  to {
    -moz-transform: scale(1, 1);
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    opacity: 1
  }
}

@-webkit-keyframes ciclescale {
  from {
    -moz-transform: scale(0, 0);
    -webkit-transform: scale(0, 0);
    transform: scale(0, 0)
  }

  to {
    -moz-transform: scale(1, 1);
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    opacity: 1
  }
}

.animate .object1 {
  animation: animateObj1 500ms linear 800ms forwards;
  -webkit-animation: animateObj1 500ms linear 800ms forwards;
  -moz-animation: animateObj1 500ms linear 800ms forwards
}

.animate .object2 {
  animation: animateObj2 500ms linear 800ms forwards;
  -webkit-animation: animateObj2 500ms linear 800ms forwards;
  -moz-animation: animateObj2 500ms linear 800ms forwards
}

.animate .object3 {
  animation: animateObj3 500ms linear 800ms forwards;
  -webkit-animation: animateObj3 500ms linear 800ms forwards;
  -moz-animation: animateObj3 500ms linear 800ms forwards
}

.animate .object4 {
  animation: animateObj4 500ms linear 800ms forwards;
  -webkit-animation: animateObj4 500ms linear 800ms forwards;
  -moz-animation: animateObj4 500ms linear 800ms forwards
}

.animate .object5 {
  animation: animateObj5 500ms linear 800ms forwards;
  -webkit-animation: animateObj5 500ms linear 800ms forwards;
  -moz-animation: animateObj5 500ms linear 800ms forwards
}

.animate .object6 {
  animation: animateObj6 500ms linear 800ms forwards;
  -webkit-animation: animateObj6 500ms linear 800ms forwards;
  -moz-animation: animateObj6 500ms linear 800ms forwards
}

.animate .object7 {
  animation: animateObj7 500ms linear 800ms forwards;
  -webkit-animation: animateObj7 500ms linear 800ms forwards;
  -moz-animation: animateObj7 500ms linear 800ms forwards
}

.animate .object8 {
  animation: animateObj8 500ms linear 800ms forwards;
  -webkit-animation: animateObj8 500ms linear 800ms forwards;
  -moz-animation: animateObj8 500ms linear 800ms forwards
}

.animate .object9 {
  animation: animateObj9 500ms linear 800ms forwards;
  -webkit-animation: animateObj9 500ms linear 800ms forwards;
  -moz-animation: animateObj9 500ms linear 800ms forwards
}

.animate .object10 {
  animation: animateObj10 500ms linear 800ms forwards;
  -webkit-animation: animateObj10 500ms linear 800ms forwards;
  -moz-animation: animateObj10 500ms linear 800ms forwards
}

.animate .object11 {
  animation: animateObj11 500ms linear 800ms forwards;
  -webkit-animation: animateObj11 500ms linear 800ms forwards;
  -moz-animation: animateObj11 500ms linear 800ms forwards
}

.animate .object12 {
  animation: animateObj12 500ms linear 800ms forwards;
  -webkit-animation: animateObj12 500ms linear 800ms forwards;
  -moz-animation: animateObj12 500ms linear 800ms forwards
}

.animate .object13 {
  animation: animateObj13 500ms linear 800ms forwards;
  -webkit-animation: animateObj13 500ms linear 800ms forwards;
  -moz-animation: animateObj13 500ms linear 800ms forwards
}

.animate .object14 {
  animation: animateObj14 500ms linear 800ms forwards;
  -webkit-animation: animateObj14 500ms linear 800ms forwards;
  -moz-animation: animateObj14 500ms linear 800ms forwards
}

.animate .object15 {
  animation: animateObj15 500ms linear 800ms forwards;
  -webkit-animation: animateObj15 500ms linear 800ms forwards;
  -moz-animation: animateObj15 500ms linear 800ms forwards
}

.animate .object16 {
  animation: animateObj16 500ms linear 800ms forwards;
  -webkit-animation: animateObj16 500ms linear 800ms forwards;
  -moz-animation: animateObj16 500ms linear 800ms forwards
}

.animate .object17 {
  animation: animateObj17 500ms linear 800ms forwards;
  -webkit-animation: animateObj17 500ms linear 800ms forwards;
  -moz-animation: animateObj17 500ms linear 800ms forwards
}

.animate .object18 {
  animation: animateObj18 500ms linear 800ms forwards;
  -webkit-animation: animateObj18 500ms linear 800ms forwards;
  -moz-animation: animateObj18 500ms linear 800ms forwards
}

.animate .object19 {
  animation: animateObj19 500ms linear 800ms forwards;
  -webkit-animation: animateObj19 500ms linear 800ms forwards;
  -moz-animation: animateObj19 500ms linear 800ms forwards
}

.animate .object20 {
  animation: animateObj20 500ms linear 800ms forwards;
  -webkit-animation: animateObj20 500ms linear 800ms forwards;
  -moz-animation: animateObj20 500ms linear 800ms forwards
}

.animate .object21 {
  animation: animateObj21 500ms linear 800ms forwards;
  -webkit-animation: animateObj21 500ms linear 800ms forwards;
  -moz-animation: animateObj21 500ms linear 800ms forwards
}

.animate .aaa {
  animation: baseinner 500ms linear 1s forwards;
  -webkit-animation: baseinner 500ms linear 1s forwards;
  -moz-animation: baseinner 500ms linear 1s forwards
}

.animate .bbb {
  animation: lightcx 500ms linear 0.7s forwards;
  -webkit-animation: lightcx 500ms linear 0.7s forwards;
  -moz-animation: lightcx 500ms linear 0.7s forwards
}

.animate .base_inner_frame_dh {
  animation: left_right_frame 2s ease-in-out 0.7s infinite alternate;
  -webkit-animation: left_right_frame 2s ease-in-out 0.7s infinite alternate
}

.animate .phone_box {
  animation: txt 400ms linear 0.2s forwards;
  -webkit-animation: txt 400ms linear 0.2s forwards;
  -moz-animation: txt 400ms linear 0.2s forwards
}

@keyframes ball1 {
  from {
    opacity: 0;
    transform: translateY(254px)
  }

  to {
    opacity: 1;
    transform: translateY(0)
  }
}

@-webkit-keyframes ball1 {
  from {
    opacity: 0;
    transform: translateY(254px)
  }

  to {
    opacity: 1;
    transform: translateY(0)
  }
}

@keyframes ball2-1 {
  from {
    opacity: 0;
    margin-top: 266px
  }

  to {
    opacity: 1;
    margin-top: 46px
  }
}

@-webkit-keyframes ball2-1 {
  from {
    opacity: 0;
    margin-top: 266px
  }

  to {
    opacity: 1;
    margin-top: 46px
  }
}

@keyframes ball2-2 {
  from {
    margin-top: 46px
  }

  to {
    margin-top: 76px
  }
}

@-webkit-keyframes ball2-2 {
  from {
    margin-top: 46px
  }

  to {
    margin-top: 76px
  }
}

@keyframes legend {
  from {
    opacity: 0;
    margin-top: -91px
  }

  to {
    opacity: 1;
    margin-top: -211px
  }
}

@-webkit-keyframes legend {
  from {
    opacity: 0;
    margin-top: -91px
  }

  to {
    opacity: 1;
    margin-top: -211px
  }
}

@keyframes item0content {
  from {
    opacity: 0;
    margin-top: 155px
  }

  to {
    opacity: 1;
    margin-top: 35px
  }
}

@-webkit-keyframes item0content {
  from {
    opacity: 0;
    margin-top: 155px
  }

  to {
    opacity: 1;
    margin-top: 35px
  }
}

@keyframes ball3-1 {
  from {
    opacity: 0;
    margin-top: 313px
  }

  to {
    opacity: 1;
    margin-top: 93px
  }
}

@-webkit-keyframes ball3-1 {
  from {
    opacity: 0;
    margin-top: 313px
  }

  to {
    opacity: 1;
    margin-top: 93px
  }
}

@keyframes ball3-2 {
  from {
    margin-top: 93px
  }

  to {
    margin-top: 123px
  }
}

@-webkit-keyframes ball3-2 {
  from {
    margin-top: 93px
  }

  to {
    margin-top: 123px
  }
}

@keyframes ball4 {
  from {
    opacity: 0;
    margin-top: -26px
  }

  to {
    opacity: 1;
    margin-top: -286px
  }
}

@-webkit-keyframes ball4 {
  from {
    opacity: 0;
    margin-top: -26px
  }

  to {
    opacity: 1;
    margin-top: -286px
  }
}

@keyframes scale0to1 {
  from {
    opacity: 0;
    transform: scale(0)
  }

  to {
    opacity: 1;
    transform: scale(1)
  }
}

@-webkit-keyframes scale0to1 {
  from {
    opacity: 0;
    transform: scale(0)
  }

  to {
    opacity: 1;
    transform: scale(1)
  }
}

@keyframes scale1to0 {
  from {
    opacity: 1;
    transform: scale(1)
  }

  to {
    opacity: 0;
    transform: scale(0)
  }
}

@-webkit-keyframes scale1to0 {
  from {
    opacity: 1;
    transform: scale(1)
  }

  to {
    opacity: 0;
    transform: scale(0)
  }
}

@keyframes rotateZ {
  from {
    transform: rotate(0)
  }

  to {
    transform: rotate(360deg)
  }
}

@-webkit-keyframes rotateZ {
  from {
    transform: rotate(0)
  }

  to {
    transform: rotate(360deg)
  }
}

@keyframes rotateF {
  from {
    transform: rotate(0)
  }

  to {
    transform: rotate(-360deg)
  }
}

@-webkit-keyframes rotateF {
  from {
    transform: rotate(0)
  }

  to {
    transform: rotate(-360deg)
  }
}

@keyframes stars {
  0% {
    opacity: 1;
    left: 50%;
    top: -98px;
    transform: translateX(386px)
  }

  79% {
    opacity: 1;
    left: 50%;
    transform: translateX(386px);
    top: -98px
  }

  100% {
    opacity: 0;
    left: 50%;
    transform: translateX(0px);
    top: 177px
  }
}

@-webkit-keyframes stars {
  0% {
    opacity: 1;
    left: 50%;
    top: -98px;
    transform: translateX(386px)
  }

  79% {
    opacity: 1;
    left: 50%;
    transform: translateX(386px);
    top: -98px
  }

  100% {
    opacity: 0;
    left: 50%;
    transform: translateX(0px);
    top: 177px
  }
}

@keyframes starl {
  0% {
    opacity: 1;
    left: 100%;
    top: 50%;
    transform: translateY(-380px)
  }

  72% {
    opacity: 1;
    left: 100%;
    top: 50%;
    transform: translateY(-380px)
  }

  100% {
    opacity: 0;
    left: 50%;
    top: 50%;
    transform: translateY(180px)
  }
}

@-webkit-keyframes starl {
  0% {
    opacity: 1;
    left: 100%;
    top: 50%;
    transform: translateY(-380px)
  }

  72% {
    opacity: 1;
    left: 100%;
    top: 50%;
    transform: translateY(-380px)
  }

  100% {
    opacity: 0;
    left: 50%;
    top: 50%;
    transform: translateY(180px)
  }
}

.animate.item-0 .ball-1 {
  animation: ball1 600ms ease 0ms forwards;
  -webkit-animation: ball1 600ms ease 0ms forwards;
  -moz-animation: ball1 600ms ease 0ms forwards
}

.animate.item-0 .ball-2 {
  animation: ball2-1 600ms ease 200ms forwards normal, ball2-2 2s linear 800ms infinite alternate;
  -webkit-animation: ball2-1 600ms ease 200ms forwards normal, ball2-2 2s linear 800ms infinite alternate;
  -moz-animation: ball2-1 600ms ease 200ms forwards normal, ball2-2 2s linear 800ms infinite alternate
}

.animate.item-0 .legend {
  animation: legend 400ms ease 400ms forwards;
  -webkit-animation: legend 400ms ease 400ms forwards;
  -moz-animation: legend 400ms ease 400ms forwards
}

.animate.item-0 .content {
  animation: item0content 400ms ease 600ms forwards;
  -webkit-animation: item0content 400ms ease 600ms forwards;
  -moz-animation: item0content 400ms ease 600ms forwards
}

.animate.item-0 .ball-3 {
  animation: ball3-1 600ms ease 600ms forwards normal, ball3-2 2s linear 1.2s infinite alternate;
  -webkit-animation: ball3-1 600ms ease 600ms forwards normal, ball3-2 2s linear 1.2s infinite alternate;
  -moz-animation: ball3-1 600ms ease 600ms forwards normal, ball3-2 2s linear 1.2s infinite alternate
}

.animate.item-0 .ball-4 {
  animation: ball4 600ms ease 1s forwards;
  -webkit-animation: ball4 600ms ease 1s forwards;
  -moz-animation: ball4 600ms ease 1s forwards
}

.animate.item-0 .ball-4-circle {
  animation: scale0to1 600ms ease 1.6s forwards;
  -webkit-animation: scale0to1 600ms ease 1.6s forwards;
  -moz-animation: scale0to1 600ms ease 1.6s forwards
}

.animate.item-0 .ball-4-l {
  animation: rotateZ 40s linear 2.2s infinite;
  -webkit-animation: rotateZ 40s linear 2.2s infinite;
  -moz-animation: rotateZ 40s linear 2.2s infinite
}

.animate.item-0 .ball-4-s {
  animation: rotateZ 40s linear 2.2s infinite;
  -webkit-animation: rotateZ 40s linear 2.2s infinite;
  -moz-animation: rotateZ 40s linear 2.2s infinite
}

.animate.item-0 .star-s {
  animation: stars 4.2s ease 0s infinite;
  -webkit-animation: stars 4.2s ease 0s infinite;
  -moz-animation: stars 4.2s ease 0s infinite
}

.animate.item-0 .star-l {
  animation: starl 3.8s ease 0s infinite;
  -webkit-animation: starl 3.8s ease 0s infinite;
  -moz-animation: starl 3.8s ease 0s infinite
}

@keyframes opacity0to1 {
  from {
    opacity: 0
  }

  to {
    opacity: 1;
    transform: scale(1)
  }
}

@-webkit-keyframes opacity0to1 {
  from {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

.animate.item-1 .base_inner {
  animation: scale0to1 600ms ease 0.8s forwards;
  -webkit-animation: scale0to1 600ms ease 0.8s forwards;
  -moz-animation: scale0to1 600ms ease 0.8s forwards
}

.animate.item-1 .base_inner .object div {
  animation: opacity0to1 600ms linear 0.8s forwards;
  -webkit-animation: opacity0to1 600ms linear 0.8s forwards;
  -moz-animation: opacity0to1 600ms linear 0.8s forwards
}

@keyframes moveqiao {
  from {
    transform: translateY(0px)
  }

  to {
    transform: translateY(20px)
  }
}

@-webkit-keyframes moveqiao {
  from {
    transform: translateY(0px)
  }

  to {
    transform: translateY(20px)
  }
}

@keyframes movekai {
  from {
    transform: translateY(20px)
  }

  to {
    transform: translateY(0px)
  }
}

@-webkit-keyframes movekai {
  from {
    transform: translateY(20px)
  }

  to {
    transform: translateY(0px)
  }
}

@keyframes suipian {
  from {
    opacity: 0;
    left: 50%;
    top: 50%;
    margin-left: 0;
    transform: translate(-50%, -50%) scale(0)
  }

  to {
    opacity: 1;
    top: -83px;
    margin-left: -740px;
    transform: translate(0, 0) scale(1)
  }
}

@-webkit-keyframes suipian {
  from {
    opacity: 0;
    left: 50%;
    top: 50%;
    margin-left: 0;
    transform: translate(-50%, -50%) scale(0)
  }

  to {
    opacity: 1;
    top: -83px;
    margin-left: -740px;
    transform: translate(0, 0) scale(1)
  }
}

@keyframes qiao {
  from {
    opacity: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0)
  }

  to {
    opacity: 1;
    left: 157px;
    top: 102px;
    transform: translate(0, 0) scale(1)
  }
}

@-webkit-keyframes qiao {
  from {
    opacity: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0)
  }

  to {
    opacity: 1;
    left: 157px;
    top: 102px;
    transform: translate(0, 0) scale(1)
  }
}

@keyframes kai {
  from {
    opacity: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0)
  }

  to {
    opacity: 1;
    left: 466px;
    top: 171px;
    transform: translate(0, 20px) scale(1)
  }
}

@-webkit-keyframes kai {
  from {
    opacity: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0)
  }

  to {
    opacity: 1;
    left: 466px;
    top: 171px;
    transform: translate(0, 20px) scale(1)
  }
}

@keyframes libao-s {
  from {
    opacity: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0)
  }

  to {
    opacity: 1;
    left: 679px;
    top: 131px;
    transform: translate(0, 0) scale(1)
  }
}

@-webkit-keyframes libao-s {
  from {
    opacity: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0)
  }

  to {
    opacity: 1;
    left: 679px;
    top: 131px;
    transform: translate(0, 0) scale(1)
  }
}

@keyframes libao-l {
  from {
    opacity: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0)
  }

  to {
    opacity: 1;
    left: 343px;
    top: 343px;
    transform: translate(0, 0) scale(1)
  }
}

@-webkit-keyframes libao-l {
  from {
    opacity: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0)
  }

  to {
    opacity: 1;
    left: 343px;
    top: 343px;
    transform: translate(0, 0) scale(1)
  }
}

.animate.item-2 .suipian {
  animation: suipian 0.4s ease 0.2s forwards;
  -webkit-animation: suipian 0.4s ease 0.2s forwards;
  -moz-animation: suipian 0.4s ease 0.2s forwards
}

.animate.item-2 .qiao {
  animation: qiao 0.4s ease 0.4s forwards normal, moveqiao 2s linear 0.8s infinite alternate;
  -webkit-animation: qiao 0.4s ease 0.4s forwards normal, moveqiao 2s linear 0.8s infinite alternate;
  -moz-animation: qiao 0.4s ease 0.4s forwards normal, moveqiao 2s linear 0.8s infinite alternate
}

.animate.item-2 .kai {
  animation: kai 0.4s ease 0.6s forwards normal, movekai 2s linear 1s infinite alternate;
  -webkit-animation: kai 0.4s ease 0.6s forwards normal, movekai 2s linear 1s infinite alternate;
  -moz-animation: kai 0.4s ease 0.6s forwards normal, movekai 2s linear 1s infinite alternate
}

.animate.item-2 .libao-s {
  animation: libao-s 0.4s ease 0.8s forwards;
  -webkit-animation: libao-s 0.4s ease 0.8s forwards;
  -moz-animation: libao-s 0.4s ease 0.8s forwards
}

.animate.item-2 .libao-l {
  animation: scale0to1 0.4s ease 1s forwards;
  -webkit-animation: scale0to1 0.4s ease 1s forwards;
  -moz-animation: scale0to1 0.4s ease 1s forwards
}

@keyframes move80 {
  from {
    opacity: 0;
    transform: translateY(80px)
  }

  to {
    opacity: 1;
    transform: translateY(0)
  }
}

@-webkit-keyframes move80 {
  from {
    opacity: 0;
    transform: translateY(80px)
  }

  to {
    opacity: 1;
    transform: translateY(0)
  }
}

.animate.item-3 .huan-wai {
  animation: scale0to1 0.4s ease 0.2s forwards normal, rotateF 0.5s linear 0.2s infinite normal, rotateF 3s linear 2s infinite normal;
  -webkit-animation: scale0to1 0.4s ease 0.2s forwards normal, rotateF 0.5s linear 0.2s infinite normal, rotateF 3s linear 2s infinite normal;
  -moz-animation: scale0to1 0.4s ease 0.2s forwards normal, rotateF 0.5s linear 0.2s infinite normal, rotateF 3s linear 2s infinite normal
}

.animate.item-3 .huan-zhong {
  animation: scale0to1 0.4s ease 0.2s forwards normal, rotateZ 0.5s linear 0.2s infinite normal, rotateZ 3s linear 2s infinite normal;
  -webkit-animation: scale0to1 0.4s ease 0.2s forwards normal, rotateZ 0.5s linear 0.2s infinite normal, rotateZ 3s linear 2s infinite normal;
  -moz-animation: scale0to1 0.4s ease 0.2s forwards normal, rotateZ 0.5s linear 0.2s infinite normal, rotateZ 3s linear 2s infinite normal
}

.animate.item-3 .huan-nei {
  animation: scale0to1 0.4s ease 0.2s forwards;
  -webkit-animation: scale0to1 0.4s ease 0.2s forwards;
  -moz-animation: scale0to1 0.4s ease 0.2s forwards
}

.animate.item-3 .fengshan {
  animation: scale0to1 0.4s ease 0.2s forwards normal, rotateZ 0.6s linear 0.2s infinite normal, scale1to0 0.4s linear 1.6s forwards normal;
  -webkit-animation: scale0to1 0.4s ease 0.2s forwards normal, rotateZ 0.6s linear 0.2s infinite normal, scale1to0 0.4s linear 1.6s forwards normal;
  -moz-animation: scale0to1 0.4s ease 0.2s forwards normal, rotateZ 0.6s linear 0.2s infinite normal, scale1to0 0.4s linear 1.6s forwards normal
}

.animate.item-3 .dui {
  animation: scale0to1 0.4s ease 1.8s forwards;
  -webkit-animation: scale0to1 0.4s ease 1.8s forwards;
  -moz-animation: scale0to1 0.4s ease 1.8s forwards
}

.animate.item-3 .txt-l {
  animation: move80 0.4s ease 2.2s forwards;
  -webkit-animation: move80 0.4s ease 2.2s forwards;
  -moz-animation: move80 0.4s ease 2.2s forwards
}

.animate.item-3 .txt-r {
  animation: move80 0.4s ease 2.6s forwards;
  -webkit-animation: move80 0.4s ease 2.6s forwards;
  -moz-animation: move80 0.4s ease 2.6s forwards
}

@keyframes move60 {
  from {
    opacity: 0;
    transform: translateY(60px)
  }

  to {
    opacity: 1;
    transform: translateY(0)
  }
}

@-webkit-keyframes move60 {
  from {
    opacity: 0;
    transform: translateY(60px)
  }

  to {
    opacity: 1;
    transform: translateY(0)
  }
}

@keyframes huojian {
  from {
    opacity: 0;
    left: 0;
    top: 100%
  }

  to {
    opacity: 1;
    left: 50%;
    top: 148px
  }
}

@-webkit-keyframes huojian {
  from {
    opacity: 0;
    left: 0;
    top: 100%
  }

  to {
    opacity: 1;
    left: 50%;
    top: 148px
  }
}

@keyframes huojianshake {
  0% {
    transform: translate(0, 0)
  }

  25% {
    transform: translate(0, -4px)
  }

  50% {
    transform: translate(4px, -4px)
  }

  75% {
    transform: translate(4px, 0)
  }

  100% {
    transform: translate(0, 0)
  }
}

@-webkit-keyframes huojianshake {
  0% {
    transform: translate(0, 0)
  }

  25% {
    transform: translate(0, -4px)
  }

  50% {
    transform: translate(4px, -4px)
  }

  75% {
    transform: translate(4px, 0)
  }

  100% {
    transform: translate(0, 0)
  }
}

.animate.item-4 .quan {
  animation: move60 0.4s ease 0.2s forwards;
  -webkit-animation: move60 0.4s ease 0.2s forwards;
  -moz-animation: move60 0.4s ease 0.2s forwards
}

.animate.item-4 .huojian {
  animation: huojian 0.2s linear 0.6s forwards normal, huojianshake 0.4s linear 1.1s infinite normal;
  -webkit-animation: huojian 0.2s linear 0.6s forwards normal, huojianshake 0.4s linear 1.1s infinite normal;
  -moz-animation: huojian 0.2s linear 0.6s forwards normal, huojianshake 0.4s linear 1.1s infinite normal
}

.animate.item-4 .txt-l {
  animation: move80 0.4s ease 0.8s forwards;
  -webkit-animation: move80 0.4s ease 0.8s forwards;
  -moz-animation: move80 0.4s ease 0.8s forwards
}

.animate.item-4 .txt-r {
  animation: move80 0.4s ease 1.2s forwards;
  -webkit-animation: move80 0.4s ease 1.2s forwards;
  -moz-animation: move80 0.4s ease 1.2s forwards
}

.animate.item h2 img {
  animation: move60 0.4s ease 0.2s forwards;
  -webkit-animation: move60 0.4s ease 0.2s forwards;
  -moz-animation: move60 0.4s ease 0.2s forwards
}