
/* scene1 气泡飘走动画 */
@keyframes scb_anim1{
	100%{transform: translate(-210%,-20%);}
}
@-webkit-keyframes scb_anim1{
	100%{-webkit-transform: translate(-210%,-20%);}
}
.scb_anim1{
	animation: scb_anim1 1.6s ease-in-out;
	-webkit-animation: scb_anim1 1.6s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
}

@keyframes scb_anim2{
	100%{transform: translate(140%,-60%);}
}
@-webkit-keyframes scb_anim2{
	100%{-webkit-transform: translate(140%,-60%);}
}
.scb_anim2{
	animation: scb_anim2 3s ease-in-out;
	-webkit-animation: scb_anim2 3s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 0.2s;
	-webkit-animation-delay: 0.2s;
}

@keyframes scb_anim3{
	100%{transform: translate(-220%,-20%);}
}
@-webkit-keyframes scb_anim3{
	100%{-webkit-transform: translate(-220%,-20%);}
}
.scb_anim3{
	animation: scb_anim3 2.5s ease-in-out;
	-webkit-animation: scb_anim3 2.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 0.3s;
	-webkit-animation-delay: 0.3s;
}

@keyframes scb_anim11{
	100%{transform: translate(120%,-10%);}
}
@-webkit-keyframes scb_anim11{
	100%{-webkit-transform: translate(120%,-10%);}
}
.scb_anim11{
	animation: scb_anim11 2.5s ease-in-out;
	-webkit-animation: scb_anim11 2.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 0.7s;
	-webkit-animation-delay: 0.7s;
}

@keyframes scb_anim4{
	100%{transform: translate(-150%,-10%);}
}
@-webkit-keyframes scb_anim4{
	100%{-webkit-transform: translate(-150%,-10%);}
}
.scb_anim4{
	animation: scb_anim4 2.5s ease-in-out;
	-webkit-animation: scb_anim4 2.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 0.4s;
	-webkit-animation-delay: 0.4s;
}

@keyframes scb_anim6{
	100%{transform: translate(-150%,-15%);}
}
@-webkit-keyframes scb_anim6{
	100%{-webkit-transform: translate(-150%,-15%);}
}
.scb_anim6{
	animation: scb_anim6 3s ease-in-out;
	-webkit-animation: scb_anim6 3s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 1.2s;
	-webkit-animation-delay: 1.2s;
}

@keyframes scb_anim5{
	100%{transform: translate(-80%,-15%);}
}
@-webkit-keyframes scb_anim5{
	100%{-webkit-transform: translate(-80%,-15%);}
}
.scb_anim5{
	animation: scb_anim5 2.5s ease-in-out;
	-webkit-animation: scb_anim5 2.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 0.7s;
	-webkit-animation-delay: 0.7s;
}

@keyframes scb_anim10{
	100%{transform: translate(100%,-15%);}
}
@-webkit-keyframes scb_anim10{
	100%{-webkit-transform: translate(100%,-15%);}
}
.scb_anim10{
	animation: scb_anim10 2.5s ease-in-out;
	-webkit-animation: scb_anim10 2.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 0.8s;
	-webkit-animation-delay: 0.8s;
}

@keyframes scb_anim8{
	100%{transform: translate(-200%,-25%);}
}
@-webkit-keyframes scb_anim8{
	100%{-webkit-transform: translate(-200%,-25%);}
}
.scb_anim8{
	animation: scb_anim8 2.5s ease-in-out;
	-webkit-animation: scb_anim8 2.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 1s;
	-webkit-animation-delay: 1s;
}

@keyframes scb_anim9{
	100%{transform: translate(120%,15%);}
}
@-webkit-keyframes scb_anim9{
	100%{-webkit-transform: translate(120%,15%);}
}
.scb_anim9{
	animation: scb_anim9 2.5s ease-in-out;
	-webkit-animation: scb_anim9 2.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 1.5s;
	-webkit-animation-delay: 1.5s;
}

@keyframes scb_anim15{
	100%{transform: translate(-120%,50%);}
}
@-webkit-keyframes scb_anim15{
	100%{-webkit-transform: translate(-120%,50%);}
}
.scb_anim15{
	animation: scb_anim15 2.5s ease-in-out;
	-webkit-animation: scb_anim15 2.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 1.8s;
	-webkit-animation-delay: 1.8s;
}

@keyframes scb_anim14{
	100%{transform: translate(-100%,95%);}
}
@-webkit-keyframes scb_anim14{
	100%{-webkit-transform: translate(-100%,95%);}
}
.scb_anim14{
	animation: scb_anim14 2.5s ease-in-out;
	-webkit-animation: scb_anim14 2.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 2.4s;
	-webkit-animation-delay: 2.4s;
}

@keyframes scb_anim12{
	100%{transform: translate(90%,90%);}
}
@-webkit-keyframes scb_anim12{
	100%{-webkit-transform: translate(90%,90%);}
}
.scb_anim12{
	animation: scb_anim12 2.5s ease-in-out;
	-webkit-animation: scb_anim12 2.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 2.3s;
	-webkit-animation-delay: 2.3s;
}

@keyframes scb_anim13{
	100%{transform: translate(80%,100%);}
}
@-webkit-keyframes scb_anim13{
	100%{-webkit-transform: translate(80%,100%);}
}
.scb_anim13{
	animation: scb_anim13 2.5s ease-in-out;
	-webkit-animation: scb_anim13 2.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 2.9s;
	-webkit-animation-delay: 2.9s;
}
@keyframes scb_anim7{
	100%{transform: translate(100%,160%);}
}
@-webkit-keyframes scb_anim7{
	100%{-webkit-transform: translate(100%,160%);}
}
.scb_anim7{
	animation: scb_anim7 2.7s ease-in-out;
	-webkit-animation: scb_anim7 2.7s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 1.9s;
	-webkit-animation-delay: 1.9s;
}

@keyframes scb_anim17{
	100%{transform: translate(-50%,120%);}
}
@-webkit-keyframes scb_anim17{
	100%{-webkit-transform: translate(-50%,120%);}
}
.scb_anim17{
	animation: scb_anim17 2.5s ease-in-out;
	-webkit-animation: scb_anim17 2.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 2.3s;
	-webkit-animation-delay: 2.3s;
}

@keyframes scb_anim16{
	100%{transform: translate(30%,60%);}
}
@-webkit-keyframes scb_anim16{
	100%{-webkit-transform: translate(30%,60%);}
}
.scb_anim16{
	animation: scb_anim16 2.5s ease-in-out;
	-webkit-animation: scb_anim16 2.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 2.5s;
	-webkit-animation-delay: 2.5s;
}
/* end */

/* scene1 黄球眼睛动画 */
@keyframes scene1_eye1_anim{
	20%{transform: translate(-28%,60%);}
	40%{transform: translate(-28%,60%);}
	60%{transform: translate(28%,0%);}
	80%{transform: translate(28%,0%);}
	100%{transform: translate(0%,0%);}
}
@-webkit-keyframes scene1_eye1_anim{
	20%{-webkit-transform: translate(-28%,60%);}
	40%{-webkit-transform: translate(-28%,60%);}
	60%{-webkit-transform: translate(28%,0%);}
	80%{-webkit-transform: translate(28%,0%);}
	100%{-webkit-transform: translate(0%,0%);}
}
.scene1_eye1_anim{
	animation: scene1_eye1_anim 2.4s ease-in-out;
	-webkit-animation: scene1_eye1_anim 2.4s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 1.1s;
	-webkit-animation-delay: 1.1s;
}
/* end */

/* scene1 黄球滚动动画 */
@keyframes shell1_anim{
	46%{transform: translate(-110%,-20%) rotate(-355deg) scale(1.38);}
	54%{transform: translate(-110%,-20%) rotate(-355deg) scale(1.38);}
	100%{transform: translate(-20%,12%) rotate(0deg) scale(1.7);}
}
@-webkit-keyframes shell1_anim{
	46%{-webkit-transform: translate(-110%,-20%) rotate(-355deg) scale(1.38);}
	54%{-webkit-transform: translate(-110%,-20%) rotate(-355deg) scale(1.38);}
	100%{-webkit-transform: translate(-20%,12%) rotate(0deg) scale(1.7);}
}
.shell1_anim{
	animation: shell1_anim 3.6s ease-in-out;
	-webkit-animation: shell1_anim 3.6s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 3.9s;
	-webkit-animation-delay: 3.9s;
}

/* scene1 文字显示时表情切换 */
@keyframes scene1_eye1_anim2{
	14%{transform: translate(0%,-30%);}
	28%{transform: translate(0%,-30%);}
	43%{transform: translate(0%,0%);}
	58%{transform: translate(0%,0%);}
	71%{transform: translate(-20%,60%);}
	85%{transform: translate(-20%,60%);}
	100%{transform: translate(0%,0%);}
}
@-webkit-keyframes scene1_eye1_anim2{
	14%{-webkit-transform: translate(0%,-30%);}
	28%{-webkit-transform: translate(0%,-30%);}
	43%{-webkit-transform: translate(0%,0%);}
	58%{-webkit-transform: translate(0%,0%);}
	71%{-webkit-transform: translate(-20%,60%);}
	85%{-webkit-transform: translate(-20%,60%);}
	100%{-webkit-transform: translate(0%,0%);}
}
.scene1_eye1_anim2{
	animation: scene1_eye1_anim2 4.8s ease-in-out;
	-webkit-animation: scene1_eye1_anim2 4.8s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 4.1s;
	-webkit-animation-delay: 4.1s;
}

@keyframes scene1_mouth1_anim{
	20%{opacity: 0;}
	40%{opacity: 0;}
	50%{opacity: 1;}
	70%{opacity: 1;}
	80%{opacity: 0;}
	100%{opacity: 0;}
}
@-webkit-keyframes scene1_mouth1_anim{
	20%{opacity: 0;}
	40%{opacity: 0;}
	50%{opacity: 1;}
	70%{opacity: 1;}
	80%{opacity: 0;}
	100%{opacity: 0;}
}
.scene1_mouth1_anim{
	animation: scene1_mouth1_anim 3.5s ease-in-out;
	-webkit-animation: scene1_mouth1_anim 3.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 3.3s;
	-webkit-animation-delay: 3.3s;
}

/* 手 */
/*@keyframes hand_anim{
	60%{transform: translate(15%,-20%);}
	100%{transform: translate(0%,0%);}
}
@-webkit-keyframes hand_anim{
	60%{-webkit-transform: translate(15%,-20%);}
	100%{-webkit-transform: translate(0%,0%);}
}*/
.hand_anim{
	/*animation: hand_anim 1.5s infinite ease-in-out;
	-webkit-animation: hand_anim 1.5s infinite ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;*/
}

/* 手1_2 */
/*@keyframes hand2_anim{
	60%{transform: translate(15%,-20%);}
	100%{transform: translate(0%,0%);}
}
@-webkit-keyframes hand2_anim{
	60%{-webkit-transform: translate(15%,-20%);}
	100%{-webkit-transform: translate(0%,0%);}
}*/
.hand2_anim{
	/*animation: hand2_anim 1.5s infinite ease-in-out;
	-webkit-animation: hand2_anim 1.5s infinite ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;*/
}


/* 黄球滚走了 */
@keyframes shell1_anim2{
	0%{transform: scale(1.7);}
	100%{transform: rotate(720deg) scale(0.9) translate(400%,0%);}
}
@-webkit-keyframes shell1_anim2{
	0%{-webkit-transform: scale(1.7);}
	100%{-webkit-transform: rotate(720deg) scale(0.9) translate(400%,0%);}
}
.shell1_anim2{
	animation: shell1_anim2 2s linear;
	-webkit-animation: shell1_anim2 2s linear;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
}


/* scene2 */
@keyframes scene2_shell_anim2{
	100%{transform: scale(0.55) translateY(-88%);}
}
@-webkit-keyframes scene2_shell_anim2{
	100%{-webkit-transform: scale(0.55) translateY(-88%);}
}
.scene2_shell_anim2{
	animation: scene2_shell_anim2 1s linear;
	-webkit-animation: scene2_shell_anim2 1s linear;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
}

/* 精灵球 */
@keyframes spirit_ball_anim{
	50%{transform: translate(20%,-180%);}
	100%{transform: translate(-40%,-160%);}
}
@-webkit-keyframes spirit_ball_anim{
	50%{-webkit-transform: translate(20%,-180%);}
	100%{-webkit-transform: translate(-40%,-160%);}
}
.spirit_ball_anim{
	animation: spirit_ball_anim 1.4s ease-in-out;
	-webkit-animation: spirit_ball_anim 1.4s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 0.4s;
	-webkit-animation-delay: 0.4s;
}

@keyframes scene6_shell_anim{
	100%{transform: scale(0.6) translate(-3%,-262%);}
}
@-webkit-keyframes scene6_shell_anim{
	100%{-webkit-transform: scale(0.6) translate(-3%,-262%);}
}
.scene6_shell_anim{
	animation: scene6_shell_anim 1.5s ease-in-out;
	-webkit-animation: scene6_shell_anim 1.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 1s;
	-webkit-animation-delay: 1s;
}

/* 帽子 */
@keyframes hat_anim{
	100%{transform: translate(-13%,55%);}
}
@-webkit-keyframes hat_anim{
	100%{-webkit-transform: translate(-13%,55%);}
}
.hat_anim{
	animation: hat_anim 0.7s ease-in-out;
	-webkit-animation: hat_anim 0.7s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 3s;
	-webkit-animation-delay: 3s;
}

/* 眼往下看 */
@keyframes scene6_eye1_anim{
	100%{transform: translate(-16%,83%);}
}
@-webkit-keyframes scene6_eye1_anim{
	100%{-webkit-transform: translate(-16%,83%);}
}
.scene6_eye1_anim{
	animation: scene6_eye1_anim 0.7s ease-in-out;
	-webkit-animation: scene6_eye1_anim 0.7s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 3s;
	-webkit-animation-delay: 3s;
}

/* 小伙伴出来 */
@keyframes scene7_partner1_anim{
	100%{transform: translate(70%,-80%);}
}
@-webkit-keyframes scene7_partner1_anim{
	100%{-webkit-transform: translate(70%,-80%);}
}
.scene7_partner1_anim{
	animation: scene7_partner1_anim 1.5s ease-in-out;
	-webkit-animation: scene7_partner1_anim 1.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 0s;
	-webkit-animation-delay: 0s;
}

@keyframes scene7_partner2_anim{
	100%{transform: translate(42%,-45%);}
}
@-webkit-keyframes scene7_partner2_anim{
	100%{-webkit-transform: translate(42%,-45%);}
}
.scene7_partner2_anim{
	animation: scene7_partner2_anim 1.5s ease-in-out;
	-webkit-animation: scene7_partner2_anim 1.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 1s;
	-webkit-animation-delay: 1s;
}

@keyframes scene7_partner3_anim{
	100%{transform: translate(0%,-80%);}
}
@-webkit-keyframes scene7_partner3_anim{
	100%{-webkit-transform: translate(0%,-80%);}
}
.scene7_partner3_anim{
	animation: scene7_partner3_anim 1.5s ease-in-out;
	-webkit-animation: scene7_partner3_anim 1.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 0.6s;
	-webkit-animation-delay: 0.6s;
}

@keyframes scene7_partner4_anim{
	100%{transform: translate(-40%,-60%);}
}
@-webkit-keyframes scene7_partner4_anim{
	100%{-webkit-transform: translate(-40%,-60%);}
}
.scene7_partner4_anim{
	animation: scene7_partner4_anim 1.5s ease-in-out;
	-webkit-animation: scene7_partner4_anim 1.5s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 1.3s;
	-webkit-animation-delay: 1.3s;
}

@keyframes scene7_eye1_anim{
	100%{transform: translate(-10%,70%);}
}
@-webkit-keyframes scene7_eye1_anim{
	100%{-webkit-transform: translate(-10%,70%);}
}
.scene7_eye1_anim{
	animation: scene7_eye1_anim 1.2s ease-in-out;
	-webkit-animation: scene7_eye1_anim 1.2s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 0.5s;
	-webkit-animation-delay: 0.5s;
}

/* 问号圆圈 */
@keyframes question_decor2_anim{
	25%{opacity: 0}
	50%{opacity: 1}
	75%{opacity: 0}
	100%{opacity: 1}
}
@-webkit-keyframes question_decor2_anim{
	25%{opacity: 0}
	50%{opacity: 1}
	75%{opacity: 0}
	100%{opacity: 1}
}
.question_decor2_anim{
	animation: question_decor2_anim 1.4s ease-in-out;
	-webkit-animation: question_decor2_anim 1.4s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 1.2s;
	-webkit-animation-delay: 1.2s;
}

@keyframes scene7_2_shell_anim{
	100%{transform: scale(0.7) translate(-5%,-85%);}

}
@-webkit-keyframes scene7_2_shell_anim{
	100%{-webkit-transform: scale(0.7) translate(-5%,-85%);}
}
.scene7_2_shell_anim{
	animation: scene7_2_shell_anim 1s ease-in-out;
	-webkit-animation: scene7_2_shell_anim 1s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 3.1s;
	-webkit-animation-delay: 3.1s;
}

@keyframes scene7_2_mouth1_anim{
	100%{transform: translate(0%,43%);}

}
@-webkit-keyframes scene7_2_mouth1_anim{
	100%{-webkit-transform: translate(0%,43%);}
}
.scene7_2_mouth1_anim{
	animation: scene7_2_mouth1_anim 0.6s ease-in-out;
	-webkit-animation: scene7_2_mouth1_anim 0.6s ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-delay: 3.7s;
	-webkit-animation-delay: 3.7s;
}