      @charset "UTF-8";
/* 动画 */
/* 首先设置.animated的动画播放时间 */
.partblock{
    position: relative;
    width: 100%;
   /*  text-align: center; */
    background-repeat: no-repeat;
    background-position: top center;
    position: relative;
   /*  text-align: center; */
}
.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.animated .action_d{
     -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
 }
/* 在定义动画出现方式 */
.animated .scroll-left {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
}
.animated .scroll-right{
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
}
.animated .scroll-up{
    -webkit-animation-name: fadeInup;
    animation-name: fadeInup;
}
.animated .scroll-top{
    -webkit-animation-name: fadeIntop;
    animation-name: fadeIntop;
}
.animated .scroll-scale{
    -webkit-animation-name: fadeInscale;
    animation-name: fadeInscale;
}
.animated .scroll-rotate{
    -webkit-animation-name: fadeInrotate;
    animation-name: fadeInrotate;
}
.animated .scroll-fadeIn{
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
}
/* 动画过程 */
@-o-keyframes fadeIn{
0% {
    opacity:0;
}
100% {
    opacity:1;
}
}
@-moz-keyframes fadeIn{
0% {
    opacity:0;
}
100% {
    opacity:1;
}
}
@-webkit-keyframes fadeIn{
0% {
    opacity:0;
}
100% {
    opacity:1;
}
}
@keyframes fadeInscale {
0% {
    opacity:0;
}
100% {
    opacity:1;
     filter:alpha(opacity=1);
   -webkit-opacity:1;
   -moz-opacity:1;
   -khtml-opacity:1;
}
}
.fadeIn {
    -webkit-animation-name:fadeIn;
    animation-name: fadeIn;
}


@-o-keyframes fadeInrotate {
0% {
    opacity:0;
    -webkit-transform:translateX(-100%) rotate(360deg) ;
}
100% {
    opacity:1;
    -webkit-transform:translateX(0) rotate(0deg);
}
}
@-moz-keyframes fadeInrotate {
0% {
    opacity:0;
    -webkit-transform:translateX(-100%) rotate(360deg) ;
}
100% {
    opacity:1;
    -webkit-transform:translateX(0) rotate(0deg);
}
}
@-webkit-keyframes fadeInrotate {
0% {
    opacity:0;
    -webkit-transform:translateX(-100%) rotate(360deg) ;
}
100% {
    opacity:1;
    -webkit-transform:translateX(0) rotate(0deg);
}
}
@keyframes fadeInrotate {
0% {
    opacity:0;
    -webkit-transform:translateX(-100%) rotate(360deg) ;
}
100% {
    opacity:1;
    -webkit-transform:translateX(0) rotate(0deg);
}
}
.fadeInrotate {
    -webkit-animation-name:fadeInrotate;
    animation-name: fadeInrotate;
}


@-o-keyframes fadeInscale {
0% {
    opacity:0;
    -webkit-transform:scale(0);
    transform:scale(0);
}
100% {
    opacity:1;
    -webkit-transform:scale(1);
    transform:scale(1);
}
}
@-moz-keyframes fadeInscale {
0% {
    opacity:0;
    -webkit-transform:scale(0);
    transform:scale(0);
}
100% {
    opacity:1;
    -webkit-transform:scale(1);
    transform:scale(1);
}
}
@-webkit-keyframes fadeInscale {
0% {
    opacity:0;
    -webkit-transform:scale(0);
    transform:scale(0);
}
100% {
    opacity:1;
    -webkit-transform:scale(1);
    transform:scale(1);
}
}
@keyframes fadeInscale {
0% {
     opacity:0;
    -webkit-transform:scale(0);
    transform:scale(0);
}
100% {
      opacity:1;
    -webkit-transform:scale(1);
    transform:scale(1);
}
}
.fadeInscale {
    -webkit-animation-name:fadeInscale;
    animation-name: fadeInscale
}


@-o-keyframes fadeInLeft {
0% {
    opacity:0;
    -webkit-transform:translate3d(-100%, 0, 0);
    transform:translate3d(-100%, 0, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
@-moz-keyframes fadeInLeft {
0% {
    opacity:0;
    -webkit-transform:translate3d(-100%, 0, 0);
    transform:translate3d(-100%, 0, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
@-webkit-keyframes fadeInLeft {
0% {
    opacity:0;
    -webkit-transform:translate3d(-100%, 0, 0);
    transform:translate3d(-100%, 0, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
@keyframes fadeInLeft {
0% {
    opacity:0;
    -webkit-transform:translate3d(-100%, 0, 0);
    transform:translate3d(-100%, 0, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft
}


@-o-keyframes fadeInup {
0% {
    opacity:0;
    -webkit-transform:translate3d(0, 150%, 0);
    transform:translate3d(0, 150%, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
@-moz-keyframes fadeInup {
0% {
    opacity:0;
    -webkit-transform:translate3d(0, 150%, 0);
    transform:translate3d(0, 150%, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
@-webkit-keyframes fadeInup {
0% {
    opacity:0;
    -webkit-transform:translate3d(0, 150%, 0);
    transform:translate3d(0, 150%, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
@keyframes fadeInup{
0% {
    opacity:0;
    -webkit-transform:translate3d(0, 150%, 0);
    transform:translate3d(0, 150%, 0);
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
.fadeInup {
    -webkit-animation-name: fadeInup;
    animation-name: fadeInup
}


@-o-keyframes fadeIntop {
0% {
    opacity:0;
    -webkit-transform:translate3d(0, -150%, 0);
    transform:translate3d(0, -150%, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
@-moz-keyframes fadeIntop {
0% {
    opacity:0;
    -webkit-transform:translate3d(0, -150%, 0);
    transform:translate3d(0, -150%, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
@-webkit-keyframes fadeIntop {
0% {
    opacity:0;
    -webkit-transform:translate3d(0, -150%, 0);
    transform:translate3d(0, -150%, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
@keyframes fadeIntop{
0% {
    opacity:0;
    -webkit-transform:translate3d(0, -150%, 0);
    transform:translate3d(0, -150%, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
.fadeIntop {
    -webkit-animation-name: fadeIntop;
    animation-name: fadeIntop
}

@-o-keyframes fadeInRight {
0% {
    opacity:0;
    -webkit-transform:translate3d(100%, 0, 0);
    transform:translate3d(100%, 0, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
@-moz-keyframes fadeInRight {
0% {
    opacity:0;
    -webkit-transform:translate3d(100%, 0, 0);
    transform:translate3d(100%, 0, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
@-webkit-keyframes fadeInRight {
0% {
    opacity:0;
    -webkit-transform:translate3d(100%, 0, 0);
    transform:translate3d(100%, 0, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
@keyframes fadeInRight {
0% {
    opacity:0;
    -webkit-transform:translate3d(100%, 0, 0);
    transform:translate3d(100%, 0, 0)
}
100% {
    opacity:1;
    -webkit-transform:none;
    transform:none
}
}
.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight
}
