﻿
#bianfu,
#bianfu:after {
 width:300px;
 height:200px;
 position:absolute;
 left:50%;
 top:0
}
#bianfu:after {
 content:"";
 background:url(/images/v5/bianfu.png) no-repeat;
 background-size:contain;
 -webkit-animation:bianfu .6s linear infinite alternate;
 animation:bianfu .6s linear infinite alternate
}
.cur #bianfu {
 -webkit-animation:dfdh 2s linear infinite;
 animation:dfdh 2s linear infinite
}
@-webkit-keyframes bianfu {
 0% {
  -webkit-transform:rotateY(0deg);
  transform:rotateY(0deg)
 }
 50% {
  -webkit-transform:rotateY(80deg);
  transform:rotateY(80deg)
 }
 to {
  -webkit-transform:rotateY(0);
  transform:rotateY(0)
 }
}
@keyframes bianfu {
 0% {
  -webkit-transform:rotateY(0deg);
  transform:rotateY(0deg)
 }
 50% {
  -webkit-transform:rotateY(80deg);
  transform:rotateY(80deg)
 }
 to {
  -webkit-transform:rotateY(0);
  transform:rotateY(0)
 }
}
@-webkit-keyframes dfdh {
 0% {
  -webkit-transform:translate(800px,500px) rotate(-40deg);
  transform:translate(800px,500px) rotate(-40deg)
 }
 to {
  -webkit-transform:translate(-400px,-200px) rotate(-40deg);
  transform:translate(-400px,-200px) rotate(-40deg)
 }
}
@keyframes dfdh {
  0% {
    -webkit-transform:translate(800px,500px) rotate(-40deg);
    transform:translate(800px,500px) rotate(-40deg)
   }
   to {
    -webkit-transform:translate(-400px,-200px) rotate(-40deg);
    transform:translate(-400px,-200px) rotate(-40deg)
   }
}
#bianfu2 {
 -webkit-transform:translate(800px,400px);
 transform:translate(800px,400px);
 z-index:222
}
#bianfu2,
#bianfu2:after {
 width:100px;
 height:50px;
 position:absolute;
 left:0;
 top:0
}
#bianfu2:after {
 content:"";
 background:url(/images/v5/bianfu.png) no-repeat;
 background-size:contain;
 -webkit-animation:bianfu2 .6s linear infinite alternate;
 animation:bianfu2 .6s linear infinite alternate
}
.cur #bianfu2 {
 -webkit-animation:dfdh2 3s linear infinite;
 animation:dfdh2 3s linear infinite;
 -webkit-animation-delay:1.4s;
 animation-delay:1.4s
}
@-webkit-keyframes bianfu2 {
 0% {
  -webkit-transform:rotateY(0deg);
  transform:rotateY(0deg)
 }
 50% {
  -webkit-transform:rotateY(80deg);
  transform:rotateY(80deg)
 }
 to {
  -webkit-transform:rotateY(0);
  transform:rotateY(0)
 }
}
@keyframes bianfu2 {
 0% {
  -webkit-transform:rotateY(0deg);
  transform:rotateY(0deg)
 }
 50% {
  -webkit-transform:rotateY(80deg);
  transform:rotateY(80deg)
 }
 to {
  -webkit-transform:rotateY(0);
  transform:rotateY(0)
 }
}
@-webkit-keyframes dfdh2 {
 0% {
  -webkit-transform:translate(-200px,300px) rotate(90deg);
  transform:translate(-200px,300px) rotate(90deg)
 }
 to {
  -webkit-transform:translate(900px,300px) rotate(90deg);
  transform:translate(900px,300px) rotate(90deg)
 }
}
@keyframes dfdh2 {
  0% {
    -webkit-transform:translate(-200px,300px) rotate(90deg);
    transform:translate(-200px,300px) rotate(90deg)
   }
   to {
    -webkit-transform:translate(900px,300px) rotate(90deg);
    transform:translate(900px,300px) rotate(90deg)
   }
}
#bianfu3 {
 -webkit-transform:translate(-200px,500px);
 transform:translate(-200px,500px);
 z-index:222
}
#bianfu3,
#bianfu3:after {
 width:100px;
 height:50px;
 position:absolute;
 left:0;
 top:0
}
#bianfu3:after {
 content:"";
 background:url(/images/v5/bianfu.png) no-repeat;
 background-size:contain;
 -webkit-animation:bianfu3 .5s linear infinite alternate;
 animation:bianfu3 .5s linear infinite alternate
}
.cur #bianfu3 {
 -webkit-animation:dfdh3 3s linear infinite;
 animation:dfdh3 3s linear infinite;
 -webkit-animation-delay:.4s;
 animation-delay:.4s
}
@-webkit-keyframes bianfu3 {
 0% {
  -webkit-transform:rotateY(0deg);
  transform:rotateY(0deg)
 }
 50% {
  -webkit-transform:rotateY(80deg);
  transform:rotateY(80deg)
 }
 to {
  -webkit-transform:rotateY(0);
  transform:rotateY(0)
 }
}
@keyframes bianfu3 {
 0% {
  -webkit-transform:rotateY(0deg);
  transform:rotateY(0deg)
 }
 50% {
  -webkit-transform:rotateY(80deg);
  transform:rotateY(80deg)
 }
 to {
  -webkit-transform:rotateY(0);
  transform:rotateY(0)
 }
}
@-webkit-keyframes dfdh3 {
 0% {
  -webkit-transform:translate(-200px,800px) rotate(90deg);
  transform:translate(-200px,800px) rotate(90deg)
 }
 34% {
  -webkit-transform:translate(600px,500px) rotate(90deg);
  transform:translate(600px,500px) rotate(90deg)
 }
 35% {
  -webkit-transform:translate(600px,500px) rotate(-40deg);
  transform:translate(600px,500px) rotate(-40deg)
 }
 74% {
  -webkit-transform:translate(100px,100px) rotate(-40deg);
  transform:translate(100px,100px) rotate(-40deg)
 }
 75% {
  -webkit-transform:translate(100px,100px) rotate(40deg);
  transform:translate(100px,100px) rotate(40deg)
 }
 99% {
  -webkit-transform:translate(300px,-200px) rotate(40deg);
  transform:translate(300px,-200px) rotate(40deg)
 }
 to {
  -webkit-transform:translate(300px,-200px) rotate(-90deg);
  transform:translate(300px,-200px) rotate(-90deg)
 }
}
@keyframes dfdh3 {
 0% {
  -webkit-transform:translate(-200px,800px) rotate(90deg);
  transform:translate(-200px,800px) rotate(90deg)
 }
 34% {
  -webkit-transform:translate(600px,500px) rotate(90deg);
  transform:translate(600px,500px) rotate(90deg)
 }
 35% {
  -webkit-transform:translate(600px,500px) rotate(-40deg);
  transform:translate(600px,500px) rotate(-40deg)
 }
 74% {
  -webkit-transform:translate(100px,100px) rotate(-40deg);
  transform:translate(100px,100px) rotate(-40deg)
 }
 75% {
  -webkit-transform:translate(100px,100px) rotate(40deg);
  transform:translate(100px,100px) rotate(40deg)
 }
 99% {
  -webkit-transform:translate(300px,-200px) rotate(40deg);
  transform:translate(300px,-200px) rotate(40deg)
 }
 to {
  -webkit-transform:translate(300px,-200px) rotate(-90deg);
  transform:translate(300px,-200px) rotate(-90deg)
 }
}