@keyframes linemove {
    0% {
        margin-right: 0px !important;
    }  
    20% {
      margin-right: 20px !important;
    }

    40% {
      margin-right: 40px !important;
    }
    60% {
      margin-right: 60px !important;
    }
    80% {
      margin-right: 80px !important;
    }

    100% {
      margin-right: 120px !important;
    }
}

@keyframes lineback {
  0% {
      width: 120px;
  }  
  20% {
      width: 80px;
  }
  50% {
    width: 40px;
  }
  100% {
      width: 0px;
  }
}
  

/* 渐变动画效果 */
  @keyframes ripple {
    0% {
        transform: scale(1);
        opacity: 0;
    }
    30% {
        opacity: 0.5;
    }
    100% {
        transform: scale(2.2);
        opacity: 0;
    }
}

@keyframes ripple1 {
  0% {
      transform: scale(1);
      opacity: 0;
  }
  30% {
      opacity: 0.5;
  }
  100% {
      transform: scale(2.1);
      opacity: 0;
  }
}

/* 右循环动 */
@keyframes mover {
    0% {
        transform: translateX(0);
      }
      25% {
        transform: translateX(-1.25rem);
      }
      50% {
        transform: translateX(-2rem);
      }
      75% {
        transform: translateX(-1.25rem);
      }
      100% {
        transform: translateX(0);
      }
}
/* 左循环动 */
@keyframes movel {
    0% {
        transform: translateX(0);
      }
      25% {
        transform: translateX(1.25rem);
      }
      50% {
        transform: translateX(2rem);
      }
      75% {
        transform: translateX(1.25rem);
      }
      100% {
        transform: translateX(0);
      }
}
/* 上下循环动 */
@keyframes movey {
    0% {
        transform: translateY(0);
      }
      25% {
        transform: translateY(-1.25rem);
      }
      50% {
        transform: translateY(-2rem);
      }
      75% {
        transform: translateY(-1.25rem);
      }
      100% {
        transform: translateY(0);
      }
}

/* 旋转 */
@keyframes cspine {
  from {
    transform: rotate(0);
  }
  to {
    transform: rotate(359deg);
  }
}