/* ===== Legal Page Layout(privacy.html と統一) ===== */
    .legal-hero {
      max-width: 800px; margin: 0 auto;
      text-align: center;
      padding: calc(60px + var(--s-12)) var(--s-3) var(--s-6);
    }
    .legal-eyebrow {
      font-family: var(--f-caption);
      font-size: 0.7rem; letter-spacing: 0.3em;
      text-transform: uppercase;
      color: var(--c-navy-soft);
      margin-bottom: var(--s-2);
      display: inline-block;
    }
    .legal-title-en {
      font-family: var(--f-display);
      font-weight: 400;
      font-size: clamp(2.2rem, 4.5vw, 3.4rem);
      letter-spacing: 0.08em;
      color: var(--c-navy-dark);
      margin-bottom: var(--s-1);
    }
    .legal-title-jp {
      font-family: var(--f-serif-jp);
      font-weight: 300;
      font-size: clamp(1.1rem, 2vw, 1.4rem);
      letter-spacing: 0.18em;
      color: var(--c-navy-main);
      margin-bottom: var(--s-3);
    }
    .legal-updated {
      font-family: var(--f-caption);
      font-size: 0.72rem; letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--c-navy-soft);
    }

    .legal-article {
      max-width: 760px; margin: 0 auto;
      padding: var(--s-6) var(--s-3) var(--s-12);
    }
    .legal-lead {
      font-family: var(--f-serif-jp);
      font-size: 1rem; line-height: 2.1;
      color: var(--c-navy-main);
      letter-spacing: 0.04em;
      margin-bottom: var(--s-8);
      padding: var(--s-4) var(--s-4);
      background: rgba(255,255,255,0.45);
      border-left: 2px solid var(--c-aurora-lav);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }
    .legal-section {
      margin-bottom: var(--s-8);
      padding-top: var(--s-4);
      border-top: 1px solid rgba(26, 31, 74, 0.08);
    }
    .legal-section:first-of-type { border-top: none; padding-top: 0; }
    .legal-section h2 {
      font-family: var(--f-serif-jp);
      font-weight: 500;
      font-size: 1.2rem;
      color: var(--c-navy-dark);
      letter-spacing: 0.1em;
      margin-bottom: var(--s-3);
      display: flex; align-items: baseline; gap: var(--s-2);
    }
    .legal-section h2::before {
      content: attr(data-num);
      font-family: var(--f-number); font-style: italic;
      font-size: 1.6rem;
      color: var(--c-navy-soft);
      opacity: 0.7;
      letter-spacing: 0.02em;
    }
    .legal-section p,
    .legal-section ul {
      font-family: var(--f-serif-jp);
      font-size: 0.96rem; line-height: 2.0;
      color: var(--c-navy-main);
      letter-spacing: 0.04em;
      margin-bottom: var(--s-2);
    }
    .legal-section ul {
      padding-left: 1.4em;
      list-style: none;
    }
    .legal-section ul li {
      position: relative;
      margin-bottom: 4px;
    }
    .legal-section ul li::before {
      content: "·";
      position: absolute; left: -1.1em;
      color: var(--c-aurora-lav);
      font-size: 1.4em;
      line-height: 1;
    }
    .legal-section a {
      color: var(--c-navy-dark);
      border-bottom: 1px solid rgba(26, 31, 74, 0.3);
      transition: border-color var(--d-fast) var(--ease);
    }
    .legal-section a:hover { border-bottom-color: var(--c-navy-dark); }
    .legal-meta {
      margin-top: var(--s-6); padding-top: var(--s-4);
      border-top: 1px solid rgba(26, 31, 74, 0.08);
      font-family: var(--f-caption);
      font-size: 0.78rem;
      color: var(--c-navy-soft);
      letter-spacing: 0.08em;
    }
    .legal-meta strong {
      font-family: var(--f-serif-jp); font-weight: 500;
      color: var(--c-navy-dark);
    }

    .breadcrumb {
      max-width: 1280px; margin: 0 auto;
      padding: var(--s-3) var(--s-3) 0;
      font-family: var(--f-caption);
      font-size: 0.72rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--c-navy-soft);
    }
    .breadcrumb a { color: var(--c-navy-soft); }
    .breadcrumb a:hover { color: var(--c-navy-dark); }
    .breadcrumb .sep { margin: 0 0.6em; opacity: 0.5; }

    .legal-back-wrap { text-align: center; padding: var(--s-6) 0 var(--s-12); }
    .legal-back {
      display: inline-block;
      padding: 14px 36px;
      font-family: var(--f-caption); font-size: 0.78rem; font-weight: 500;
      letter-spacing: 0.22em; text-transform: uppercase;
      border: 1px solid var(--c-navy-dark);
      color: var(--c-navy-dark);
      transition: all var(--d-fast) var(--ease);
    }
    .legal-back:hover { background: var(--c-navy-dark); color: var(--c-primary); }

    @media (max-width: 639px) {
      .legal-hero { padding-top: calc(60px + var(--s-8)); }
      .legal-section h2 { font-size: 1.1rem; }
    }