.scrolldown {
  position: absolute;
  bottom: 1%;
  right: 50%;
  /*矢印の動き1秒かけて永遠にループ*/
  animation: arrowmove 1s ease-in-out infinite;
}

/*下からの距離が変化して全体が下→上→下に動く*/
@keyframes arrowmove {
  0% {
    bottom: 2%;
  }
  50% {
    bottom: 6%;
  }
  100% {
    bottom: 2%;
  }
}

/*Scrollテキストの描写*/
.scrolldown span {
  /*描画位置*/
  margin-right: 10px;
  /*テキストの形状*/
  color: #eee;
  font-size: 1rem;
  letter-spacing: 0.5em;
}

/* 矢印の描写 */
.scrolldown:before {
  content: "";
  /*描画位置*/
  position: absolute;
  bottom: 0;
  right: -6px;
  /*矢印の形状*/
  width: 5px;
  height: 20px;
  background: #eee;
  transform: skewX(-31deg);
}

.scrolldown:after {
  content: "";
  /*描画位置*/
  position: absolute;
  bottom: 0;
  right: 0;
  /*矢印の形状*/
  width: 5px;
  height: 50px;
  background: #eee;
}