@charset "UTF-8";
/* ==========================================================================
   b.s. — privacy.css（Privacy Policy）
   読みやすさを優先し、本文は傾けずに組んでいます。
   ピンクの地・傾いた白い英字・グレーの面（our philosophy の about と同じ色）で
   サイトの他のページとそろえています。
   ========================================================================== */

@layer pages {
  .p-privacy main { display: block; }

  /* ---------- タイトル ---------- */
  .p-privacy__hero {
    padding: max(250px, calc(300 * var(--u))) 0 0; /* 傾いて右上がりになる英字がヘッダーにかからない高さ */
    overflow: hidden;
  }
  .p-privacy__title {
    margin: 0 0 0 calc(var(--frame-x) + 54 * var(--u));
    font-family: var(--ff-sans);
    font-weight: 700;
    font-size: calc(132 * var(--u));
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--c-white);
    white-space: nowrap;
    transform-origin: 0 100%;
    transform: skewY(calc(-1 * var(--slant-en)));
  }

  /* ---------- 本文 ---------- */
  .p-privacy__body {
    position: relative;
    padding: calc(40 * var(--u)) 0 calc(160 * var(--u));
  }
  .p-privacy__panel {
    width: min(calc(967 * var(--u)), 100% - 40px);
    margin-left: calc(var(--frame-x) + 157 * var(--u));
    padding: calc(84 * var(--u)) calc(110 * var(--u)) calc(96 * var(--u));
    background: var(--c-about-box);
    color: var(--c-ink);
    font-family: var(--ff-mincho);
    font-weight: var(--fw-mincho-regular);
    font-size: 16px;
    line-height: 2.05;
    letter-spacing: 0.04em;
    font-feature-settings: "palt" 0;
    line-break: strict;
    overflow-wrap: anywhere;
  }
  .p-privacy__panel > * { max-width: 44em; }
  .p-privacy__lead { margin: 0 0 3.2em; }
  .p-privacy__item + .p-privacy__item { margin-top: 2.6em; }
  .p-privacy__heading {
    margin: 0 0 0.7em;
    font-size: 1.12em;
    font-weight: var(--fw-mincho-strong);
    line-height: 1.6;
    letter-spacing: 0.06em;
  }
  .p-privacy__item p { margin: 0; }
  .p-privacy__list { margin: 0.9em 0 0; padding: 0; list-style: none; }
  .p-privacy__list li { position: relative; padding-left: 1.2em; }
  .p-privacy__list li::before { content: "・"; position: absolute; left: 0; }

  /* お問い合わせ先：細い線で本文と区切る */
  .p-privacy__contact {
    margin-top: 3.2em;
    padding-top: 2.4em;
    border-top: 1px solid rgb(35 24 21 / 0.25);
  }
  .p-privacy__contact p { margin: 0; }
  .p-privacy__mail {
    display: inline-block;
    padding: 0.2em 0;          /* 押しやすい高さを確保 */
    color: inherit;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.3em;
    overflow-wrap: anywhere;
  }
  .p-privacy__mail:hover { text-decoration-thickness: 2px; }
  .p-privacy__mail:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
}

/* ---------- 動き：タイトルが傾きに沿って入る（「視差効果を減らす」設定では動かない） ---------- */
@layer motion {
  .js-motion .p-privacy__title[data-intro] { opacity: 0; translate: -40px 7px; transition: opacity 0.9s linear, translate 1.2s var(--ease-out); }
  .js-motion.is-ready .p-privacy__title[data-intro] { opacity: 1; translate: 0 0; }
}

/* ==========================================================================
   SMARTPHONE／TABLET（〜1023px）
   ========================================================================== */
@layer pages {
  @media (max-width: 1023px) {
    .p-privacy__hero { padding-top: calc(118px + 38 * var(--s)); }
    .p-privacy__title { margin-left: calc(14 * var(--s)); font-size: calc(52 * var(--s)); }
    .p-privacy__body { padding: calc(30 * var(--sv)) 0 calc(70 * var(--sv)); }
    .p-privacy__panel {
      width: auto;
      margin: 0 calc(12 * var(--s));
      padding: calc(34 * var(--sv)) calc(20 * var(--s)) calc(44 * var(--sv));
      font-size: 15px;
      line-height: 2;
      letter-spacing: 0.02em;
    }
  }
  @media (min-width: 560px) and (max-width: 1023px) {
    .p-privacy__title { margin-left: calc(20 * var(--s)); font-size: calc(40 * var(--s)); }
    .p-privacy__panel { margin: 0 calc(28 * var(--s)); padding: 48px 40px 56px; font-size: 16px; }
  }
}
