#image {
    position: absolute;
    left: 50%;
    top: 20%;
    transform: translate(-50%, 50px);
    /* 初期状態で50px下にオフセット */
    opacity: 0;
    transition: opacity 1.2s ease-out, transform 0.5s ease-out;
  }

  #image.show {
    transform: translate(-50%, 0);
    /* まっすぐ上に移動 */
    opacity: 1;
  }

  .animated-content {
    position: relative;
    /* relative コンテンツ用 */
    left: 50%;
    top: 50%;
    transform: translate(-50%, 50px);
    /* 初期状態: 50px下にオフセット */
    opacity: 0;
    transition: opacity 0.8s ease-out, transform 0.4s ease-out;
  }

  .animated-content.show {
    transform: translate(-50%, 0);
    /* まっすぐ上に移動 */
    opacity: 1;
  }

  .humotoppara-color {
    background-color: #257c2a;
  }