<div class="orinn-ring-wrap">
  <div class="orinn-ring"></div>
  <p class="orinn-text">そっと触れてください<br>カメラがひらきます</p>
</div>

<script>
document.addEventListener("DOMContentLoaded", function () {
  const ring = document.querySelector('.orinn-ring');

  // 初回アクセス時の 1 回だけの“さざ波”
  ring.classList.add('initial-wave');

  // タップ時の収束アニメーション
  ring.addEventListener('click', function () {
    ring.classList.add('tap-zoom');
    setTimeout(() => {
      // ここで次のページへ遷移させる
      // location.href = "next_page_url";
    }, 400);
  });
});
</script>