@charset "utf-8";
/* CSS Document */

@-webkit-keyframes aixin1{
    from{-webkit-transform:translate(0px,0px) rotate(0deg);}
    to{-webkit-transform:translate(200px,-500px) rotate(360deg);}
}

@-webkit-keyframes text1{
    0% {
        -webkit-transform:translateX(00) rotate(0deg) opacity: 0.2;
    }
    20% {
        -webkit-transform: translateX(-80px) opacity: 1;

    }
    50% {
        -webkit-transform: translateX(-220px);
    }
    75% {
        -webkit-transform: translateX(-450px) opacity: 0.1;;
    }
    100% {
        -webkit-transform:translateX(-600px) rotate(0deg);
    }

}

.zhuanx {
    -webkit-transform: translate 3d(0px, 6px, 0px);
    -webkit-animation: du1 4s 0s infinite linear normal ;
}

@-webkit-keyframes du1 {
    0% {
        -webkit-transform: translateX(-200px);
    }
    100% {
        -webkit-transform: translateX(500px);
    }
}


.l_r1 {
    -webkit-transform: translate 3d(0px, 6px, 0px);
    -webkit-animation: l_r 2s 0s infinite linear normal ;
}

@-webkit-keyframes l_r {
    0% {
        -webkit-transform: translateX(0px);
    }

    50% {
        -webkit-transform: translateX(10px);
    }
    100% {
        -webkit-transform: translateX(0px);
    }
}

.r_l1 {
    -webkit-transform: translate 3d(0px, 6px, 0px);
    -webkit-animation: r_l 2s 0s infinite linear normal ;
}

@-webkit-keyframes r_l {
    0% {
        -webkit-transform: translateX(0px);
    }

    50% {
        -webkit-transform: translateX(-10px);
    }
    100% {
        -webkit-transform: translateX(0px);
    }
}


/*定义变形动画round*/
@-webkit-keyframes 'skew' {
    0%,30%,80%{
        -webkit-transform: skew(10deg,10deg);
    }
    50%,15%,65%{
        -webkit-transform: skew(0deg,0deg);
    }
    to {
        -webkit-transform: skew(20deg,20deg);
    }
}

/*定义左边进入动画动画moveleft*/
@-webkit-keyframes 'moveleft' {
    from{
        -webkit-transform: translate(-400px,0);
    }
    50%{
        -webkit-transform: translate(0,0);
    }
    to {
        -webkit-transform: translate(0px,0);
    }
}

/*定义左边进入动画动画moveleft*/
@-webkit-keyframes 'moveleft2' {
    from{
        -webkit-transform: translate(-400px,0);
    }
    50%{
        -webkit-transform: translate(0,0);
    }
    to {
        -webkit-transform: translate(0px,0);
    }
}

/*定义右边进入动画动画moveright*/
@-webkit-keyframes 'moveright' {
    from{
        -webkit-transform: translate(600px,0);
    }
    50%{
        -webkit-transform: translate(0,0);
    }
    to {
        -webkit-transform: translate(0px,0);
    }
}

/*定义左边进入动画动画moveleft*/
@-webkit-keyframes 'movetop' {
    0% {
        -webkit-transform: translateY(-30px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0px);
    }
}
/*定义右边进入动画动画left-right-move*/
@-webkit-keyframes lrmove /* Safari and Chrome */
{
    0%   {-webkit-transform: rotate(0deg);}
    25%  {-webkit-transform: rotate(10deg);}
    50%  {-webkit-transform: rotate(0deg);}
    75%  {-webkit-transform: rotate(-10deg);}
    100% {-webkit-transform: rotate(0deg);}
}

/*定义右边进入动画动画lrmove2*/
@-webkit-keyframes lrmove2 /* Safari and Chrome */
{
    0%   {-webkit-transform: rotate(0deg);}
    25%  {-webkit-transform: rotate(5deg);}
    50%  {-webkit-transform: rotate(0deg);}
    75%  {-webkit-transform: rotate(-5deg);}
    100% {-webkit-transform: rotate(0deg);}
}

@-webkit-keyframes lrmove6 /* Safari and Chrome */
{
    0%   {
        -webkit-transform: translate(200px,0); }
    50%  {-webkit-transform: rotate(360deg);}
    100% {-webkit-transform: rotate(0deg);}
}


.skew{
    -webkit-animation-name: 'skew'; /*动画名称*/
    -webkit-animation-duration: 1s;/*播放一次所持续时间*/
    -webkit-animation-timing-function: ease-in-out;/*动画播放频率*/
    -webkit-animation-iteration-count: 1;/*动画播放次涒为无限次*/
}
.moveleft{
    -webkit-animation-name: 'moveleft'; /*动画名称*/
    -webkit-animation-duration: 2s;/*播放一次所持续时间*/
    -webkit-animation-timing-function: ease-in-out;/*动画播放频率*/
    -webkit-animation-iteration-count: 2;/*动画播放次涒为无限次*/
}
.moveleft2{
    -webkit-animation-name: 'moveleft2'; /*动画名称*/
    -webkit-animation-duration: 2s;/*播放一次所持续时间*/
    -webkit-animation-timing-function: ease-in-out;/*动画播放频率*/
    -webkit-animation-iteration-count: 1;/*动画播放次涒为无限次*/
}
.moveright{
    -webkit-animation-name: 'moveright'; /*动画名称*/
    -webkit-animation-duration: 2s;/*播放一次所持续时间*/
    -webkit-animation-timing-function: ease-in-out;/*动画播放频率*/
    /*-webkit-animation-delay:1s;*/
    -webkit-animation-iteration-count: 1;/*动画播放次涒为无限次*/
}

.movetop{
    -webkit-animation-name: 'movefoot'; /*动画名称*/
    -webkit-animation-duration: 2s;/*播放一次所持续时间*/
    -webkit-animation-timing-function: ease-in-out;/*动画播放频率*/
    /*-webkit-animation-delay:1s;*/
    -webkit-animation-iteration-count: 1;/*动画播放次涒为无限次*/
}

.lrmove{
    -webkit-animation-name: 'lrmove'; /*动画名称*/
    -webkit-animation-duration: 2s;/*播放一次所持续时间*/
    -webkit-animation-timing-function: ease-in-out;/*动画播放频率*/
    -webkit-animation-iteration-count:infinite;/*动画播放次涒为无限次*/
}

.lrmove2{
    -webkit-animation-name: 'lrmove2'; /*动画名称*/
    -webkit-animation-duration: 3s;/*播放一次所持续时间*/
    -webkit-animation-timing-function: ease-in-out;/*动画播放频率*/
    -webkit-animation-iteration-count:infinite;/*动画播放次涒为无限次*/
}

.lrmove6{
    -webkit-animation-name: 'lrmove6'; /*动画名称*/
    -webkit-animation-duration: 1.5s;/*播放一次所持续时间*/
    -webkit-animation-timing-function: ease-in-out;/*动画播放频率*/
    -webkit-animation-iteration-count:1;/*动画播放次涒为无限次*/
}
.updown1 {
    -webkit-transform: translate 3d(0px, 6px, 0px);
    -webkit-animation: bounce-down 2s 0s infinite linear alternate both;
}
.updown3 {
    -webkit-transform: translate 3d(0px, 6px, 0px);
    -webkit-animation: bounce-down3 2s 0s 1 linear alternate both;
}

@-webkit-keyframes bounce-down {
    0% {
        -webkit-transform: translateY(0px);
    }
    25% {
        -webkit-transform: translateY(-10px);
    }
    50%, 100% {
        -webkit-transform: translateY(0);
    }
    75% {
        -webkit-transform: translateY(5px);
    }
    100% {
        -webkit-transform: translateY(0px);
    }
}
@-webkit-keyframes bounce-down3 {
    0% {
        -webkit-transform: translateY(-400px);
    }
    25% {
        -webkit-transform: translateY(-200px);
    }
    50%, 100% {
        -webkit-transform: translateY(0);
    }
    75% {
        -webkit-transform: translateY(5px);
    }
    100% {
        -webkit-transform: translateY(0px);
    }
}

.dax {
    -webkit-transition:All 0.4s ease-in-out;
    -webkit-animation: daxiao 2s 0s infinite  linear alternate both;
}

@-webkit-keyframes daxiao {
    0% {
        -webkit-transform: scale(1);
    }
    25% {
        -webkit-transform: scale(1.1);
    }
    50%, 100% {
        -webkit-transform: scale(0.9);
    }
    75% {
        -webkit-transform: scale(1.1);
    }
    100% {
        -webkit-transform: scale(1);
    }
}

.x_d1 {
    -webkit-transition:All 0.1s ease-in-out;
    -webkit-animation: x_d 1s 0s 1  linear alternate both;
}

@-webkit-keyframes x_d {
    0% {
        -webkit-transform: scale(0.5);

    }
    50% {
        -webkit-transform: rotate(180deg);
    }
    100% {
        -webkit-transform: scale(1);
    }
}

.rat1 {
    -webkit-animation: lrmove3 2s 0s infinite  linear alternate both;
    }
@-webkit-keyframes lrmove3 /* Safari and Chrome */
{
    0%   {-webkit-transform: rotate(0deg);}
    25%  {-webkit-transform: rotate(180deg);}
    50%  {-webkit-transform: rotate(360deg);}
    75%  {-webkit-transform: rotate(180deg);}
    100% {-webkit-transform: rotate(0deg);}
}

@-webkit-keyframes p2InOut1 {
    0% {
        opacity:0;
        -webkit-transform: translateX(700px);
    }
    25% {
        opacity:0;
        -webkit-transform: translateX(300px);
    }
    50% {
        opacity: 0.8;
        -webkit-transform: translateX(3px);
    }
    75% {
        opacity:1;
        -webkit-transform: translateX(5px);
    }
    100% {
        opacity:1;
        -webkit-transform: translateX(0px);
    }
}
.p2_fot1 {
    position:absolute;
    -webkit-animation-name: p2InOut1;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-duration: 1.5s;
    -webkit-animation-direction: alternate;
}