@charset "UTF-8";

/* ============================
   共通
============================ */
.cp-page {
}

.cp-header {
}

.cp-main {
}

.cp-hero {
}

.cp-section {
}

.cp-cta {
}

.cp-footer {
}

/* ============================
   パターンA：フェードイン
============================ */
.cp-fadein-item {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.cp-fadein.is-visible .cp-fadein-item {
  opacity: 1;
  transform: translateY(0);
}

/* 子要素の遅延（cp-fadein-delayを親に追加で有効） */
.cp-fadein-delay.is-visible .cp-fadein-item:nth-child(2) { transition-delay: 0.15s; }
.cp-fadein-delay.is-visible .cp-fadein-item:nth-child(3) { transition-delay: 0.3s; }
.cp-fadein-delay.is-visible .cp-fadein-item:nth-child(4) { transition-delay: 0.45s; }
.cp-fadein-delay.is-visible .cp-fadein-item:nth-child(5) { transition-delay: 0.6s; }
.cp-fadein-delay.is-visible .cp-fadein-item:nth-child(6) { transition-delay: 0.75s; }

/* ============================
   パターンB：ふわふわ浮遊
============================ */
.cp-float-a { animation: cp-float-a 3s ease-in-out infinite; }
.cp-float-b { animation: cp-float-b 3.8s ease-in-out 0.3s infinite; }
.cp-float-c { animation: cp-float-c 2.6s ease-in-out 1.1s infinite; }
.cp-float-d { animation: cp-float-a 3.4s ease-in-out 0.7s infinite; }
.cp-float-e { animation: cp-float-b 2.9s ease-in-out 1.5s infinite; }
.cp-float-f { animation: cp-float-c 3.6s ease-in-out 0.4s infinite; }

@keyframes cp-float-a {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}
@keyframes cp-float-b {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-9px); }
}
@keyframes cp-float-c {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-15px); }
}

/* ============================
   パターンC：横スクロールループ
============================ */
.cp-marquee {
  overflow: hidden;
}

.cp-marquee-track {
  display: flex;
  width: max-content;
  animation: cp-marquee 20s linear infinite;
}

.cp-marquee-reverse.cp-marquee-track {
  animation-direction: reverse;
}

/* ============================
   パターンD：ポップアップ
============================ */
.cp-popup-item {
  animation: cp-popup 1.5s ease-in-out infinite;
}

/* ============================
   パターンE：アンダーライン
============================ */
.cp-underline {
  background-image: linear-gradient(transparent 60%, #ffe14d 60%);
  background-size: 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.6s ease;
}

.cp-underline-wrap.is-visible .cp-underline {
  background-size: 100% 100%;
}

/* ============================
   パターンF：クリップ展開（左→右）
============================ */
.cp-reveal-item {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.8s ease;
}

.cp-reveal.is-visible .cp-reveal-item {
  clip-path: inset(0 0 0 0);
}

/* ============================
   パターンG：テキストコピー
============================ */
.cp-copy {
  cursor: pointer;
}

.cp-copy-done {
  pointer-events: none;
  opacity: 0;
  position: absolute;
  font-size: 12px;
  transition: opacity 0.3s ease;
}

.cp-copy.is-copied .cp-copy-done {
  opacity: 1;
}

/* ============================
   パターンH：アコーディオン
============================ */
.cp-acc-head {
  cursor: pointer;
}

.cp-acc-body {
  display: none;
}

/* ============================
   パターンI：上から展開
============================ */
.cp-dropdown-item {
  clip-path: inset(0 0 100% 0 round 0 0 500px 500px);
}
.cp-dropdown.is-visible .cp-dropdown-item {
  animation: cp-dropdown 1s ease forwards;
  animation-delay: 1s;
}

@keyframes cp-dropdown {
  0% { clip-path: inset(0 0 100% 0 round 0 0 500px 500px); }
  100% { clip-path: inset(0 0 0 0 round 0); }
}

@keyframes cp-popup {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.15); }
}

@keyframes cp-marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}