@charset "UTF-8";
/* =========================================================
   原田直樹 公式サイト  styles
   ========================================================= */

:root{
  --blue:        #005a96;   /* primary */
  --blue-dark:   #004473;
  --blue-deep:   #003355;
  --blue-logo:   #0073bd;
  --ink:         #222222;
  --ink-soft:    #4a4a4a;
  --line:        #e2e6ea;
  --bg:          #ffffff;
  --bg-soft:     #f4f7fa;
  --header-h:    75px;
  --header-h-sp: 64px;
  --container:   1100px;
  --ease:        cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  margin:0;
  font-family:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.9;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }

.container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:24px;
}

/* anchor offset for fixed header */
:where(section,main)[id]{ scroll-margin-top:var(--header-h); }

/* =========================================================
   Header
   ========================================================= */
.header{
  position:fixed;
  inset:0 0 auto 0;
  height:var(--header-h);
  z-index:1000;
  background:rgba(255,255,255,.95);
  backdrop-filter:saturate(1.2) blur(2px);
  transition:box-shadow .3s var(--ease);
}
.header.is-scrolled{ box-shadow:0 4px 14px rgba(0,0,0,.12); }

.header__inner{
  height:100%;
  display:flex;
  align-items:center;
  gap:24px;
  padding-left:22px;
}

/* brand */
.header__brand,.footer__brand{
  display:flex;
  align-items:center;
  gap:14px;
  flex-shrink:0;
}
.header__logo{ width:clamp(228px,27vw,340px); height:auto; }

/* nav */
.gnav{ display:flex; align-items:center; gap:26px; margin-left:auto; }
.gnav__top{ display:contents; }   /* transparent on PC; flex wrapper inside the SP drawer */
.gnav__list{ display:flex; align-items:center; gap:26px; }
.gnav__link{
  position:relative;
  color:var(--blue);
  font-weight:700;
  font-size:16px;
  letter-spacing:.08em;
  padding:6px 2px;
  transition:opacity .25s;
}
.gnav__link::after{
  content:"";
  position:absolute;
  left:0; bottom:-2px;
  width:100%; height:2px;
  background:var(--blue);
  transform:scaleX(0);
  transform-origin:right;
  transition:transform .35s var(--ease);
}
.gnav__link:hover::after,.gnav__link.is-current::after{ transform:scaleX(1); transform-origin:left; }
.gnav__social{ display:none; }        /* shown only inside drawer */
.gnav__hp{ display:none; }            /* shown only inside drawer */
.gnav__item--contact{ display:none; } /* shown only inside drawer */

/* contact button */
.btn-contact{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--blue);
  color:#fff;
  font-weight:500;
  font-size:15px;
  letter-spacing:.04em;
  padding:8px 22px;
  border-radius:25px;
  white-space:nowrap;
  transition:background .25s, transform .25s;
}
.btn-contact:hover{ background:var(--blue-dark); transform:translateY(-1px); }
.header__contact{ flex-shrink:0; height:30px; padding-block:0; padding-inline:16px; }

/* blue social block (flush right) */
.header__sns{
  align-self:stretch;
  display:flex;
  align-items:center;
  gap:16px;
  background:var(--blue);
  padding:0 26px;
  flex-shrink:0;
}
.header__sns a{ color:#fff; width:24px; height:24px; display:grid; place-items:center; transition:opacity .25s, transform .25s; }
.header__sns a:hover{ opacity:.75; transform:translateY(-2px); }
.header__sns svg{ width:100%; height:100%; }

/* hamburger */
.hamburger{
  display:none;
  width:48px; height:48px;
  margin-left:auto;
  background:none; border:0; cursor:pointer;
  position:relative; flex-shrink:0;
}
.hamburger span{
  position:absolute; left:11px; width:26px; height:2px;
  background:var(--blue); transition:.35s var(--ease);
}
.hamburger span:nth-child(1){ top:13px; }
.hamburger span:nth-child(2){ top:23px; }
.hamburger span:nth-child(3){ top:33px; }
.is-open .hamburger span:nth-child(1){ top:23px; transform:rotate(45deg); }
.is-open .hamburger span:nth-child(2){ opacity:0; }
.is-open .hamburger span:nth-child(3){ top:23px; transform:rotate(-45deg); }

.drawer-overlay{
  position:fixed; inset:0; z-index:998;
  background:rgba(0,0,0,.45);
  opacity:0; visibility:hidden;
  transition:.4s var(--ease);
}
.is-open .drawer-overlay{ opacity:1; visibility:visible; }

/* =========================================================
   Hero
   ========================================================= */
.hero{
  position:relative;
  margin-top:var(--header-h);
  width:100%;
  aspect-ratio:2560/1296;   /* full MV photo — no vertical cropping (PC) */
  overflow:hidden;
  background:#0c2c44;
}
.hero__slider{ position:absolute; inset:0; }
.hero__slide{
  position:absolute; inset:0;
  background-size:cover;
  background-position:center;
  opacity:0;
  transition:opacity 1.6s var(--ease);
}
/* PC main-visual photos */
.hero__slide.hslide1{ background-image:url('../assets/img/hero_1.jpg'); }
.hero__slide.hslide2{ background-image:url('../assets/img/hero_2.jpg'); }
.hero__slide.hslide3{ background-image:url('../assets/img/hero_3.jpg'); }
.hero__slide.hslide4{ background-image:url('../assets/img/hero_4.jpg'); }
.hero__slide.hslide5{ background-image:url('../assets/img/hero_5.jpg'); }
.hero__slide.is-active{
  opacity:1;
}
/* swipe affordance */
.hero{ touch-action:pan-y; cursor:grab; }
.hero:active{ cursor:grabbing; }

/* =========================================================
   Section commons
   ========================================================= */
.section{ padding:clamp(70px,10vw,130px) 0; }

.sec-head{ text-align:center; margin:0 0 clamp(40px,6vw,72px); line-height:1; }
.sec-head__en{
  display:block;
  font-family:"Roboto",sans-serif;
  font-weight:700;
  font-size:clamp(34px,5vw,52px);
  letter-spacing:.02em;
  color:var(--blue);
}
.sec-head__ja{
  display:block;
  margin-top:14px;
  font-size:15px;
  font-weight:700;
  letter-spacing:.07em;
  color:var(--blue);
}
.sec-head--light .sec-head__en,
.sec-head--light .sec-head__ja{ color:#fff; }

/* =========================================================
   WILL
   ========================================================= */
.will{ background:var(--bg); }
.will__body{ text-align:center; }
.will__body p{
  margin:0 0 2em;
  font-size:clamp(16px,2vw,20px);
  font-weight:700;
  letter-spacing:.04em;
  line-height:2.0;
}
.will__body p:last-child{ margin-bottom:0; }

/* =========================================================
   PROFILE
   ========================================================= */
.profile{ background:#fff; }
/* PC: heading centered full-width; left = name + details, right = photo */
.profile__layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) clamp(280px,32%,355px);
  grid-template-areas:"intro photo";
  column-gap:clamp(24px,5vw,64px);
  align-items:start;
  container-type:inline-size;   /* enables cqw so the heading can measure the real column widths */
}
/* left col (name+details) is ONE cell so the tall photo no longer spans two text rows.
   The heading stays put (layout unchanged) but is visually centered across the full width
   by widening its box over the photo column (32cqw = same as the photo column) — nothing else moves. */
.profile__intro{ grid-area:intro; }
.profile__head{ text-align:center; margin-right:calc(-1 * (clamp(280px,32cqw,355px) + clamp(24px,5vw,64px))); }
.profile__lead{ margin-bottom:clamp(16px,2vw,24px); width:fit-content; }   /* 原田直樹↔生年月日 ≈ 1 line */
.profile__photo{ grid-area:photo; align-self:end; }   /* PC: bottom of photo aligns with bottom of text */
.profile__photo img{ width:100%; display:block; transform:translateY(80px); }   /* PC: drop the face to ~name line */

.profile__kana{ margin:0 0 .35em; color:var(--ink); font-size:15px; letter-spacing:.45em; font-weight:700; line-height:1.4; text-align:center; }
.profile__name{ margin:0; font-size:clamp(28px,3.4vw,36px); font-weight:700; letter-spacing:.1em; color:var(--ink); line-height:1.2; }

/* basic info — no rules/borders, bold, label #000 / value #222, value aligned at 135px */
.profile__meta{
  margin:0 0 1.5em;
  display:flex; flex-direction:column; gap:6px;
  font-size:18px; font-weight:700; letter-spacing:.07em; line-height:1.45;
}
.profile__meta > div{ display:flex; }
.profile__meta dt{ flex:0 0 135px; color:#000; }
.profile__meta dd{ margin:0; color:#222; }

.profile__sub{ font-size:18px; font-weight:700; color:var(--ink); margin:0 0 1.1em; letter-spacing:.08em; }

.history{ margin:0; display:flex; flex-direction:column; gap:5px; font-size:18px; font-weight:700; letter-spacing:.07em; line-height:1.45; }
.history__row{ display:flex; }
.history__row dt{ flex:0 0 135px; color:#222; font-variant-numeric:tabular-nums; }
.history__row dd{ margin:0; color:#222; }
.history .note{ display:block; padding-left:.5em; }   /* half-width indent before the "-" */
.history__row dd .school2{ display:block; margin-top:5px; }   /* 2nd school line: same gap as between rows */

/* =========================================================
   POLICY
   ========================================================= */
.policy{ background:#fff; padding-bottom:0; margin-bottom:-1px; }   /* overlap next section (SNS) 1px so the last article↔blue seam shows no white hairline */
.policy__list{ margin-top:clamp(34px,5vw,60px); }

/* checkerboard: photo on one side, [blue title + white description] on the other */
.pol{
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-areas:"photo panel";
  align-items:stretch;
  margin-bottom:-1px;   /* overlap consecutive articles 1px so fractional row heights never leave a white hairline seam */
}
.pol--rev{ grid-template-areas:"panel photo"; }

/* photo: two plain <img> (PC png / SP jpg) toggled by display.
   PROVEN-on-device sizing: width:100%;height:auto only — NO object-fit / absolute / aspect-ratio
   (those broke display on the real iPhone). */
/* image at NATURAL size — never cropped. The blue+white panel is stretched to match the
   image height (flex-grow below) so photo & panel always align — no white/blue seams. */
.pol__photo{ grid-area:photo; overflow:hidden; }
/* scale(1.004) makes the image overscan its cell by ~1px so its fractional-height bottom edge
   never leaves a sub-pixel white hairline; overflow:hidden clips the imperceptible excess. */
.pol__photo img{ width:100%; height:auto; display:block; transform:scale(1.004); }
.pol__photo .pol__img--sp{ display:none; }   /* PC shows the .png (2 classes beat .pol__photo img) */

.pol__panel{ grid-area:panel; display:flex; flex-direction:column; min-width:0; }

/* blue title block (~60% height) */
.pol__head{
  flex:1.5 1 auto;   /* grows to fill ~60% of the image height (panel = image height) */
  position:relative; overflow:hidden;
  background:var(--blue); color:#fff;
  padding:clamp(34px,3.6vw,54px) clamp(34px,3.8vw,60px);
  text-align:right;
}
.pol--rev .pol__head{ text-align:left; }
.pol__num{
  position:absolute; z-index:1;
  bottom:-.05em; left:-.22em;   /* anchored low; inner edge clipped */
  font-family:"Inter",sans-serif; font-weight:500; font-style:italic;
  line-height:.8; font-size:clamp(132px,19vw,248px); letter-spacing:-.06em;
  color:rgba(255,255,255,.15);
  pointer-events:none; user-select:none;
}
.pol--rev .pol__num{ left:auto; right:-.1em; }
.pol__label{
  position:absolute; z-index:2; text-align:left;
  top:clamp(32px,3.4vw,50px); left:clamp(34px,3.8vw,60px);
  font-family:"Roboto",sans-serif; font-weight:500;
  font-size:14px; line-height:1.5; letter-spacing:.04em; color:#fff;
}
.pol--rev .pol__label{ left:auto; right:clamp(34px,3.8vw,60px); text-align:right; }
.pol__title{
  position:relative; z-index:2; margin:0;
  font-size:clamp(26px,3.1vw,40px); font-weight:700;
  line-height:1.55; letter-spacing:.03em;
}

/* white description block (~40% height), text vertically centered */
.pol__body{
  flex:1 1 auto;   /* grows to fill ~40% of the image height */
  background:#fff; color:#222;
  display:flex; flex-direction:column; justify-content:center;
  padding:clamp(24px,2.6vw,38px) clamp(34px,3.8vw,60px);
}
.pol__desc{ margin:0; font-weight:700; font-size:clamp(15px,1.35vw,18px); line-height:1.7; letter-spacing:-.01em; }

/* =========================================================
   SNS
   ========================================================= */
.sns{ background:var(--blue); color:#fff; text-align:center; padding:clamp(46px,6vw,72px) 0; }
/* title sits top-left; icons + text stay centered */
.sns .sec-head{ text-align:left; margin-bottom:clamp(40px,5vw,60px); }
.sns .sec-head__ja{ letter-spacing:.06em; }   /* 情報発信・活動報告: narrower tracking (PC & SP) */
.sns__icons{
  display:flex; justify-content:center; align-items:center;
  gap:clamp(22px,4vw,40px); margin-bottom:36px;
}
.sns__icons a{
  width:clamp(40px,5vw,52px); height:clamp(40px,5vw,52px);
  color:#fff; display:grid; place-items:center;
  transition:transform .3s var(--ease), opacity .3s;
}
.sns__icons a:hover{ transform:translateY(-5px); opacity:.8; }
.sns__icons svg{ width:100%; height:100%; }
.sns__text{ margin:0; font-size:clamp(15px,2vw,18px); font-weight:500; letter-spacing:.06em; line-height:2; }

/* =========================================================
   Footer
   ========================================================= */
.footer{ background:#fff; padding:clamp(56px,7vw,90px) 0 clamp(28px,3.5vw,42px); border-top:1px solid var(--line); }
/* footer spans the full screen width (side margins scale, no max-width cap) */
.footer .container{ max-width:none; width:100%; padding-inline:clamp(24px,4.8vw,80px); }
.footer__brand{ display:inline-block; }
.footer__logo{ width:clamp(330px,54vw,700px); height:auto; display:block; }

.footer__office{
  margin:clamp(34px,5vw,72px) 0 clamp(38px,5vw,72px);
  font-style:normal; font-weight:700; font-size:18px; line-height:1.75;
  color:#222; letter-spacing:.04em;
}
.footer__office a{ color:inherit; text-decoration:none; }

/* bottom: 中道改革連合HP (left) | nav + copyright (right) */
.footer__bottom{
  display:flex; justify-content:space-between; align-items:flex-start;
  gap:clamp(20px,4vw,48px); flex-wrap:wrap;
}
.footer__party{
  align-self:flex-start;
  color:var(--blue); font-weight:500; font-size:clamp(16px,1.7vw,20px); letter-spacing:.05em; line-height:1.2;
  padding-bottom:5px; border-bottom:1px solid var(--blue);
}
.footer__end{ display:flex; flex-direction:column; align-items:flex-end; gap:clamp(14px,2vw,22px); }
.footer__nav{ display:flex; flex-wrap:wrap; justify-content:flex-end; gap:clamp(14px,1.8vw,28px); }
.footer__nav a{ font-size:clamp(16px,1.7vw,20px); font-weight:500; color:var(--blue); letter-spacing:.05em; transition:opacity .2s; }
.footer__nav a:hover{ opacity:.65; }
.footer__copy{ margin:0; font-size:13px; color:var(--blue); font-weight:500; letter-spacing:.04em; }

/* =========================================================
   Page top button
   ========================================================= */
.pagetop{
  position:fixed; right:22px; bottom:22px; z-index:900;
  width:48px; height:48px; border-radius:50%;
  background:var(--blue); color:#fff;
  display:grid; place-items:center;
  box-shadow:0 6px 18px rgba(0,0,0,.22);
  opacity:0; visibility:hidden; transform:translateY(12px);
  transition:.4s var(--ease);
}
.pagetop.is-visible{ opacity:1; visibility:visible; transform:translateY(0); }
.pagetop:hover{ background:var(--blue-dark); }

/* =========================================================
   Scroll reveal
   ========================================================= */
/* gentle fade-up, matching the reference site's .fadeInDown
   (opacity 0->1, translateY 20px->0, 1s ease) */
/* only hide when JS is active (degrade gracefully — content stays visible without JS) */
html.js [data-reveal]{
  opacity:0; transform:translateY(20px);
  transition:opacity 1s ease, transform 1s ease;
  will-change:opacity,transform;
}
html.js [data-reveal].is-in{ opacity:1; transform:none; }

/* light cascade for the WILL statement lines */
.will__body p:nth-child(2){ transition-delay:.1s; }
.will__body p:nth-child(3){ transition-delay:.2s; }
.will__body p:nth-child(4){ transition-delay:.3s; }

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  [data-reveal]{ opacity:1; transform:none; transition:none; }
  .hero__slide.is-active{ transition:opacity .6s; transform:none; }
}

/* =========================================================
   Responsive — single PC/SP breakpoint at 980px (≥980 = PC, <980 = SP)
   ========================================================= */

/* compress the (item-heavy) header so it fits down to 980px on PC */
@media (min-width:980px) and (max-width:1200px){
  .header__inner{ gap:16px; padding-left:16px; }
  .header__logo{ width:clamp(190px,21vw,250px); }
  .gnav{ gap:18px; }
  .gnav__list{ gap:clamp(14px,1.7vw,24px); }
  .gnav__link{ font-size:15px; letter-spacing:.04em; }
  .btn-contact{ font-size:14px; padding:7px 16px; }
  .header__sns{ gap:13px; padding:0 16px; }
}

@media (max-width:979.98px){
  /* keep the header opaque (not greyed by the overlay behind it) while open */
  .is-open .header{ background:#fff; }

  /* full-width drawer that opens BELOW the visible header */
  .gnav{
    position:fixed; top:var(--header-h); left:0; right:0; z-index:999;
    height:calc(100dvh - var(--header-h));
    width:100%;
    background:#fff;
    flex-direction:column; align-items:stretch; justify-content:flex-start;
    gap:0; padding:clamp(28px,7vw,40px) clamp(36px,10vw,56px) 0;
    margin:0;
    opacity:0; visibility:hidden;
    transform:translateY(-12px);
    transition:opacity .35s var(--ease), transform .4s var(--ease), visibility .35s;
    overflow-y:auto;
  }
  .is-open .gnav{ opacity:1; visibility:visible; transform:none; }

  /* menu + HP vertically centered in the white area between header and blue */
  .gnav__top{ flex:1 1 auto; display:flex; flex-direction:column; justify-content:center; align-items:center; width:100%; padding-bottom:clamp(48px,14vw,90px); }   /* bias the centered menu a bit upward */

  /* menu items: blue text, leading dash bar, no dividers */
  .gnav__list{ flex-direction:column; align-items:stretch; gap:22px; width:fit-content; max-width:100%; align-self:center; }
  .gnav__list li{ border-bottom:none; }
  .gnav__item--contact{ display:list-item; }
  .gnav__link{
    display:flex; align-items:center; gap:12px;
    padding:0; font-size:18px; font-weight:600; line-height:1.25;
    color:var(--blue); letter-spacing:.05em;
  }
  .gnav__link::before{ content:""; flex:0 0 auto; width:9px; height:1px; background:var(--blue); }
  .gnav__link::after{ display:none; }

  /* 中道改革連合HP */
  .gnav__hp{
    display:inline-block; align-self:center; margin-top:26px;
    color:var(--blue); font-size:18px; font-weight:600; letter-spacing:.05em;
    border-bottom:1px solid var(--blue); padding-bottom:4px;
  }

  /* blue 公式SNS block, full-bleed at the bottom of the drawer */
  .gnav__social{
    display:block; margin-top:auto; min-height:25dvh;
    margin-inline:calc(-1 * clamp(36px,10vw,56px));
    background:var(--blue); color:#fff;
    padding:clamp(26px,6vw,34px) clamp(36px,10vw,56px) clamp(34px,9vw,54px);
  }
  .gnav__social-label{ display:block; font-size:15px; font-weight:500; letter-spacing:.06em; margin-bottom:18px; }
  .gnav__sns{ display:flex; justify-content:space-between; align-items:center; gap:8px; width:100%; }
  .gnav__sns a{ width:clamp(34px,9.5vw,42px); height:clamp(34px,9.5vw,42px); color:#fff; display:grid; place-items:center; }
  .gnav__sns svg{ width:100%; height:100%; }

  .header__contact{ display:none; }
  .header__sns{ display:none; }
  .hamburger{ display:block; }
  .header__inner{ gap:0; padding-left:10px; padding-right:8px; }   /* SP: logo a bit further left */
}

@media (max-width:979.98px){
  :root{ --header-h:var(--header-h-sp); }
  .header{ height:var(--header-h-sp); }
  /* match Figma SP header: logo ≈ 65% of header width */
  .header__logo{ width:clamp(230px,67vw,270px); }

  /* SP version of the main-visual — dedicated portrait (390x540), full, no crop */
  .hero{ aspect-ratio:780/720; }
  .hero__slide.hslide1{ background-image:url('../assets/img/hero_sp1.jpg'); }
  .hero__slide.hslide2{ background-image:url('../assets/img/hero_sp2.jpg'); }
  .hero__slide.hslide3{ background-image:url('../assets/img/hero_sp3.jpg'); }
  .hero__slide.hslide4{ background-image:url('../assets/img/hero_sp4.jpg'); }
  .hero__slide.hslide5{ background-image:url('../assets/img/hero_sp5.jpg'); }

  /* SP only: narrow the WILL↔PROFILE gap (reduce PROFILE's top padding; other section gaps unchanged) */
  .profile{ padding-top:clamp(40px,9vw,60px); }
  /* SP: photo top-right; heading + name beside it; info + 略歴 below (full width). */
  .profile__layout{
    grid-template-columns:1fr 46%;
    grid-template-areas:
      "intro   photo"
      "details details";
    column-gap:18px;
    align-items:stretch;
  }
  .profile__intro{ display:contents; }
  .profile__namebox{
    display:flex; flex-direction:column; justify-content:flex-end;
    grid-area:intro; padding-bottom:6px;
  }
  .profile__head{ text-align:left; margin:0 0 clamp(56px,17vw,92px); }
  .profile__lead{ margin:0; }
  .profile__kana{ letter-spacing:.18em; margin-bottom:.05em; }
  .profile__details{ grid-area:details; margin-top:clamp(22px,5vw,30px); }
  /* #9: shift ONLY the photo down & right — transform on the IMG (the .profile__photo
     wrapper carries data-reveal, whose transform would otherwise override this). */
  .profile__photo{ grid-area:photo; align-self:start; max-width:none; margin:0; }
  .profile__photo img{ transform:translate(14%, 108px); }
  /* SP: smaller type + tighter value indent */
  .profile__meta, .history{ font-size:15px; gap:6px; }
  .history{ letter-spacing:0; }   /* SP: tighter tracking for the 略歴 */
  .history .note--tight{ letter-spacing:-.03em; }   /* SP: the two long notes a bit tighter */
  .profile__meta{ margin-bottom:2.4em; }
  .profile__meta dt, .history__row dt{ flex-basis:86px; }
  .profile__name{ font-size:28px; }

  /* SP: stacked — photo on top, blue title, then white description */
  .pol,
  .pol--rev{
    grid-template-columns:1fr;
    grid-template-areas:"photo" "panel";
  }
  /* SP: swap to the SP .jpg (natural size; the 772x480 jpg gives the right shape) */
  .pol__photo img{ transform:none; }   /* no overscan on SP — keep iPhone-proven plain <img> */
  .pol__photo .pol__img--pc{ display:none; }
  .pol__photo .pol__img--sp{ display:block; }
  .pol__head,
  .pol--rev .pol__head{
    text-align:left; min-height:clamp(140px,40vw,168px);
    justify-content:flex-start;
    padding:clamp(22px,5.5vw,30px) clamp(28px,7.2vw,40px);
  }
  .pol__label,
  .pol--rev .pol__label{
    top:clamp(22px,5.5vw,30px); left:auto; right:clamp(28px,7.2vw,40px); text-align:right; text-transform:lowercase;
  }
  .pol__num,
  .pol--rev .pol__num{
    bottom:auto; top:50%; transform:translateY(-40%);
    left:auto; right:-.03em;
    font-size:clamp(120px,46vw,184px);
  }
  .pol__title{ font-size:clamp(22px,6.2vw,28px); line-height:1.35; }
  .pol__body{ min-height:0; padding:clamp(22px,5.5vw,28px) clamp(34px,8.6vw,48px); }
  .pol__desc{ line-height:1.55; }

  /* SNS (SP): heading centered; text moved above icons, centered */
  .sns .container{ display:flex; flex-direction:column; }
  .sns .sec-head{ text-align:center; order:1; margin-bottom:clamp(18px,5vw,26px); }
  .sns .sec-head__ja{ font-size:14px; font-weight:500; letter-spacing:.06em; line-height:1.3; margin-top:8px; }
  .sns__text{ order:2; margin:0 0 clamp(30px,8vw,44px); line-height:1.6; }
  .sns__icons{ order:3; margin-bottom:0; width:100%; gap:clamp(16px,5vw,28px); }
  .sns__icons a{ width:clamp(34px,9vw,46px); height:clamp(34px,9vw,46px); }

  /* SP footer: stacked, left-aligned (copyright centered) */
  .footer{ padding-top:36px; }
  .footer .container{ padding-inline:18px; }
  .footer__logo{ width:clamp(290px,90vw,352px); }
  /* whole footer: tighter tracking; extra side padding for everything except the logo */
  .footer__office{ font-size:15px; line-height:1.5; margin:clamp(24px,7vw,38px) 0 clamp(28px,7vw,42px); letter-spacing:-.02em; padding-inline:clamp(14px,4.5vw,24px); }
  .footer__addr span{ display:block; }
  .footer__tel-br{ display:none; }   /* attach TEL line directly under the address (no blank line) */
  .footer__bottom{ flex-direction:column; align-items:flex-start; gap:12px; padding-inline:clamp(14px,4.5vw,24px); }
  .footer__end{ align-items:flex-start; width:100%; gap:18px; }
  .footer__nav{ justify-content:flex-start; gap:8px 7px; flex-wrap:nowrap; white-space:nowrap; }
  .footer__nav a{ font-size:13px; letter-spacing:0; }
  .footer__copy{ width:100%; text-align:center; font-size:11px; letter-spacing:0; }
  .footer__party{ font-size:13px; letter-spacing:-.01em; }
}

@media (max-width:430px){
  .will__body p{ line-height:2; }
}