.animate.item_1 {
  position: absolute;
  top: 32%;
  left: 46%;
  background: url("../images/animate-mouse.png") no-repeat;
  background-size: 100%;
  width: 1.7vw;
  height: 1.7vw;
}

.animate.item_2 {
  position: absolute;
  top: 34%;
  left: 24%;
  background: url("../images/animate-dottedLine.png") no-repeat;
  background-size: 100%;
  width: 9vw;
  height: 5vw;
}

.animate.item_3 {
  position: absolute;
  top: 46%;
  left: 15%;
  background: url("../images/animate-browser.png") no-repeat;
  background-size: 100%;
  width: 3vw;
  height: 4vw;
}

.animate.item_3:after {
  content: "";
  position: absolute;
  top: 25%;
  left: 57%;
  background: url("../images/animate-mouse.png") no-repeat;
  background-size: 100%;
  width: 1.7vw;
  height: 1.7vw;
}

.animate.item_4 {
  /* position: absolute;
  top: 30%;
  left: 35%; */
  position: relative;
  background: url("../images/animate-drag.png") no-repeat;
  background-size: 100%;
  width: 4vw;
  height: 1.3vw;
}

.animate.item_4::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -50%;
  background: url("../images/animate-mouse.png") no-repeat;
  background-size: 100%;
  width: 1.7vw;
  height: 1.7vw;
}

/* 拖弋动画 */
.actionMove {
  position: absolute;
  top: 30%;
  left: 35%;
  animation-name: actionMove;
  animation-duration: 2s;
  animation-iteration-count: infinite;
}

@keyframes actionMove {
  0% {
    transform: translateX(0%);
    opacity: 0;
  }
  100% {
    transform: translateX(-120%);
    opacity: 1;
  }
}