@charset "UTF-8";
@keyframes load {
  0% {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes rotate {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
@keyframes scroll-bg {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 97.5% 0;
  }
}
@keyframes scroll-bg-sp {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 880.607vw 0;
  }
}
@keyframes scroll-bg-02 {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -413vw 0;
  }
}
@keyframes scroll-bg-02-reverse {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 197.5vw 0;
  }
}
@keyframes scroll-bg-02-reverse-sp {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 413vw 0;
  }
}
@keyframes scroll-bg-03 {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 0 -130.208vw;
  }
}
@keyframes scroll-bg-03-sp {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 0 -315.888vw;
  }
}
@keyframes scroll-bg-03-reverse {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 0 130.208vw;
  }
}
@keyframes scroll-bg-03-reverse-sp {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 0 315.888vw;
  }
}
@keyframes DropShadow-Move {
  0% {
    filter: drop-shadow(0px 0px 6px #921c22) drop-shadow(0px 0px 0px #921c22) drop-shadow(0px 0px 0px #921c22) drop-shadow(0px 0px 0px #921c22) brightness(1);
  }
  50% {
    filter: drop-shadow(0px 0px 6px #921c22) drop-shadow(0px 0px 6px #921c22) drop-shadow(0px 0px 6px #921c22) drop-shadow(0px 0px 6px #921c22) brightness(1.5);
  }
  100% {
    filter: drop-shadow(0px 0px 6px #921c22) drop-shadow(0px 0px 0px #921c22) drop-shadow(0px 0px 0px #921c22) drop-shadow(0px 0px 0px #921c22) brightness(1);
  }
}
@keyframes vibe {
  0% {
    transform: scale(5);
    opacity: 0;
  }
  60% {
    transform: scale(1);
    opacity: 1;
  }
  65% {
    transform: translate(0%, 0%) rotateZ(0deg);
    opacity: 1;
    transform: scale(3);
  }
  75% {
    transform: translate(2%, 2%) rotateZ(1deg);
    opacity: 1;
  }
  85% {
    transform: translate(0%, 2%) rotateZ(0deg);
    opacity: 1;
  }
  95% {
    transform: translate(2%, 0%) rotateZ(-1deg);
    opacity: 1;
  }
  100% {
    transform: translate(0%, 0%) rotateZ(0deg);
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes aiming-revised {
  0% {
    transform: translate(-80%, -50%);
    opacity: 0.5;
  }
  30% {
    transform: translate(60%, 40%);
  }
  60% {
    transform: translate(70%, -60%);
    opacity: 0.7;
  }
  80% {
    transform: translate(-10%, 10%);
  }
  100% {
    transform: translate(0%, 0%);
    opacity: 1;
  }
}
@keyframes flicker {
  0%, 100% {
    opacity: 1;
  }
  /* 1回目の「ジ」 */
  50% {
    opacity: 1;
  }
  52% {
    opacity: 0; /* 瞬時に消す */
  }
  54% {
    opacity: 1; /* すぐ戻す */
  }
  /* 2回目の「ジ」 */
  60% {
    opacity: 1;
  }
  62% {
    opacity: 0.2; /* 少し弱めに暗く */
  }
  64% {
    opacity: 1; /* すぐ戻す */
  }
  /* 3回目の「ジ」 */
  70% {
    opacity: 1;
  }
  72% {
    opacity: 0;
  }
  74% {
    opacity: 1;
  }
}
@keyframes tikatika {
  0% {
    filter: brightness(1);
  }
  100% {
    filter: brightness(1.3);
  }
}
@keyframes tikatika-move {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes Move-btnmovie {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes h-written02 {
  0% {
    stroke-dashoffset: 2300px;
  }
  100% {
    stroke-dashoffset: 0px;
  }
}
@keyframes h-written03 {
  0% {
    stroke-dashoffset: 1595px;
  }
  100% {
    stroke-dashoffset: 0px;
  }
}
@keyframes circlemove {
  0% {
    bottom: 3.125vw;
  }
  100% {
    bottom: 0px;
  }
}
@keyframes circlemove-sp {
  0% {
    bottom: 17.523vw;
  }
  100% {
    bottom: 0px;
  }
}
@keyframes cirlemovehide {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  80% {
    opacity: 0.9;
  }
  100% {
    opacity: 0;
  }
}
@keyframes infiniteRotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.active .motion-product {
  animation: Motion-Product 1.8s infinite;
}

@keyframes Motion-Product {
  0% {
    transform: scale(0);
  }
  30% {
    transform: scale(1);
  }
  80% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: scale(1);
  }
}
.active .motion-fmd {
  animation: Motion-fmd 1.2s infinite alternate;
}

@keyframes Motion-fmd {
  0% {
    transform: scale(0.5);
  }
  100% {
    transform: scale(1);
  }
}
.active .motion-lmd {
  animation: Motion-lmd 0.8s linear infinite alternate;
}

@keyframes Motion-lmd {
  0% {
    transform: translateX(10%);
  }
  100% {
    transform: translateX(-10%);
  }
}
.active .motion-contents {
  animation: Motion-contents 1.8s infinite;
}

@keyframes Motion-contents {
  0% {
    transform: rotate3d(0, 1, 0, 0deg);
  }
  100% {
    transform: rotate3d(0, 1, 0, 360deg);
  }
}
.active .motion-ec {
  animation: Motion-ec 1.8s infinite;
}

@keyframes Motion-ec {
  0% {
    transform: scale(1, 1);
  }
  35% {
    transform: scale(1.25, 0.85);
  }
  65% {
    transform: scale(0.32, 1.08);
  }
  100% {
    transform: scale(1, 1);
  }
}
.active .motion-hd {
  animation: Motion-hd 3s ease-in-out infinite;
  transform-origin: center bottom;
}

@keyframes Motion-hd {
  0% {
    transform: rotate(0deg);
  }
  9% {
    transform: rotate(20deg);
  }
  18% {
    transform: rotate(-20deg);
  }
  27% {
    transform: rotate(12deg);
  }
  36% {
    transform: rotate(-6deg);
  }
  /* ピタッと止まる */
  45% {
    transform: rotate(0deg);
  }
  /* --- 停止フェーズ (45% から 73% まで) --- */
  73% {
    transform: rotate(0deg);
  }
  /* 73% から 100% は次のサイクルの 0% に繋がる */
  100% {
    transform: rotate(0deg);
  }
}/*# sourceMappingURL=animation.css.map */