@font-face { font-family: 'LINE Seed JP'; font-weight: 400; font-display: swap; src: url('/fonts/LINESeedJP_OTF_Rg.woff2') format('woff2'); }
@font-face { font-family: 'LINE Seed JP'; font-weight: 700; font-display: swap; src: url('/fonts/LINESeedJP_OTF_Bd.woff2') format('woff2'); }
@font-face { font-family: 'LINE Seed JP'; font-weight: 800; font-display: swap; src: url('/fonts/LINESeedJP_OTF_Eb.woff2') format('woff2'); }
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

/* レスポンシブ改行ユーティリティ */
.br-sp { display: none; }
@media (max-width: 768px) {
  .br-sp { display: inline; }
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: clamp(28px, 2.778vw, 40px);
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

:root {
  --text: #2A1A0E;
  --text-sub: rgba(42,26,14,0.4);
  --brand: #F7A01D;
  --brand-pale: #FDE0A8;
  --pink: #F0C878;
  --purple: #E08A30;
  --bg: #FFFCF8;
}

body { font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif; color: var(--text); background: var(--bg); -webkit-font-smoothing: antialiased; }

/* キーボードフォーカス（WCAG 2.4.7 - キーボード操作時のみ表示） */
:focus { outline: none; }
:focus-visible {
  outline: 3px solid #F7A01D;
  outline-offset: 2px;
  border-radius: 4px;
}

/* SR専用テキスト */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* スキップリンク (キーボード Tab で最初に表示) */
.skip-link {
  position: absolute;
  top: -100px;
  left: 0;
  z-index: 100;
  background: #2A1A0E;
  color: #fff;
  padding: 12px 20px;
  text-decoration: none;
  font-weight: 700;
  border-radius: 0 0 8px 0;
}
.skip-link:focus {
  top: 0;
}

/* NAV: go-gx(分離型フロストガラスカプセル) */
.header {
  position: fixed; top: 0; left: 0; width: 100%; height: clamp(72px, 7.639vw, 110px);
  padding: clamp(12px, 1.389vw, 20px) clamp(16px, 1.944vw, 28px); display: flex; align-items: center; justify-content: space-between; z-index: 100;
}

.pill {
  display: flex; align-items: center;
  background: rgba(255,255,255,0.6); border: 1px solid rgba(255,255,255,0.7);
  border-radius: 50px; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  box-shadow: 8px 8px 16px rgba(200,180,150,0.15), -4px -4px 16px rgba(255,255,255,0.5);
}

.logo-pill {
  display: flex; align-items: center;
  padding: clamp(6px, 0.556vw, 8px) clamp(14px, 1.389vw, 20px); gap: 0; height: clamp(48px, 4.722vw, 68px);
  background: transparent; border: none; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none;
}
.logo-pill a { text-decoration: none; display: flex; align-items: center; }
.logo-pill img { height: clamp(32px, 3.194vw, 46px); width: auto; }

.nav-pill { padding: clamp(8px, 0.833vw, 12px) clamp(10px, 1.111vw, 16px); gap: 0; height: auto; }
.nav-links { display: flex; list-style: none; align-items: center; }
.nav-links > li { display: flex; align-items: center; }
.nav-links a { font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif; font-size: clamp(14px, 1.042vw, 15px); font-weight: 400; letter-spacing: 1px; color: var(--text); text-decoration: none; padding: 0 clamp(12px, 1.25vw, 18px); line-height: clamp(40px, 3.611vw, 52px); transition: opacity 0.3s; }
.nav-links a:hover { opacity: 0.5; }

/* 階層ナビ：親（ボタン） */
.nav-links .has-children { position: relative; }
.nav-parent {
  background: transparent; border: 0; cursor: pointer;
  display: inline-flex; align-items: center; gap: clamp(4px, 0.417vw, 6px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(14px, 1.042vw, 15px); font-weight: 400;
  letter-spacing: 1px; color: var(--text);
  padding: 0 clamp(12px, 1.25vw, 18px);
  line-height: clamp(40px, 3.611vw, 52px);
  transition: opacity 0.3s, color 0.3s;
}
.nav-parent:hover { opacity: 0.5; }
.nav-parent.is-active { color: var(--brand); }
.nav-caret {
  width: 7px; height: 7px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translate(-1px, -1px);
  transition: transform 0.25s;
}
.has-children:hover .nav-caret,
.has-children:focus-within .nav-caret { transform: rotate(-135deg) translate(-1px, -1px); }

/* 階層ナビ：サブメニュー */
.nav-submenu {
  position: absolute;
  top: calc(100% - 2px);
  left: 50%;
  margin: 0;
  padding: clamp(6px, 0.556vw, 8px) 0;
  min-width: clamp(160px, 13.889vw, 200px);
  background: #fff;
  border: 1px solid rgba(247,160,29,0.2);
  border-radius: clamp(10px, 1.111vw, 14px);
  list-style: none;
  box-shadow: 0 14px 30px rgba(42,26,14,0.14);
  opacity: 0; pointer-events: none;
  transform: translate(-50%, 8px);
  transition: opacity 0.22s, transform 0.22s;
  z-index: 100;
}
.has-children:hover .nav-submenu,
.has-children:focus-within .nav-submenu {
  opacity: 1; pointer-events: auto;
  transform: translate(-50%, 0);
}
.nav-submenu li { display: block; }
.nav-submenu a {
  display: block;
  padding: clamp(8px, 0.833vw, 12px) clamp(16px, 1.667vw, 24px);
  font-size: clamp(14px, 1.042vw, 15px);
  font-weight: 500;
  letter-spacing: 0.5px;
  color: var(--text);
  line-height: 1.5;
  white-space: nowrap;
  transition: background 0.2s, color 0.2s, opacity 0.2s;
}
.nav-submenu a:hover {
  color: var(--brand);
  opacity: 1;
}
.nav-submenu a.is-active {
  color: var(--brand);
  font-weight: 700;
}

/* CTA: go-gx(グラデーションピル+INNER_SHADOW) → オレンジ系 */
.nav-cta {
  display: flex; align-items: center; height: clamp(40px, 3.611vw, 52px); padding: 0 clamp(18px, 1.944vw, 28px);
  background: linear-gradient(90deg, #FCBE4A, #F7A01D);
  border-radius: 44px; text-decoration: none;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif; font-size: clamp(14px, 1.042vw, 15px); font-weight: 700; color: #FFF; letter-spacing: 1px;
  box-shadow: inset 0 2px 4px rgba(255,255,255,0.25), inset 0 1px 1px rgba(255,255,255,0.15);
  margin-left: 8px;
  transition: transform 0.3s cubic-bezier(0.16,1,0.3,1);
}
.nav-cta:hover { transform: scale(1.04); }

/* セカンダリCTA: 会員様用入口（ダークブラウン基調） */
.nav-login {
  display: inline-flex; align-items: center; gap: clamp(6px, 0.556vw, 8px);
  height: clamp(40px, 3.611vw, 52px); padding: 0 clamp(16px, 1.667vw, 22px);
  background: #fff;
  border: 2px solid #F7A01D;
  border-radius: 44px; text-decoration: none;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(13px, 0.972vw, 14px); font-weight: 700; color: #F7A01D;
  letter-spacing: 0.5px;
  margin-left: 8px;
  transition: transform 0.3s cubic-bezier(0.16,1,0.3,1), background 0.2s ease, color 0.2s ease;
}
.nav-login:hover { transform: scale(1.04); background: #FFF7E8; }
.nav-login-icon {
  width: clamp(13px, 0.972vw, 14px); height: clamp(13px, 0.972vw, 14px);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F7A01D' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><rect x='4' y='11' width='16' height='10' rx='2'/><path d='M8 11V7a4 4 0 0 1 8 0v4'/></svg>");
  background-repeat: no-repeat; background-size: contain;
  flex-shrink: 0;
}

/* ===== Hamburger Toggle (タブレット/スマホで表示) ===== */
.menu-toggle {
  display: none;
  position: relative;
  width: clamp(56px, 5vw, 72px);
  height: clamp(56px, 5vw, 72px);
  padding: 0;
  border: none;
  background: rgba(255,255,255,0.7);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-radius: 9999px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  cursor: pointer;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(5px, 0.5vw, 7px);
  z-index: 110;
  transition: transform 0.2s ease;
}
.menu-toggle:hover { transform: scale(1.04); }
.menu-toggle-bar {
  display: block;
  width: clamp(20px, 1.8vw, 26px);
  height: 2px;
  background: var(--text);
  border-radius: 1px;
  transition: transform 0.3s ease, opacity 0.3s ease;
}
.menu-toggle.is-open .menu-toggle-bar:nth-child(1) {
  transform: translateY(calc(clamp(5px, 0.5vw, 7px) + 2px)) rotate(45deg);
}
.menu-toggle.is-open .menu-toggle-bar:nth-child(2) { opacity: 0; }
.menu-toggle.is-open .menu-toggle-bar:nth-child(3) {
  transform: translateY(calc(-1 * (clamp(5px, 0.5vw, 7px) + 2px))) rotate(-45deg);
}

/* ===== Mobile Menu (全画面オーバーレイ) ===== */
.mobile-menu {
  position: fixed;
  inset: 0;
  background: rgba(255,252,248, 0.96);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  z-index: 95;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s ease, visibility 0.35s ease;
}
.mobile-menu.is-open { opacity: 1; visibility: visible; }
.mobile-menu-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(20px, 2.5vw, 32px);
  padding: 0;
  margin: 0;
  text-align: left;
}
.mobile-menu-list li {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}
.mobile-menu.is-open .mobile-menu-list li { opacity: 1; transform: translateY(0); }
.mobile-menu.is-open .mobile-menu-list li:nth-child(1) { transition-delay: 0.10s; }
.mobile-menu.is-open .mobile-menu-list li:nth-child(2) { transition-delay: 0.15s; }
.mobile-menu.is-open .mobile-menu-list li:nth-child(3) { transition-delay: 0.20s; }
.mobile-menu.is-open .mobile-menu-list li:nth-child(4) { transition-delay: 0.25s; }
.mobile-menu.is-open .mobile-menu-list li:nth-child(5) { transition-delay: 0.30s; }
.mobile-menu.is-open .mobile-menu-list li:nth-child(6) { transition-delay: 0.35s; }
.mobile-menu.is-open .mobile-menu-list li:nth-child(7) { transition-delay: 0.40s; }
.mobile-menu-list a {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(20px, 2.4vw, 26px);
  font-weight: 400;
  letter-spacing: 1.5px;
  color: var(--text);
  text-decoration: none;
  transition: opacity 0.3s ease;
}
.mobile-menu-list a:hover { opacity: 0.5; }
.mobile-menu-list a.is-active { color: var(--brand); font-weight: 700; }

/* モバイルメニュー：階層グループ */
.mobile-menu-group {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(10px, 1vw, 14px);
}
.mobile-menu-group-label {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(20px, 2vw, 26px);
  font-weight: 700;
  color: var(--text);
  opacity: 0.55;
  letter-spacing: 1.5px;
}
.mobile-menu-sublist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(8px, 0.833vw, 12px);
}
.mobile-menu-sublist a {
  font-size: clamp(18px, 1.8vw, 22px) !important;
  font-weight: 500 !important;
}
.mobile-menu-sublist a::before {
  content: '└ ';
  opacity: 0.4;
  margin-right: 4px;
}
.mobile-menu-cta {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: clamp(240px, 60vw, 320px);
  box-sizing: border-box;
  background: linear-gradient(90deg, #FCBE4A, #F7A01D);
  border: 2px solid transparent;
  color: #fff !important;
  padding: clamp(16px, 1.6vw, 22px) clamp(36px, 3.5vw, 52px);
  border-radius: 9999px;
  font-size: clamp(18px, 2.2vw, 24px) !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
  margin-top: clamp(4px, 0.6vw, 8px);
  box-shadow: inset 0 2px 4px rgba(255,255,255,0.25), inset 0 1px 1px rgba(255,255,255,0.15);
  transition: transform 0.2s ease;
}
.mobile-menu-cta:hover { opacity: 1 !important; transform: scale(1.04); }
.mobile-menu-login {
  display: inline-flex !important; align-items: center; justify-content: center;
  gap: clamp(8px, 0.833vw, 12px);
  width: clamp(240px, 60vw, 320px);
  box-sizing: border-box;
  background: #fff;
  border: 2px solid #F7A01D;
  color: #F7A01D !important;
  padding: clamp(16px, 1.6vw, 22px) clamp(36px, 3.5vw, 52px);
  border-radius: 9999px;
  font-size: clamp(18px, 2.2vw, 24px) !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
  margin-top: clamp(16px, 1.8vw, 24px);
  transition: transform 0.2s ease, background 0.2s ease;
}
.mobile-menu-login:hover { opacity: 1 !important; transform: scale(1.04); background: #FFF7E8; }
.mobile-menu-login-icon {
  display: inline-block;
  width: clamp(18px, 2vw, 22px); height: clamp(18px, 2vw, 22px);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F7A01D' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><rect x='4' y='11' width='16' height='10' rx='2'/><path d='M8 11V7a4 4 0 0 1 8 0v4'/></svg>");
  background-repeat: no-repeat; background-size: contain;
  flex-shrink: 0;
}
body.is-menu-open { overflow: hidden; }

@media (max-width: 1024px) {
  .menu-toggle { display: flex; }
}

.hero { position: relative; width: 100%; height: 100vh; min-height: clamp(560px, 52.78vw, 760px); overflow: visible; background: #fef6e8; }
.hero-bg-clip { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }

/* 巨大装飾円 → オレンジ系シャドウ */
.deco-circle {
  position: absolute; top: 50%; left: 55%; transform: translate(-50%,-50%);
  width: 1800px; height: 1800px; border-radius: 900px;
  background: #FFFFFF;
  box-shadow: 0 4px 140px rgba(247,160,29,0.12);
  pointer-events: none;
}

/* ブロブ → オレンジ系パステル3色 */
.blobs { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; }
.blob {
  position: absolute; border-radius: 50%;
  animation: blobFloat 6s ease-in-out infinite;
}
.b1 { width: 520px; height: 520px; background: radial-gradient(circle, var(--brand-pale), transparent 70%); top: 5%; right: 5%; opacity: 0.5; animation-delay: 0s; }
.b2 { width: 400px; height: 400px; background: radial-gradient(circle, var(--pink), transparent 70%); top: 35%; right: 20%; opacity: 0.3; animation-delay: 1s; }
.b3 { width: 340px; height: 340px; background: radial-gradient(circle, var(--purple), transparent 70%); top: 50%; right: 0%; opacity: 0.2; animation-delay: 2s; }
@keyframes blobFloat {
  0%,100% { transform: translate(0,0); }
  50% { transform: translate(10px,-15px); }
}

.hero-content {
  position: absolute; top: 50%; left: clamp(28px, 5.556vw, 80px); transform: translateY(-55%); z-index: 2;
  max-width: clamp(320px, 33.333vw, 480px);
}

.hero-visual {
  position: absolute; top: 50%; right: clamp(12px, 1.389vw, 20px); transform: translateY(-50%); z-index: 3;
  width: 56%; max-width: 880px;
}
.hero-visual-wrap {
  position: relative;
}

/* 巨大オレンジ正円 — 画面右半分を覆い、左右を二分割する */
.hero-orange-circle {
  position: absolute;
  top: 50%; right: -300px; transform: translateY(-50%);
  width: 1200px; height: 1200px;
  background: radial-gradient(circle at 30% 40%, #fffcf6 0%, #fef9f0 25%, #fdf2e0 50%, #fcebd2 70%, #fdf2e0 85%, #fef6e8 100%);
  border-radius: 50%;
  z-index: 1;
  pointer-events: none;
}
.hero-visual img {
  position: relative; z-index: 3;
  width: 100%; height: auto; display: block;
  filter: drop-shadow(0 12px 40px rgba(42,26,14,0.15));
}

.hero-heading {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif; font-size: clamp(28px, 3.333vw, 48px); font-weight: 700;
  letter-spacing: 2px; line-height: 1.5; color: var(--text);
}

.hero-sub {
  margin-top: clamp(14px, 1.528vw, 22px); font-size: clamp(15px, 1.111vw, 16px); font-weight: 400; letter-spacing: 0.04em;
  line-height: 1.9; color: var(--text); max-width: clamp(280px, 29.861vw, 430px);
}

/* CTA → ナビCTAと同じデザイン(go-gxスタイル) */
.hero-cta {
  display: inline-flex; align-items: center; margin-top: clamp(20px, 2.222vw, 32px);
  height: clamp(40px, 3.611vw, 52px); padding: 0 clamp(18px, 1.944vw, 28px);
  background: linear-gradient(90deg, #FCBE4A, #F7A01D);
  border-radius: 44px; text-decoration: none;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif; font-size: clamp(15px, 1.181vw, 17px); font-weight: 700; color: #FFF; letter-spacing: 1px;
  box-shadow: inset 0 2px 4px rgba(255,255,255,0.25), inset 0 1px 1px rgba(255,255,255,0.15);
  transition: transform 0.3s cubic-bezier(0.16,1,0.3,1);
}
.hero-cta:hover { transform: scale(1.04); }

@media (max-width: 1024px) {
  .hero-heading { font-size: 36px; }
  .hero-content { left: 48px; max-width: 380px; }
  .hero-visual { width: 50%; right: 24px; }
  .hero-orange-circle { width: 1000px; height: 1000px; right: -200px; }
  .nav-pill { display: none; }
  .deco-circle { width: 1200px; height: 1200px; border-radius: 600px; }
}
@media (max-width: 768px) {
  .hero { height: 88vh; min-height: 560px; }
  .hero-heading { font-size: 32px; }
  .hero-content { left: 28px; right: 28px; max-width: none; top: 40%; text-align: center; z-index: 4; }
  .hero-sub { max-width: none; text-align: left; }
  .hero-cta {
    width: min(360px, calc(100vw - 56px));
    max-width: 100%; height: 64px; padding: 0 32px;
    font-size: 16px; border-radius: 9999px;
    justify-content: center;
  }
  .hero-visual { position: relative; top: auto; right: auto; transform: none; width: 90%; max-width: 400px; margin: 0 auto; padding-top: 58vh; }
  .deco-circle { width: 800px; height: 800px; border-radius: 400px; left: 60%; }
  .b1 { width: 200px; height: 200px; } .b2,.b3 { display: none; }
  .hero-orange-circle { width: 600px; height: 600px; right: -150px; }
  .logo-pill { height: 56px; padding: 6px 14px; }
  .logo-pill img { height: 38px; }
}

/* ===== Sub Page Header (livesense派生 + 画像背景オーバーレイ) ===== */
.sub-hero { background: var(--bg); position: relative; }
.sub-hero-band {
  background: linear-gradient(135deg, #FCBE4A, #F7A01D);
  padding: clamp(140px, 13.889vw, 200px) 0 clamp(140px, 13.889vw, 200px);
  position: relative;
  overflow: hidden;
}
.sub-hero-band.has-image {
  background-image:
    linear-gradient(135deg, rgba(252,190,74,0.75), rgba(247,160,29,0.88)),
    var(--sub-hero-image);
  background-size: cover;
  background-position: var(--sub-hero-image-position, center);
  background-repeat: no-repeat;
  background-color: var(--brand);
}
.sub-hero-band-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 clamp(24px, 2.778vw, 40px);
  color: #ffffff;
  text-align: center;
  position: relative;
  z-index: 1;
  text-shadow: 0 2px 12px rgba(120,68,8,0.25);
}
.sub-hero-eyebrow {
  display: block;
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(14px, 1.097vw, 15.8px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: clamp(2px, 0.208vw, 3px);
}
.sub-hero-headline {
  margin-top: clamp(18px, 1.806vw, 26px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(32px, 3.472vw, 50px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: clamp(2px, 0.174vw, 2.5px);
}
@media (max-width: 480px) {
  .sub-hero-band { padding: 120px 0 100px; }
  .sub-hero-headline { letter-spacing: 1.5px; }
}

/* パンくずリスト */
.breadcrumb {
  background: #fff;
}
.breadcrumb-list {
  list-style: none;
  margin: 0 auto;
  padding: clamp(12px, 1.111vw, 16px) clamp(20px, 2.778vw, 40px);
  max-width: 1280px;
  display: flex;
  flex-wrap: wrap;
  gap: clamp(6px, 0.556vw, 8px) clamp(8px, 0.833vw, 12px);
  font-size: clamp(14px, 0.972vw, 14px);
  line-height: 1.6;
}
.breadcrumb-item {
  display: inline-flex;
  align-items: center;
  gap: clamp(6px, 0.556vw, 8px);
  color: rgba(42,26,14,0.6);
}
.breadcrumb-item + .breadcrumb-item::before {
  content: '';
  width: 6px;
  height: 6px;
  border-right: 1.5px solid rgba(42,26,14,0.35);
  border-top: 1.5px solid rgba(42,26,14,0.35);
  transform: rotate(45deg);
  display: inline-block;
}
.breadcrumb-item a {
  color: rgba(42,26,14,0.6);
  text-decoration: none;
  letter-spacing: 0.5px;
  transition: color 0.2s;
}
.breadcrumb-item a:hover {
  color: var(--brand);
}
.breadcrumb-item [aria-current="page"] {
  color: var(--brand);
  font-weight: 600;
  letter-spacing: 0.5px;
}

/* ===== Intro Prep (system: 必要機材リスト + オンラインショップバナー) ===== */
.intro-prep {
  background: #fff;
  padding: clamp(48px, 5.556vw, 80px) clamp(20px, 2.778vw, 40px);
}
.intro-prep-inner { max-width: 1180px; margin: 0 auto; }

.intro-head { text-align: center; margin-bottom: clamp(48px, 5vw, 72px); }
.intro-title {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(26px, 2.778vw, 40px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 1px;
  color: var(--text);
}
.intro-lead {
  margin-top: clamp(16px, 1.667vw, 24px);
  font-size: clamp(15px, 1.111vw, 16px);
  color: rgba(42,26,14,0.75);
  line-height: 1.9;
}
.intro-lead a {
  color: var(--brand);
  text-decoration: underline;
  text-underline-offset: 4px;
  font-weight: 600;
}
.intro-lead a:hover { text-decoration-thickness: 2px; }

.prep-list-wrap {
  background: var(--bg);
  border-radius: clamp(20px, 2.222vw, 32px);
  padding: clamp(40px, 4.167vw, 60px) clamp(20px, 3.333vw, 48px);
  border: 1px solid rgba(247,160,29,0.18);
}
.prep-list-title {
  text-align: center;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(18px, 1.806vw, 26px);
  font-weight: 700;
  margin-bottom: clamp(28px, 3.333vw, 48px);
  color: var(--text);
  letter-spacing: 0.5px;
}
.prep-list {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: auto auto;
  column-gap: clamp(8px, 0.833vw, 12px);
  row-gap: clamp(16px, 1.667vw, 24px);
}
.prep-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(10px, 1.042vw, 15px);
  background: #fff;
  border: 1px solid rgba(42,26,14,0.06);
  border-radius: clamp(12px, 1.389vw, 20px);
  padding: clamp(22px, 2.222vw, 32px) clamp(16px, 1.667vw, 24px);
  box-shadow: 0 4px 12px rgba(42,26,14,0.04);
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.prep-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(247,160,29,0.12);
  border-color: rgba(247,160,29,0.35);
}
.prep-num {
  flex: 0 0 auto;
  width: clamp(32px, 2.778vw, 40px);
  height: clamp(32px, 2.778vw, 40px);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--brand);
  color: #fff;
  border-radius: 50%;
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(14px, 1.042vw, 15px);
  font-weight: 700;
  letter-spacing: 0.5px;
  box-shadow: 0 4px 10px rgba(247,160,29,0.3);
}
.prep-list-item {
  display: grid;
  grid-row: span 2;
  grid-template-rows: subgrid;
  row-gap: 0;
}
.prep-name {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(14px, 1.111vw, 16px);
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.5px;
  line-height: 1.4;
}
.prep-link {
  text-align: center;
  font-size: clamp(13px, 0.903vw, 13px);
  color: var(--brand);
  font-weight: 600;
  text-decoration: none;
  line-height: 1.4;
  padding: clamp(2px, 0.347vw, 5px) 4px;
  border-bottom: 1px dashed transparent;
  align-self: start;
  margin-top: clamp(8px, 0.833vw, 12px);
  transition: border-color 0.2s ease, color 0.2s ease;
}
.prep-link:hover {
  border-bottom-color: currentColor;
  color: #d6831a;
}
.prep-sub {
  text-align: center;
  font-size: clamp(13px, 0.903vw, 13px);
  color: rgba(42,26,14,0.7);
  line-height: 1.5;
  padding: clamp(2px, 0.347vw, 5px) 4px;
  align-self: start;
  margin-top: clamp(8px, 0.833vw, 12px);
}
.prep-sub a {
  color: var(--brand);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.prep-sub a:hover { text-decoration-thickness: 2px; }

.shop-banner {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: clamp(16px, 1.667vw, 24px);
  text-decoration: none;
  margin: clamp(28px, 3.333vw, 48px) auto 0;
  max-width: 720px;
  position: relative;
  background-color: var(--brand);
  background-image:
    linear-gradient(rgba(247,160,29,0.82), rgba(247,160,29,0.82)),
    url('/photos/photo-amplifier.jpg');
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  border-radius: clamp(14px, 1.389vw, 20px);
  padding: clamp(16px, 1.667vw, 24px) clamp(20px, 2.222vw, 32px);
  color: #fff;
  box-shadow: 0 12px 32px rgba(247,160,29,0.28);
  position: relative;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.shop-banner > * { position: relative; z-index: 1; }
.shop-banner-text { text-shadow: 0 1px 4px rgba(120,68,8,0.3); }
.shop-banner:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 40px rgba(247,160,29,0.4);
}
.shop-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(2px, 0.347vw, 5px);
  text-align: center;
  min-width: 0;
}
.shop-banner-eyebrow {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(13px, 0.903vw, 13px);
  font-weight: 500;
  letter-spacing: 1.5px;
  opacity: 0.95;
}
.shop-banner-title {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(20px, 2.083vw, 30px);
  font-weight: 700;
  letter-spacing: 3px;
  line-height: 1.2;
}
.shop-banner-arrow {
  flex: 0 0 auto;
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(17px, 1.319vw, 19px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: clamp(36px, 3.056vw, 44px);
  height: clamp(36px, 3.056vw, 44px);
  border-radius: 50%;
  background: rgba(255,255,255,0.2);
  border: 1.5px solid rgba(255,255,255,0.6);
  transition: background 0.3s ease, transform 0.3s ease;
  position: absolute;
  right: clamp(20px, 2.222vw, 32px);
  top: 50%;
  transform: translateY(-50%);
}
.shop-banner:hover .shop-banner-arrow {
  background: rgba(255,255,255,0.35);
  transform: translateY(-50%) translateX(4px);
}

@media (max-width: 1024px) {
  .prep-list { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .prep-list { grid-template-columns: repeat(2, 1fr); }
  .prep-item { padding: 14px 10px; }
  .shop-banner { padding: 14px 18px; }
  .shop-banner-title { letter-spacing: 2px; }
}
@media (max-width: 480px) {
  .prep-list { grid-template-columns: 1fr; }
}

/* ===== Diagnosis Chart (system: かんたんYES/NO診断 — 旧yesno_new.jpgの刷新版) ===== */
.diagnosis {
  --dc-line: rgba(247, 160, 29, 0.45);
  --dc-yes: #E66B7C;
  --dc-no: #4F9DC4;
  background: var(--bg);
  padding: clamp(48px, 5.556vw, 80px) clamp(20px, 2.778vw, 40px);
}
.diagnosis-inner { max-width: 1180px; margin: 0 auto; }

.diagnosis-head { text-align: center; margin-bottom: clamp(48px, 5vw, 72px); }
.diagnosis-title {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(24px, 2.5vw, 36px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 1px;
  color: var(--text);
}
.diagnosis-lead {
  margin-top: clamp(10px, 1.111vw, 16px);
  font-size: clamp(15px, 1.111vw, 16px);
  color: rgba(42,26,14,0.7);
}

.dc-chart {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  position: relative;
}
.dc-row { display: grid; align-items: stretch; }
.dc-row-start, .dc-row-q1 { justify-content: center; }
.dc-row-q2 { grid-template-columns: 1fr 1fr; gap: clamp(24px, 2.778vw, 40px); }
.dc-row-results { grid-template-columns: repeat(4, 1fr); gap: clamp(12px, 1.389vw, 20px); }

.dc-start {
  display: inline-block;
  background: transparent;
  color: var(--brand);
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(20px, 2.083vw, 30px);
  font-weight: 800;
  letter-spacing: 6px;
  padding: 0;
  border: none;
  box-shadow: none;
  line-height: 1;
  margin-bottom: clamp(16px, 1.667vw, 24px);
}

.dc-q {
  background: var(--brand);
  color: #fff;
  border-radius: clamp(16px, 1.667vw, 24px);
  padding: clamp(22px, 2.361vw, 34px) clamp(18px, 2.083vw, 30px);
  text-align: center;
  font-size: clamp(15px, 1.111vw, 16px);
  line-height: 1.75;
  font-weight: 500;
  box-shadow: 0 10px 24px rgba(247,160,29,0.28);
  display: flex;
  align-items: center;
  justify-content: center;
}
.dc-q-main { max-width: clamp(280px, 31.25vw, 450px); }
.dc-plus { font-size: 0.85em; opacity: 0.85; display: inline-block; padding: 4px 0; }

.dc-line-down {
  width: 2px;
  height: clamp(28px, 2.778vw, 40px);
  background: var(--dc-line);
  margin: 0 auto;
}
.dc-line-down-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(24px, 2.778vw, 40px);
}
.dc-line-down-pair span {
  display: block;
  width: 2px;
  height: clamp(28px, 2.778vw, 40px);
  background: var(--dc-line);
  margin: 0 auto;
}

.dc-split { position: relative; display: grid; }
.dc-split-1 { grid-template-columns: 1fr 1fr; height: clamp(72px, 7.639vw, 110px); }
.dc-split-2 { grid-template-columns: repeat(4, 1fr); height: clamp(72px, 7.639vw, 110px); }

.dc-split-bar {
  position: absolute;
  height: 2px;
  background: var(--dc-line);
  top: 0;
}
.dc-split-1 .dc-split-bar { left: 25%; right: 25%; }
.dc-split-2 .dc-split-bar { left: 12.5%; width: 25%; }
.dc-split-2 .dc-split-bar-2 { left: 62.5%; width: 25%; }

.dc-split-leg {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.dc-split-leg::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 2px;
  background: var(--dc-line);
}

.dc-badge {
  position: relative;
  z-index: 1;
  display: inline-block;
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(13px, 0.903vw, 13px);
  font-weight: 700;
  letter-spacing: 2px;
  padding: clamp(5px, 0.486vw, 7px) clamp(12px, 1.181vw, 17px);
  border-radius: 9999px;
  color: #fff;
  box-shadow: 0 4px 12px rgba(42,26,14,0.12);
}
.dc-yes { background: var(--dc-yes); }
.dc-no  { background: var(--dc-no); }

.dc-result {
  background: #fff;
  border: 1px solid rgba(247,160,29,0.18);
  border-radius: clamp(14px, 1.389vw, 20px);
  padding: clamp(18px, 1.806vw, 26px) clamp(14px, 1.389vw, 20px) clamp(18px, 1.806vw, 26px);
  position: relative;
  box-shadow: 0 12px 28px rgba(42,26,14,0.06);
  overflow: hidden;
}
.dc-result::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: var(--brand);
}
.dc-result-label {
  display: block;
  width: fit-content;
  margin: 0 auto clamp(12px, 1.111vw, 16px);
  background: rgba(247,160,29,0.12);
  color: var(--brand);
  font-size: clamp(13px, 0.903vw, 13px);
  font-weight: 700;
  letter-spacing: 1.5px;
  padding: clamp(4px, 0.347vw, 5px) clamp(10px, 0.833vw, 12px);
  border-radius: 6px;
}
.dc-result ul { list-style: none; padding: 0; margin: 0; }
.dc-result li {
  position: relative;
  padding-left: clamp(14px, 1.181vw, 18px);
  font-size: clamp(14px, 1.042vw, 15px);
  line-height: 1.65;
  color: var(--text);
}
.dc-result li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.65em;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--brand);
}
.dc-result li + li { margin-top: clamp(6px, 0.486vw, 7px); }

.diagnosis-glossary {
  margin-top: clamp(48px, 5vw, 72px);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(16px, 1.667vw, 24px);
}
.dg-item {
  background: #fff;
  border-radius: clamp(14px, 1.389vw, 20px);
  padding: clamp(24px, 2.5vw, 36px) clamp(24px, 2.5vw, 36px) clamp(20px, 2.222vw, 32px);
  border: 1px solid rgba(42,26,14,0.08);
  text-align: center;
  box-shadow: 0 8px 24px rgba(42,26,14,0.04);
}
.dg-photo {
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: clamp(10px, 1.111vw, 16px);
  overflow: hidden;
  background: #f7f5f1;
  margin-bottom: clamp(14px, 1.389vw, 20px);
}
.dg-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.dg-name {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(17px, 1.389vw, 20px);
  font-weight: 700;
  color: var(--text);
}
.dg-sub {
  margin-top: 6px;
  font-size: clamp(14px, 0.972vw, 14px);
  color: rgba(42,26,14,0.65);
}

.diagnosis-note {
  margin-top: clamp(28px, 2.778vw, 40px);
  text-align: center;
  font-size: clamp(14px, 0.972vw, 14px);
  color: rgba(42,26,14,0.6);
}

.dc-chart-mobile { display: none; }

@media (max-width: 768px) {
  .dc-chart { display: none; }
  .dc-chart-mobile {
    display: block;
    padding: 0 8px;
  }
  .dcm-q {
    width: 100%;
    background: var(--brand);
    color: #fff;
    border-radius: 16px;
    padding: 18px 18px;
    text-align: center;
    font-size: 15px;
    line-height: 1.6;
    font-weight: 500;
    box-shadow: 0 8px 18px rgba(247,160,29,0.25);
  }
  .dcm-q-main { padding: 22px 20px; }
  .dcm-prompt {
    margin: 18px 0 10px;
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    color: rgba(42,26,14,0.7);
    letter-spacing: 1px;
  }
  .dcm-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 18px;
  }
  .dcm-tab {
    appearance: none;
    border: 1px solid rgba(247,160,29,0.3);
    background: #fff;
    border-radius: 12px;
    padding: 18px 12px;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    color: rgba(42,26,14,0.65);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: border-color 0.2s, color 0.2s, background 0.2s, box-shadow 0.2s;
  }
  .dcm-tab .dc-badge { font-size: 11px; padding: 4px 9px; }
  .dcm-tab-label { text-align: left; line-height: 1.3; }
  .dcm-tab.is-active {
    border-color: var(--brand);
    background: #FFF6E5;
    color: var(--text);
    box-shadow: 0 4px 14px rgba(247,160,29,0.18);
  }
  .dcm-panel {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .dcm-panel[hidden] { display: none; }
  .diagnosis-glossary { margin-top: 24px; gap: 8px; }
  .dg-item { padding: 14px 10px 14px; }
  .dg-name { font-size: 15px; }
}

/* ===== Setup Patterns (system: 機材の接続方法例 — 旧setting1〜3.jpg刷新) ===== */
.setup-patterns {
  background: #fff;
  padding: clamp(48px, 5.556vw, 80px) clamp(20px, 2.778vw, 40px);
}
.setup-patterns-inner { max-width: 1180px; margin: 0 auto; }

.setup-head { text-align: center; margin-bottom: clamp(48px, 5vw, 72px); }
.setup-title {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(24px, 2.5vw, 36px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 1px;
  color: var(--text);
}
.setup-lead {
  margin-top: clamp(10px, 1.111vw, 16px);
  font-size: clamp(15px, 1.111vw, 16px);
  color: rgba(42,26,14,0.7);
}

.pattern {
  background: var(--bg);
  border-radius: clamp(20px, 2.222vw, 32px);
  padding: clamp(36px, 4.167vw, 60px) clamp(24px, 3.333vw, 48px);
  border: 1px solid rgba(247,160,29,0.18);
  box-shadow: 0 16px 40px rgba(42,26,14,0.05);
  margin-bottom: clamp(32px, 3.333vw, 48px);
}
.pattern:last-child { margin-bottom: 0; }

.pattern-head {
  text-align: center;
  padding-bottom: clamp(24px, 2.5vw, 36px);
}
.pattern-num {
  display: inline-block;
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(13px, 0.903vw, 13px);
  font-weight: 700;
  letter-spacing: 4px;
  color: var(--brand);
  text-transform: uppercase;
  background: rgba(247,160,29,0.12);
  padding: clamp(4px, 0.486vw, 7px) clamp(12px, 1.181vw, 17px);
  border-radius: 9999px;
}
.pattern-num em { font-style: normal; font-size: 1.15em; }
.pattern-title {
  margin-top: clamp(12px, 1.111vw, 16px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(18px, 1.667vw, 24px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--text);
}
.pattern-title small {
  display: block;
  margin-top: clamp(6px, 0.625vw, 9px);
  font-size: clamp(14px, 1.042vw, 15px);
  font-weight: 500;
  color: rgba(42,26,14,0.7);
  letter-spacing: 0.5px;
}

.pattern-flow {
  background: #fff;
  border-radius: clamp(16px, 1.667vw, 24px);
  padding: clamp(20px, 2.222vw, 32px) clamp(20px, 2.222vw, 32px) clamp(28px, 2.778vw, 40px);
  border: 1px solid rgba(42,26,14,0.06);
  position: relative;
}
.pattern-flow-after {
  border-color: rgba(247,160,29,0.35);
  box-shadow: 0 12px 32px rgba(247,160,29,0.1);
}
.flow-label {
  display: block;
  width: fit-content;
  margin: 0 auto clamp(20px, 2.222vw, 32px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(14px, 1.042vw, 15px);
  font-weight: 700;
  color: var(--text);
  background: rgba(42,26,14,0.06);
  padding: clamp(5px, 0.486vw, 7px) clamp(12px, 1.111vw, 16px);
  border-radius: 6px;
  letter-spacing: 1px;
}
.pattern-flow-after .flow-label {
  background: var(--brand);
  color: #fff;
}

.flow-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(8px, 1.111vw, 16px);
  flex-wrap: nowrap;
}
.flow-node {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: clamp(140px, 14.583vw, 210px);
}
.flow-photo {
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: clamp(12px, 1.389vw, 20px);
  overflow: hidden;
  background: #f7f5f1;
  border: 1px solid rgba(42,26,14,0.06);
}
.flow-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.flow-name {
  display: block;
  margin-top: clamp(10px, 1.111vw, 16px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(14px, 1.042vw, 15px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--text);
  letter-spacing: 0.5px;
  min-height: 2.8em;
}

.flow-arrow {
  flex: 0 0 auto;
  width: clamp(24px, 2.778vw, 40px);
  height: 2px;
  background: var(--brand);
  position: relative;
  margin-bottom: clamp(28px, 2.778vw, 40px);
}
.flow-arrow::after {
  content: '';
  position: absolute;
  right: -2px;
  top: 50%;
  transform: translateY(-50%);
  width: 0; height: 0;
  border-left: clamp(8px, 0.833vw, 12px) solid var(--brand);
  border-top: clamp(5px, 0.556vw, 8px) solid transparent;
  border-bottom: clamp(5px, 0.556vw, 8px) solid transparent;
}

.pattern-transition {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: clamp(20px, 2.222vw, 32px) 0;
  gap: 0;
}
.transition-line {
  width: 2px;
  height: clamp(28px, 2.778vw, 40px);
  background: var(--brand);
}
.transition-arrow {
  width: 0; height: 0;
  border-top: clamp(10px, 1.111vw, 16px) solid var(--brand);
  border-left: clamp(7px, 0.764vw, 11px) solid transparent;
  border-right: clamp(7px, 0.764vw, 11px) solid transparent;
  margin-top: -1px;
}
.transition-text {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(15px, 1.319vw, 19px);
  font-weight: 700;
  letter-spacing: 3px;
  color: var(--brand);
  margin-top: clamp(12px, 1.181vw, 17px);
}

.pattern-newitems {
  margin-top: clamp(36px, 3.889vw, 56px);
  background: #fff;
  border: 2px solid var(--brand);
  border-radius: clamp(16px, 1.667vw, 24px);
  padding: clamp(24px, 2.778vw, 40px) clamp(20px, 2.222vw, 32px);
  text-align: center;
  position: relative;
}
.newitems-label {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  background: var(--brand);
  color: #fff;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(14px, 1.042vw, 15px);
  font-weight: 700;
  letter-spacing: 1.5px;
  padding: clamp(6px, 0.625vw, 9px) clamp(16px, 1.667vw, 24px);
  border-radius: 9999px;
  white-space: nowrap;
}
.newitems-list {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: clamp(16px, 1.667vw, 24px);
  flex-wrap: wrap;
}
.newitem {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: clamp(160px, 16.667vw, 240px);
}
.newitem-photo {
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: clamp(10px, 1.111vw, 16px);
  overflow: hidden;
  background: #f7f5f1;
}
.newitem-photo img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.newitem-name {
  margin-top: clamp(10px, 1.111vw, 16px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(15px, 1.181vw, 17px);
  font-weight: 700;
  color: var(--text);
}
.newitem-sub {
  margin-top: 4px;
  font-size: clamp(13px, 0.903vw, 13px);
  color: rgba(42,26,14,0.65);
}
.newitem-plus {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(24px, 2.222vw, 32px);
  font-weight: 300;
  color: var(--brand);
  line-height: 1;
  align-self: center;
  margin-top: clamp(-8px, -0.833vw, -12px); /* visual center against photos */
}

.connector-detail {
  margin-top: clamp(28px, 2.778vw, 40px);
  padding-top: clamp(24px, 2.5vw, 36px);
  border-top: 1px dashed rgba(247,160,29,0.35);
}
.connector-detail-label {
  display: block;
  text-align: center;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(15px, 1.319vw, 19px);
  font-weight: 700;
  letter-spacing: 3px;
  color: var(--brand);
  margin-bottom: clamp(16px, 1.667vw, 24px);
}
.connector-svg-wrap { width: 100%; max-width: 1180px; margin: 0 auto; }
.connector-svg-wrap svg { width: 100%; height: auto; display: block; }
.connector-labels {
  position: relative;
  width: 100%;
  max-width: 1180px;
  margin: clamp(10px, 1.111vw, 16px) auto 0;
  min-height: clamp(38px, 3.889vw, 56px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(13px, 0.903vw, 13px);
  font-weight: 700;
  color: var(--text);
  line-height: 1.4;
}
.cl-pos {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  text-align: center;
  white-space: nowrap;
}
.cl-1 { left: 8.75%; }   /* icon center 105/1200 */
.cl-2 { left: 31.67%; }  /* icon center 380/1200 */
.cl-3 { left: 62.08%; }  /* icon center 745/1200 */
.cl-4 { left: 90.92%; }  /* icon center 1091/1200 */
.cl-3a { left: 16.5%; }  /* icon center 165/1000 */
.cl-3b { left: 44.7%; }  /* AV cable center 447/1000 */
.cl-3c { left: 76.5%; }  /* amp input center 765/1000 */
.flow-note {
  margin: clamp(10px, 1.111vw, 16px) 0 0;
  text-align: center;
  font-family: 'LINE Seed JP','Noto Sans JP',sans-serif;
  font-size: clamp(14px, 1vw, 14.5px);
  font-weight: 700;
  color: var(--brand);
  letter-spacing: 0.04em;
}
.connector-labels small {
  display: block;
  font-weight: 500;
  font-size: 0.85em;
  color: rgba(42,26,14,0.65);
  margin-top: 2px;
}

.sp-label-list {
  display: none;
  list-style: none;
  margin: clamp(14px, 1.667vw, 24px) auto 0;
  padding: 0;
  max-width: 480px;
  counter-reset: none;
}
.sp-label-list li {
  display: grid;
  grid-template-columns: clamp(28px, 3.333vw, 36px) 1fr;
  gap: clamp(10px, 1.111vw, 14px);
  align-items: center;
  padding: clamp(10px, 1.111vw, 14px) clamp(12px, 1.389vw, 16px);
  border-bottom: 1px dashed rgba(247,160,29,0.3);
}
.sp-label-list li:last-child { border-bottom: 0; }
.sp-label-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: var(--brand);
  color: #fff;
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(14px, 1.042vw, 14px);
  font-weight: 700;
  letter-spacing: 0.5px;
}
.sp-label-text {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(14px, 1.042vw, 14px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--text);
}
.sp-label-text small {
  display: block;
  font-size: 0.85em;
  font-weight: 500;
  color: rgba(42,26,14,0.65);
  margin-top: 2px;
  letter-spacing: 0;
}

@media (max-width: 768px) {
  .pattern { padding: clamp(28px, 5vw, 40px) clamp(14px, 3vw, 24px); }
  .pattern-flow { padding: 16px 12px 20px; }
  .flow-row { gap: 8px; align-items: flex-start; }
  .flow-node { max-width: none; }
  .flow-arrow { width: 18px; margin-top: clamp(50px, 14vw, 100px); margin-bottom: 0; }
  .newitems-list { flex-direction: column; gap: 16px; }
  .newitem { width: 100%; max-width: 280px; }
  .newitem-plus { margin-top: 0; }
  .connector-svg-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .connector-svg-wrap svg { min-width: 600px; }
  .connector-labels { display: none; }
  .sp-label-list { display: block; }
}
@media (max-width: 480px) {
  .flow-row { flex-wrap: wrap; row-gap: 16px; }
  .flow-arrow { width: 14px; }
  .connector-svg-wrap svg { min-width: 540px; }
}

/* ===== NEWS Section (角丸色フレーム + ミニマル中央リスト) ===== */
.news-outer { padding: clamp(16px, 1.667vw, 24px) clamp(16px, 1.667vw, 24px) clamp(28px, 3.333vw, 48px); background: transparent; position: relative; z-index: 1; }
.news-frame {
  max-width: 1280px; margin: 0 auto;
  background: rgba(255,255,255,0.6);
  border: 1px solid rgba(255,255,255,0.7);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  box-shadow:
    0 0 60px rgba(42,26,14,0.05),
    0 24px 50px rgba(42,26,14,0.04),
    0 4px 12px rgba(42,26,14,0.025),
    inset 0 1px 0 rgba(255,255,255,0.7);
  border-radius: clamp(32px, 4.444vw, 64px);
  padding: clamp(40px, 5vw, 72px) clamp(20px, 4.444vw, 64px);
  position: relative;
  overflow: hidden;
}
.news-inner {
  max-width: 1152px; margin: 0 auto;
  position: relative; z-index: 1;
}
.news-head { text-align: center; margin-bottom: clamp(28px, 3.333vw, 48px); }
.news-eyebrow {
  font-family: 'Montserrat', 'LINE Seed JP', sans-serif; font-size: clamp(14px, 1.042vw, 15px); font-weight: 700;
  letter-spacing: 6px; color: var(--brand); text-transform: uppercase;
  display: inline-block;
}
.news-title {
  margin-top: clamp(10px, 1.111vw, 16px);
  font-size: clamp(28px, 2.917vw, 42px); font-weight: 700; letter-spacing: 2.5px; line-height: 1.4;
  color: var(--text);
}
.news-list { list-style: none; }
.news-list li { border-bottom: 1px dashed rgba(42,26,14,0.15); }
.news-list li:first-child { border-top: 1px dashed rgba(42,26,14,0.15); }
.news-list-item {
  padding: clamp(16px, 1.667vw, 24px) clamp(4px, 0.556vw, 8px);
  transition: background 0.3s;
  border-radius: 12px;
}
.news-list-item:hover { background: rgba(247,160,29,0.05); }
.news-headline {
  display: flex; flex-wrap: wrap; align-items: baseline;
  gap: clamp(8px, 0.833vw, 12px);
  margin-bottom: clamp(6px, 0.694vw, 10px);
}
.news-date {
  font-family: 'Montserrat', 'LINE Seed JP', sans-serif; font-size: clamp(14px, 1.042vw, 15px); font-weight: 600;
  color: var(--brand); letter-spacing: 1px;
  flex-shrink: 0;
}
.news-headline-title {
  font-size: clamp(15px, 1.181vw, 17px); font-weight: 700; line-height: 1.6; letter-spacing: 0.05em;
  color: var(--text);
}
.news-body {
  font-size: clamp(14px, 1.042vw, 15px); font-weight: 400; line-height: 1.85; letter-spacing: 0.04em;
  color: var(--text);
  padding-left: 0;
}
.news-body a {
  color: var(--brand); text-decoration: underline;
  text-decoration-thickness: 1px; text-underline-offset: 3px;
  transition: opacity 0.2s;
}
.news-body a:hover { opacity: 0.7; }

@media (max-width: 1024px) {
  .news-frame { border-radius: 48px; padding: 56px 40px; }
}
@media (max-width: 480px) {
  .news-outer { padding: 24px 16px; }
  .news-frame { border-radius: 32px; padding: 40px 20px; }
  .news-title { font-size: 28px; letter-spacing: 2px; }
  .news-list-item { padding: 20px 4px; }
  .news-headline-title { font-size: 15px; }
  .news-body { font-size: 13.5px; }
}

/* ===== SUBNAV (Features): tokyo-technology派生 縦カード+正円ビジュアル+ナンバリングバッジ ===== */
.subnav-outer { padding: clamp(40px, 3.889vw, 56px) clamp(16px, 1.667vw, 24px) clamp(20px, 2.222vw, 32px); }
.subnav-inner { max-width: 1280px; margin: 0 auto; }
.subnav-head { text-align: center; margin-bottom: clamp(32px, 3.889vw, 56px); }
.subnav-eyebrow {
  font-family: 'Montserrat','LINE Seed JP',sans-serif; font-size: clamp(14px, 1.042vw, 15px); font-weight: 700;
  letter-spacing: 6px; color: var(--brand); text-transform: uppercase;
  display: inline-block;
}
.subnav-title {
  margin-top: clamp(10px, 1.111vw, 16px);
  font-size: clamp(28px, 2.917vw, 42px); font-weight: 700; letter-spacing: 2.5px; line-height: 1.4;
  color: var(--text);
}
.subnav-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(16px, 1.667vw, 24px); }
.subnav-grid.subnav-grid-3 { grid-template-columns: repeat(3, 1fr); }
.subnav-card {
  position: relative;
  background: #ffffff;
  border-radius: 20px;
  padding: clamp(24px, 2.5vw, 36px) clamp(18px, 1.944vw, 28px) clamp(20px, 1.944vw, 28px);
  text-decoration: none;
  box-shadow: 0 4px 16px rgba(42,26,14,0.05);
  transition: transform 0.4s cubic-bezier(0.16,1,0.3,1), box-shadow 0.4s;
  display: flex; flex-direction: column; align-items: center;
}
.subnav-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(42,26,14,0.12);
}
.subnav-card-visual {
  position: relative; width: clamp(112px, 11.111vw, 160px); height: clamp(112px, 11.111vw, 160px);
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #FFE7C2, #FDE0A8 60%, #FCD18A 100%);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: clamp(14px, 1.528vw, 22px);
}
.subnav-card-visual img { width: clamp(64px, 6.667vw, 96px); height: clamp(64px, 6.667vw, 96px); object-fit: contain; }
.subnav-card-visual--photo { overflow: hidden; background: #f3ece2; }
.subnav-card-visual--photo img { width: 100%; height: 100%; object-fit: cover; }
.subnav-card-title {
  font-family: 'LINE Seed JP','Noto Sans JP',sans-serif; font-size: clamp(18px, 1.319vw, 19px); font-weight: 700;
  letter-spacing: 0.8px; line-height: 1.5; color: var(--text); text-align: center;
  margin-bottom: clamp(8px, 0.833vw, 12px);
}
.subnav-card-title:has(+ .subnav-card-link) { margin-bottom: 0; }
.subnav-card-desc {
  font-size: clamp(14px, 0.972vw, 14px); font-weight: 400; line-height: 1.85; letter-spacing: 0.04em;
  color: rgba(42,26,14,0.65); text-align: left;
  flex: 1;
}
.subnav-card-link {
  margin-top: clamp(12px, 1.25vw, 18px);
  display: inline-flex; align-items: center; gap: 8px;
  font-family: 'Montserrat',sans-serif; font-size: clamp(13px, 0.903vw, 13px); font-weight: 700; letter-spacing: 1.5px;
  color: var(--brand);
}
.subnav-card-link::after { content: '→'; transition: transform 0.3s; }
.subnav-card:hover .subnav-card-link::after { transform: translateX(4px); }

@media (max-width: 1024px) {
  .subnav-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .subnav-grid.subnav-grid-3 { grid-template-columns: repeat(3, 1fr); }
  .subnav-title { font-size: 28px; }
}
@media (max-width: 768px) {
  .subnav-grid.subnav-grid-3 { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .subnav-outer { padding: 40px 16px 64px; }
  .subnav-grid { grid-template-columns: 1fr; }
  .subnav-title { font-size: 28px; letter-spacing: 1.5px; }
}

/* ===== FEATURE-1 (L5i): goals派生 Magazine見開き 左縦長写真+右テキスト + 背景巨大01 ===== */
.f1-outer { padding: clamp(56px, 6.667vw, 96px) clamp(16px, 1.667vw, 24px) clamp(72px, 8.333vw, 120px); }
.f1-outer:has(+ .f1-outer) { padding-bottom: clamp(20px, 2.222vw, 32px); }
.f1-inner { max-width: 1280px; margin: 0 auto; }
.f1-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 5vw, 72px); align-items: stretch;
}
.f1-photo {
  position: relative;
  width: 100%; height: 100%; min-height: clamp(360px, 40.278vw, 580px);
  border-radius: 24px;
  box-shadow: 0 30px 60px rgba(42,26,14,0.16);
}
.f1-photo > img {
  border-radius: inherit;
}
.f1-badge {
  position: absolute;
  top: clamp(-50px, -3.333vw, -32px);
  right: clamp(-50px, -3.333vw, -32px);
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: clamp(110px, 10.417vw, 150px);
  height: clamp(110px, 10.417vw, 150px);
  padding-top: clamp(6px, 0.556vw, 8px);
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #FFC04A 0%, #F7A01D 60%, #E8870A 100%);
  color: #fff;
  text-align: center;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  box-shadow:
    0 12px 28px rgba(232,135,10,0.45),
    inset 0 -4px 10px rgba(0,0,0,0.12),
    inset 0 2px 6px rgba(255,255,255,0.4),
    0 0 0 4px #fff,
    0 0 0 6px rgba(247,160,29,0.55);
}
.f1-badge-top {
  font-size: clamp(16px, 1.389vw, 20px);
  font-weight: 700;
  letter-spacing: 2px;
  line-height: 1;
  margin-bottom: clamp(4px, 0.417vw, 6px);
}
.f1-badge-main {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(44px, 4.444vw, 64px);
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
  display: inline-flex;
  align-items: baseline;
  gap: clamp(2px, 0.139vw, 2px);
}
.f1-badge-main small {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(18px, 1.806vw, 26px);
  font-weight: 700;
}
.f1-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
#section-2 .f1-photo img { object-position: left center; }
.f1-text { position: relative; display: flex; flex-direction: column; justify-content: center; padding: clamp(16px, 1.667vw, 24px) 0; }
.f1-num-circle {
  position: absolute;
  left: clamp(-28px, -1.944vw, -16px); top: clamp(-32px, -2.222vw, -18px);
  z-index: 0; pointer-events: none;
  display: block;
}
.f1-num {
  font-family: 'Montserrat', sans-serif; font-size: clamp(220px, 37.5vw, 540px); font-weight: 800;
  line-height: 0.85; letter-spacing: clamp(-18px, -1.25vw, -10px);
  color: var(--brand); opacity: 0.1;
  user-select: none;
}
.f1-head {
  position: relative; z-index: 1;
  display: flex; align-items: center;
  margin-bottom: clamp(20px, 2.5vw, 36px);
}
.f1-eyebrow-jp {
  display: inline-flex; align-items: center; gap: clamp(12px, 1.25vw, 18px);
  padding: clamp(12px, 1.25vw, 18px) clamp(22px, 2.778vw, 40px) clamp(12px, 1.25vw, 18px) clamp(16px, 1.806vw, 26px);
  background: #ffffff;
  border: 1px solid rgba(247,160,29,0.35);
  border-radius: 999px;
  box-shadow: 0 14px 30px rgba(247,160,29,0.12), 0 2px 4px rgba(42,26,14,0.04);
  font-family: 'LINE Seed JP','Noto Sans JP',sans-serif;
  font-size: clamp(17px, 1.458vw, 21px); font-weight: 600;
  letter-spacing: 6px; line-height: 1; color: var(--text);
}
.f1-eyebrow-jp::before {
  content: ''; flex-shrink: 0;
  width: clamp(10px, 0.972vw, 14px); height: clamp(10px, 0.972vw, 14px); border-radius: 50%;
  background: var(--brand);
  box-shadow: 0 0 0 5px rgba(247,160,29,0.18);
}
.f1-title {
  position: relative; z-index: 1;
  font-family: 'LINE Seed JP','Noto Sans JP',sans-serif; font-size: clamp(24px, 2.5vw, 36px); font-weight: 700;
  letter-spacing: 2.2px; line-height: 1.5; color: var(--text);
  margin-bottom: clamp(20px, 2.222vw, 32px);
}
.f1-body {
  position: relative; z-index: 1;
  font-size: clamp(15px, 1.111vw, 16px); font-weight: 400; line-height: 2; letter-spacing: 0.04em; color: var(--text);
  max-width: 540px;
}

/* セクション内CTA（ユーザー登録ボタン） */
.f1-cta {
  display: inline-flex; align-items: center; justify-content: center; align-self: flex-start; margin-top: clamp(20px, 2.222vw, 32px);
  height: clamp(40px, 3.611vw, 52px); padding: 0 clamp(20px, 2.222vw, 32px);
  background: linear-gradient(90deg, #FCBE4A, #F7A01D);
  border-radius: 44px; text-decoration: none;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif; font-size: clamp(15px, 1.181vw, 17px); font-weight: 700; color: #FFF; letter-spacing: 1px;
  box-shadow: inset 0 2px 4px rgba(255,255,255,0.25), inset 0 1px 1px rgba(255,255,255,0.15);
  transition: transform 0.3s cubic-bezier(0.16,1,0.3,1);
  position: relative; z-index: 1;
}
.f1-cta:hover { transform: scale(1.04); }

@media (max-width: 1024px) {
  .f1-grid { grid-template-columns: 1fr; gap: 32px; }
  .f1-photo { min-height: 0; height: auto; aspect-ratio: 4 / 3; }
  .f1-title { font-size: 30px; }
  .f1-num { font-size: 320px; letter-spacing: -14px; }
  .f1-eyebrow-jp { font-size: 22px; letter-spacing: 4px; padding: 14px 28px 14px 20px; }
}
@media (max-width: 768px) {
  .f1-grid { gap: 16px; }
  .f1-title { margin-bottom: 16px; text-align: center; }
  .f1-outer:has(+ .f1-outer) { padding-bottom: 16px; }
  .f1-outer + .f1-outer { padding-top: 24px; }
  .f1-text { align-items: center; text-align: center; }
  .f1-head { justify-content: center; }
  .f1-cta {
    align-self: center;
    width: min(360px, calc(100vw - 56px));
    max-width: 100%; height: 64px; padding: 0 32px;
    font-size: 16px; border-radius: 9999px;
  }
  .f1-body { text-align: left; }
  .f1-badge { right: auto; left: 50%; top: -58px; transform: translateX(-50%); }
}
@media (max-width: 480px) {
  .f1-outer { padding: 64px 16px 80px; }
  .f1-photo { aspect-ratio: 4 / 3; }
  .f1-title { font-size: 24px; letter-spacing: 1.5px; }
  .f1-head { gap: 16px; }
  .f1-num { font-size: 220px; letter-spacing: -10px; }
  .f1-num-circle { left: -14px; top: -16px; }
  .f1-eyebrow-jp { font-size: 16px; letter-spacing: 2px; padding: 12px 22px 12px 16px; gap: 12px; }
  .f1-eyebrow-jp::before { width: 10px; height: 10px; box-shadow: 0 0 0 4px rgba(247,160,29,0.18); }
}

/* reverse: テキスト左 / 写真右（HTML 順序で実現、グリッドはデフォルトと共通） */
.f1-outer.reverse .f1-num-circle { left: auto; right: clamp(-32px, -1.944vw, -16px); text-align: right; }
@media (max-width: 1024px) {
  .f1-outer.reverse .f1-num-circle { right: -14px; }
  /* 縦積み時はリバース配置でも画像/表が上に来るように order で並び替え */
  .f1-outer.reverse .f1-photo,
  .f1-outer.reverse .f1-compare { order: -1; }
}


/* 比較表（section-4） */
.f1-compare {
  width: 100%; min-height: clamp(360px, 40.278vw, 580px);
  display: flex; flex-direction: column;
  background: #fff; border-radius: 24px;
  box-shadow: 0 20px 60px rgba(42,26,14,0.08), 0 4px 12px rgba(42,26,14,0.04);
  padding: clamp(24px, 2.778vw, 40px) clamp(16px, 2.083vw, 30px);
}
.f1-compare-table { width: 100%; height: 100%; border-collapse: separate; border-spacing: 0; flex: 1; }
.f1-compare-table th, .f1-compare-table td {
  padding: clamp(16px, 1.944vw, 28px) clamp(6px, 0.833vw, 12px); text-align: center; vertical-align: middle;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
}
.f1-compare-table thead th {
  font-size: clamp(15px, 1.181vw, 17px); font-weight: 600; color: #8b7565; letter-spacing: 1px;
  border-bottom: 1px solid rgba(42,26,14,0.08);
  padding-bottom: clamp(16px, 1.667vw, 24px);
}
.f1-compare-table thead th.is-rakunet {
  color: var(--brand); font-weight: 700;
}
.f1-compare-table thead th.is-rakunet span {
  display: inline-block; padding: clamp(6px, 0.556vw, 8px) clamp(14px, 1.25vw, 18px); border-radius: 999px;
  background: linear-gradient(90deg, #FCBE4A, #F7A01D); color: #fff;
  font-size: clamp(14px, 1.111vw, 16px); font-weight: 700; letter-spacing: 1px;
}
.f1-compare-table tbody th {
  text-align: left; font-size: clamp(15px, 1.181vw, 17px); font-weight: 600; letter-spacing: 0.04em; color: var(--text);
  padding-left: 0; border-bottom: 1px solid rgba(42,26,14,0.06);
}
.f1-compare-table tbody td {
  font-size: clamp(18px, 1.667vw, 24px); font-weight: 700; letter-spacing: 0.5px; color: var(--text);
  border-bottom: 1px solid rgba(42,26,14,0.06);
}
.f1-compare-table tbody td.is-rakunet {
  background: rgba(247,160,29,0.08);
  color: var(--brand); font-size: clamp(22px, 2.083vw, 30px); font-weight: 800; letter-spacing: 0.5px;
}
.f1-compare-table tbody tr:last-child th,
.f1-compare-table tbody tr:last-child td { border-bottom: none; }
.f1-compare-table tbody tr:first-child td.is-rakunet { border-top-left-radius: 12px; border-top-right-radius: 12px; }
.f1-compare-table tbody tr:last-child td.is-rakunet { border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; }
.f1-compare-unit { font-size: clamp(14px, 1.042vw, 15px); font-weight: 500; letter-spacing: 0.04em; margin-left: 2px; color: inherit; opacity: 0.8; }
.f1-compare-unit.is-note { font-size: clamp(12px, 0.833vw, 12px); display: block; margin-top: 4px; line-height: 1.4; }

@media (max-width: 768px) {
  .f1-compare { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .f1-compare-table { min-width: 520px; }
}
@media (max-width: 480px) {
  .f1-outer.reverse .f1-num-circle { left: auto; right: -14px; top: -16px; }
  .f1-compare { padding: 24px 12px; min-height: auto; }
  .f1-compare-table th, .f1-compare-table td { padding: 16px 6px; }
  .f1-compare-table thead th { font-size: 14px; }
  .f1-compare-table thead th.is-rakunet span { font-size: 13px; padding: 6px 14px; }
  .f1-compare-table tbody th { font-size: 14px; }
  .f1-compare-table tbody td { font-size: 18px; }
  .f1-compare-table tbody td.is-rakunet { font-size: 22px; }
  .f1-compare-unit { font-size: 12px; }
}

/* 導入実績（results） */
.results-outer {
  padding: clamp(72px, 7.778vw, 112px) 0 clamp(80px, 9.167vw, 132px);
  background: #FAF5EC;
  position: relative; overflow: hidden;
}
.results-inner { max-width: 1280px; margin: 0 auto; padding: 0 clamp(16px, 1.667vw, 24px); }
.results-head { text-align: center; margin-bottom: clamp(28px, 3.333vw, 48px); }
.results-title { margin-top: clamp(10px, 1.111vw, 16px); font-size: clamp(28px, 2.917vw, 42px); font-weight: 700; letter-spacing: 2.5px; line-height: 1.4; color: var(--text); }
.results-heading { margin-top: clamp(18px, 1.944vw, 28px); font-size: clamp(20px, 1.944vw, 28px); font-weight: 700; letter-spacing: 1.5px; line-height: 1.6; color: var(--text); }
.results-caption { margin: clamp(16px, 1.667vw, 24px) auto 0; max-width: 760px; font-size: clamp(15px, 1.111vw, 16px); line-height: 2; letter-spacing: 0.04em; color: var(--text); }
.results-hero-metric { display: flex; align-items: baseline; justify-content: center; gap: clamp(10px, 1.111vw, 16px); margin: clamp(32px, 3.889vw, 56px) 0 clamp(40px, 4.444vw, 64px); flex-wrap: wrap; }
.results-hero-prefix, .results-hero-suffix { font-size: clamp(16px, 1.528vw, 22px); font-weight: 600; color: var(--text); letter-spacing: 2px; }
.results-hero-num { font-family: 'Montserrat'; font-size: clamp(96px, 10vw, 144px); font-weight: 800; color: var(--brand); line-height: 1; letter-spacing: -4px; }
.results-hero-unit { font-size: clamp(56px, 6.111vw, 88px); }
.results-clients { padding: clamp(8px, 0.833vw, 12px) clamp(16px, 1.667vw, 24px); }
.results-clients-list { max-width: 1180px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: clamp(10px, 1.111vw, 16px); justify-content: center; }
.results-client { flex: none; height: clamp(56px, 5.556vw, 80px); padding: 0 clamp(20px, 2.5vw, 36px); background: #fff; border-radius: 16px; display: flex; align-items: center; justify-content: center; font-size: clamp(14px, 1.042vw, 15px); font-weight: 600; letter-spacing: 1px; color: var(--text); box-shadow: 0 4px 14px rgba(42,26,14,0.06); white-space: nowrap; }
.results-client-logo { padding: 0 clamp(16px, 1.667vw, 24px); }
.results-client-logo img { height: clamp(22px, 2.5vw, 36px); width: auto; display: block; }
@media (max-width: 1024px) {
  .results-title { font-size: 28px; }
  .results-heading { font-size: 22px; }
  .results-hero-num { font-size: 96px; }
  .results-hero-unit { font-size: 56px; }
  .results-hero-prefix, .results-hero-suffix { font-size: 16px; }
  .results-client { height: 64px; font-size: 13px; padding: 0 24px; }
}
@media (max-width: 768px) {
  .results-heading { font-size: 18px; }
  .results-caption { text-align: left; }
  .results-clients-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .results-client {
    width: auto; height: auto; min-height: 56px; padding: 10px 12px;
    white-space: normal; line-height: 1.4; text-align: center;
  }
  .results-client.is-wide { grid-column: 1 / -1; }
}

/* FAQ */
.faq-outer { padding: clamp(56px, 6.667vw, 96px) clamp(16px, 1.667vw, 24px) clamp(72px, 8.333vw, 120px); background: transparent; }
.faq-inner { max-width: 880px; margin: 0 auto; }
.faq-head { text-align: center; margin-bottom: clamp(40px, 4.444vw, 64px); }
.faq-title { margin-top: clamp(10px, 1.111vw, 16px); font-size: clamp(28px, 2.917vw, 42px); font-weight: 700; letter-spacing: 2.5px; line-height: 1.4; color: var(--text); }

.faq-list { display: flex; flex-direction: column; gap: clamp(14px, 1.389vw, 20px); }
.faq-card {
  background: #fff; border-radius: 20px;
  box-shadow: 0 8px 24px rgba(42,26,14,0.05);
  border-left: 4px solid var(--brand);
  overflow: hidden;
  transition: box-shadow 0.4s cubic-bezier(0.16,1,0.3,1);
}
.faq-card.is-open { box-shadow: 0 16px 36px rgba(42,26,14,0.09); }
.faq-card-q {
  width: 100%; appearance: none; border: none; background: transparent;
  cursor: pointer; text-align: left; font-family: inherit;
  padding: clamp(20px, 1.944vw, 28px) clamp(20px, 2.5vw, 36px);
  display: flex; align-items: center; gap: clamp(12px, 1.25vw, 18px);
}
.faq-card-q-mark {
  flex: none; font-family: 'Montserrat'; font-size: clamp(24px, 2.222vw, 32px); font-weight: 800;
  color: var(--brand); line-height: 1;
}
.faq-card-q-text {
  flex: 1; font-size: clamp(16px, 1.25vw, 18px); font-weight: 700; letter-spacing: 0.04em; line-height: 1.6; color: var(--text);
}
.faq-card-q-icon {
  flex: none; width: clamp(26px, 2.222vw, 32px); height: clamp(26px, 2.222vw, 32px); border-radius: 50%;
  background: rgba(247,160,29,0.12);
  position: relative;
  transition: background 0.3s;
}
.faq-card-q-icon::before,
.faq-card-q-icon::after {
  content: ''; position: absolute; left: 50%; top: 50%;
  width: clamp(11px, 0.972vw, 14px); height: 2px; background: var(--brand); border-radius: 1px;
  transform: translate(-50%, -50%);
  transition: transform 0.4s cubic-bezier(0.16,1,0.3,1), opacity 0.3s, background 0.3s;
}
.faq-card-q-icon::after { transform: translate(-50%, -50%) rotate(90deg); }
.faq-card.is-open .faq-card-q-icon { background: var(--brand); }
.faq-card.is-open .faq-card-q-icon::before { background: #fff; }
.faq-card.is-open .faq-card-q-icon::after { opacity: 0; transform: translate(-50%, -50%) rotate(0deg); }
.faq-card-content {
  display: grid; grid-template-rows: 0fr;
  transition: grid-template-rows 0.5s cubic-bezier(0.16,1,0.3,1);
}
.faq-card.is-open .faq-card-content { grid-template-rows: 1fr; }
.faq-card-content-inner { overflow: hidden; min-height: 0; }
.faq-card-a {
  margin: 0 clamp(20px, 2.5vw, 36px); padding: clamp(16px, 1.667vw, 24px) 0 clamp(20px, 1.944vw, 28px);
  border-top: 1px dashed rgba(42,26,14,0.16);
  display: flex; align-items: flex-start; gap: clamp(12px, 1.25vw, 18px);
}
.faq-card-a-mark {
  flex: none; font-family: 'Montserrat'; font-size: clamp(24px, 2.222vw, 32px); font-weight: 800;
  color: #c9a66e; line-height: 1;
}
.faq-card-a-text {
  flex: 1; font-size: clamp(14px, 1.042vw, 15px); letter-spacing: 0.04em; line-height: 2; color: var(--text); padding-top: 6px;
}
@media (max-width: 480px) {
  .faq-title { font-size: 28px; }
  .faq-card-q { padding: 22px 20px; gap: 12px; }
  .faq-card-q-text { font-size: 15px; }
  .faq-card-q-mark, .faq-card-a-mark { font-size: 24px; }
  .faq-card-a { margin: 0 20px; gap: 12px; }
}

/* 運営会社情報（名刺カード型・修正版） */
.company-outer { padding: clamp(56px, 6.667vw, 96px) clamp(16px, 1.667vw, 24px) clamp(72px, 8.333vw, 120px); background: transparent; }
.company-inner { max-width: 1280px; margin: 0 auto; }
.company-head { text-align: center; margin-bottom: clamp(40px, 4.444vw, 64px); }
.company-title { margin-top: clamp(10px, 1.111vw, 16px); font-size: clamp(28px, 2.917vw, 42px); font-weight: 700; letter-spacing: 2.5px; line-height: 1.4; color: var(--text); }
.company-C-card-wrap { display: flex; justify-content: center; padding: clamp(20px, 2.222vw, 32px) 0; }
.company-C-card {
  position: relative;
  width: 100%; max-width: 720px;
  background: #fff; border-radius: 16px;
  box-shadow:
    0 0 60px rgba(42,26,14,0.05),
    0 24px 50px rgba(42,26,14,0.04),
    0 4px 12px rgba(42,26,14,0.025);
  padding: clamp(40px, 4.444vw, 64px) clamp(28px, 4.444vw, 64px) clamp(36px, 3.889vw, 56px);
  border: 1px solid rgba(42,26,14,0.04);
  overflow: hidden;
}
.company-C-card::before {
  content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 6px;
  background: linear-gradient(90deg, #FCBE4A, #F7A01D);
}
.company-C-name-en {
  font-family: 'Montserrat'; font-size: clamp(13px, 0.903vw, 13px); font-weight: 700;
  letter-spacing: 5px; color: var(--brand); text-transform: uppercase;
  margin-bottom: clamp(10px, 0.972vw, 14px);
}
.company-C-name {
  font-size: clamp(22px, 2.083vw, 30px); font-weight: 700; letter-spacing: 1.5px; line-height: 1.5; color: var(--text);
  margin-bottom: clamp(24px, 2.5vw, 36px);
}
.company-C-divider-thin {
  width: 100%; height: 1px; background: rgba(42,26,14,0.08);
  margin-bottom: clamp(20px, 1.944vw, 28px);
}
.company-C-addr-label {
  font-family: 'Montserrat'; font-size: clamp(12px, 0.833vw, 12px); font-weight: 700;
  letter-spacing: 4px; color: #8b7565; text-transform: uppercase;
  margin-bottom: clamp(6px, 0.694vw, 10px);
}
.company-C-addr {
  font-size: clamp(16px, 1.181vw, 17px); font-weight: 500; letter-spacing: 0.04em; line-height: 1.7; color: var(--text);
}
@media (max-width: 480px) {
  .company-title { font-size: 28px; }
  .company-C-card { padding: 40px 32px 36px; }
  .company-C-name { font-size: 22px; }
  .company-C-addr { font-size: 15px; }
}

.site-main { overflow: hidden; }

/* フッター */
.site-footer {
  padding: clamp(28px, 2.778vw, 40px) clamp(16px, 1.667vw, 24px) clamp(20px, 2.222vw, 32px);
  text-align: center;
  font-family: 'Montserrat','LINE Seed JP',sans-serif;
  color: #8b7565;
  border-top: 1px solid rgba(42,26,14,0.06);
}
.footer-links {
  display: flex; justify-content: center; flex-wrap: wrap;
  gap: 0 clamp(20px, 2.5vw, 36px);
  margin-bottom: clamp(14px, 1.389vw, 20px);
  list-style: none;
}
.footer-links a {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(13px, 0.903vw, 13px); font-weight: 500; letter-spacing: 1px;
  color: #8b7565; text-decoration: none;
  line-height: 2;
  transition: color 0.3s;
}
.footer-links a:hover { color: var(--brand); }
.footer-copyright {
  font-size: clamp(12px, 0.833vw, 12px); font-weight: 500; letter-spacing: 1.5px;
  color: rgba(139,117,101,0.7);
}
@media (max-width: 768px) {
  .footer-links { flex-direction: column; align-items: center; gap: 16px; margin-bottom: 24px; }
  .footer-links a { font-size: 14px; line-height: 1.6; }
}
/* Floating CTA (sticky bottom) */
.floating-cta {
  position: fixed; left: 0; right: 0; bottom: 0;
  transform: translateY(100%);
  z-index: 90;
  opacity: 0; pointer-events: none;
  background: linear-gradient(135deg, #FCBE4A, #F7A01D);
  box-shadow: 0 -12px 36px rgba(42,26,14,0.18);
  transition: opacity 0.4s cubic-bezier(0.16,1,0.3,1), transform 0.5s cubic-bezier(0.16,1,0.3,1);
}
.floating-cta.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.floating-cta-inner {
  max-width: 1160px; margin: 0 auto;
  padding: clamp(10px, 0.972vw, 14px) clamp(12px, 1.667vw, 24px);
  display: flex; gap: clamp(8px, 1.111vw, 16px); justify-content: center; align-items: center;
}
.floating-cta-btn {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center;
  width: clamp(220px, 22.222vw, 320px); height: clamp(48px, 3.889vw, 56px); padding: 0 clamp(36px, 3.889vw, 56px);
  border-radius: 9999px; text-decoration: none;
  font-size: clamp(14px, 1.042vw, 15px); font-weight: 700; letter-spacing: 1px;
  transition: transform 0.3s, box-shadow 0.3s;
}
.floating-cta-btn.is-primary {
  background: #fff; color: var(--brand);
  box-shadow: 0 12px 24px rgba(170,100,10,0.22), 0 4px 8px rgba(170,100,10,0.12);
}
.floating-cta-btn.is-primary:hover { transform: translateY(-2px); box-shadow: 0 16px 30px rgba(170,100,10,0.30); }
.floating-cta-btn.is-secondary {
  background: transparent; color: #fff;
  border: 2px solid #fff;
}
.floating-cta-btn.is-secondary:hover { background: rgba(255,255,255,0.12); }
.floating-cta-btn-arrow {
  position: absolute; right: clamp(10px, 1.111vw, 16px); top: 50%;
  width: clamp(22px, 1.944vw, 28px); height: clamp(22px, 1.944vw, 28px); border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  transform: translateY(-50%);
  transition: transform 0.3s;
}
.floating-cta-btn:hover .floating-cta-btn-arrow { transform: translate(2px, -50%); }
.floating-cta-btn.is-primary .floating-cta-btn-arrow { background: rgba(247,160,29,0.12); }
.floating-cta-btn.is-secondary .floating-cta-btn-arrow { background: rgba(255,255,255,0.16); }
.floating-cta-btn-arrow::before {
  content: ''; width: 8px; height: 8px;
  border-right: 2.5px solid currentColor; border-top: 2.5px solid currentColor;
  transform: rotate(45deg) translate(-1px, 1px);
  border-radius: 1px;
}
@media (max-width: 768px) {
  .floating-cta-inner { padding: 10px 12px; gap: 8px; }
  .floating-cta-btn { flex: 1; width: auto; height: 52px; padding: 0 44px 0 18px; font-size: 13px; letter-spacing: 0.5px; }
  .floating-cta-btn-arrow { width: 24px; height: 24px; right: 10px; }
}

/* CTA section */
.cta-outer {
  position: relative; overflow: hidden;
  padding: clamp(60px, 6.25vw, 90px) clamp(16px, 1.667vw, 24px) clamp(68px, 7.083vw, 102px);
  background: linear-gradient(135deg, #FCBE4A, #F7A01D);
}
.cta-inner { position: relative; z-index: 1; max-width: 1160px; margin: 0 auto; text-align: center; }
.cta-title {
  font-size: clamp(24px, 2.5vw, 36px); font-weight: 700; letter-spacing: 2.5px; line-height: 1.5;
  color: #fff;
  display: inline-flex; align-items: center; justify-content: center; gap: clamp(20px, 2.222vw, 32px);
}
.cta-title-deco {
  position: relative;
  width: clamp(22px, 2.222vw, 32px); height: clamp(40px, 4.167vw, 60px);
  flex: none;
  background: linear-gradient(#fff, #fff) center / clamp(3px, 0.278vw, 4px) clamp(40px, 4.167vw, 60px) no-repeat;
  border-radius: 2px;
  filter: drop-shadow(0 4px 8px rgba(170,100,10,0.18));
}
.cta-title-deco::before, .cta-title-deco::after {
  content: ''; position: absolute;
  width: clamp(3px, 0.278vw, 4px); border-radius: 2px;
}
.cta-title-deco::before {
  left: clamp(3px, 0.278vw, 4px); top: clamp(6px, 0.556vw, 8px);
  height: clamp(26px, 2.639vw, 38px);
  background: rgba(255,255,255,0.85);
}
.cta-title-deco::after {
  left: clamp(16px, 1.667vw, 24px); top: clamp(10px, 0.972vw, 14px);
  height: clamp(18px, 1.806vw, 26px);
  background: rgba(255,255,255,0.65);
}
.cta-title-deco.is-left { transform: rotate(-22deg); }
.cta-title-deco.is-right { transform: rotate(22deg); }
.cta-buttons {
  margin-top: clamp(28px, 2.778vw, 40px);
  display: inline-flex; gap: clamp(16px, 1.667vw, 24px); flex-wrap: wrap; justify-content: center;
}
.cta-btn {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center;
  width: clamp(300px, 31.944vw, 460px); height: clamp(60px, 6.111vw, 88px); padding: 0 clamp(36px, 3.889vw, 56px);
  border-radius: 9999px; text-decoration: none;
  font-size: clamp(15px, 1.25vw, 18px); font-weight: 700; letter-spacing: 1px;
  transition: transform 0.3s, box-shadow 0.3s;
}
.cta-btn-arrow {
  position: absolute; right: clamp(16px, 1.667vw, 24px); top: 50%;
  width: clamp(24px, 1.944vw, 28px); height: clamp(24px, 1.944vw, 28px); border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  transform: translateY(-50%);
  transition: transform 0.3s;
}
.cta-btn:hover .cta-btn-arrow { transform: translate(3px, -50%); }
.cta-btn-arrow::before {
  content: '';
  width: 8px; height: 8px;
  border-right: 2.5px solid currentColor;
  border-top: 2.5px solid currentColor;
  transform: rotate(45deg) translate(-1px, 1px);
  border-radius: 1px;
}
.cta-btn.is-primary .cta-btn-arrow { background: rgba(247,160,29,0.12); }
.cta-btn.is-secondary .cta-btn-arrow { background: rgba(255,255,255,0.16); }
.cta-btn.is-primary {
  background: #fff; color: var(--brand);
  box-shadow: 0 20px 40px rgba(170,100,10,0.25), 0 6px 12px rgba(170,100,10,0.15);
}
.cta-btn.is-primary:hover { transform: translateY(-3px); box-shadow: 0 28px 50px rgba(170,100,10,0.32); }
.cta-btn.is-secondary {
  background: transparent; color: #fff;
  border: 2px solid #fff;
}
.cta-btn.is-secondary:hover { background: rgba(255,255,255,0.12); }
@media (max-width: 1024px) {
  .cta-outer { padding: 88px 24px 100px; }
  .cta-title { font-size: 26px; }
  .cta-btn { width: 100%; max-width: 360px; height: 64px; padding: 0 32px; font-size: 16px; }
}

/* ==================================================
   Channel Hero — 共通
================================================== */
.channel-hero {
  position: relative;
  width: 100%;
  min-height: clamp(520px, 70vh, 760px);
  background: var(--bg);
  overflow: visible;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: clamp(110px, 12vw, 160px);
}

/* ==================================================
   案C: Streaming Lanes — 流れるレーン
================================================== */
.channel-hero-C {
  background: #fff;
  min-height: clamp(560px, 75vh, 800px);
  padding-top: 120px;
  padding-bottom: 40px;
}
.chc-stage {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.chc-half {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 50%;
  overflow: visible;
}
.chc-half-left { left: 0; }
.chc-half-right { right: 0; }
.chc-lanes {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 200%;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  padding: clamp(20px, 2.778vw, 40px) 0;
  pointer-events: none;
  transform-style: preserve-3d;
  will-change: transform;
}
.chc-half-left .chc-lanes {
  right: 0;
  transform: perspective(1200px) rotateY(-36deg) scale(1.32);
  transform-origin: right center;
}
.chc-half-right .chc-lanes {
  left: 0;
  transform: perspective(1200px) rotateY(36deg) scale(1.32);
  transform-origin: left center;
}
.chc-lane {
  width: 100%;
  overflow: hidden;
  height: clamp(80px, 9.722vw, 140px);
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.chc-track {
  display: flex;
  gap: clamp(10px, 1.111vw, 16px);
  width: max-content;
  height: 100%;
  align-items: center;
}
.chc-icon {
  height: 100%;
  width: clamp(80px, 9.722vw, 140px);
  border-radius: clamp(10px, 1.111vw, 16px);
  object-fit: cover;
  box-shadow: 0 8px 18px rgba(120,68,8,0.12);
  flex-shrink: 0;
}
@media (prefers-reduced-motion: no-preference) {
  .chc-lane-1 .chc-track { animation: chc-scroll-left 50s linear infinite; }
  .chc-lane-2 .chc-track { animation: chc-scroll-right 60s linear infinite; }
  .chc-lane-3 .chc-track { animation: chc-scroll-left 70s linear infinite; }
  .chc-lane-4 .chc-track { animation: chc-scroll-right 55s linear infinite; }
}
@keyframes chc-scroll-left {
  from { transform: translateX(0); }
  to   { transform: translateX(-33.333%); }
}
@keyframes chc-scroll-right {
  from { transform: translateX(-33.333%); }
  to   { transform: translateX(0); }
}
.chc-overlay {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center,
    rgba(255,255,255,0.92) 0%,
    rgba(255,255,255,0.7) 35%,
    rgba(255,255,255,0.2) 70%,
    transparent 100%);
  pointer-events: none;
}
.chc-content {
  position: relative;
  z-index: 2;
  width: clamp(400px, 38.889vw, 560px);
  height: clamp(400px, 38.889vw, 560px);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: clamp(40px, 5vw, 70px);
  background: rgba(255,255,255,0.45);
  border: 1px solid rgba(255,255,255,0.6);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow:
    8px 8px 24px rgba(200,180,150,0.18),
    -4px -4px 16px rgba(255,255,255,0.6),
    inset 0 1px 0 rgba(255,255,255,0.7);
}
.chc-title {
  margin-top: 0;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(28px, 3.333vw, 48px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 1.5px;
  color: var(--text);
}
.chc-lead {
  margin-top: clamp(16px, 1.667vw, 24px);
  font-size: clamp(15px, 1.181vw, 17px);
  line-height: 1.9;
  color: rgba(42,26,14,0.75);
}
.chc-cta {
  margin-top: clamp(28px, 2.778vw, 40px);
  display: flex;
  gap: clamp(12px, 1.111vw, 16px);
  justify-content: center;
  flex-wrap: wrap;
}
.chc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(14px, 1.389vw, 20px) clamp(28px, 2.778vw, 40px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(15px, 1.111vw, 16px);
  font-weight: 700;
  letter-spacing: 1.5px;
  border-radius: 9999px;
  text-decoration: none;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.chc-btn-primary { background: var(--brand); color: #fff; box-shadow: 0 8px 20px rgba(247,160,29,0.4); }
.chc-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(247,160,29,0.5); }
.chc-btn-secondary { background: #fff; color: var(--brand); border: 2px solid var(--brand); }
.chc-btn-secondary:hover { transform: translateY(-2px); background: rgba(247,160,29,0.08); }

@media (max-width: 1024px) {
  .chc-content { width: 360px; height: 360px; padding: 32px; }
  .chc-half-left .chc-lanes { transform: perspective(950px) rotateY(-40deg) scale(2); }
  .chc-half-right .chc-lanes { transform: perspective(950px) rotateY(40deg) scale(2); }
  .chc-lanes { justify-content: center; gap: 18px; padding: 16px 0; }
}
@media (max-width: 768px) {
  /* Pattern A: 3D維持・両側レーンを背景として残しつつ、コンテンツは正円カード */
  .chc-stage { display: block; }
  .chc-half { width: 50%; }
  .chc-half-left .chc-lanes { transform: perspective(900px) rotateY(-52deg) scale(1.6); }
  .chc-half-right .chc-lanes { transform: perspective(900px) rotateY(52deg) scale(1.6); }
  .chc-lanes { justify-content: center; gap: 10px; padding: 8px 0; }
  .chc-lane { height: clamp(60px, 18vw, 100px); }
  .chc-icon { width: clamp(60px, 18vw, 100px); }
  .chc-content {
    width: clamp(280px, 95vw, 480px);
    height: clamp(280px, 95vw, 480px);
    border-radius: 50%;
    padding: clamp(16px, 4vw, 32px);
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
  }
  .channel-hero {
    min-height: clamp(490px, 76vh, 640px);
    padding-top: clamp(40px, 6vw, 80px);
    padding-bottom: 0;
  }
  .chc-lead { margin-top: 8px; }
  .chc-cta { margin-top: 16px; flex-direction: column; }
  .channel-hero + .breadcrumb { margin-top: -20px; position: relative; z-index: 3; background: transparent; }
  .channel-hero + .breadcrumb .breadcrumb-list { padding-top: 0; padding-bottom: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  .chc-track { animation: none !important; }
}

/* ==================================================
   Manual ページ /manual/
================================================== */
.manual {
  background: #fff;
  padding: clamp(56px, 5.556vw, 80px) clamp(20px, 2.778vw, 40px) clamp(80px, 8.333vw, 120px);
}
.manual-inner {
  max-width: 1180px;
  margin: 0 auto;
}

/* 重要なお知らせ */
.manual-notices {
  display: grid;
  gap: clamp(16px, 1.667vw, 24px);
  margin-bottom: clamp(56px, 5.556vw, 80px);
}
.manual-notice {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(16px, 1.667vw, 24px);
  align-items: start;
  padding: clamp(20px, 2.222vw, 32px) clamp(20px, 2.5vw, 36px);
  background: #FFF6E8;
  border-left: 4px solid #E8870A;
  border-radius: clamp(10px, 1.111vw, 16px);
  box-shadow: 0 4px 14px rgba(232,135,10,0.06);
}
.manual-notice-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(4px, 0.417vw, 6px) clamp(10px, 0.972vw, 14px);
  background: #E8870A;
  color: #fff;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(13px, 0.903vw, 13px);
  font-weight: 700;
  letter-spacing: 1.5px;
  border-radius: 999px;
  white-space: nowrap;
}
.manual-notice-body {
  color: var(--text);
  font-size: clamp(14px, 1.042vw, 15px);
  line-height: 1.9;
}
.manual-notice-body p {
  margin: 0;
}
.manual-notice-body p + p {
  margin-top: clamp(8px, 0.833vw, 12px);
}
.manual-notice-title {
  margin: 0 0 clamp(6px, 0.694vw, 10px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(16px, 1.25vw, 18px);
  font-weight: 700;
  color: #C66E07;
  line-height: 1.5;
}
.manual-notice-body a {
  color: var(--brand);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.manual-notice-body strong {
  color: #C66E07;
}

/* 目次 */
.manual-toc {
  background: var(--bg);
  border-radius: clamp(20px, 2.222vw, 32px);
  padding: clamp(36px, 3.889vw, 56px) clamp(24px, 3.333vw, 48px);
  margin-bottom: clamp(64px, 6.944vw, 100px);
}
.manual-toc-title {
  display: flex;
  align-items: baseline;
  gap: clamp(10px, 1.111vw, 16px);
  margin: 0 0 clamp(20px, 2.222vw, 32px);
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(22px, 2.222vw, 32px);
  font-weight: 700;
  color: var(--text);
  letter-spacing: 1px;
}
.manual-toc-title-jp {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(14px, 1.042vw, 15px);
  font-weight: 600;
  color: rgba(42,26,14,0.65);
  letter-spacing: 2px;
}
.manual-toc-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(8px, 0.833vw, 12px) clamp(20px, 2.222vw, 32px);
}
.manual-toc-list a {
  display: flex;
  align-items: center;
  gap: clamp(12px, 1.25vw, 18px);
  padding: clamp(12px, 1.25vw, 18px) clamp(14px, 1.389vw, 20px);
  background: #fff;
  border: 1px solid rgba(247,160,29,0.18);
  border-radius: clamp(10px, 1.111vw, 14px);
  color: var(--text);
  text-decoration: none;
  transition: border-color 0.25s, transform 0.25s, box-shadow 0.25s;
}
.manual-toc-list a:hover {
  border-color: var(--brand);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(247,160,29,0.18);
}
.manual-toc-num {
  flex-shrink: 0;
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(20px, 1.944vw, 28px);
  font-weight: 800;
  color: var(--brand);
  line-height: 1;
  letter-spacing: 0;
}
.manual-toc-text {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(14px, 1.042vw, 15px);
  font-weight: 500;
  letter-spacing: 0.5px;
  line-height: 1.5;
}
.manual-toc-text small {
  display: block;
  margin-top: 2px;
  font-size: clamp(13px, 0.833vw, 12px);
  font-weight: 400;
  color: rgba(42,26,14,0.55);
  letter-spacing: 0.5px;
}

/* セクション */
.manual-section {
  scroll-margin-top: clamp(80px, 8.333vw, 120px);
  padding-top: clamp(40px, 4.167vw, 60px);
  margin-top: clamp(40px, 4.167vw, 60px);
  border-top: 1px solid rgba(42,26,14,0.08);
}
.manual-section:first-of-type {
  border-top: 0;
  padding-top: 0;
  margin-top: 0;
}
.manual-section-head {
  display: flex;
  align-items: baseline;
  gap: clamp(14px, 1.667vw, 24px);
  margin-bottom: clamp(16px, 1.667vw, 24px);
}
.manual-section-num {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(40px, 4.167vw, 60px);
  font-weight: 800;
  color: var(--brand);
  line-height: 1;
  letter-spacing: 0;
}
.manual-section-title {
  margin: 0;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(22px, 2.222vw, 32px);
  font-weight: 700;
  color: var(--text);
  letter-spacing: 1.5px;
  line-height: 1.4;
}
.manual-section-lead {
  margin: 0 0 clamp(28px, 2.778vw, 40px);
  font-size: clamp(15px, 1.111vw, 16px);
  line-height: 1.95;
  color: rgba(42,26,14,0.78);
}
.manual-video {
  position: relative;
  aspect-ratio: 16 / 9;
  width: 100%;
  max-width: clamp(480px, 50vw, 720px);
  margin: 0 0 clamp(24px, 2.222vw, 32px);
  border-radius: clamp(8px, 0.833vw, 12px);
  overflow: hidden;
  background: #000;
  box-shadow: 0 12px 32px rgba(42,26,14,0.12);
}
.manual-video iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.manual-section-conclusion {
  margin-top: clamp(28px, 2.778vw, 40px);
  padding: clamp(14px, 1.389vw, 20px) clamp(20px, 2.222vw, 32px);
  background: rgba(247,160,29,0.08);
  border-radius: clamp(8px, 0.833vw, 12px);
  font-weight: 600;
  color: var(--text);
  font-size: clamp(15px, 1.111vw, 16px);
}

/* セクション内サブ見出し */
.manual-subhead {
  display: flex;
  align-items: center;
  gap: clamp(10px, 1.111vw, 16px);
  margin: clamp(36px, 3.889vw, 56px) 0 clamp(20px, 2.222vw, 32px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(17px, 1.528vw, 22px);
  font-weight: 700;
  color: var(--text);
  line-height: 1.5;
  letter-spacing: 0.5px;
}
.manual-subhead::before {
  content: '';
  flex-shrink: 0;
  width: clamp(20px, 1.944vw, 28px);
  height: 4px;
  background: var(--brand);
  border-radius: 2px;
}

/* セクション内 通常段落 */
.manual-paragraph {
  margin: 0;
  font-size: clamp(15px, 1.111vw, 16px);
  line-height: 1.95;
  color: var(--text);
}

/* セクション内コールアウト（注意書き） */
.manual-callout {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(14px, 1.389vw, 20px);
  align-items: start;
  margin-top: clamp(16px, 1.667vw, 24px);
  margin-bottom: clamp(16px, 1.667vw, 24px);
  padding: clamp(18px, 1.806vw, 26px) clamp(20px, 2.222vw, 32px);
  background: #FFF6E8;
  border-left: 4px solid #E8870A;
  border-radius: clamp(10px, 1.111vw, 14px);
}
.manual-callout-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(3px, 0.347vw, 5px) clamp(10px, 0.972vw, 14px);
  background: #E8870A;
  color: #fff;
  font-size: clamp(13px, 0.903vw, 13px);
  font-weight: 700;
  letter-spacing: 1.5px;
  border-radius: 999px;
  white-space: nowrap;
  margin-top: 2px;
}
.manual-callout-title {
  margin: 0 0 clamp(6px, 0.625vw, 9px);
  font-size: clamp(16px, 1.25vw, 18px);
  font-weight: 700;
  color: #C66E07;
  line-height: 1.5;
}
.manual-callout-body {
  font-size: clamp(14px, 1.042vw, 15px);
  line-height: 1.85;
  color: var(--text);
}
.manual-callout-body p {
  margin: 0;
}

/* セクション内 注釈段落（旧 style3 / style6 の代替） */
.manual-inline-note {
  margin: clamp(20px, 2.222vw, 32px) 0;
  padding: clamp(14px, 1.389vw, 20px) clamp(18px, 1.806vw, 26px);
  background: #FFF1E0;
  border-radius: clamp(8px, 0.833vw, 12px);
  font-size: clamp(14px, 1.042vw, 15px);
  line-height: 1.85;
  color: #8E4A02;
}

/* 強調インライン（旧 style3：赤字） */
.manual-emph {
  color: #D03F1A;
  font-weight: 600;
}
.manual-emph-strong {
  color: #D03F1A;
  font-weight: 700;
}

/* テーブル（再生プレーヤーの機能等） */
.manual-table-wrap {
  overflow-x: auto;
  margin: clamp(8px, 0.833vw, 12px) 0;
}
.manual-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
  border: 1px solid rgba(42,26,14,0.08);
  border-radius: clamp(10px, 1.111vw, 14px);
  overflow: hidden;
  font-size: clamp(16px, 1.25vw, 18px);
}
.manual-table thead th {
  padding: clamp(12px, 1.111vw, 16px) clamp(14px, 1.389vw, 20px);
  background: var(--bg);
  font-weight: 700;
  color: var(--text);
  text-align: left;
  letter-spacing: 0.5px;
  border-bottom: 1px solid rgba(42,26,14,0.08);
}
.manual-table tbody td {
  padding: clamp(12px, 1.25vw, 18px) clamp(14px, 1.389vw, 20px);
  vertical-align: top;
  line-height: 1.8;
  color: var(--text);
  border-bottom: 1px solid rgba(42,26,14,0.06);
}
.manual-table tbody tr:last-child td {
  border-bottom: 0;
}
.manual-table .is-num {
  width: clamp(80px, 7.639vw, 110px);
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(17px, 1.389vw, 20px);
  font-weight: 700;
  color: var(--brand);
  text-align: center;
  white-space: nowrap;
}

/* step-body 内の複数 p / figure スペーシング */
.manual-step-body p + figure,
.manual-step-body figure + p,
.manual-step-body p + p {
  margin-top: clamp(12px, 1.111vw, 16px);
}

/* セクション見出し内の小サブタイトル */
.manual-section-title-sub {
  display: inline-block;
  margin-left: clamp(8px, 0.833vw, 12px);
  font-size: clamp(14px, 1.111vw, 16px);
  font-weight: 500;
  color: rgba(42,26,14,0.6);
  letter-spacing: 0.5px;
}

/* サブヘッド・レベル2（小サブ見出し） */
.manual-subhead-2 {
  margin: clamp(28px, 2.778vw, 40px) 0 clamp(14px, 1.389vw, 20px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(16px, 1.25vw, 18px);
  font-weight: 700;
  color: var(--text);
  line-height: 1.5;
  scroll-margin-top: clamp(80px, 8.333vw, 120px);
}
/* 図キャプション（旧サイトの「（〜が届くメール↓）」等） */
.manual-figure-caption {
  margin: clamp(20px, 2.222vw, 32px) 0 clamp(8px, 0.833vw, 12px);
  font-size: clamp(14px, 1.042vw, 15px);
  color: rgba(42,26,14,0.7);
  font-weight: 500;
}

/* コールアウト：情報（is-info）バリアント */
.manual-callout.is-info {
  background: #EFF6FF;
  border-left-color: #3B82F6;
}
.manual-callout-tag.is-info {
  background: #3B82F6;
}
.manual-callout.is-info .manual-callout-title {
  color: #1E5BC1;
}

/* コールアウト内の番号付きリスト */
.manual-numbered {
  list-style: none;
  margin: clamp(8px, 0.833vw, 12px) 0 0;
  padding: 0;
  counter-reset: manual-numbered;
}
.manual-numbered li {
  counter-increment: manual-numbered;
  position: relative;
  padding-left: clamp(28px, 2.5vw, 36px);
  margin-bottom: clamp(6px, 0.625vw, 9px);
  font-size: clamp(14px, 1.042vw, 15px);
  line-height: 1.85;
  color: var(--text);
}
.manual-numbered li::before {
  content: counter(manual-numbered) ".";
  position: absolute;
  left: 0;
  top: 0;
  width: clamp(20px, 1.806vw, 26px);
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  color: #C66E07;
  text-align: center;
}
.manual-numbered li:last-child {
  margin-bottom: 0;
}

/* よくある使用例カード */
.manual-examples {
  display: flex;
  flex-direction: column;
  gap: clamp(20px, 2.222vw, 32px);
  margin-top: clamp(8px, 0.833vw, 12px);
}
.manual-example {
  padding: clamp(24px, 2.5vw, 36px) clamp(20px, 2.222vw, 32px);
  background: var(--bg);
  border-radius: clamp(14px, 1.389vw, 20px);
  border: 1px solid rgba(247,160,29,0.18);
}
.manual-example-title {
  margin: 0 0 clamp(12px, 1.111vw, 16px);
  font-size: clamp(16px, 1.25vw, 18px);
  font-weight: 700;
  color: var(--brand);
  line-height: 1.5;
}
.manual-example p {
  margin: 0;
  font-size: clamp(15px, 1.111vw, 16px);
  line-height: 1.95;
  color: var(--text);
}
.manual-example p + p {
  margin-top: clamp(10px, 0.972vw, 14px);
}
.manual-example .manual-figure {
  margin-top: clamp(14px, 1.389vw, 20px);
}

/* 定義リスト（決済ステータス説明等） */
.manual-deflist {
  margin: clamp(16px, 1.667vw, 24px) 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(8px, 0.833vw, 12px);
}
.manual-deflist-row {
  display: grid;
  grid-template-columns: clamp(120px, 11.111vw, 160px) 1fr;
  gap: clamp(14px, 1.389vw, 20px);
  align-items: start;
  padding: clamp(14px, 1.389vw, 20px) clamp(18px, 1.806vw, 26px);
  background: #fff;
  border: 1px solid rgba(42,26,14,0.08);
  border-radius: clamp(10px, 1.111vw, 14px);
}
.manual-deflist-row dt {
  font-weight: 700;
  font-size: clamp(15px, 1.111vw, 16px);
  color: var(--brand);
  line-height: 1.6;
}
.manual-deflist-row dd {
  margin: 0;
  font-size: clamp(14px, 1.042vw, 15px);
  line-height: 1.85;
  color: var(--text);
}

/* リンク（manual-paragraph 内） */
.manual-paragraph a,
.manual-callout-body a,
.manual-deflist-row dd a {
  color: var(--brand);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.manual-paragraph a:hover,
.manual-callout-body a:hover {
  text-decoration-thickness: 2px;
}

/* paragraph + figure 等のスペーシング */
.manual-section > .manual-figure,
.manual-section .manual-paragraph + .manual-figure,
.manual-section .manual-figure + .manual-paragraph,
.manual-section .manual-paragraph + .manual-paragraph {
  margin-top: clamp(14px, 1.389vw, 20px);
}

@media (max-width: 768px) {
  .manual-deflist-row { grid-template-columns: 1fr; gap: 6px; }
  .manual-section-title-sub { display: block; margin-left: 0; margin-top: 6px; }
  .manual-toc-list { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .manual-callout { grid-template-columns: 1fr; gap: clamp(8px, 1.111vw, 12px); padding: clamp(14px, 1.667vw, 18px) clamp(14px, 1.667vw, 20px); }
  .manual-callout-tag { justify-self: start; }
}

/* ==================================================
   FAQ ページ /faq/
================================================== */
.faq-page {
  background: #fff;
  padding: clamp(56px, 5.556vw, 80px) clamp(20px, 2.778vw, 40px) clamp(80px, 8.333vw, 120px);
}
.faq-page-inner {
  max-width: 1180px;
  margin: 0 auto;
}
.faq-page-head {
  text-align: center;
  margin-bottom: clamp(40px, 4.167vw, 60px);
}
.faq-page-title {
  margin: 0;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(20px, 1.944vw, 28px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 1px;
  color: var(--text);
}

/* FAQ 検索バー */
.faq-search {
  max-width: 720px;
  margin: 0 auto clamp(40px, 4.167vw, 60px);
}
.faq-search-field {
  position: relative;
  display: flex;
  align-items: center;
  background: #fff;
  border: 1px solid rgba(247,160,29,0.3);
  border-radius: 9999px;
  padding: clamp(8px, 0.694vw, 10px) clamp(14px, 1.389vw, 20px) clamp(8px, 0.694vw, 10px) clamp(20px, 1.806vw, 26px);
  box-shadow: 0 4px 14px rgba(42,26,14,0.05);
  transition: border-color 0.25s, box-shadow 0.25s;
}
.faq-search-field:focus-within {
  border-color: var(--brand);
  box-shadow: 0 6px 18px rgba(247,160,29,0.18);
}
.faq-search-icon {
  flex-shrink: 0;
  width: clamp(18px, 1.528vw, 22px);
  height: clamp(18px, 1.528vw, 22px);
  color: var(--brand);
}
.faq-search-input {
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  padding: clamp(10px, 0.972vw, 14px) clamp(10px, 1.111vw, 16px);
  font-family: inherit;
  font-size: clamp(15px, 1.111vw, 16px);
  color: var(--text);
  letter-spacing: 0.5px;
  min-width: 0;
}
.faq-search-input::placeholder {
  color: rgba(42,26,14,0.4);
}
.faq-search-input::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
}
.faq-search-clear {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: clamp(28px, 2.5vw, 36px);
  height: clamp(28px, 2.5vw, 36px);
  border-radius: 50%;
  background: rgba(42,26,14,0.06);
  color: rgba(42,26,14,0.6);
  border: 0;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.faq-search-clear:hover {
  background: rgba(42,26,14,0.1);
  color: var(--text);
}
.faq-search-clear svg {
  width: clamp(14px, 1.25vw, 18px);
  height: clamp(14px, 1.25vw, 18px);
}
.faq-search-status {
  margin: clamp(12px, 1.111vw, 16px) 0 0;
  text-align: center;
  font-size: clamp(14px, 1.042vw, 15px);
  color: rgba(42,26,14,0.7);
}
.faq-search-status.is-empty {
  color: #C66E07;
  font-weight: 600;
}

/* ヘルプ導線カード */
.faq-help-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(16px, 1.667vw, 24px);
  margin-bottom: clamp(48px, 5vw, 72px);
}
.faq-help-card {
  display: flex;
  align-items: center;
  gap: clamp(16px, 1.667vw, 24px);
  padding: clamp(20px, 2.222vw, 32px) clamp(20px, 2.222vw, 32px);
  background: var(--bg);
  border: 1px solid rgba(247,160,29,0.2);
  border-radius: clamp(14px, 1.389vw, 20px);
  text-decoration: none;
  color: var(--text);
  transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s;
}
.faq-help-card:hover {
  transform: translateY(-2px);
  border-color: var(--brand);
  box-shadow: 0 12px 28px rgba(247,160,29,0.15);
}
.faq-help-card-icon {
  flex-shrink: 0;
  width: clamp(48px, 4.444vw, 64px);
  height: clamp(48px, 4.444vw, 64px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(247,160,29,0.12);
  color: var(--brand);
}
.faq-help-card-icon svg {
  width: clamp(22px, 2.083vw, 30px);
  height: clamp(22px, 2.083vw, 30px);
}
.faq-help-card-body {
  display: flex;
  flex-direction: column;
  gap: clamp(4px, 0.417vw, 6px);
}
.faq-help-card-label {
  font-size: clamp(16px, 1.25vw, 18px);
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.5px;
}
.faq-help-card-desc {
  font-size: clamp(14px, 0.972vw, 14px);
  color: rgba(42,26,14,0.6);
  line-height: 1.6;
}

/* FAQ ページ：アコーディオンリスト調整 */
.faq-page-list {
  margin: 0 auto;
  max-width: 960px;
}
.faq-page-list .faq-card {
  border-radius: clamp(14px, 1.389vw, 20px);
}

/* 質問番号バッジ（Q01〜Q21） */
.faq-card-q-num {
  flex: none;
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(16px, 1.25vw, 18px);
  font-weight: 800;
  color: var(--brand);
  letter-spacing: 0.5px;
  line-height: 1;
  padding: clamp(6px, 0.556vw, 8px) clamp(8px, 0.764vw, 11px);
  background: rgba(247,160,29,0.1);
  border-radius: 6px;
  white-space: nowrap;
}

/* 回答内のリンク */
.faq-card-a-text a {
  color: var(--brand);
  text-decoration: underline;
  text-underline-offset: 3px;
  font-weight: 600;
}
.faq-card-a-text a:hover {
  text-decoration-thickness: 2px;
}

@media (max-width: 768px) {
  .faq-help-grid { grid-template-columns: 1fr; }
  .faq-card-q-num { font-size: 13px; padding: 5px 8px; }
}

/* ==================================================
   /troublefaq/ 各種設定 ＆ トラブル集
================================================== */
.trouble {
  background: #fff;
  padding: clamp(56px, 5.556vw, 80px) clamp(20px, 2.778vw, 40px) clamp(80px, 8.333vw, 120px);
}
.trouble-inner {
  max-width: 1180px;
  margin: 0 auto;
}
.trouble-part {
  padding-top: clamp(40px, 4.167vw, 60px);
  margin-top: clamp(40px, 4.167vw, 60px);
  border-top: 1px solid rgba(42,26,14,0.08);
  scroll-margin-top: clamp(80px, 8.333vw, 120px);
}
.trouble-part:first-of-type {
  padding-top: 0;
  margin-top: 0;
  border-top: 0;
}
.trouble-part-head {
  margin-bottom: clamp(24px, 2.5vw, 36px);
}
.trouble-part-num {
  display: inline-block;
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(13px, 0.972vw, 14px);
  font-weight: 700;
  letter-spacing: 3px;
  color: var(--brand);
  text-transform: uppercase;
  margin-bottom: clamp(8px, 0.694vw, 10px);
}
.trouble-part-title {
  margin: 0;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(24px, 2.5vw, 36px);
  font-weight: 700;
  letter-spacing: 1.5px;
  line-height: 1.4;
  color: var(--text);
}
.trouble-paragraph {
  margin: 0 0 clamp(14px, 1.111vw, 16px);
  font-size: clamp(15px, 1.111vw, 16px);
  line-height: 1.95;
  color: var(--text);
}
.trouble-paragraph a {
  color: var(--brand);
  text-decoration: underline;
  text-underline-offset: 3px;
  font-weight: 600;
}
.trouble-subhead {
  margin: clamp(36px, 3.889vw, 56px) 0 clamp(16px, 1.667vw, 24px);
  display: flex;
  align-items: center;
  gap: clamp(10px, 1.111vw, 16px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(18px, 1.667vw, 24px);
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.5px;
}
.trouble-subhead::before {
  content: '';
  flex-shrink: 0;
  width: clamp(20px, 1.944vw, 28px);
  height: 4px;
  background: var(--brand);
  border-radius: 2px;
}

/* PC 設定カード */
.setting-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(14px, 1.389vw, 20px);
}
.setting-card {
  display: flex;
  flex-direction: column;
  gap: clamp(10px, 0.972vw, 14px);
  padding: clamp(20px, 2.222vw, 32px) clamp(20px, 2.222vw, 32px);
  background: var(--bg);
  border: 1px solid rgba(247,160,29,0.18);
  border-radius: clamp(12px, 1.389vw, 18px);
}
.setting-card-num {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(40px, 4.167vw, 60px);
  font-weight: 800;
  color: var(--brand);
  line-height: 0.9;
  letter-spacing: -1px;
}
.setting-card-title {
  margin: 0 0 clamp(10px, 0.972vw, 14px);
  font-size: clamp(16px, 1.25vw, 18px);
  font-weight: 700;
  color: var(--text);
  line-height: 1.5;
  letter-spacing: 0.5px;
}
.setting-card-os {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(8px, 0.694vw, 10px);
}
.setting-card-os-link {
  display: inline-flex;
  align-items: center;
  gap: clamp(6px, 0.486vw, 7px);
  padding: clamp(7px, 0.625vw, 9px) clamp(12px, 1.111vw, 16px);
  background: #fff;
  border: 1px solid rgba(247,160,29,0.35);
  border-radius: 9999px;
  font-size: clamp(14px, 0.972vw, 14px);
  font-weight: 600;
  color: var(--brand);
  text-decoration: none;
  letter-spacing: 0.5px;
  transition: background 0.2s, border-color 0.2s, transform 0.2s;
}
.setting-card-os-link:hover {
  background: var(--brand);
  color: #fff;
  border-color: var(--brand);
  transform: translateY(-1px);
}
.setting-card-os-arrow {
  display: inline-block;
  width: 5px;
  height: 5px;
  border-right: 1.5px solid currentColor;
  border-top: 1.5px solid currentColor;
  transform: rotate(45deg);
}

.trouble-browser-note {
  margin: clamp(14px, 1.389vw, 20px) 0 0;
  font-size: clamp(14px, 1.042vw, 15px);
  color: rgba(42,26,14,0.7);
}
.trouble-browser-note strong {
  color: var(--brand);
  font-weight: 700;
}

/* お知らせコールアウト */
.trouble-callout {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(14px, 1.389vw, 20px);
  align-items: start;
  margin: clamp(20px, 2.222vw, 32px) 0 0;
  padding: clamp(18px, 1.806vw, 26px) clamp(20px, 2.222vw, 32px);
  background: #FFF6E8;
  border-left: 4px solid #E8870A;
  border-radius: clamp(10px, 1.111vw, 14px);
}
.trouble-callout-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(3px, 0.347vw, 5px) clamp(10px, 0.972vw, 14px);
  background: #E8870A;
  color: #fff;
  font-size: clamp(13px, 0.903vw, 13px);
  font-weight: 700;
  letter-spacing: 1.5px;
  border-radius: 999px;
  white-space: nowrap;
  margin-top: 2px;
}
.trouble-callout-title {
  margin: 0 0 clamp(6px, 0.625vw, 9px);
  font-size: clamp(16px, 1.25vw, 18px);
  font-weight: 700;
  color: #C66E07;
  line-height: 1.5;
}
.trouble-callout-body p {
  margin: 0;
  font-size: clamp(14px, 1.042vw, 15px);
  line-height: 1.85;
  color: var(--text);
}

/* タブレット/SP 設定カード */
.setting-mobile-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(16px, 1.667vw, 24px);
}
.setting-mobile-card {
  padding: clamp(24px, 2.5vw, 36px);
  background: var(--bg);
  border: 1px solid rgba(247,160,29,0.18);
  border-radius: clamp(14px, 1.389vw, 20px);
  display: flex;
  flex-direction: column;
  gap: clamp(16px, 1.667vw, 24px);
}
.setting-mobile-card-title {
  margin: 0;
  padding-bottom: clamp(12px, 1.111vw, 16px);
  font-size: clamp(17px, 1.389vw, 20px);
  font-weight: 700;
  color: var(--brand);
  letter-spacing: 0.5px;
  border-bottom: 2px solid rgba(247,160,29,0.3);
}
.setting-mobile-card-block h5 {
  margin: 0 0 clamp(6px, 0.625vw, 9px);
  font-size: clamp(14px, 1.042vw, 15px);
  font-weight: 700;
  color: var(--text);
  line-height: 1.5;
}
.setting-mobile-card-block p {
  margin: 0;
  font-size: clamp(14px, 1.042vw, 15px);
  line-height: 1.85;
  color: var(--text);
}
.setting-mobile-card-block a,
.setting-mobile-card-foot a {
  color: var(--brand);
  text-decoration: underline;
  text-underline-offset: 3px;
  font-weight: 600;
}
.setting-mobile-card-foot {
  margin-top: auto;
  padding-top: clamp(12px, 1.111vw, 16px);
  border-top: 1px dashed rgba(42,26,14,0.16);
  font-size: clamp(14px, 0.972vw, 14px);
  color: rgba(42,26,14,0.75);
  display: flex;
  flex-direction: column;
  gap: clamp(4px, 0.417vw, 6px);
}
.setting-mobile-card-foot p {
  margin: 0;
}
.setting-mobile-card-foot strong {
  color: var(--brand);
  font-weight: 700;
}

/* トラブル集インデックス */
.trouble-index {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(20px, 2.222vw, 32px);
  margin: clamp(20px, 2.222vw, 32px) 0 clamp(40px, 4.167vw, 60px);
  padding: clamp(24px, 2.5vw, 36px);
  background: var(--bg);
  border-radius: clamp(14px, 1.389vw, 20px);
}
.trouble-index-cat {
  margin: 0 0 clamp(8px, 0.833vw, 12px);
  padding-bottom: clamp(6px, 0.486vw, 7px);
  font-size: clamp(14px, 1.111vw, 16px);
  font-weight: 700;
  color: var(--brand);
  letter-spacing: 0.5px;
  border-bottom: 1px solid rgba(247,160,29,0.3);
}
.trouble-index-cat:not(:first-child) {
  margin-top: clamp(20px, 2.222vw, 32px);
}
.trouble-index-col ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(6px, 0.556vw, 8px);
}
.trouble-index-col a {
  display: flex;
  align-items: baseline;
  gap: clamp(8px, 0.694vw, 10px);
  padding: clamp(6px, 0.556vw, 8px) clamp(8px, 0.694vw, 10px);
  font-size: clamp(14px, 1.042vw, 15px);
  color: var(--text);
  text-decoration: none;
  line-height: 1.5;
  border-radius: 6px;
  transition: background 0.2s, color 0.2s;
}
.trouble-index-col a:hover {
  background: rgba(247,160,29,0.08);
  color: var(--brand);
}
.trouble-index-num {
  flex-shrink: 0;
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: clamp(14px, 0.972vw, 14px);
  color: var(--brand);
  letter-spacing: 0.3px;
}

/* カテゴリ見出し */
.trouble-cat-title {
  margin: clamp(40px, 4.167vw, 60px) 0 clamp(16px, 1.667vw, 24px);
  font-size: clamp(17px, 1.528vw, 22px);
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.5px;
  padding-left: clamp(12px, 1.111vw, 16px);
  border-left: 4px solid var(--brand);
  line-height: 1.4;
}

/* trouble-faq-list は標準の faq-list を継承、scroll-margin-top のみ追加 */
.trouble-faq-list .faq-card {
  scroll-margin-top: clamp(80px, 8.333vw, 120px);
}

@media (max-width: 768px) {
  .setting-cards { grid-template-columns: 1fr; }
  .setting-mobile-grid { grid-template-columns: 1fr; }
  .trouble-index { grid-template-columns: 1fr; }
}

/* ==================================================
   法務ページ /company/ /privacy/ /kiyaku/
================================================== */
.legal {
  background: #fff;
  padding: clamp(56px, 5.556vw, 80px) clamp(20px, 2.778vw, 40px) clamp(80px, 8.333vw, 120px);
}
.legal-inner {
  max-width: 1180px;
  margin: 0 auto;
}
.legal-inner-narrow {
  max-width: 880px;
}
.legal-doc-title {
  margin: 0 0 clamp(28px, 2.778vw, 40px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(20px, 1.944vw, 28px);
  font-weight: 700;
  text-align: center;
  letter-spacing: 1px;
  color: var(--text);
  line-height: 1.5;
}

/* /company/ 定義リスト */
.legal-deflist {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(8px, 0.694vw, 10px);
}
.legal-deflist-row {
  display: grid;
  grid-template-columns: clamp(180px, 16.667vw, 240px) 1fr;
  gap: clamp(16px, 1.667vw, 24px);
  align-items: start;
  padding: clamp(18px, 1.806vw, 26px) clamp(20px, 2.222vw, 32px);
  background: var(--bg);
  border-radius: clamp(10px, 1.111vw, 14px);
}
.legal-deflist-row dt {
  font-weight: 700;
  font-size: clamp(15px, 1.111vw, 16px);
  color: var(--brand);
  letter-spacing: 0.5px;
  line-height: 1.6;
}
.legal-deflist-row dd {
  margin: 0;
  font-size: clamp(14px, 1.042vw, 15px);
  line-height: 1.85;
  color: var(--text);
}
.legal-deflist-row dd > p {
  margin: 0;
}
.legal-deflist-row dd > p + p {
  margin-top: clamp(8px, 0.694vw, 10px);
}
.email-img {
  display: inline-block;
  height: clamp(15px, 1.181vw, 17px);
  width: auto;
  vertical-align: -0.18em;
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none;
}
.legal-note {
  font-size: clamp(14px, 0.972vw, 14px) !important;
  color: rgba(42,26,14,0.65) !important;
  line-height: 1.75 !important;
}

/* /privacy/ */
.legal-intro {
  margin: 0 0 clamp(28px, 2.778vw, 40px);
  font-size: clamp(15px, 1.111vw, 16px);
  line-height: 2;
  color: var(--text);
  letter-spacing: 0.04em;
}
.legal-policy-list {
  list-style: none;
  margin: 0 0 clamp(28px, 2.778vw, 40px);
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(16px, 1.667vw, 24px);
}
.legal-policy-list > li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(8px, 0.833vw, 12px);
  padding: clamp(16px, 1.667vw, 24px) clamp(20px, 2.222vw, 32px);
  background: var(--bg);
  border-left: 4px solid var(--brand);
  border-radius: clamp(8px, 0.833vw, 12px);
}
.legal-policy-num {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: clamp(16px, 1.25vw, 18px);
  color: var(--brand);
  line-height: 1.85;
}
.legal-policy-list p {
  margin: 0;
  font-size: clamp(15px, 1.111vw, 16px);
  line-height: 1.95;
  color: var(--text);
  letter-spacing: 0.04em;
}
.legal-paragraph {
  margin: 0 0 clamp(20px, 2.222vw, 32px);
  font-size: clamp(15px, 1.111vw, 16px);
  line-height: 2;
  color: var(--text);
  letter-spacing: 0.04em;
}
.legal-signature {
  margin: clamp(40px, 4.167vw, 60px) 0;
  padding: clamp(24px, 2.5vw, 36px);
  text-align: center;
  background: var(--bg);
  border-radius: clamp(10px, 1.111vw, 14px);
}
.legal-signature p {
  margin: 0;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(16px, 1.25vw, 18px);
  font-weight: 700;
  color: var(--text);
  line-height: 1.8;
  letter-spacing: 1px;
}
.legal-callout {
  padding: clamp(18px, 1.806vw, 26px) clamp(20px, 2.222vw, 32px);
  background: #FFF6E8;
  border-left: 4px solid #E8870A;
  border-radius: clamp(8px, 0.833vw, 12px);
}
.legal-callout p {
  margin: 0;
  font-size: clamp(14px, 1.042vw, 15px);
  font-weight: 600;
  color: #C66E07;
  line-height: 1.7;
}

/* /kiyaku/ */
.legal-intro-block {
  margin: 0 0 clamp(40px, 4.167vw, 60px);
  padding: clamp(24px, 2.5vw, 36px);
  background: var(--bg);
  border-radius: clamp(10px, 1.111vw, 14px);
}
.legal-intro-block p {
  margin: 0;
  font-size: clamp(15px, 1.111vw, 16px);
  line-height: 2;
  color: var(--text);
  letter-spacing: 0.04em;
}
.legal-intro-block p + p {
  margin-top: clamp(10px, 0.972vw, 14px);
}
.legal-article {
  margin-bottom: clamp(28px, 2.778vw, 40px);
}
.legal-article-title {
  margin: 0 0 clamp(10px, 0.972vw, 14px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(17px, 1.389vw, 20px);
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.5px;
  line-height: 1.5;
  padding-bottom: clamp(8px, 0.694vw, 10px);
  border-bottom: 2px solid rgba(247,160,29,0.3);
}
.legal-article-body {
  padding-left: clamp(8px, 0.833vw, 12px);
}
.legal-article-body p {
  margin: 0;
  font-size: clamp(15px, 1.111vw, 16px);
  line-height: 1.95;
  color: var(--text);
  letter-spacing: 0.04em;
}
.legal-article-body p + p {
  margin-top: clamp(10px, 0.972vw, 14px);
}
.legal-effective-date {
  margin: clamp(48px, 4.444vw, 64px) 0 0;
  padding: clamp(20px, 1.944vw, 28px);
  text-align: center;
  font-weight: 600;
  font-size: clamp(14px, 1.042vw, 15px);
  color: #C66E07;
  background: #FFF6E8;
  border-radius: clamp(8px, 0.833vw, 12px);
  line-height: 1.85;
}

@media (max-width: 768px) {
  .legal-deflist-row { grid-template-columns: 1fr; gap: 6px; }
  .legal-policy-list > li { grid-template-columns: 1fr; }
}

/* ステップ */
.manual-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(20px, 2.222vw, 32px);
}
.manual-step {
  display: grid;
  grid-template-columns: clamp(48px, 4.444vw, 64px) 1fr;
  gap: clamp(16px, 1.667vw, 24px);
  align-items: start;
}
.manual-step-num {
  width: clamp(48px, 4.444vw, 64px);
  height: clamp(48px, 4.444vw, 64px);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: linear-gradient(135deg, #FCBE4A 0%, #F7A01D 100%);
  color: #fff;
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(20px, 1.944vw, 28px);
  font-weight: 800;
  letter-spacing: 0;
  box-shadow: 0 6px 14px rgba(247,160,29,0.32);
}
.manual-step-body {
  padding-top: clamp(8px, 0.833vw, 12px);
  font-size: clamp(15px, 1.111vw, 16px);
  line-height: 1.9;
  color: var(--text);
}
.manual-step-body p {
  margin: 0;
}
.manual-step-body strong {
  color: #C66E07;
  font-weight: 700;
}
.manual-figure {
  margin: clamp(16px, 1.667vw, 24px) 0 0;
}
.manual-figure img {
  display: block;
  width: 100%;
  max-width: 720px;
  height: auto;
  border-radius: clamp(10px, 1.111vw, 16px);
  box-shadow: 0 14px 30px rgba(42,26,14,0.12);
}

/* フローティング ページトップボタン（全ページ共通） */
.page-top {
  position: fixed;
  right: clamp(18px, 1.667vw, 24px);
  bottom: clamp(18px, 1.667vw, 24px);
  z-index: 95;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: clamp(48px, 3.889vw, 56px);
  height: clamp(48px, 3.889vw, 56px);
  border-radius: 50%;
  background: #fff;
  color: var(--brand);
  border: 1px solid rgba(247,160,29,0.35);
  box-shadow:
    0 12px 28px rgba(42,26,14,0.18),
    0 4px 10px rgba(247,160,29,0.18);
  text-decoration: none;
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px);
  transition: opacity 0.3s ease, transform 0.3s ease, box-shadow 0.25s, background 0.25s, color 0.25s;
}
.page-top.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
.page-top:hover {
  transform: translateY(-3px);
  background: var(--brand);
  color: #fff;
  border-color: var(--brand);
  box-shadow:
    0 16px 32px rgba(42,26,14,0.22),
    0 6px 14px rgba(247,160,29,0.32);
}
.page-top-icon {
  width: clamp(20px, 1.667vw, 24px);
  height: clamp(20px, 1.667vw, 24px);
}
@media (max-width: 480px) {
  .page-top { bottom: 18px; right: 18px; }
}

@media (max-width: 768px) {
  .manual-notice { grid-template-columns: 1fr; }
  .manual-section-head { flex-wrap: wrap; gap: 8px; }
}

/* チャンネルページ ① ジャンルから選ぶ */
.chg-section {
  padding: clamp(60px, 6.944vw, 100px) clamp(20px, 1.667vw, 24px);
  background: #fff;
}
.chg-inner {
  max-width: 1180px;
  margin: 0 auto;
}
.ch-title {
  margin: 0 0 clamp(40px, 3.472vw, 50px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(24px, 2.5vw, 36px);
  font-weight: 700;
  color: var(--text);
  text-align: center;
  letter-spacing: 1.5px;
  line-height: 1.4;
}
.ch-title:has(+ .chg-lead) { margin-bottom: clamp(8px, 0.833vw, 12px); }
.chg-lead {
  margin: 0 0 clamp(40px, 3.472vw, 50px);
  text-align: center;
  font-size: clamp(15px, 1.111vw, 16px);
  line-height: 1.85;
  color: rgba(42,26,14,0.72);
}
.chg-grid {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(16px, 1.667vw, 24px);
}
.chg-card {
  position: relative;
  background: #FFFAF1;
  border: 1px solid rgba(247,160,29,0.18);
  border-radius: clamp(12px, 1.111vw, 16px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.chg-card:hover {
  transform: translateY(-3px);
  border-color: var(--brand);
  box-shadow: 0 14px 28px rgba(247,160,29,0.14);
}
.chg-card-img {
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #F5EFE3;
}
.chg-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}
.chg-card:hover .chg-card-img img {
  transform: scale(1.04);
}
.chg-card-body {
  padding: clamp(12px, 1.111vw, 16px) clamp(14px, 1.25vw, 18px) clamp(14px, 1.25vw, 18px);
  flex: 1;
  display: flex;
  flex-direction: column;
}
.chg-card-name {
  margin: 0;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(16px, 1.181vw, 17px);
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.04em;
  line-height: 1.4;
}
/* A案: アコーディオン版ジャンルカード */
.chg-card-collapsible { align-self: start; }
.chg-card-collapsible .chg-card-head {
  appearance: none;
  background: transparent;
  border: 0;
  padding: 0;
  margin: 0;
  width: 100%;
  text-align: left;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  font-family: inherit;
  color: inherit;
}
.chg-card-collapsible .chg-card-name { display: flex; align-items: center; justify-content: space-between; gap: clamp(6px, 0.556vw, 8px); }
.chg-card-toggle {
  display: inline-block;
  width: clamp(8px, 0.694vw, 10px);
  height: clamp(8px, 0.694vw, 10px);
  border-right: 2px solid var(--brand);
  border-bottom: 2px solid var(--brand);
  transform: rotate(45deg);
  transition: transform 0.3s ease;
  flex-shrink: 0;
}
.chg-card-collapsible[data-open="true"] .chg-card-toggle { transform: rotate(-135deg); }
.chg-card-panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
}
.chg-card-collapsible[data-open="true"] .chg-card-panel { max-height: 600px; }
.chg-card-list {
  list-style: none;
  margin: 0;
  padding: clamp(10px, 0.972vw, 14px) clamp(14px, 1.25vw, 18px) clamp(14px, 1.25vw, 18px);
  display: grid;
  gap: clamp(4px, 0.347vw, 5px);
}
.chg-card-list li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(4px, 0.347vw, 6px);
  font-size: clamp(14px, 0.972vw, 13px);
  line-height: 1.6;
  color: rgba(42,26,14,0.78);
}
.chg-card-list li::before {
  content: '・';
  color: var(--brand);
  font-weight: 700;
}
.chg-card-count {
  position: absolute;
  top: clamp(8px, 0.694vw, 10px);
  right: clamp(8px, 0.694vw, 10px);
  z-index: 2;
  padding: clamp(3px, 0.278vw, 4px) clamp(8px, 0.694vw, 10px);
  border-radius: 9999px;
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(13px, 0.833vw, 12px);
  font-weight: 700;
  color: var(--brand);
  letter-spacing: 0.04em;
  line-height: 1;
  box-shadow: 0 2px 6px rgba(42,26,14,0.08);
}
.chg-note {
  margin: clamp(28px, 2.5vw, 36px) 0 0;
  text-align: center;
  font-size: clamp(14px, 1vw, 14.5px);
  color: rgba(42,26,14,0.6);
}
@media (max-width: 1024px) {
  .chg-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .chg-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .chg-grid { grid-template-columns: 1fr; }
}

/* チャンネルページ ② 業種から選ぶ */
.chi-section {
  padding: clamp(60px, 6.944vw, 100px) clamp(20px, 1.667vw, 24px);
  background: #FFFAF1;
}
.chi-inner {
  max-width: 1180px;
  margin: 0 auto;
}
.chi-grid {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(16px, 1.667vw, 24px);
}
.chi-card {
  background: #fff;
  border: 1px solid rgba(247,160,29,0.18);
  border-radius: clamp(12px, 1.111vw, 16px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.chi-card-img {
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #F5EFE3;
}
.chi-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.chi-card-img-empty {
  background: repeating-linear-gradient(45deg, #F5EFE3, #F5EFE3 8px, #ECE4D2 8px, #ECE4D2 16px);
}
.chi-card-body {
  padding: clamp(16px, 1.389vw, 20px) clamp(18px, 1.528vw, 22px) clamp(18px, 1.528vw, 22px);
  flex: 1;
  display: flex;
  flex-direction: column;
}
.chi-card:hover {
  transform: translateY(-3px);
  border-color: var(--brand);
  box-shadow: 0 14px 28px rgba(247,160,29,0.14);
}
.chi-card-name {
  margin: 0 0 clamp(8px, 0.694vw, 10px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(16px, 1.181vw, 17px);
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.04em;
  line-height: 1.4;
}
.chi-card-desc {
  margin: 0;
  font-size: clamp(14px, 1vw, 14.5px);
  line-height: 1.7;
  color: rgba(42,26,14,0.72);
}
@media (max-width: 1024px) {
  .chi-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .chi-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .chi-grid { grid-template-columns: 1fr; }
}

/* チャンネルページ ③ 全チャンネル一覧 */
.cha-section {
  padding: clamp(60px, 6.944vw, 100px) clamp(20px, 1.667vw, 24px);
  background: #fff;
}
.cha-inner {
  max-width: 1180px;
  margin: 0 auto;
}
.cha-grid {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: clamp(10px, 0.972vw, 14px);
}
.cha-card {
  position: relative;
  background: #FFFAF1;
  border: 1px solid rgba(247,160,29,0.18);
  border-radius: clamp(10px, 0.833vw, 12px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.cha-card-img {
  width: 100%;
  aspect-ratio: 1 / 1;
  background: #F5EFE3;
  overflow: hidden;
}
.cha-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.cha-card-img-empty {
  background: repeating-linear-gradient(45deg, #F5EFE3, #F5EFE3 6px, #ECE4D2 6px, #ECE4D2 12px);
}
.cha-card-body {
  padding: clamp(8px, 0.694vw, 10px) clamp(8px, 0.694vw, 10px) clamp(10px, 0.833vw, 12px);
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: clamp(2px, 0.139vw, 2px);
}
.cha-card-code {
  position: absolute;
  top: clamp(6px, 0.556vw, 8px);
  right: clamp(6px, 0.556vw, 8px);
  z-index: 2;
  padding: clamp(3px, 0.278vw, 4px) clamp(7px, 0.625vw, 9px);
  border-radius: 9999px;
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(12px, 0.764vw, 11px);
  font-weight: 700;
  color: var(--brand);
  letter-spacing: 0.04em;
  line-height: 1;
  box-shadow: 0 2px 6px rgba(42,26,14,0.08);
}
.cha-card-name {
  margin: 0;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(14px, 1.111vw, 16px);
  font-weight: 700;
  color: var(--text);
  line-height: 1.5;
  letter-spacing: 0.02em;
}
@media (max-width: 1180px) {
  .cha-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1024px) {
  .cha-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .cha-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ===== System: 推奨PC・タブレット環境 ===== */
.spec-section {
  background: #FAF6EF;
  padding: clamp(48px, 5.556vw, 80px) clamp(20px, 2.778vw, 40px);
  scroll-margin-top: clamp(60px, 5.556vw, 80px);
}
.spec-inner { max-width: 1180px; margin: 0 auto; }
.spec-head { text-align: center; margin-bottom: clamp(36px, 4.167vw, 60px); }
.spec-title {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(22px, 2.222vw, 32px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 1px;
  color: var(--text);
}
.spec-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(16px, 1.667vw, 24px);
}
.spec-card {
  background: #fff;
  border-radius: clamp(14px, 1.389vw, 20px);
  padding: clamp(24px, 2.222vw, 32px) clamp(22px, 1.944vw, 28px) clamp(26px, 2.222vw, 32px);
  box-shadow: 0 4px 16px rgba(42,26,14,0.05);
  display: flex;
  flex-direction: column;
}
.spec-card-os {
  display: inline-block;
  align-self: flex-start;
  font-family: 'Montserrat', 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(16px, 1.319vw, 19px);
  font-weight: 700;
  letter-spacing: 1.2px;
  color: #fff;
  background: var(--brand);
  padding: clamp(6px, 0.556vw, 8px) clamp(14px, 1.111vw, 16px);
  border-radius: clamp(6px, 0.556vw, 8px);
  margin-bottom: clamp(18px, 1.667vw, 24px);
}
.spec-card-list {
  margin: 0 0 clamp(12px, 1.111vw, 16px);
  padding: 0;
  display: grid;
  grid-template-columns: clamp(82px, 7.5vw, 108px) 1fr;
  gap: clamp(8px, 0.833vw, 12px) clamp(14px, 1.111vw, 16px);
  align-items: start;
}
.spec-card-list dt {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(14px, 0.972vw, 14px);
  font-weight: 700;
  color: var(--brand);
  letter-spacing: 1.2px;
  padding-top: 2px;
}
.spec-card-list dd {
  margin: 0;
  font-size: clamp(14px, 1.042vw, 15px);
  line-height: 1.7;
  color: var(--text);
  letter-spacing: 0.02em;
}
.spec-card-note {
  margin: 0;
  margin-top: auto;
  padding-top: clamp(14px, 1.25vw, 18px);
  border-top: 1px dashed rgba(247,160,29,0.35);
  font-size: clamp(14px, 0.903vw, 13px);
  line-height: 1.7;
  color: rgba(42,26,14,0.7);
}
.spec-card-note a {
  color: var(--brand);
  text-decoration: underline;
  font-weight: 700;
}

/* ===== System: 推奨インターネット回線 ===== */
.speed-section {
  background: #fff;
  padding: clamp(48px, 5.556vw, 80px) clamp(20px, 2.778vw, 40px);
  scroll-margin-top: clamp(60px, 5.556vw, 80px);
}
.speed-inner { max-width: 1180px; margin: 0 auto; }
.speed-head { text-align: center; margin-bottom: clamp(28px, 3.333vw, 48px); }
.speed-title {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(22px, 2.222vw, 32px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 1px;
  color: var(--text);
}
.speed-callout {
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
  background: linear-gradient(135deg, #FFF6E5 0%, #FFE7BD 100%);
  border-radius: clamp(16px, 1.667vw, 24px);
  padding: clamp(28px, 3.056vw, 44px) clamp(28px, 3.056vw, 48px);
  text-align: center;
}
.speed-eyebrow {
  display: block;
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(14px, 1.042vw, 15px);
  font-weight: 700;
  letter-spacing: 2px;
  color: rgba(42,26,14,0.7);
  margin-bottom: clamp(10px, 1.111vw, 16px);
}
.speed-figure {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  gap: clamp(4px, 0.556vw, 8px);
  line-height: 1.1;
  color: var(--text);
}
.speed-num {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(44px, 5.556vw, 80px);
  font-weight: 700;
  font-style: normal;
  letter-spacing: -1px;
  color: var(--brand);
}
.speed-unit {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(22px, 2.5vw, 36px);
  font-weight: 700;
  color: var(--brand);
}
.speed-suffix {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(17px, 1.667vw, 24px);
  font-weight: 700;
  letter-spacing: 1px;
  margin-left: clamp(6px, 0.694vw, 10px);
}
.speed-note {
  max-width: 720px;
  margin: clamp(20px, 1.944vw, 28px) auto 0;
  text-align: center;
  font-size: clamp(14px, 1.042vw, 15px);
  line-height: 1.8;
  color: rgba(42,26,14,0.75);
}

@media (max-width: 768px) {
  .spec-grid { grid-template-columns: 1fr; }
  .spec-card-list { grid-template-columns: 1fr; gap: 4px 0; }
  .spec-card-list dt { padding-top: 8px; }
  .spec-card-list dt:first-child { padding-top: 0; }
}

/* ===== 404 NOT FOUND ===== */
.notfound {
  background: var(--bg);
  padding: clamp(80px, 10vw, 140px) clamp(20px, 2.778vw, 40px);
  min-height: calc(100vh - 200px);
  display: flex;
  align-items: center;
  justify-content: center;
}
.notfound-inner {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}
.notfound-code {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(96px, 14vw, 200px);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -2px;
  color: var(--brand);
  opacity: 0.85;
  margin-bottom: clamp(16px, 2vw, 28px);
}
.notfound-title {
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(22px, 2.5vw, 36px);
  font-weight: 700;
  letter-spacing: 1.5px;
  line-height: 1.4;
  color: var(--text);
  margin-bottom: clamp(16px, 1.667vw, 24px);
}
.notfound-lead {
  font-size: clamp(14px, 1.111vw, 16px);
  line-height: 1.95;
  color: rgba(42,26,14,0.7);
  margin-bottom: clamp(32px, 3.333vw, 48px);
}
.notfound-links {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(12px, 1.25vw, 18px);
  justify-content: center;
}
.notfound-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(12px, 1.25vw, 16px) clamp(24px, 2.5vw, 36px);
  font-family: 'LINE Seed JP', 'Noto Sans JP', sans-serif;
  font-size: clamp(14px, 1.111vw, 16px);
  font-weight: 700;
  letter-spacing: 1px;
  border-radius: 9999px;
  text-decoration: none;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.notfound-btn:hover { transform: translateY(-2px); }
.notfound-btn-primary {
  background: var(--brand);
  color: #fff;
  box-shadow: 0 8px 20px rgba(247,160,29,0.3);
}
.notfound-btn-primary:hover { box-shadow: 0 12px 28px rgba(247,160,29,0.4); }
.notfound-btn-secondary {
  background: #fff;
  color: var(--brand);
  border: 2px solid var(--brand);
}
.notfound-btn-secondary:hover { background: rgba(247,160,29,0.06); }