/* =========================================================
   南山舎 — Design v4（Webサイト.psd 再現版）
   基準: PSD 1920×6000
   navy #1f2c5f / footer #022c60 / tint #f8fdff / line #bec5d4
   ========================================================= */
:root{
  --navy:#1f2c5f;
  --navy-dark:#16204a;
  --footer-navy:#022c60;
  --tint:#f8fdff;
  --line:#bec5d4;
  --ink:#1f2733;
  --ink-soft:#55637a;
  --white:#ffffff;

  --serif:"Noto Serif JP",serif;
  --sans:"Noto Sans JP",-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN",sans-serif;
  --en:"EB Garamond",Georgia,serif;
  --din:"Barlow","DIN Alternate",-apple-system,sans-serif;

  --header-h:74px;

  /* 統一スペーシング */
  --sec-pad:clamp(3.5rem,6.5vw,7.5rem);   /* セクション上下 */
  --head-gap:clamp(2rem,3.6vw,4.2rem);    /* 見出し→コンテンツ */
  --text-gap:clamp(1rem,1.9vw,2.2rem);    /* テキストブロック間 */
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  color:var(--ink);
  background:var(--white);
  line-height:1.9;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}

/* PSD: コンテンツ幅 199–1721px ≒ 79.3% */
.container{width:min(79.3%,1522px);margin-inline:auto}
.section{position:relative}
.tint{background:var(--tint)}

/* ---------- Section titles ---------- */
.sec-en{
  font-family:var(--en);font-weight:400;letter-spacing:.04em;
  font-size:clamp(2.4rem,4.9vw,5.9rem);color:var(--navy);line-height:1.1;
}
.sec-ja{
  font-family:var(--serif);font-weight:600;color:var(--ink);
  font-size:clamp(.95rem,1.15vw,1.4rem);letter-spacing:.14em;margin-top:.4rem;
}
.sec-center{text-align:center}
.view-all{
  display:inline-block;font-weight:700;color:var(--navy);
  font-size:clamp(.85rem,1vw,1.2rem);letter-spacing:.08em;
  border-bottom:1px solid var(--navy);padding-bottom:.45em;
  transition:opacity .25s;white-space:nowrap;
}
.view-all::after{
  content:"\2192";display:inline-block;margin-left:.7em;
  transition:transform .3s cubic-bezier(.25,.8,.35,1);
}
.view-all:hover{opacity:.65}
.view-all:hover::after{transform:translateX(.5em)}

/* ---------- Vertical side labels ---------- */
.v-label{
  position:absolute;top:0;bottom:0;z-index:2;pointer-events:none;
  display:flex;flex-direction:column;align-items:center;justify-content:space-between;
}
.v-label span{
  writing-mode:vertical-rl;font-size:clamp(.6rem,.85vw,1rem);
  letter-spacing:.35em;color:var(--navy);font-weight:500;
  white-space:nowrap;
}
.v-label .it{font-family:var(--sans);font-style:normal;letter-spacing:.35em}
.v-hero{left:4.9vw;top:7vw;bottom:20%}
.v-hero span,.v-hero .it{
  color:#fff;font-family:var(--sans);font-style:normal;
  letter-spacing:.35em;font-weight:500;
  text-shadow:0 2px 6px rgba(15,45,120,.6);
}
.v-left{left:4.9vw;top:0;bottom:0;padding:4vw 0}
.v-right{right:2.3vw;top:0;bottom:0;padding:1.5vw 0}

/* ---------- Header ---------- */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:100;height:var(--header-h);
  background:var(--white);
  transition:box-shadow .3s ease;
}
.site-header.scrolled{box-shadow:0 3px 18px -10px rgba(31,44,95,.35)}
.header-inner{
  height:100%;display:flex;align-items:center;justify-content:space-between;
  gap:1rem;padding-inline:clamp(16px,2.2vw,42px);
}
.logo{display:flex;align-items:center;gap:.8rem}
.logo-img{width:52px;height:52px;object-fit:contain}
.logo-text{display:flex;flex-direction:column;line-height:1.3}
.logo-ja{font-weight:700;font-size:1.3rem;color:var(--navy);letter-spacing:.04em}
.logo-en{font-size:.66rem;letter-spacing:.16em;color:var(--ink-soft)}
.nav{display:flex;align-items:center;gap:clamp(1.2rem,2.4vw,2.6rem)}
.nav a{font-weight:500;font-size:.92rem;color:var(--ink);position:relative;transition:color .2s}
.nav a:not(.nav-cta)::after{
  content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;
  background:var(--navy);transition:width .25s;
}
.nav a:not(.nav-cta):hover{color:var(--navy)}
.nav a:not(.nav-cta):hover::after{width:100%}
.nav-cta{
  display:inline-flex;align-items:center;gap:.5em;
  background:var(--navy);color:#fff!important;padding:.66em 1.7em;
  border-radius:100px;font-weight:700;transition:background .25s,transform .25s;
}
.nav-cta svg{width:1.1em;height:1.1em}
.nav-cta:hover{background:var(--navy-dark);transform:translateY(-1px)}
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
.nav-toggle span{width:26px;height:2px;background:var(--navy);transition:.3s}

/* ---------- Hero ---------- */
/* ファーストビューは常に画面内に収まる高さ（動画はcoverでトリミング表示） */
.hero{position:relative;margin-top:var(--header-h);overflow:hidden}
.hero-photo{
  width:100%;height:calc(100svh - var(--header-h));
  min-height:520px;object-fit:cover;display:block;
}
.hero-content{
  position:absolute;inset:0;z-index:2;
  padding-left:10.4%;padding-block:2.5rem;
  display:flex;flex-direction:column;justify-content:center;
}
.hero-title{
  font-family:var(--serif);font-weight:600;color:#fff;
  font-size:clamp(1.5rem,4.4vw,5.2rem);line-height:1.45;letter-spacing:.06em;
  text-shadow:0 4px 6px rgba(15,45,120,.85),0 0 24px rgba(15,45,120,.5);
  margin-bottom:clamp(1rem,2.2vw,2.6rem);
}
.hero-lead p{
  color:#fff;font-weight:500;
  font-size:clamp(.62rem,1.45vw,1.7rem);letter-spacing:.04em;line-height:1.45;
  text-shadow:0 3px 4px rgba(15,45,120,.9),0 0 14px rgba(15,45,120,.5);
  margin-bottom:.65em;
}
.hero-lead p:last-child{margin-bottom:0}

/* ---------- Hero scroll indicator ---------- */
.hero-scroll{
  position:absolute;right:2.3vw;bottom:0;z-index:3;
  display:flex;flex-direction:column;align-items:center;gap:.9em;
}
.hero-scroll span{
  writing-mode:vertical-rl;
  font-family:var(--sans);font-size:clamp(.6rem,.8vw,.95rem);
  letter-spacing:.35em;font-weight:500;color:#fff;
  text-shadow:0 2px 6px rgba(15,45,120,.6);
}
.hero-scroll::after{
  content:"";width:1px;height:clamp(48px,5.5vw,90px);
  background:linear-gradient(to bottom,#fff,rgba(255,255,255,.25));
  animation:scrollLine 2.2s ease-in-out infinite;
  transform-origin:top;
}
@keyframes scrollLine{
  0%{transform:scaleY(0)}
  45%{transform:scaleY(1);transform-origin:top}
  55%{transform:scaleY(1);transform-origin:bottom}
  100%{transform:scaleY(0);transform-origin:bottom}
}

/* ---------- Scroll reveal ---------- */
.reveal{opacity:0;transform:translateY(28px);
  transition:opacity .8s cubic-bezier(.25,.6,.3,1),transform .8s cubic-bezier(.25,.6,.3,1);
  transition-delay:var(--reveal-delay,0s);
}
.reveal.is-visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .hero-scroll::after{animation:none}
}

/* ---------- News ---------- */
.news{padding:var(--sec-pad) 0}
.news-grid{display:grid;grid-template-columns:25.5% 1fr;gap:0;align-items:start}
.news-head .view-all{margin-top:var(--head-gap)}
.news-item{
  display:grid;
  grid-template-columns:11.3% 16.6% 1fr;
  gap:0 3%;
  align-items:center;
  padding:2vw 0;
  border-bottom:1px solid var(--line);
}
.news-item:first-child{padding-top:.6vw}
.news-item:last-child{border-bottom:none;padding-bottom:0}
.news-item time{
  font-family:var(--en);font-size:clamp(.85rem,1.25vw,1.5rem);
  color:var(--ink);letter-spacing:.02em;white-space:nowrap;
}
.news-tag{
  display:inline-block;width:fit-content;
  font-family:var(--serif);font-weight:600;color:#fff;background:var(--navy);
  font-size:clamp(.66rem,1.05vw,1.25rem);letter-spacing:.1em;
  text-align:center;padding:.5em 1.6em;line-height:1.2;
  border-radius:6px;white-space:nowrap;
}
.news-item a{
  font-family:var(--serif);font-weight:500;
  font-size:clamp(.85rem,1.25vw,1.5rem);letter-spacing:.04em;
  transition:color .2s;
}
.news-item a:hover{color:var(--navy);text-decoration:underline}

/* ---------- About ---------- */
.about{background:var(--white);padding:var(--sec-pad) 0}
.about-grid{
  display:grid;grid-template-columns:1.1fr 1fr;
  grid-template-rows:auto auto;
  column-gap:5%;row-gap:var(--head-gap);
  align-items:stretch;
}
.about-text{grid-column:1;grid-row:1}
.about-link{grid-column:1;grid-row:2;justify-self:start;align-self:start}
.about-heading{
  font-family:var(--serif);font-weight:600;color:var(--navy);
  font-size:clamp(1.3rem,3vw,3.6rem);letter-spacing:.1em;
  margin:var(--head-gap) 0 var(--text-gap);
}
.about-body{
  font-family:var(--serif);font-weight:500;color:var(--ink);
  font-size:clamp(.85rem,1.35vw,1.6rem);line-height:2.1;letter-spacing:.04em;
}
/* 写真：コンテナを突き抜けて画面右端まで（コンテナ幅=min(79.3vw,1522px)）
   高さはテキスト列（ABOUT上端〜説明文下端）に自動で揃う */
.about-photo{
  grid-column:2;grid-row:1;
  position:relative;
  margin-right:calc((min(79.3vw,1522px) - 100vw)/2);
}
.about-photo img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  border-radius:20px 0 0 20px;
}

/* ---------- Service ---------- */
/* PSD: カード 471×512 / 写真 217 */
.service{padding:var(--sec-pad) 0}
.service .sec-center{margin-bottom:var(--head-gap)}
.service-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:3.6%;
}
.service-card{
  background:var(--white);border-radius:10px;overflow:hidden;
  box-shadow:0 14px 34px -22px rgba(31,44,95,.4);
  transition:transform .3s ease,box-shadow .3s ease;
}
.service-card:hover{transform:translateY(-5px);box-shadow:0 22px 44px -22px rgba(31,44,95,.5)}
.service-photo{aspect-ratio:471/217;overflow:hidden}
.service-photo img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.service-card:hover .service-photo img{transform:scale(1.05)}
.service-body{padding:2.3vw 1.4rem 2.4vw;text-align:center}
.service-body h3{
  font-weight:700;color:var(--navy);letter-spacing:.04em;
  font-size:clamp(.95rem,1.5vw,1.8rem);
  margin-bottom:1.8vw;
}
.service-body p{
  font-size:clamp(.78rem,1.15vw,1.4rem);color:var(--ink);
  line-height:1.85;margin-bottom:2vw;
}
.more-link{
  display:inline-block;font-weight:700;color:var(--ink);
  font-size:clamp(.75rem,.95vw,1.15rem);letter-spacing:.06em;
  transition:color .25s;
}
.more-link::after{
  content:"\2192";display:inline-block;margin-left:.6em;
  transition:transform .3s cubic-bezier(.25,.8,.35,1);
}
.more-link:hover{color:var(--navy)}
.more-link:hover::after{transform:translateX(.5em)}

/* ---------- Works ---------- */
/* PSD: サムネ高さ285 */
.works{background:var(--white);padding:var(--sec-pad) 0}
.works-head{
  display:flex;justify-content:space-between;align-items:flex-end;
  gap:1rem;flex-wrap:wrap;margin-bottom:var(--head-gap);
}
.works-carousel{
  position:relative;width:min(93.5%,1795px);margin-inline:auto;
  padding-inline:clamp(52px,6vw,110px);
}
.works-track{
  display:flex;justify-content:space-between;align-items:flex-start;
  gap:clamp(1rem,4vw,5rem);
  overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x mandatory;
  scrollbar-width:none;
}
.works-track::-webkit-scrollbar{display:none}
.work-item{flex:0 0 auto;scroll-snap-align:start;text-align:center}
.work-item figure{
  height:clamp(160px,14.8vw,285px);
  display:flex;justify-content:center;
  box-shadow:0 10px 26px -16px rgba(31,44,95,.45);
}
.work-item img{height:100%;width:auto;transition:transform .35s ease}
.work-item:hover img{transform:scale(1.03)}
.work-item figcaption{
  margin-top:1.1vw;font-weight:700;line-height:1.5;
  font-size:clamp(.78rem,1.1vw,1.3rem);
}
.car-btn{
  position:absolute;top:32%;z-index:2;
  width:clamp(40px,4vw,76px);height:clamp(40px,4vw,76px);border-radius:50%;
  background:var(--navy);color:#fff;border:0;cursor:pointer;
  display:grid;place-items:center;transition:background .25s,transform .25s;
}
.car-btn svg{width:40%;height:40%}
.car-btn:hover{background:var(--navy-dark);transform:scale(1.06)}
.car-prev{left:0}
.car-next{right:0}

/* ---------- Contact ---------- */
/* PSD: 円197 / ボタン515×93 / 電話箱516×113 */
.contact{padding:var(--sec-pad) 0}
.contact-inner{
  display:grid;grid-template-columns:10.5% 1fr 36%;gap:3%;
  align-items:center;
}
.contact-icon{
  aspect-ratio:1;border-radius:50%;background:var(--navy);
  display:grid;place-items:center;color:#fff;
}
.contact-icon svg{width:46%;height:46%}
.contact-text h2{
  font-weight:700;color:var(--ink);letter-spacing:.04em;
  font-size:clamp(1.05rem,1.9vw,2.4rem);line-height:1.65;
  white-space:nowrap;
  margin-bottom:var(--text-gap);
}
.contact-text p{
  font-size:clamp(.8rem,1.25vw,1.5rem);color:var(--ink);line-height:1.9;
}
.contact-actions{display:flex;flex-direction:column;gap:1.25vw}
.btn-form{
  position:relative;
  display:flex;align-items:center;justify-content:center;gap:.7em;
  background:var(--navy);color:#fff;font-weight:700;
  font-size:clamp(.85rem,1.25vw,1.5rem);letter-spacing:.06em;
  padding:1em 1.4em;border-radius:100px;
  transition:background .25s,transform .25s;
}
.btn-form svg{width:1.2em;height:1.2em}
.btn-form .btn-arrow{
  position:absolute;right:1.4em;
  width:.5em;height:.7em;
  clip-path:polygon(0 0,100% 50%,0 100%);background:#fff;
}
.btn-form:hover{background:var(--navy-dark);transform:translateY(-2px)}
/* 電話ボックス：中身をひとかたまりで中央に置き、左右の余白を均等にする */
.tel-box{
  display:flex;align-items:center;justify-content:center;
  gap:clamp(.9rem,1.5vw,1.5rem);
  background:var(--white);border-radius:14px;
  padding:clamp(1rem,1.3vw,1.35rem) clamp(1.2rem,1.7vw,1.7rem);
  box-shadow:0 10px 28px -20px rgba(31,44,95,.4);
}
.tel-icon{
  flex:none;width:clamp(42px,3vw,54px);aspect-ratio:1;border-radius:50%;
  background:#e6eef8;color:var(--navy);display:grid;place-items:center;
}
.tel-icon svg{width:52%;height:52%}
.tel-main{flex:none;display:flex;flex-direction:column;gap:.2em;text-align:left}
.tel-label{
  font-size:clamp(.7rem,.8vw,.9rem);font-weight:700;color:var(--ink);
  letter-spacing:.02em;line-height:1.3;white-space:nowrap;
}
.tel-num{
  font-family:var(--din);font-weight:600;color:var(--ink);
  font-size:clamp(1.25rem,1.4vw,1.85rem);letter-spacing:.02em;line-height:1.15;
  white-space:nowrap;transition:color .2s;
}
.tel-num:hover{color:var(--navy)}
.tel-divider{
  flex:none;width:1px;height:clamp(2.4rem,3vw,3.1rem);
  background:var(--line);
}
.tel-hours{
  flex:none;font-size:clamp(.7rem,.8vw,.9rem);color:var(--ink-soft);
  line-height:1.4;white-space:nowrap;
}
/* 横幅が足りない時は営業時間を番号の下に送る（はみ出し防止） */
@media(max-width:1500px){
  .tel-box{flex-wrap:wrap;justify-content:flex-start;row-gap:.35rem}
  .tel-divider{display:none}
  .tel-hours{
    flex-basis:100%;
    padding-left:calc(clamp(42px,3vw,54px) + clamp(.9rem,1.5vw,1.5rem));
  }
}

/* ---------- Footer ---------- */
/* PSD: #022c60 */
.site-footer{
  background:var(--footer-navy);color:rgba(255,255,255,.92);
  padding:clamp(3rem,5vw,5.5rem) 0;
}
.footer-grid{
  display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:4%;
  align-items:start;
}
.footer-logo{display:flex;align-items:center;gap:.7rem;margin-bottom:1.6vw}
.footer-logo img{
  width:clamp(34px,2.9vw,56px);height:auto;
  filter:brightness(0) invert(1);
}
.footer-logo span{
  font-weight:700;color:#fff;letter-spacing:.05em;
  font-size:clamp(1rem,1.5vw,1.8rem);
}
.footer-addr{
  font-size:clamp(.78rem,1.05vw,1.25rem);line-height:2;color:rgba(255,255,255,.9);
}
.footer-copy{
  display:block;margin-top:2.6vw;
  font-size:clamp(.65rem,.8vw,.95rem);color:rgba(255,255,255,.7);
}
.footer-col-title{
  font-weight:700;color:#fff;letter-spacing:.08em;
  font-size:clamp(.85rem,1.15vw,1.4rem);
  margin-bottom:1.6vw;
}
.footer-col ul{display:flex;flex-direction:column;gap:.9vw}
.footer-col a,.footer-note{
  font-size:clamp(.8rem,1.05vw,1.25rem);color:rgba(255,255,255,.92);
}
.footer-col nav a{transition:color .2s}
.footer-col a:hover{color:#fff}
.footer-grid nav ul a::before{content:"› ";opacity:.8}
.footer-grid nav ul a:hover{text-decoration:underline}
.footer-tel{font-family:var(--sans);font-weight:500;text-decoration:underline}
.footer-note{color:rgba(255,255,255,.85)}
.footer-link{text-decoration:underline}

/* =========================================================
   下層ページ共通
   ========================================================= */
/* ページタイトル帯（社屋写真＋ネイビーグラデーション） */
.page-hero{
  position:relative;margin-top:var(--header-h);overflow:hidden;
  min-height:clamp(240px,30vw,430px);
  display:flex;align-items:center;
  background:var(--navy-dark);
  padding:clamp(2rem,4vw,4rem) 0;
}
.page-hero-photo{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center 40%;
}
.page-hero::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,
    rgba(13,24,58,.94) 0%,rgba(13,24,58,.78) 30%,
    rgba(13,24,58,.35) 62%,rgba(13,24,58,.12) 100%);
}
.page-hero .container{position:relative;z-index:2}
.page-title{
  font-family:var(--serif);font-weight:600;color:#fff;
  font-size:clamp(1.8rem,3.4vw,3.6rem);letter-spacing:.14em;line-height:1.3;
}
.page-title-en{
  font-family:var(--en);color:rgba(255,255,255,.72);
  font-size:clamp(.8rem,1vw,1.15rem);letter-spacing:.32em;
  text-transform:uppercase;margin-top:.5rem;
}
.breadcrumb{
  display:flex;gap:.6em;flex-wrap:wrap;
  font-size:clamp(.72rem,.85vw,.95rem);color:rgba(255,255,255,.75);
  margin-bottom:clamp(1.2rem,2.4vw,2.8rem);
}
.breadcrumb a{color:#fff;transition:opacity .2s}
.breadcrumb a:hover{opacity:.7;text-decoration:underline}
.breadcrumb .sep::before{content:"›"}

/* 下層セクション見出し（小） */
.sub-title{
  display:flex;align-items:baseline;gap:1rem;
  margin-bottom:var(--head-gap);
}
.sub-title .en{
  font-family:var(--en);font-size:clamp(1.5rem,2.4vw,2.9rem);
  color:var(--navy);letter-spacing:.05em;line-height:1.1;
}
.sub-title .ja{
  font-family:var(--serif);font-weight:600;
  font-size:clamp(.85rem,1.05vw,1.3rem);color:var(--ink);letter-spacing:.12em;
}

/* 会社情報テーブル */
.info-table{width:100%;border-collapse:collapse}
.info-table th,.info-table td{
  padding:clamp(1rem,1.6vw,1.6rem) clamp(.4rem,1vw,1.2rem);
  border-bottom:1px solid var(--line);
  font-size:clamp(.85rem,1.1vw,1.3rem);
  text-align:left;vertical-align:top;line-height:1.9;
}
.info-table th{
  width:clamp(110px,18%,220px);
  font-weight:700;color:var(--navy);white-space:nowrap;
}
.info-table tr:first-child th,.info-table tr:first-child td{border-top:1px solid var(--line)}

/* 代表挨拶 */
.greeting-grid{
  display:grid;grid-template-columns:clamp(220px,26%,340px) 1fr;
  gap:clamp(1.8rem,4vw,4.5rem);align-items:start;
}
.greeting-photo{
  aspect-ratio:3/4;border-radius:12px;overflow:hidden;
  background:linear-gradient(150deg,#c9d8e8,#9db4cd);
  display:grid;place-items:center;text-align:center;
  color:var(--navy);font-weight:700;font-size:.9rem;line-height:1.7;
}
.greeting-photo img{width:100%;height:100%;object-fit:cover}
.greeting-heading{
  font-family:var(--serif);font-weight:600;color:var(--navy);
  font-size:clamp(1.2rem,1.9vw,2.2rem);letter-spacing:.08em;
  margin-bottom:var(--text-gap);
}
.greeting-body{
  font-family:var(--serif);font-size:clamp(.85rem,1.1vw,1.3rem);
  line-height:2.2;letter-spacing:.03em;color:var(--ink);
}
.greeting-body p{margin-bottom:1.2em}
.greeting-sign{
  margin-top:1.8em;text-align:right;font-family:var(--serif);
  font-size:clamp(.85rem,1.1vw,1.3rem);
}
.greeting-sign .title{font-size:.82em;color:var(--ink-soft);margin-right:1em}
.greeting-sign .name{font-size:1.25em;font-weight:600;letter-spacing:.14em}

/* 代表コラム（続きを読む） */
.column-card{
  position:relative;
  background:var(--tint);
  border:1px solid var(--line);
  border-radius:14px;
  padding:clamp(1.6rem,3vw,2.8rem);
}
/* コラムが複数あるときの間隔 */
.column-card + .column-card{margin-top:clamp(1.4rem,2.4vw,2.4rem)}
.column-head{
  display:flex;align-items:baseline;flex-wrap:wrap;gap:.4em 1em;
  margin-bottom:clamp(1rem,1.6vw,1.5rem);
}
.column-title{
  font-family:var(--serif);font-weight:600;color:var(--navy);
  font-size:clamp(1.15rem,1.9vw,1.7rem);letter-spacing:.06em;line-height:1.6;
}
.column-author{
  font-family:var(--serif);color:var(--ink-soft);
  font-size:clamp(.82rem,1vw,1.05rem);letter-spacing:.06em;
  white-space:nowrap;
}
.column-text{
  font-family:var(--serif);color:var(--ink);
  font-size:clamp(.9rem,1.1vw,1.25rem);line-height:2.1;letter-spacing:.02em;
  max-height:16em;overflow:hidden;
  transition:max-height .5s ease;
}
/* 開いた状態（JSが .is-open を付ける） */
.column-card.is-open .column-text{max-height:none}
.column-text p{margin-bottom:1.2em}
.column-text p:last-child{margin-bottom:0}
.column-h{
  font-family:var(--serif);font-weight:600;color:var(--navy);
  font-size:clamp(1rem,1.35vw,1.35rem);letter-spacing:.04em;line-height:1.6;
  margin:1.8em 0 .8em;padding-left:.7em;
  border-left:3px solid var(--navy);
}
.column-text > .column-h:first-child{margin-top:0}
.column-note{
  font-size:.9em;color:var(--ink-soft);
  margin-top:1.6em;padding-top:1em;border-top:1px dotted var(--line);
}
/* 出典（本文末尾・追記の下） */
.column-source{
  display:flex;align-items:baseline;flex-wrap:wrap;gap:.3em .8em;
  margin-top:clamp(1.2rem,1.8vw,1.6rem);
  font-size:clamp(.76rem,.9vw,.98rem);line-height:1.9;color:var(--ink-soft);
}
.column-source-label{
  flex:none;font-weight:700;color:var(--navy);letter-spacing:.1em;
  font-size:.9em;
  border:1px solid var(--line);border-radius:4px;
  padding:.15em .8em;background:var(--white);
}
.column-source a{
  font-family:var(--serif);font-weight:600;color:var(--navy);
  border-bottom:1px solid var(--navy);padding-bottom:1px;
  transition:opacity .2s;
}
.column-source a:hover{opacity:.65}
.column-source a:focus-visible{outline:2px solid var(--navy);outline-offset:3px}
.column-source-ext{font-size:.85em;margin-left:.25em}
.column-source-detail{flex:1 1 auto;min-width:0}
/* 折りたたみ中に下端をふわっと隠すフェード */
.column-fade{
  position:absolute;left:1px;right:1px;
  bottom:calc(clamp(1.6rem,3vw,2.8rem) + 3.4rem);
  height:5em;pointer-events:none;
  background:linear-gradient(to bottom,rgba(244,249,253,0),var(--tint));
  transition:opacity .3s ease;
}
.column-card.is-open .column-fade{opacity:0}
.column-toggle{
  display:inline-flex;align-items:center;gap:.5em;cursor:pointer;
  margin-top:clamp(1.2rem,2vw,1.8rem);
  font-family:var(--sans);font-weight:700;letter-spacing:.06em;
  font-size:clamp(.85rem,1vw,1.1rem);color:var(--navy);
  background:none;border:none;padding:.2em 0;
  border-bottom:1px solid var(--navy);
  transition:opacity .2s;
}
.column-toggle:hover{opacity:.65}
.column-toggle:focus-visible{outline:2px solid var(--navy);outline-offset:3px}
.column-toggle::after{
  content:"\25BC";font-size:.7em;transition:transform .3s ease;
}
.column-card.is-open .column-toggle::after{transform:rotate(180deg)}

/* 沿革タイムライン */
.timeline{position:relative;padding-left:clamp(120px,16%,200px)}
.timeline::before{
  content:"";position:absolute;top:.5em;bottom:.5em;
  left:calc(clamp(120px,16%,200px) - 5.5px);
  width:1px;background:var(--line);
}
.timeline-item{position:relative;padding:0 0 clamp(1.8rem,3vw,3rem) clamp(1.6rem,2.6vw,3rem)}
.timeline-item:last-child{padding-bottom:0}
.timeline-item::before{
  content:"";position:absolute;left:-10px;top:.5em;
  width:11px;height:11px;border-radius:50%;
  background:var(--navy);border:2.5px solid var(--white);
  box-shadow:0 0 0 1px var(--navy);
}
.timeline-year{
  position:absolute;left:calc(-1 * clamp(120px,16%,200px));top:0;
  text-align:left;
  font-family:var(--din);font-weight:600;color:var(--navy);
  font-size:clamp(1.05rem,1.5vw,1.8rem);letter-spacing:.04em;white-space:nowrap;
  line-height:1.4;
}
.timeline-body{font-size:clamp(.85rem,1.1vw,1.3rem);line-height:1.9}
.timeline-body strong{display:block;font-weight:700;color:var(--ink)}
.timeline-body span{color:var(--ink-soft);font-size:.92em}

/* 運営メディア */
.media-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:clamp(1rem,2.2vw,2rem);
}
.media-card{
  background:var(--white);border-radius:10px;overflow:hidden;
  box-shadow:0 14px 34px -22px rgba(31,44,95,.4);
  transition:transform .3s ease,box-shadow .3s ease;
  display:flex;flex-direction:column;
}
.media-card:hover{transform:translateY(-5px);box-shadow:0 22px 44px -22px rgba(31,44,95,.5)}
.media-photo{aspect-ratio:4/3;overflow:hidden;background:var(--navy-pale, #e6eef8)}
.media-photo img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.media-card:hover .media-photo img{transform:scale(1.05)}
.media-photo.placeholder{
  display:grid;place-items:center;text-align:center;
  background:linear-gradient(150deg,#c9d8e8,#9db4cd);
  color:var(--navy);font-weight:700;font-size:.85rem;line-height:1.7;
}
.media-body{padding:1.2rem 1.2rem 1.4rem;text-align:center}
.media-body h3{font-size:clamp(.9rem,1.1vw,1.25rem);font-weight:700;color:var(--navy);margin-bottom:.4rem}
.media-body p{font-size:clamp(.75rem,.9vw,1.05rem);color:var(--ink-soft);line-height:1.7}

/* SNS */
.sns-groups{display:flex;flex-direction:column}
.sns-group{
  display:grid;grid-template-columns:clamp(120px,20%,180px) 1fr;
  align-items:center;gap:clamp(1rem,2vw,2rem);
  padding:clamp(1rem,1.8vw,1.6rem) 0;
  border-bottom:1px solid var(--line);
}
.sns-group:first-child{padding-top:0}
.sns-group:last-child{border-bottom:none;padding-bottom:0}
.sns-brand{
  font-family:var(--serif);font-weight:600;color:var(--navy);
  font-size:clamp(.95rem,1.2vw,1.3rem);letter-spacing:.04em;margin:0;
}
.sns-icons{display:flex;flex-wrap:wrap;gap:clamp(.6rem,1vw,.9rem)}
.sns-icon{
  --sns-color:var(--navy);
  min-width:clamp(96px,7.8vw,120px);height:clamp(40px,3.4vw,48px);
  padding:0 .95em;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;gap:.55em;
  color:var(--sns-color);background:var(--white);
  border:1px solid var(--sns-color);
  font-family:var(--sans);font-size:clamp(.78rem,.8vw,.9rem);font-weight:700;
  transition:background .2s,color .2s,transform .2s,border-color .2s;
}
.sns-icon::after{content:attr(data-label)}
.sns-icon:hover{background:var(--sns-color);color:#fff;border-color:var(--sns-color);transform:translateY(-2px)}
.sns-icon:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.sns-svg{width:1.15em;height:1.15em;flex:0 0 auto}
.sns-instagram{--sns-color:#d62976}
.sns-facebook{--sns-color:#1877f2}
.sns-threads,.sns-x,.sns-tiktok{--sns-color:#111}
.sns-line{--sns-color:#06c755}
.sns-youtube{--sns-color:#ff0033}

/* アクセス */
.access-grid{
  display:grid;grid-template-columns:1fr clamp(260px,32%,420px);
  gap:clamp(1.8rem,3.6vw,4rem);align-items:start;
}
.access-map{
  aspect-ratio:16/10;border-radius:12px;overflow:hidden;
  box-shadow:0 14px 34px -22px rgba(31,44,95,.4);
}
.access-map iframe{width:100%;height:100%;border:0;display:block}
.access-info dt{
  font-weight:700;color:var(--navy);
  font-size:clamp(.82rem,1vw,1.15rem);
  margin-bottom:.3em;display:flex;align-items:center;gap:.5em;
}
.access-info dt::before{content:"";width:14px;height:1.5px;background:var(--navy)}
.access-info dd{
  font-size:clamp(.85rem,1.05vw,1.25rem);line-height:1.9;color:var(--ink);
  margin-bottom:1.4em;
}

/* 下層ページのセクション背景リズム */
.sub-section{padding:var(--sec-pad) 0}
.sub-section.tint{background:var(--tint)}

/* リード文（下層ページ冒頭） */
.sub-lead{
  font-family:var(--serif);font-size:clamp(.9rem,1.2vw,1.4rem);
  line-height:2.2;letter-spacing:.04em;color:var(--ink);
  max-width:46em;
}

/* 事業内容：詳細ブロック（交互レイアウト） */
.svc-detail{
  display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(2rem,5vw,5.5rem);align-items:center;
}
.svc-detail + .svc-detail{margin-top:var(--sec-pad)}
.svc-detail.reverse .svc-photo{order:2}
.svc-photo img{
  width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px;
  box-shadow:0 18px 40px -24px rgba(31,44,95,.45);
}
.svc-num{
  font-family:var(--din);font-weight:600;color:var(--navy);
  font-size:clamp(.85rem,1.05vw,1.25rem);letter-spacing:.2em;
  display:flex;align-items:center;gap:.9em;
}
.svc-num::after{content:"";width:38px;height:1.5px;background:var(--navy)}
.svc-title{
  font-family:var(--serif);font-weight:600;color:var(--navy);
  font-size:clamp(1.35rem,2.2vw,2.6rem);letter-spacing:.08em;line-height:1.5;
  margin:.7em 0 .8em;
}
.svc-desc{
  font-size:clamp(.85rem,1.05vw,1.25rem);line-height:2;color:var(--ink);
  margin-bottom:1.6em;
}
.svc-tags{display:flex;flex-wrap:wrap;gap:.6em}
.svc-tag{
  font-size:clamp(.72rem,.85vw,1rem);font-weight:500;color:var(--navy);
  border:1px solid var(--navy);border-radius:100px;
  padding:.35em 1.1em;white-space:nowrap;
}

/* 主な媒体・サービス詳細 */
.item-grid{
  display:grid;
  /* カードが狭いとテキストが縦に伸びて画像より高くなるため、
     十分な幅が取れる時だけ2カラムにする */
  grid-template-columns:repeat(auto-fit,minmax(min(520px,100%),1fr));
  align-items:stretch;
  grid-auto-rows:1fr;
  gap:clamp(1.4rem,2.6vw,2.6rem);
}
.item-card{
  background:var(--white);border-radius:12px;overflow:hidden;
  box-shadow:0 16px 38px -24px rgba(31,44,95,.45);
  display:grid;grid-template-columns:clamp(260px,51%,390px) 1fr;
  grid-template-rows:auto;align-items:center;height:100%;
}
/* 画像枠は3:4固定。画像がカードの高さを決めるので上下に余白が出ない */
.item-photo{width:100%;height:auto;min-height:0;aspect-ratio:3/4;align-self:start;overflow:hidden}
.item-photo img{width:100%;height:100%;object-fit:cover;object-position:center center;display:block;background:#fff}
.item-photo.placeholder{
  display:grid;place-items:center;text-align:center;
  background:linear-gradient(150deg,#c9d8e8,#9db4cd);
  color:var(--navy);font-weight:700;font-size:.8rem;line-height:1.7;
}
.item-body{padding:clamp(.8rem,1vw,1.25rem) clamp(1rem,1.4vw,1.6rem);align-self:center}
/* 実績ページと共用の .item-cat には影響させない */
.item-body .item-cat{margin-bottom:.45em}
.item-cat{
  display:inline-block;font-size:clamp(.66rem,.78vw,.9rem);font-weight:700;
  color:#fff;background:var(--navy);border-radius:3px;
  padding:.2em 1em;letter-spacing:.1em;margin-bottom:.6em;
}
.item-body h3{
  font-family:var(--serif);font-weight:600;color:var(--navy);
  font-size:clamp(1.1rem,1.5vw,1.75rem);letter-spacing:.06em;
  margin-bottom:.35em;line-height:1.3;
}
.item-body > p{
  font-size:clamp(.76rem,.88vw,1rem);line-height:1.55;color:var(--ink);
  margin-bottom:.6em;
}
.item-specs{display:flex;flex-direction:column}
.item-specs > div{
  display:grid;grid-template-columns:clamp(52px,5.6vw,88px) 1fr;gap:.7em;
  padding:.26em 0;border-top:1px dotted var(--line);
  font-size:clamp(.7rem,.82vw,.94rem);line-height:1.45;
}
.item-specs dt{font-weight:700;color:var(--navy);white-space:nowrap}
.item-specs dd{color:var(--ink)}
.item-specs a{color:var(--navy);font-weight:700;text-decoration:underline;text-underline-offset:.2em}

/* 実績：フィルター＋ギャラリー */
.works-filter{
  display:flex;flex-wrap:wrap;gap:.7em;
  margin-bottom:clamp(2rem,3.6vw,3.6rem);
}
.filter-btn{
  font-family:var(--sans);font-weight:700;cursor:pointer;
  font-size:clamp(.78rem,.92vw,1.05rem);letter-spacing:.06em;
  color:var(--navy);background:var(--white);
  border:1.5px solid var(--navy);border-radius:100px;
  padding:.5em 1.5em;transition:background .25s,color .25s;
}
.filter-btn:hover{background:var(--tint)}
.filter-btn.active{background:var(--navy);color:#fff}
/* 表紙をトリミングせず等倍で並べる（トップのWORKSと同じ見せ方） */
.works-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(2.4rem,4vw,4.5rem) clamp(1.4rem,2.6vw,2.8rem);
}
.workcard{text-align:center}
.workcard.is-hidden{display:none}
.workcard-photo{
  height:clamp(230px,21vw,330px);
  display:flex;justify-content:center;align-items:flex-end;
}
.workcard-photo img{
  max-height:100%;width:auto;max-width:100%;object-fit:contain;
  box-shadow:0 14px 32px -18px rgba(31,44,95,.5);
  transition:transform .3s ease;
}
.workcard:hover .workcard-photo img{transform:translateY(-5px)}
.workcard-photo.placeholder{align-items:stretch}
.workcard-photo.placeholder span{
  display:grid;place-items:center;text-align:center;
  aspect-ratio:210/297;height:100%;
  background:linear-gradient(150deg,#c9d8e8,#9db4cd);
  color:var(--navy);font-weight:700;font-size:.82rem;line-height:1.7;
  box-shadow:0 14px 32px -18px rgba(31,44,95,.5);
}
.workcard .item-cat{display:none}
a.workcard{color:inherit}
.ext-link{
  display:inline-block;margin-top:.55em;
  font-size:clamp(.72rem,.85vw,1rem);font-weight:700;color:var(--navy);
  border-bottom:1px solid var(--navy);padding-bottom:2px;
  transition:opacity .2s;
}
.ext-link::after{content:"\2197";margin-left:.4em}
a.workcard:hover .ext-link{opacity:.65}
.workcard-body{padding-top:clamp(.9rem,1.4vw,1.4rem)}
.workcard-body h3{
  font-weight:700;color:var(--ink);
  font-size:clamp(.9rem,1.1vw,1.3rem);letter-spacing:.04em;line-height:1.6;
  margin-bottom:.3em;
}
.workcard-body p{
  font-size:clamp(.72rem,.85vw,1rem);color:var(--ink-soft);line-height:1.7;
}

/* お知らせ：サムネイル付きリスト */
.news-rows{display:flex;flex-direction:column}
.news-row{
  display:grid;grid-template-columns:clamp(170px,24%,280px) 1fr;
  gap:clamp(1.2rem,2.4vw,2.6rem);align-items:center;
  padding:clamp(1.4rem,2.4vw,2.4rem) 0;
  border-bottom:1px solid var(--line);
}
.news-row:first-child{padding-top:0}
.news-row-thumb{
  aspect-ratio:16/10;overflow:hidden;border-radius:10px;
  background:var(--tint);
}
.news-row-thumb img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .35s ease;
}
.news-row:hover .news-row-thumb img{transform:scale(1.05)}
.news-row-meta{display:flex;align-items:center;gap:1.1em;margin-bottom:.6em}
.news-row-meta time{
  font-family:var(--en);font-size:clamp(.85rem,1.05vw,1.25rem);
  color:var(--ink);letter-spacing:.02em;
}
.news-row-title{
  font-family:var(--serif);font-weight:600;color:var(--ink);
  font-size:clamp(1.05rem,1.5vw,1.7rem);letter-spacing:.04em;line-height:1.7;
  margin-bottom:.4em;transition:color .2s;
}
.news-row:hover .news-row-title{color:var(--navy)}
.news-row-excerpt{
  font-size:clamp(.78rem,.95vw,1.1rem);color:var(--ink-soft);line-height:1.9;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}

/* お知らせ：ページ送り */
.news-pagination{
  display:flex;justify-content:center;align-items:center;gap:.6em;
  margin-top:clamp(2.5rem,4.5vw,4.5rem);
}
.page-btn{
  min-width:42px;height:42px;display:grid;place-items:center;
  font-family:var(--din);font-weight:600;font-size:1rem;
  color:var(--navy);border:1.5px solid var(--navy);border-radius:50%;
  padding:0 .5em;transition:background .25s,color .25s;
}
.page-btn:hover{background:var(--tint)}
.page-btn.active{background:var(--navy);color:#fff;pointer-events:none}

/* お知らせ：記事アイキャッチ */
.article-eyecatch{
  border-radius:14px;overflow:hidden;
  margin-bottom:clamp(1.8rem,3vw,3rem);
  box-shadow:0 18px 40px -24px rgba(31,44,95,.45);
}
.article-eyecatch img{width:100%;aspect-ratio:16/8;object-fit:cover;display:block}

/* お知らせ：記事詳細 */
.article-container{max-width:min(79.3%,900px)}
.article-head{
  border-bottom:1px solid var(--line);
  padding-bottom:clamp(1.2rem,2vw,2rem);
  margin-bottom:clamp(1.6rem,2.8vw,2.8rem);
}
.article-meta{display:flex;align-items:center;gap:1.2em;margin-bottom:.9em}
.article-meta time{
  font-family:var(--en);font-size:clamp(.9rem,1.15vw,1.35rem);
  color:var(--ink);letter-spacing:.02em;
}
.article-title{
  font-family:var(--serif);font-weight:600;color:var(--navy);
  font-size:clamp(1.3rem,2.2vw,2.4rem);letter-spacing:.05em;line-height:1.7;
}
.article-body{margin-bottom:clamp(2rem,3.5vw,3.5rem)}
.article-body p{
  font-size:clamp(.88rem,1.1vw,1.25rem);line-height:2.15;
  color:var(--ink);margin-bottom:1.4em;
}
.back-link::after{content:none}
.back-link::before{
  content:"\2190";display:inline-block;margin-right:.7em;
  transition:transform .3s cubic-bezier(.25,.8,.35,1);
}
.back-link:hover::before{transform:translateX(-.5em)}

/* 個人情報保護方針 */
.policy-container{max-width:min(79.3%,900px)}
.policy-intro{
  font-size:clamp(.85rem,1.05vw,1.2rem);line-height:2.1;color:var(--ink);
  margin-bottom:clamp(2.4rem,4vw,4rem);
}
.policy-block{margin-bottom:clamp(2.2rem,3.8vw,3.8rem)}
.policy-block h2{
  font-family:var(--serif);font-weight:600;color:var(--navy);
  font-size:clamp(1.1rem,1.5vw,1.65rem);letter-spacing:.06em;line-height:1.6;
  border-bottom:1px solid var(--line);
  padding-bottom:.55em;margin-bottom:1em;
}
.policy-block p{
  font-size:clamp(.85rem,1.05vw,1.2rem);line-height:2.05;color:var(--ink);
  margin-bottom:1em;
}
.policy-block ul,.policy-block ol{
  padding-left:1.6em;margin:.4em 0 1em;
}
.policy-block li{
  font-size:clamp(.85rem,1.05vw,1.2rem);line-height:2;color:var(--ink);
  margin-bottom:.35em;
}
.policy-block ul li{list-style:disc}
.policy-block ol li{list-style:decimal}
.policy-date{
  text-align:right;font-size:clamp(.78rem,.95vw,1.1rem);
  color:var(--ink-soft);line-height:1.9;
}

/* お問い合わせフォーム */
.contact-lead{
  display:flex;flex-wrap:wrap;gap:clamp(1.2rem,2.4vw,2.4rem);
  align-items:stretch;margin-bottom:clamp(2.4rem,4vw,4rem);
}
.contact-lead p{
  flex:1 1 320px;font-size:clamp(.88rem,1.1vw,1.25rem);line-height:2.05;color:var(--ink);
}
.contact-lead .tel-box{flex:0 1 380px}
.form-card{
  background:var(--white);border-radius:14px;
  box-shadow:0 18px 44px -26px rgba(31,44,95,.45);
  padding:clamp(1.8rem,3.4vw,3.4rem) clamp(1.4rem,3vw,3.4rem);
  max-width:860px;margin-inline:auto;
}
/* ボット対策用の隠し項目（人間には見えない） */
.form-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-row{margin-bottom:clamp(1.4rem,2.2vw,2.2rem)}
.form-row label{
  display:flex;align-items:center;gap:.7em;
  font-weight:700;color:var(--ink);
  font-size:clamp(.85rem,1vw,1.15rem);margin-bottom:.6em;
}
.req,.opt{
  font-size:.68em;font-weight:700;letter-spacing:.08em;
  border-radius:4px;padding:.25em .8em;line-height:1.4;
}
.req{color:#fff;background:#c85454}
.opt{color:var(--ink-soft);background:var(--tint);border:1px solid var(--line)}
.form-row input[type="text"],
.form-row input[type="email"],
.form-row input[type="tel"],
.form-row select,
.form-row textarea{
  width:100%;font-family:var(--sans);
  font-size:clamp(.9rem,1.05vw,1.15rem);color:var(--ink);
  background:var(--tint);border:1.5px solid var(--line);border-radius:8px;
  padding:.85em 1em;transition:border-color .2s,background .2s;
}
.form-row select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--navy) 50%),linear-gradient(135deg,var(--navy) 50%,transparent 50%);background-position:calc(100% - 1.4em) 50%,calc(100% - 1em) 50%;background-size:.4em .4em;background-repeat:no-repeat;cursor:pointer}
.form-row textarea{min-height:200px;resize:vertical;line-height:1.9}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{
  outline:none;border-color:var(--navy);background:var(--white);
}
.form-agree{
  display:flex;justify-content:center;align-items:center;gap:.7em;
  font-size:clamp(.85rem,1vw,1.15rem);margin:clamp(1.6rem,2.6vw,2.6rem) 0;
}
.form-agree input{width:1.15em;height:1.15em;accent-color:var(--navy);cursor:pointer}
.form-agree a{color:var(--navy);text-decoration:underline}
.form-agree a:hover{opacity:.7}
.form-submit{text-align:center}
.form-submit button{
  border:none;cursor:pointer;font-family:var(--sans);
  width:min(100%,420px);margin-inline:auto;
}
.form-note{
  text-align:center;font-size:clamp(.74rem,.88vw,1rem);color:var(--ink-soft);
  margin-top:1.2em;line-height:1.9;
}

/* 送信完了ページ */
.thanks-inner{
  max-width:min(79.3%,760px);
  display:flex;flex-direction:column;align-items:center;text-align:center;
}
.thanks-icon{
  width:clamp(64px,6vw,86px);aspect-ratio:1;border-radius:50%;
  background:#e6eef8;color:var(--navy);display:grid;place-items:center;
  margin-bottom:clamp(1.4rem,2.2vw,2.2rem);
}
.thanks-icon svg{width:50%;height:50%}
.thanks-title{
  font-family:var(--serif);font-weight:600;color:var(--navy);
  font-size:clamp(1.3rem,2.2vw,2.2rem);letter-spacing:.06em;line-height:1.6;
  margin-bottom:clamp(1rem,1.6vw,1.6rem);
}
.thanks-text{
  font-size:clamp(.88rem,1.05vw,1.2rem);line-height:2;color:var(--ink);
  margin-bottom:clamp(1rem,1.5vw,1.5rem);
}
.thanks-note{
  font-size:clamp(.76rem,.88vw,1rem);line-height:1.9;color:var(--ink-soft);
  margin-bottom:clamp(2rem,3vw,3rem);
}
.thanks-tel{width:min(100%,420px);margin-bottom:clamp(2rem,3vw,3rem)}
.thanks-back{width:min(100%,340px)}

/* ご依頼の流れ */
.flow-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:clamp(1rem,2vw,1.8rem);
  counter-reset:flow;
}
.flow-step{
  position:relative;background:var(--white);border-radius:10px;
  padding:clamp(1.4rem,2.2vw,2.2rem) clamp(1rem,1.6vw,1.6rem);
  box-shadow:0 14px 34px -22px rgba(31,44,95,.4);
  text-align:center;
}
.flow-step:not(:last-child)::after{
  content:"";position:absolute;top:50%;right:calc(-1 * clamp(.7rem,1.4vw,1.3rem));
  transform:translateY(-50%);
  width:.55em;height:.8em;
  clip-path:polygon(0 0,100% 50%,0 100%);background:var(--navy);
  font-size:clamp(.8rem,1vw,1.2rem);
}
.flow-num{
  font-family:var(--din);font-weight:600;color:var(--navy);
  font-size:clamp(1.3rem,1.9vw,2.2rem);line-height:1;
  display:block;margin-bottom:.6em;
}
.flow-step h3{
  font-size:clamp(.9rem,1.1vw,1.3rem);font-weight:700;color:var(--ink);
  margin-bottom:.5em;letter-spacing:.04em;
}
.flow-step p{font-size:clamp(.75rem,.9vw,1.05rem);color:var(--ink-soft);line-height:1.8}

/* ---------- Responsive ---------- */
@media(max-width:960px){
  .container{width:min(100% - 40px,900px)}
  .v-label{display:none}
  .hero-photo{min-height:480px}
  .hero-content{padding-left:24px;padding-right:24px}
  .hero-title{font-size:clamp(1.6rem,6.4vw,2.4rem)}
  .hero-lead p{font-size:clamp(.78rem,3.4vw,1rem)}
  .news{padding:3.5rem 0}
  .news-grid{grid-template-columns:1fr;gap:2rem}
  .news-head .view-all{margin-top:1rem}
  .news-item{grid-template-columns:auto auto;grid-template-rows:auto auto;gap:.4rem 1rem;justify-content:start;padding:1rem 0}
  .news-row{grid-template-columns:1fr;gap:.9rem;padding:1.4rem 0}
  .news-row-thumb{max-width:420px}
  .news-item a{grid-column:1/-1}
  .about{padding:3.5rem 0}
  .about-grid{grid-template-columns:1fr;row-gap:1.6rem}
  .about-text{grid-column:1;grid-row:1}
  .about-link{grid-column:1;grid-row:2}
  .about-photo{grid-column:1;grid-row:3;margin-inline:calc(50% - 50vw)}
  .about-photo img{position:static;aspect-ratio:5/3;border-radius:0}
  .about-heading{margin:1.4rem 0 1rem}
  .about-body{margin-bottom:1.4rem}
  .about-body br{display:none}
  .service{padding:3.5rem 0}
  .service .sec-center{margin-bottom:2rem}
  .service-grid{grid-template-columns:1fr;max-width:440px;margin-inline:auto;gap:1.6rem}
  .service-body{padding:1.5rem 1.2rem 1.7rem}
  .service-body h3{margin-bottom:.7rem}
  .service-body p{margin-bottom:.9rem}
  .works{padding:3.5rem 0}
  .works-head{margin-bottom:2rem}
  .works-carousel{width:100%;padding-inline:20px}
  .works-track{justify-content:flex-start;gap:1.4rem}
  .work-item figure{height:200px}
  .work-item figcaption{margin-top:.6rem}
  .car-btn{display:none}
  .contact{padding:3.5rem 0}
  .contact-inner{grid-template-columns:1fr;justify-items:center;text-align:center;gap:1.6rem}
  .contact-icon{width:96px}
  .contact-text h2{margin-bottom:.8rem}
  .contact-actions{width:100%;max-width:360px;gap:.9rem}
  .tel-box{justify-content:flex-start}
  .greeting-grid{grid-template-columns:1fr}
  .greeting-photo{max-width:280px;margin-inline:auto}
  .timeline{padding-left:0}
  .timeline::before{left:5px}
  .timeline-item{padding-left:2rem}
  .timeline-item::before{left:0}
  .timeline-year{position:static;display:block;margin-bottom:.2em}
  .media-grid{grid-template-columns:repeat(2,1fr)}
  .sns-group{grid-template-columns:1fr;gap:.7rem}
  .access-grid{grid-template-columns:1fr}
  .works-grid{grid-template-columns:repeat(2,1fr);gap:1rem}
  .item-grid{grid-template-columns:1fr}
  .item-card{grid-template-columns:1fr;grid-template-rows:auto auto}
  .item-photo{height:auto;min-height:0;aspect-ratio:3/4;width:100%;max-width:280px;margin-inline:auto}
  .svc-detail{grid-template-columns:1fr;gap:1.6rem}
  .svc-detail.reverse .svc-photo{order:0}
  .svc-detail + .svc-detail{margin-top:3rem}
  /* 縦積み時：カード間を広げ、矢印をその中央に置く（次のカードへの重なり防止） */
  .flow-grid{grid-template-columns:1fr;max-width:420px;margin-inline:auto;gap:1.9rem}
  .flow-step:not(:last-child)::after{
    top:calc(100% + .95rem);right:auto;bottom:auto;left:50%;
    transform:translate(-50%,-50%) rotate(90deg);
  }
  .site-footer{padding:3rem 0}
  .footer-grid{grid-template-columns:1fr;gap:2.2rem}
  .footer-logo{margin-bottom:1rem}
  .footer-copy{margin-top:1.6rem}
  .footer-col-title{margin-bottom:.8rem}
  .footer-col ul{gap:.55rem}
}
@media(max-width:560px){
  .sns-icons{gap:.65rem}
  .sns-icon{
    min-width:44px;width:44px;height:44px;
    padding:0;border-radius:50%;
  }
  .sns-icon::after{content:none}
  .sns-svg{width:52%;height:52%}
}
@media(max-width:860px){
  .nav{
    position:fixed;inset:0 0 0 auto;width:min(78vw,320px);flex-direction:column;justify-content:center;
    gap:1.9rem;background:var(--navy);transform:translateX(100%);transition:transform .35s ease;padding:2rem;
  }
  .nav.open{transform:translateX(0)}
  .nav a{color:#fff;font-size:1.05rem}
  .nav a:not(.nav-cta):hover{color:rgba(255,255,255,.7)}
  .nav-cta{border:1.5px solid #fff}
  .nav-toggle{display:flex;z-index:110}
  .nav-toggle.open span{background:#fff}
  .nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle.open span:nth-child(2){opacity:0}
  .nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}
