/* ============================================
   anime.css — 演出アニメーション
   ============================================ */

/* ------ top_mv_catch : 左から右へフェードイン ------ */

@keyframes catch_slide_in {
  0% {
    opacity: 0;
    clip-path: inset(0 100% 0 0);
    transform: translateX(-24px);
  }
  100% {
    opacity: 1;
    clip-path: inset(0 0% 0 0);
    transform: translateX(0);
  }
}

.top_mv_catch {
  animation: catch_slide_in 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  animation-delay: 0.4s;
}

.top_company_circle_ttlblock {
  opacity: 0;
}
.top_company_circle_ttlblock.is-animated {
  animation: catch_slide_in 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

/* ------ top_mv_box : 透明から出現（フェードイン） ------ */

@keyframes box_fade_in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.top_mv_box {
  animation: box_fade_in 3s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

.top_company_circles {
  opacity: 0;
}
.top_company_circles.is-animated {
  animation: box_fade_in 3s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}


@keyframes walkSwing {
	0% {
		transform: rotate(-2deg);
	}

	50% {
		transform: rotate(2deg);
	}

	100% {
		transform: rotate(-2deg);
	}
}

@keyframes floatUpDown {
	0% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-10px);
	}

	100% {
		transform: translateY(0);
	}
}

@keyframes rotateCircle {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}