@keyframes long {
  0% {
      width: 0
  }

  25% {
      width: 25%
  }

  50% {
      width: 100%
  }

  75% {
      width: 25%
  }

  to {
      width: 0
  }
}
 
 
@keyframes swiper_img_move{
    0%{
        transform:scale(1.2,1.2);
        -webkit-transform:scale(1.2,1.2);
        -moz-transform:scale(1.2,1.2);
        -ms-transform:scale(1.2,1.2);
        -o-transform:scale(1.2,1.2);
}
    
    100%{
        -webkit-transform:scale(1,1);
        transform:scale(1,1);
        -moz-transform:scale(1,1);
        -ms-transform:scale(1,1);
        -o-transform:scale(1,1);
}
}
 

@keyframes topFloat {
    from {
        transform: translateY(-20px);
        opacity: 0;
        -webkit-transform: translateY(-20px);
        -moz-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        -o-transform: translateY(-20px);
}

    to {
        transform: translateY(0);
        opacity: 1;
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
}
}


@keyframes zooninFloat {
    from {
        transform: scale(0.9);
        opacity: 0;
        -webkit-transform: scale(0.9);
        -moz-transform: scale(0.9);
        -ms-transform: scale(0.9);
        -o-transform: scale(0.9);
}

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



@keyframes aftermove {
    from {
        left: -80px;
    }

    to {
        left: 200px;
    }
}

@-webkit-keyframes aftermove

/*Safari and Chrome*/
    {
    from {
        left: -80px;

    }

    to {
        left: 200px;
    }
}

@keyframes layui-rotate
{
    0% {
        transform: rotate(0);
    }
    
    100% {
        transform: rotate(360deg);
    }
}