/* =================================================================
   TONE BRANDING — 下層ページ共通（全幅ダイナミック版 / pages.css）
   トップ(style.css)の横幅ダイナミック語彙（.container 1560 / .svc-rowx /
   .scene-card / .stat / .vmark / .sec-bigtitle / .bleed）を下層へ展開。
   ヘッダー・フッターも端まで使う全幅レイアウトへ。
   ================================================================= */

/* ---------- 全体：文字間隔を少し広げる（詰まり解消・全ページ共通） ---------- */
body{letter-spacing:.05em;}

/* ---------- TOP Works＝横長カード6枚・縦積み（container内＝両サイド余白あり） ---------- */
.works-stack{display:flex;flex-direction:column;gap:clamp(14px,1.8vw,26px);
  margin-top:clamp(14px,1.8vw,26px);}
.works-pickup{position:relative;display:block;overflow:hidden;aspect-ratio:3/1;
  background:var(--fill);color:var(--paper);}
.works-pickup__media{position:absolute;inset:0;}
.works-pickup__media img{width:100%;height:100%;object-fit:cover;filter:contrast(1.02);
  transform:scale(1.02);transition:transform 1.6s var(--ease);}
.works-pickup:hover .works-pickup__media img{transform:scale(1.06);}
.works-pickup::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(18,18,18,.6) 0%,rgba(18,18,18,.22) 34%,rgba(18,18,18,0) 62%),
  linear-gradient(0deg,rgba(18,18,18,.42) 0%,rgba(18,18,18,0) 34%);}
.works-pickup__cap{position:absolute;left:clamp(22px,3vw,54px);bottom:clamp(20px,2.6vw,42px);z-index:2;
  display:flex;flex-direction:column;gap:7px;}
.works-pickup__label{font-family:var(--en);font-size:11px;letter-spacing:.28em;text-transform:none;
  color:color-mix(in srgb,var(--paper) 80%,transparent);}
.works-pickup__name{font-family:var(--serif);font-weight:500;font-size:clamp(1.05rem,1.4vw,1.35rem);
  letter-spacing:.03em;text-shadow:0 2px 16px rgba(0,0,0,.44);}
.works-pickup__cat{font-family:var(--en);font-size:12px;letter-spacing:.1em;
  color:color-mix(in srgb,var(--paper) 76%,transparent);}
/* 4列×2行 */
.works-grid8{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.4vw,22px);
  margin-top:clamp(14px,1.8vw,26px);}
.works-grid8 .pcard{flex:none;aspect-ratio:4/5;}
@media(max-width:900px){
  .works-pickup{aspect-ratio:2.2/1;}
  .works-grid8{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:560px){ .works-pickup{aspect-ratio:16/10;} }

/* ---------- TOP Journal＝1注目＋3リスト ---------- */
.journal-layout{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,4.5vw,80px);align-items:start;}
.journal-layout a{display:block;color:inherit;}
/* 注目記事（大） */
.jfeature{position:relative;}
.jfeature__media{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--fill);}
.jfeature__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease);}
.jfeature a:hover .jfeature__media img{transform:scale(1.05);}
.jbadge{position:absolute;top:-18px;left:-18px;z-index:2;
  width:clamp(64px,6vw,90px);aspect-ratio:1;border-radius:50%;
  background:var(--accent);color:var(--paper);display:flex;align-items:center;justify-content:center;
  font-family:var(--en);font-size:13px;font-weight:500;letter-spacing:.16em;}
.jfeature__body{padding-top:clamp(18px,2vw,26px);}
.jfeature__title{font-family:var(--serif);font-weight:500;
  font-size:clamp(1.15rem,1.7vw,1.6rem);line-height:1.75;margin:12px 0 16px;}
/* リスト（右・3件） */
.journal-list{display:flex;flex-direction:column;gap:clamp(20px,2.6vw,34px);}
.jitem a{display:grid;grid-template-columns:clamp(108px,12vw,150px) 1fr;gap:clamp(16px,1.8vw,26px);align-items:start;}
.jitem__thumb{aspect-ratio:16/9;overflow:hidden;background:var(--fill);}
.jitem__thumb img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease);}
.jitem a:hover .jitem__thumb img{transform:scale(1.05);}
.jitem__title{font-family:var(--serif);font-weight:500;
  font-size:clamp(1rem,1.15vw,1.15rem);line-height:1.7;margin:9px 0 13px;}
/* 日付・カテゴリタグ */
.jdate{font-family:var(--en);font-size:13px;letter-spacing:.06em;color:var(--ink-3);}
.jtag{display:inline-block;border:1px solid var(--line);border-radius:999px;
  padding:5px 16px;font-size:12px;letter-spacing:.04em;color:var(--ink-2);}
@media(max-width:860px){
  .journal-layout{grid-template-columns:1fr;gap:clamp(34px,6vw,48px);}
  .jbadge{top:-14px;left:-14px;}
}
@media(max-width:480px){
  .jitem a{grid-template-columns:96px 1fr;gap:14px;}
}

/* ---------- ヘッダー：全幅（端まで） ---------- */
/* 右端＝左端と同じ余白（重複MENU削除によりサイドレール分クリアランス不要） */
.header-inner{max-width:none;padding-left:clamp(22px,3vw,60px);padding-right:clamp(22px,3vw,60px);}
/* 下層ページ（body.page）はヘッダー下の罫線を消す（TOP=home は従来どおり） */
body.page .site-header.is-scrolled{border-bottom-color:transparent;}
/* 追従（固定）ヘッダーのMENU（ハンバーガー）右余白＝ロゴの左余白に合わせて右寄せ（全ページ・ナビ/CONTACTは不変） */
.side-rail{width:auto;align-items:flex-end;padding-right:clamp(22px,3vw,60px);}
.menu-btn,.side-scroll{align-self:flex-end;}
/* ハンバーガー（MENU）を5px上へ */
.menu-btn{transform:translateY(-5px);}
/* ヒーロー右の縦線（TOPヒーローのみ表示）を25px左へ（30px左→5px右戻し） */
.side-rail::before{left:-25px;}

/* ---------- フッター ---------- */
/* 上のCTAに90px重ねて上へ・上部を角丸80px＝濃色パネルがCTAに乗り上がる */
.site-footer{position:relative;z-index:1;margin-top:-90px;border-radius:60px 60px 0 0;} /* 上部角丸 20→60px（社長指示 2026-07-18） */
/* 左右余白は同値（対称） */
.site-footer .container{max-width:none;padding-inline:clamp(22px,3vw,60px);}
/* websupport #4821：フッター見出しh5を20pxに（全ページ共通） */
.footer-col h5{font-size:20px;}

/* フッター前のCTA見出し＝英語(kicker)を大きく・日本語(h2)を小さく（#4822を包含・全ページ共通） */
.cta .kicker{display:block;font-family:var(--en);font-weight:500;
  font-size:clamp(1.9rem,4.4vw,3.3rem);letter-spacing:.1em;text-transform:none;
  color:var(--paper);}
.cta .kicker::before{display:none;}
.cta h2{font-family:var(--serif);font-weight:500;font-size:clamp(1.05rem,1.7vw,1.45rem);
  letter-spacing:.16em;line-height:1.8;margin:14px 0 20px;}
.footer-statement{
  font-family:var(--serif);font-weight:500;
  font-size:clamp(1.7rem,4.4vw,3.6rem);line-height:1.5;letter-spacing:.02em;
  max-width:22ch;padding-bottom:clamp(40px,5vw,72px);margin-bottom:clamp(40px,5vw,64px);
  border-bottom:1px solid rgba(255,255,255,.16);
}
.footer-statement .en{display:block;font-family:var(--display);font-style:italic;font-weight:400;
  font-size:.34em;color:rgba(255,255,255,.5);letter-spacing:.05em;margin-bottom:16px;}
/* フッターのブランドはロゴ画像（白抜き） */
.footer-brand .fname{font-size:clamp(20px,2vw,26px);line-height:0;}
.footer-brand .fname img{width:clamp(160px,14vw,210px);height:auto;filter:brightness(0) invert(1);}
/* SNSは外線（枠）不要＝アイコンのみ */
.footer-sns{gap:18px;}
.footer-sns a{border:0;width:auto;height:auto;}
.footer-sns a:hover{background:transparent;}
.footer-sns a img{width:19px;height:19px;filter:brightness(0) invert(1);opacity:.8;}
.footer-sns a:hover img{filter:brightness(0) invert(1);opacity:1;}

/* ---------- 下層ヒーロー（フチ付きの大写真＋上にテキスト）----------
   写真は上下100px・両サイドはロゴ位置（ヘッダー左padding）に揃えて余白を取る。
   写真の周囲＝紙色。ヘッダーは紙の上に載るため濃色（黒ロゴ/ナビ/CONTACT・main.jsで .phero は非ヒーロー扱い）。 */
.phero{
  --phero-mt:112px;                       /* 写真の上余白（ヘッダー87px＋見える余白≒25px＝従来の約半分） */
  --phero-mx:clamp(22px,3vw,60px);        /* 写真の左右余白＝ヘッダーのロゴに揃える */
  /* 下余白＝両サイドと同じ（--phero-mx） */
  position:relative;background:var(--paper);
  min-height:100svh;                      /* 画面ぴったり＝写真下端も画面下部近く（下の空きは43pxのみ／次セクションを覗かせない） */
}
.phero__media{position:absolute;top:var(--phero-mt);bottom:var(--phero-mx);
  left:var(--phero-mx);right:var(--phero-mx);overflow:hidden;z-index:0;}
.phero__media img{width:100%;height:100%;object-fit:cover;filter:contrast(1.03);}
.phero__media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(18,18,18,.26) 0%,rgba(18,18,18,.10) 40%,rgba(18,18,18,.64) 100%);}
.phero__inner{position:absolute;z-index:2;left:var(--phero-mx);right:var(--phero-mx);bottom:var(--phero-mx);
  color:var(--paper);padding:clamp(30px,4vw,66px);}
/* パンくず＝右余白(--phero-mx)の帯に、縦書き・垂直中央・14px（紙の上＝濃色） */
.phero .crumb{position:absolute;z-index:3;top:0;bottom:0;right:0;width:var(--phero-mx);margin:0;
  display:flex;align-items:center;justify-content:center;
  writing-mode:vertical-rl;text-orientation:mixed;
  font-family:var(--en);font-size:14px;letter-spacing:.1em;color:var(--ink-3);white-space:nowrap;}
.phero .crumb a{color:var(--ink-3);transition:color .3s var(--ease);}
.phero .crumb a:hover{color:var(--ink);}
.phero .crumb .sep{margin:9px 0;opacity:.55;}
.phero .crumb .cur{color:var(--ink-2);}
.phero__title{font-family:var(--serif);font-weight:500;
  font-size:clamp(1.05rem,2.8vw,2.3rem);line-height:1.5;letter-spacing:.01em;margin:0;
  text-shadow:0 2px 30px rgba(0,0,0,.3);}
/* タイトル下の英語（小・Outfit・写真の上＝白） */
.phero__en{font-family:var(--en);font-style:normal;font-weight:400;
  font-size:clamp(13px,1.2vw,17px);letter-spacing:.12em;margin-top:12px;
  color:color-mix(in srgb,var(--paper) 82%,transparent);text-shadow:0 2px 16px rgba(0,0,0,.32);}
@media(max-width:640px){
  .phero{--phero-mt:84px;}
}

/* ---------- 汎用：リード／可読幅 ---------- */
.lead-wide{color:var(--ink-2);font-size:clamp(15px,1.15vw,17px);line-height:2.15;max-width:64ch;margin-top:24px;}
.split-lead{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,90px);align-items:start;}
@media(max-width:860px){.split-lead{grid-template-columns:1fr;gap:24px;}}

/* ---------- ピラー（約束・特長）＝全幅バンド・大きな番号 ---------- */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink);}
.pillar{padding:clamp(38px,4vw,68px) clamp(26px,3.2vw,58px);
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);}
.pillar:last-child{border-right:0;}
.pillar__no{font-family:var(--display);font-style:italic;font-weight:400;
  font-size:clamp(2.6rem,5vw,4.2rem);line-height:.9;color:var(--accent);}
.pillar__en{display:block;font-family:var(--en);font-size:11px;letter-spacing:.24em;
  text-transform:none;color:var(--ink-3);margin-top:22px;}
.pillar h3{font-family:var(--serif);font-weight:500;font-size:clamp(1.15rem,1.6vw,1.5rem);
  line-height:1.6;margin:12px 0 0;}
.pillar p{color:var(--ink-2);font-size:14px;line-height:2.05;margin-top:14px;}
@media(max-width:860px){
  .pillars{grid-template-columns:1fr;}
  .pillar{border-right:0;}
}

/* ---------- メトリクス（数値）＝全幅バンド ---------- */
.metrics{display:grid;grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-bottom:100px;}
.metric{padding:clamp(42px,5vw,76px) 24px;text-align:center;border-right:1px solid var(--line);}
.metric:last-child{border-right:0;}
.metric b{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(2rem,4vw,3rem);line-height:1;letter-spacing:.02em;}
.metric span{display:block;margin-top:14px;font-family:var(--en);font-size:11px;letter-spacing:.16em;
  text-transform:none;color:var(--ink-3);}
@media(max-width:720px){
  .metrics{grid-template-columns:1fr;}
  .metric{border-right:0;border-bottom:1px solid var(--line);}
  .metric:last-child{border-bottom:0;}
}

/* ---------- 図解フロー（WHY→HOW→WHAT）＝全幅バンド ---------- */
.flow{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);}
.flow .fnode{padding:clamp(34px,3.4vw,58px) clamp(24px,2.4vw,44px);text-align:center;position:relative;
  border-right:1px solid var(--line);}
.flow .fnode:last-child{border-right:0;}
.flow .fkey{font-family:var(--display);font-style:italic;font-size:clamp(1.2rem,1.8vw,1.6rem);color:var(--accent);}
.flow .fnode h4{font-family:var(--serif);font-size:clamp(1.1rem,1.4vw,1.35rem);margin:12px 0 10px;}
.flow .fnode p{color:var(--ink-2);font-size:13.5px;line-height:2;}
.flow .fnode::after{content:"→";position:absolute;right:-12px;top:50%;transform:translateY(-50%);
  font-family:var(--en);color:var(--ink-3);background:var(--paper);width:24px;height:24px;
  display:flex;align-items:center;justify-content:center;z-index:1;}
.flow .fnode:last-child::after{display:none;}
.section--tint .flow,.section--tint .flow .fnode{background:var(--paper);}
@media(max-width:860px){
  .flow{grid-template-columns:1fr;}
  .flow .fnode{border-right:0;border-bottom:1px solid var(--line);}
  .flow .fnode:last-child{border-bottom:0;}
  .flow .fnode::after{content:"↓";right:50%;top:auto;bottom:-12px;transform:translateX(50%);}
}

/* ---------- 情報テーブル（会社概要・お悩み別）---------- */
.tbl{width:100%;border-collapse:collapse;font-size:15px;}
.tbl th,.tbl td{border-bottom:1px solid var(--line);padding:20px 8px;text-align:left;vertical-align:top;line-height:1.95;}
.tbl th{font-family:var(--serif);font-weight:500;color:var(--ink);width:26%;white-space:nowrap;}
.tbl td{color:var(--ink-2);}
.tbl tr:first-child th,.tbl tr:first-child td{border-top:1px solid var(--line);}
.tbl--head thead th{font-family:var(--en);font-size:11px;letter-spacing:.16em;text-transform:none;
  color:var(--ink-3);font-weight:500;padding-bottom:14px;border-bottom:1px solid var(--ink);white-space:normal;width:auto;}
.tbl--head tbody td:last-child{font-family:var(--serif);color:var(--ink);}
@media(max-width:640px){
  .tbl th{width:38%;font-size:14px;}
  .tbl th,.tbl td{padding:15px 6px;}
}

/* ---------- ブランドカード群（3列・scene-card流用）---------- */
.brand-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.5vw,26px);}
.brand-grid .scene-card{aspect-ratio:4/5;}
@media(max-width:900px){.brand-grid{grid-template-columns:1fr;} .brand-grid .scene-card{aspect-ratio:16/10;}}

/* ---------- 会社概要：縦ラベル＋表の2カラム ---------- */
.info-split{display:grid;grid-template-columns:minmax(180px,240px) 1fr;gap:clamp(30px,4vw,80px);align-items:start;}
.info-split__label .en{font-family:var(--en);font-weight:500;font-size:13px;letter-spacing:.2em;text-transform:none;color:var(--ink-3);}
.info-split__label h2{font-family:var(--serif);font-size:clamp(1.3rem,1.8vw,1.7rem);margin-top:8px;}
@media(max-width:820px){.info-split{grid-template-columns:1fr;gap:24px;}}

/* ---------- オフィス一覧（アクセス）---------- */
.office-panel{border:1px solid var(--line);}
.office{padding:clamp(24px,2.6vw,36px);border-bottom:1px solid var(--line);}
.office:last-child{border-bottom:0;}
.office .oname{font-family:var(--en);font-size:11px;letter-spacing:.2em;text-transform:none;color:var(--ink-3);}
.office .oaddr{font-family:var(--serif);font-size:1.1rem;line-height:1.7;margin-top:10px;}
.office .onote{color:var(--ink-2);font-size:13.5px;line-height:1.9;margin-top:6px;}

/* ---------- お問い合わせ：左レール＋右フォームの全幅2カラム ---------- */
.contact-split{display:grid;grid-template-columns:minmax(300px,440px) 1fr;gap:clamp(40px,6vw,120px);align-items:start;}
.contact-rail .tel-big{font-family:var(--display);font-style:italic;font-size:clamp(1.8rem,2.6vw,2.6rem);
  color:var(--ink);margin-top:20px;display:inline-block;}
.contact-rail .rail-note{color:var(--ink-2);font-size:14px;line-height:2;margin-top:10px;}
@media(max-width:900px){.contact-split{grid-template-columns:1fr;gap:44px;}}

.contact-tabs{display:flex;gap:0;border-bottom:1px solid var(--line);margin-bottom:clamp(28px,3.4vw,44px);}
.contact-tabs button{background:none;border:0;border-bottom:1px solid transparent;margin-bottom:-1px;
  font-family:var(--en);font-size:12px;letter-spacing:.16em;text-transform:none;
  padding:16px 26px 16px 0;margin-right:34px;color:var(--ink-3);cursor:pointer;
  transition:color .3s var(--ease),border-color .3s var(--ease);}
.contact-tabs button:hover{color:var(--ink);}
.contact-tabs button.is-on{color:var(--ink);border-bottom-color:var(--ink);}
.tabpanel[hidden]{display:none;}
.field{margin-bottom:clamp(20px,2.2vw,30px);}
.field label{display:flex;align-items:center;gap:8px;font-family:var(--sans);font-size:16px;letter-spacing:.04em;
  color:var(--ink);margin-bottom:12px;}
.field .req{display:inline-block;background:var(--ink);color:#fff;font-family:var(--en);font-size:10px;
  letter-spacing:.16em;padding:3px 8px;margin-left:0;line-height:1;}
.field input,.field textarea,.field select{
  width:100%;font-family:var(--sans);font-size:15px;color:var(--ink);background:#fff;letter-spacing:.04em;
  border:1px solid var(--line);padding:16px 20px;transition:border-color .25s var(--ease);}
.field textarea{min-height:200px;resize:vertical;line-height:1.9;}
.field input:focus,.field textarea:focus,.field select:focus{outline:0;border-color:var(--ink);}
.field input::placeholder,.field textarea::placeholder{color:var(--ink-3);}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,2.4vw,40px);}
@media(max-width:560px){.form-row{grid-template-columns:1fr;}}
.form-note{font-size:12.5px;color:var(--ink-3);margin-top:18px;line-height:1.9;}
.form-submit{margin-top:clamp(26px,3vw,40px);}

/* ---------- セクション見出しの余白（共通） ---------- */
.sec-head .lead,.sec-head .lead-wide{margin-top:20px;}

/* ---------- 汎用ページ（専用テンプレ無し・プライバシー等）---------- */
.page-lite{padding-top:clamp(120px,15vh,180px);}
.page-lite .crumb{margin-bottom:clamp(20px,2.6vw,34px);}
.page-lite .page-lite__title{margin-top:14px;}
.page-lite .entry-content{margin-top:clamp(30px,4vw,52px);line-height:2.1;color:var(--ink-2);}
.page-lite .entry-content h2,.page-lite .entry-content h3{font-family:var(--serif);color:var(--ink);margin:1.6em 0 .6em;}
.page-lite .entry-content p{margin-bottom:1.2em;}

/* ---------- SP微調整 ---------- */
@media(max-width:560px){
  .phero__title{font-size:clamp(1.15rem,4.6vw,1.5rem);}
}

/* ================================================================
   Service一覧：特集ブロック（大画像＋情報行）  .svc-features
   ボタン色=既存インク/ペーパー・英字=Outfit(--en)で統一
   ================================================================ */
.svc-features{ margin-top:4px; }
.svc-feature{ display:block; text-decoration:none; color:inherit; }
.svc-feature + .svc-feature{ margin-top:clamp(72px,9vw,140px); }
.svc-feature__media{ position:relative; width:100%; aspect-ratio:16/7; overflow:hidden; background:var(--fill); }
.svc-feature__media img{ width:100%; height:100%; object-fit:cover; filter:contrast(1.02);
  transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.svc-feature:hover .svc-feature__media img{ transform:scale(1.045); }
.svc-feature__row{ display:grid; grid-template-columns:minmax(220px,1fr) 1.9fr auto;
  gap:clamp(28px,4vw,72px); align-items:center; padding:34px 2px 0; }
.svc-feature__no{ font-family:var(--display); font-style:italic; font-weight:400; font-size:22px; color:var(--accent); }
.svc-feature__en{ display:block; font-family:var(--en); font-size:12px; letter-spacing:.24em;
  text-transform:none; color:var(--ink-3); margin-top:8px; }
.svc-feature__title{ font-family:var(--serif); font-weight:600; font-size:clamp(22px,2.3vw,32px);
  line-height:1.5; margin:12px 0 0; letter-spacing:.02em; }
.svc-feature__desc{ color:var(--ink-2); font-size:15px; line-height:2.05; margin:0; max-width:48ch; }
.svc-feature__more{ display:inline-flex; align-items:center; gap:18px; justify-self:end; white-space:nowrap;
  font-family:var(--en); font-size:12px; font-weight:500; letter-spacing:.14em; text-transform:none; color:var(--ink); }
.circle-btn{ width:60px; height:60px; border-radius:50%; background:var(--ink); color:var(--paper);
  display:grid; place-items:center; flex:none; font-size:17px; line-height:1; }
.circle-btn .arw{ font-family:var(--en); color:var(--paper); display:inline-block; transition:transform .4s var(--ease); }
.svc-feature:hover .circle-btn .arw{ transform:translateX(4px); }

@media(max-width:920px){
  .svc-feature__media{ aspect-ratio:16/9; }
  .svc-feature__row{ grid-template-columns:1fr; gap:16px; align-items:start; padding-top:24px; }
  .svc-feature__desc{ max-width:none; }
  .svc-feature__more{ justify-self:start; }
  .circle-btn{ width:52px; height:52px; }
}

/* ================================================================
   下層ページ共通ヒーロー（中央寄せテキスト）  .page-hero
   ================================================================ */
.page-hero{ text-align:center; background:var(--paper);
  padding-block:clamp(120px,15vw,180px) clamp(64px,9vw,100px); }
.page-hero__ttl{ margin:0; font-weight:400; }
.page-hero__en{ display:block; font-family:var(--en); font-weight:500; text-transform:none;
  font-size:clamp(24px,4vw,44px); letter-spacing:.16em; line-height:1.25; color:var(--ink); }
.page-hero__ja{ display:block; font-family:var(--serif); font-weight:400;
  font-size:clamp(12px,1.25vw,15px); letter-spacing:.2em; color:var(--ink-2); margin-top:22px; }
.page-hero__line{ display:block; width:40px; height:1px; background:var(--ink-3); margin:30px auto 0; }
@media(max-width:640px){ .page-hero__en{ letter-spacing:.12em; } }

/* ================================================================
   進め方タイムライン（丸番号＋縦線＋サブカード）  .flow-tl
   ================================================================ */
.flow-tl{ max-width:960px; margin:8px auto 0; }
.flow-tl__step{ position:relative; padding-left:clamp(52px,7vw,84px); padding-bottom:clamp(44px,6vw,72px); }
.flow-tl__step:last-child{ padding-bottom:0; }
.flow-tl__step::before{ content:""; position:absolute; left:19px; top:8px; bottom:0; width:1px; background:var(--line); }
.flow-tl__step:last-child::before{ display:none; }
.flow-tl__num{ position:absolute; left:0; top:0; width:40px; height:40px; border-radius:50%;
  border:1px solid var(--ink); background:var(--paper); display:grid; place-items:center;
  font-family:var(--en); font-size:14px; font-weight:500; color:var(--ink); z-index:1; }
.flow-tl__en{ display:block; font-family:var(--en); font-size:11px; letter-spacing:.22em;
  text-transform:none; color:var(--ink-3); padding-top:2px; }
.flow-tl__ttl{ font-family:var(--serif); font-weight:600; font-size:clamp(19px,1.9vw,24px);
  margin:6px 0 0; line-height:1.5; }
.flow-tl__desc{ color:var(--ink-2); font-size:14.5px; line-height:2.0; margin:14px 0 0; max-width:66ch; }
.flow-tl__subs{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:24px; }
.flow-tl__sub{ background:var(--paper-2); border-radius:12px; padding:24px 26px; }
.flow-tl__sub-no{ display:inline-block; font-family:var(--en); font-size:11px; letter-spacing:.08em;
  border:1px solid var(--ink-3); border-radius:999px; padding:3px 12px; color:var(--ink-2); }
.flow-tl__sub h4{ font-family:var(--serif); font-weight:600; font-size:15px; margin:14px 0 0; }
.flow-tl__sub p{ color:var(--ink-2); font-size:13.5px; line-height:1.9; margin:9px 0 0; }
@media(max-width:720px){
  .flow-tl__subs{ grid-template-columns:1fr; gap:12px; }
  .flow-tl__num{ width:34px; height:34px; }
  .flow-tl__step::before{ left:16px; }
  .flow-tl__step{ padding-left:48px; }
}

/* ================================================================
   Journal 一覧（カードグリッド）  .jrnl-grid
   ================================================================ */
.jrnl-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(30px,4vw,56px) clamp(24px,3vw,44px); }
.jrnl-card{ display:block; position:relative; text-decoration:none; color:inherit; }
.jrnl-card__media{ position:relative; aspect-ratio:16/9; overflow:hidden; background:var(--fill); }
.jrnl-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.jrnl-card:hover .jrnl-card__media img{ transform:scale(1.04); }
/* サムネ右上にはみ出す縦書きハッシュタグ */
.jrnl-card__hash{ position:absolute; top:-12px; right:16px; z-index:3;
  writing-mode:vertical-rl; text-orientation:mixed;
  background:var(--ink); color:var(--paper); font-family:var(--en); font-size:12px;
  letter-spacing:.1em; line-height:1; padding:12px 7px; }
.jrnl-card__date{ display:block; font-family:var(--en); font-size:13px; letter-spacing:.06em; color:var(--ink-3); margin-top:18px; }
.jrnl-card__title{ font-family:var(--serif); font-weight:600; font-size:16px; line-height:1.75; margin:10px 0 0; }
.jrnl-card__cat{ color:var(--ink-2); font-size:13px; margin:10px 0 0; }
@media(max-width:900px){ .jrnl-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .jrnl-grid{ grid-template-columns:1fr; } }

/* ページャー（Journal一覧など） */
.pager{ display:flex; justify-content:center; align-items:center; gap:8px; flex-wrap:wrap;
  margin-top:clamp(44px,5vw,72px); }
.pager .page-numbers{ display:inline-flex; align-items:center; justify-content:center;
  min-width:46px; height:46px; padding:0 13px; font-family:var(--en); font-size:14px; letter-spacing:.04em;
  color:var(--ink-2); border:1px solid var(--line); transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease); }
.pager a.page-numbers:hover{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.pager .page-numbers.current{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.pager .page-numbers.dots{ border:0; min-width:24px; color:var(--ink-3); }


/* ================================================================
   Journal 詳細（左画像＋右メタ／下本文）  .jrnl-detail
   ================================================================ */
.jrnl-crumb{ font-family:var(--en); font-size:12px; letter-spacing:.08em; color:var(--ink-3); margin-bottom:clamp(28px,4vw,44px); }
.jrnl-crumb a{ color:var(--ink-3); text-decoration:none; }
.jrnl-crumb a:hover{ color:var(--ink); }
.jrnl-crumb .sep{ margin:0 10px; }
.jrnl-detail{ display:grid; grid-template-columns:0.85fr 1fr; gap:clamp(36px,5vw,80px); align-items:start; }
.jrnl-detail__media{ aspect-ratio:16/9; overflow:hidden; background:var(--fill); position:sticky; top:110px; }
.jrnl-detail__media img{ width:100%; height:100%; object-fit:cover; }
.jrnl-detail__title{ font-family:var(--serif); font-weight:600; font-size:clamp(22px,2.4vw,32px); line-height:1.6; margin:0; }
.jrnl-meta{ margin-top:clamp(30px,4vw,52px); }
.jrnl-meta__row{ display:grid; grid-template-columns:120px 1fr; gap:20px; align-items:baseline;
  border-top:1px solid var(--line); padding:22px 0; }
.jrnl-meta__row:last-child{ border-bottom:1px solid var(--line); }
.jrnl-meta__label{ font-family:var(--en); font-size:12px; letter-spacing:.12em; text-transform:none; color:var(--ink-3); }
.jrnl-meta__val{ font-size:14.5px; color:var(--ink); line-height:1.9; }
.jrnl-meta__tags span{ display:inline-block; margin-right:14px; color:var(--ink-2); }
/* 本文は右カラム(jrnl-detail__body)内。左写真sticky追従のため右カラム側に流す（#5074/#5075） */
.jrnl-content{ margin-top:clamp(28px,3.4vw,44px); font-size:15px; line-height:2.05; color:var(--ink-2); }
.jrnl-content:empty{ margin-top:0; } /* 本文が空の投稿は余白を出さない */
.jrnl-content p{ margin:0 0 1.6em; }
.jrnl-content h2,.jrnl-content h3{ font-family:var(--serif); color:var(--ink); margin:2em 0 .8em; line-height:1.6; }
.jrnl-content img{ max-width:100%; height:auto; }
.jrnl-content a{ color:var(--accent); text-decoration:underline; }
/* 本番journal本文の装飾クラスを移植（marker-y／add_ttl／add_ttl_02／box）＝下書き413件移植対応 */
.jrnl-content .marker-y{ background:linear-gradient(to bottom,transparent 80%,#fff59d 80%); }
.jrnl-content h2.add_ttl{ border-left:2px solid var(--ink); padding-left:15px; margin-top:2.2em; margin-bottom:.8em; }
.jrnl-content h3.add_ttl_02{ margin-top:1.8em; }
.jrnl-content h4,.jrnl-content h4.add_ttl_03{ font-size:1.05em; font-family:var(--serif); color:var(--ink); margin:1.6em 0 .6em; line-height:1.6; }
.jrnl-content .box{ padding:24px 24px 8px; background:var(--paper-2); margin:1.8em 0 2.2em; }
.jrnl-content ul{ list-style:disc; padding-left:1.4em; margin:0 0 1.6em; }
.jrnl-content ol{ list-style:decimal; padding-left:1.5em; margin:0 0 1.6em; }
.jrnl-content li{ margin:0 0 .5em; }
/* 右カラム上オフセット（#5076） */
.jrnl-detail__body{ margin-top:50px; }
/* 1行目メタは上線なし（#5077） */
.jrnl-meta__row:first-child{ border-top:0; }
/* Category値はリンク */
.jrnl-meta__val a{ color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line); transition:border-color .3s var(--ease); }
.jrnl-meta__val a:hover{ border-color:var(--ink); }
/* #6313/#6314/#6315 Journal詳細ヘッダー：Dateを見出し上・Categoryを見出し下・Tags廃止（2026-07-18） */
.jrnl-detail__date{ font-family:var(--en); font-size:13px; letter-spacing:.16em; color:var(--ink-3); margin-bottom:16px; }
.jrnl-detail__cat{ display:flex; align-items:baseline; gap:16px; margin-top:22px; padding-top:20px; border-top:1px solid var(--line); }
.jrnl-detail__cat-label{ font-family:var(--en); font-size:12px; letter-spacing:.12em; text-transform:none; color:var(--ink-3); }
.jrnl-detail__cat-val{ font-size:14.5px; color:var(--ink); line-height:1.9; }
.jrnl-detail__cat-val a{ color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line); transition:border-color .3s var(--ease); }
.jrnl-detail__cat-val a:hover{ border-color:var(--ink); }

/* 記事フッター：カテゴリー（#5079）＋前後記事（#5078） */
.jrnl-foot{ margin-top:clamp(44px,5vw,68px); }
.jrnl-foot__cat{ display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; padding-bottom:clamp(24px,3vw,36px); }
.jrnl-foot__label{ font-family:var(--en); font-size:12px; letter-spacing:.12em; text-transform:none; color:var(--ink-3); }
.jrnl-foot__pills{ display:flex; flex-wrap:wrap; gap:10px; }
.jrnl-pill{ display:inline-block; padding:7px 16px; border:1px solid var(--line); border-radius:999px; font-size:13px; color:var(--ink-2); text-decoration:none; transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease); }
.jrnl-pill:hover{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.jrnl-pn{ display:grid; grid-template-columns:1fr auto 1fr; gap:clamp(16px,3vw,44px); align-items:center; border-top:1px solid var(--line); padding-top:clamp(28px,3.4vw,44px); }
.jrnl-pn__item a{ display:flex; flex-direction:column; gap:8px; text-decoration:none; color:var(--ink); }
.jrnl-pn__item--prev{ align-items:flex-start; }
.jrnl-pn__item--next{ display:flex; justify-content:flex-end; text-align:left; } /* ブロックは右端／テキストは左読み */
.jrnl-pn__lbl{ font-family:var(--en); font-size:12px; letter-spacing:.1em; color:var(--ink-3); }
.jrnl-pn__ttl{ font-size:14px; line-height:1.7; color:var(--ink-2); max-width:26ch; transition:color .3s var(--ease); }
.jrnl-pn__item a:hover .jrnl-pn__ttl{ color:var(--ink); }
.jrnl-pn__all{ display:flex; flex-direction:column; align-items:center; gap:8px; text-decoration:none; color:var(--ink-3); font-family:var(--en); font-size:12px; letter-spacing:.14em; transition:color .3s var(--ease); }
.jrnl-pn__all:hover{ color:var(--ink); }
.jrnl-pn__grid{ display:grid; grid-template-columns:1fr 1fr; gap:3px; width:18px; }
.jrnl-pn__grid i{ display:block; aspect-ratio:1; background:currentColor; }
/* 関連記事（#5080） */
.jrnl-related{ border-top:1px solid var(--line); margin-bottom:150px; } /* フッターとの間隔（#5093） */
.jrnl-related__ttl{ font-family:var(--en); font-weight:500; text-transform:none; letter-spacing:.1em; font-size:clamp(24px,3vw,34px); color:var(--ink); margin:0 0 clamp(28px,3.4vw,44px); display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; }
.jrnl-related__ttl span{ font-family:var(--serif); font-size:14px; letter-spacing:.06em; color:var(--ink-3); }
@media(max-width:820px){
  .jrnl-detail{ grid-template-columns:1fr; gap:28px; }
  .jrnl-detail__media{ position:static; aspect-ratio:16/9; }
  .jrnl-detail__body{ margin-top:0; }
  .jrnl-pn{ gap:12px; }
  .jrnl-pn__ttl{ font-size:12px; max-width:18ch; }
}

/* ================================================================
   サービス詳細：fluence風セクション  .svc-intro / .chk-list / .feat3
   ================================================================ */
.svc-intro{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,72px); align-items:center; }
.svc-intro__media{ aspect-ratio:4/3; overflow:hidden; background:var(--fill); }
.svc-intro__media img{ width:100%; height:100%; object-fit:cover; }
.svc-intro__body .sec-title{ margin:14px 0 0; }
.svc-intro__body .lead{ margin-top:22px; }
@media(max-width:820px){ .svc-intro{ grid-template-columns:1fr; } .svc-intro__media{ aspect-ratio:16/10; } }

.chk-list{ list-style:none; margin:clamp(36px,4vw,56px) auto 0; padding:0; max-width:1000px;
  display:grid; grid-template-columns:1fr 1fr; gap:0 clamp(32px,5vw,72px); }
.chk{ display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:start;
  border-bottom:1px solid var(--line); padding:24px 0; }
.chk__ico{ width:26px; height:26px; border-radius:50%; border:1px solid var(--accent); color:var(--accent);
  display:grid; place-items:center; font-size:12px; line-height:1; flex:none; margin-top:5px; } /* websupport #5290 */
.chk h3{ font-family:var(--serif); font-weight:600; font-size:20px; line-height:34px; margin:0; } /* websupport #5274→#5276→#5289 */
.chk p{ color:var(--ink-2); font-size:14px; line-height:26px; margin:8px 0 0; }
@media(max-width:720px){ .chk-list{ grid-template-columns:1fr; } }

.feat3{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(28px,3.5vw,48px); margin-top:clamp(36px,4vw,56px); }
.feat__media{ aspect-ratio:4/3; overflow:hidden; background:var(--fill); }
.feat__media img{ width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.feat:hover .feat__media img{ transform:scale(1.04); }
.feat__en{ display:block; font-family:var(--en); font-size:11px; letter-spacing:.22em; text-transform:none; color:var(--ink-3); margin-top:20px; }
.feat__title{ font-family:var(--serif); font-weight:600; font-size:20px; line-height:40px; margin:10px 0 0; } /* websupport #5275 */
.feat__desc{ color:var(--ink-2); font-size:14px; line-height:1.95; margin:12px 0 0; }
@media(max-width:820px){ .feat3{ grid-template-columns:1fr; max-width:520px; margin-inline:auto; } }

/* 進め方タイムライン：ステップ内の外部誘導リンク */
.flow-tl__link{ margin-top:24px; padding:22px 26px; background:var(--paper-2); border-radius:12px;
  display:flex; flex-wrap:wrap; align-items:center; gap:16px 28px; }
.flow-tl__link p{ margin:0; color:var(--ink-2); font-size:13.5px; line-height:1.9; flex:1 1 300px; }

/* ================================================================
   ヘッダー：Contact(塗り)＋Menuボタン／全画面ナビ・オーバーレイ
   ================================================================ */
.header-actions{ display:flex; align-items:center; gap:12px; margin-left:22px; }
.menu-pill{ display:inline-flex; align-items:center; gap:11px; cursor:pointer;
  background:transparent; border:1px solid var(--ink); border-radius:6px; padding:10px 16px;
  font-family:var(--en); font-size:12px; font-weight:500; letter-spacing:.14em; color:var(--ink);
  transition:background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease); }
.menu-pill__dots{ display:inline-flex; gap:3px; }
.menu-pill__dots i{ width:3px; height:3px; border-radius:50%; background:currentColor; }
.menu-pill:hover{ background:var(--ink); color:var(--paper); }
/* ヒーロー上（未スクロール・白ヘッダー）は白 */
.site-header:not(.is-scrolled) .menu-pill{ border-color:rgba(255,255,255,.6); color:#fff; }
.site-header:not(.is-scrolled) .menu-pill:hover{ background:#fff; color:var(--ink); }

/* 旧gnavドロワー挙動を無効化（全画面オーバーレイに置換） */
body.nav-open .gnav{ position:static; inset:auto; width:auto; z-index:auto;
  flex-direction:row; background:none; box-shadow:none; transform:none; padding:0; margin-left:auto; overflow:visible; }

/* 全画面オーバーレイ */
.nav-overlay{ position:fixed; inset:0; z-index:200; background:var(--paper);
  opacity:0; visibility:hidden; pointer-events:none; transition:opacity .5s var(--ease), visibility .5s var(--ease); }
body.nav-open .nav-overlay{ opacity:1; visibility:visible; pointer-events:auto; }
.nav-overlay__brand{ position:absolute; top:clamp(14px,1.8vw,26px); left:var(--gut); z-index:2; }
.nav-overlay__brand img{ width:min(200px,44vw); height:auto; }
.nav-close{ position:absolute; top:clamp(18px,2.2vw,30px); right:var(--gut); z-index:2;
  display:inline-flex; align-items:center; gap:12px; background:none; border:0; cursor:pointer;
  font-family:var(--en); font-size:12px; letter-spacing:.18em; text-transform:none; color:var(--ink); }
.nav-close__x{ position:relative; width:34px; height:34px; border-radius:50%; border:1px solid var(--ink); transition:background .3s var(--ease); }
.nav-close__x::before,.nav-close__x::after{ content:""; position:absolute; top:50%; left:50%; width:13px; height:1px; background:var(--ink); }
.nav-close__x::before{ transform:translate(-50%,-50%) rotate(45deg); }
.nav-close__x::after{ transform:translate(-50%,-50%) rotate(-45deg); }
.nav-close:hover .nav-close__x{ background:var(--ink); }
.nav-close:hover .nav-close__x::before,.nav-close:hover .nav-close__x::after{ background:var(--paper); }
.nav-overlay__inner{ height:100%; display:grid; grid-template-columns:0.82fr 1.18fr; gap:clamp(40px,6vw,96px); align-items:center; }
.nav-overlay__media{ height:min(66vh,600px); overflow:hidden; background:var(--fill); }
.nav-overlay__media img{ width:100%; height:100%; object-fit:cover; }
.nav-menu{ list-style:none; margin:0; padding:0; column-count:2; column-gap:clamp(28px,4vw,64px); }
.nav-menu li{ break-inside:avoid; border-bottom:1px solid var(--line-2); }
.nav-menu a{ display:flex; flex-direction:column; gap:3px; padding:17px 4px; text-decoration:none; position:relative; }
.nav-menu a::after{ content:""; position:absolute; right:6px; top:24px; width:6px; height:6px; border-radius:50%; background:var(--accent); opacity:.5; transition:opacity .3s; }
.nav-menu a:hover::after{ opacity:1; }
.nav-menu__en{ font-family:var(--en); font-size:clamp(18px,1.7vw,22px); font-weight:500; letter-spacing:.04em; color:var(--ink); transition:color .3s; }
.nav-menu a:hover .nav-menu__en{ color:var(--accent); }
.nav-menu__ja{ font-family:var(--serif); font-size:11.5px; letter-spacing:.08em; color:var(--ink-3); }
.nav-menu__foot{ margin-top:clamp(30px,4vw,50px); }
@media(max-width:820px){
  .gnav{ display:none; }
  .header-actions{ margin-left:auto; }
  .nav-overlay__inner{ grid-template-columns:1fr; align-items:start; padding-block:104px 48px; overflow-y:auto; }
  .nav-overlay__media{ display:none; }
  .nav-menu{ column-count:1; }
}

/* ヘッダー追補（コメント/指示反映 2026-07-11） */
/* 下層ヒーロー直後のセクションは上余白ゼロ＝二重余白回避（#4929の意図を .section=150/150 と両立） */
.page-hero + .section{ padding-top:0; }
/* ヘッダーの Contact ボタンを Menu(.menu-pill) と同サイズ・同形に揃える */
.header-actions .btn--sm{ padding:10px 16px; border-radius:6px; line-height:normal; }

/* =============================================================
   About「Who we are」＝左テキスト固定＋右 画像マルキー（右→左・フルブリード）
   参考: takenaka-foodware.jp
   ============================================================= */
.who-we-are{ overflow:hidden; }
.who-we-are{ overflow-x:clip; } /* セクション右端でハードクリップ＝環境依存の横スクロールを確実に断つ（sticky非破壊） */
.wwa{ display:grid; grid-template-columns:minmax(300px,36%) minmax(0,1fr); align-items:center;
  gap:clamp(28px,4vw,64px); padding-left:var(--gut); }
.wwa__text{ max-width:520px; }
.wwa__marquee{ overflow:hidden; min-width:0; max-width:100%; } /* grid列の自動膨張を封じる＝Safari等の横スクロール防止 */
.wwa__track{ display:flex; width:max-content; will-change:transform;
  animation:wwaScroll 48s linear infinite; }
.wwa__track img{ height:clamp(260px,32vw,440px); width:auto; display:block; flex:none;
  margin-right:clamp(16px,1.6vw,26px); object-fit:cover; background:var(--paper-2); }
@keyframes wwaScroll{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
.wwa__marquee:hover .wwa__track{ animation-play-state:paused; }
@media(prefers-reduced-motion:reduce){ .wwa__track{ animation:none; } }
@media(max-width:860px){
  .wwa{ grid-template-columns:minmax(0,1fr); gap:26px; padding-left:0; }
  .wwa__text{ padding:0 var(--gut); max-width:none; }
  .wwa__track img{ height:clamp(200px,52vw,300px); }
}

/* =============================================================
   About「3つのこと」＝縦積み・左画像／右テキスト＋縦ラベル（参考: takenaka concept）
   ============================================================= */
.phi-rows{ display:flex; flex-direction:column; gap:clamp(64px,9vw,140px); }
.phi-row{ display:grid; grid-template-columns:auto minmax(0,46%) 1fr;
  align-items:center; gap:clamp(24px,4vw,72px); }
.phi-row__index{ writing-mode:vertical-rl; text-orientation:mixed; align-self:center;
  font-family:var(--serif); font-size:13px; letter-spacing:.34em; color:var(--ink-3); }
.phi-row__media{ overflow:hidden; }
.phi-row__media img{ display:block; width:100%; aspect-ratio:4/3.4; object-fit:cover;
  background:var(--paper-2); }
.phi-row__no{ display:block; font-family:var(--en); font-size:13px; font-weight:500;
  letter-spacing:.2em; color:var(--ink-3); }
.phi-row__en{ margin:14px 0 0; font-family:var(--en); font-weight:500;
  font-size:clamp(26px,3vw,40px); letter-spacing:.06em; line-height:1.1; color:var(--ink); }
.phi-row__ja{ display:block; font-family:var(--serif); font-weight:400;
  font-size:clamp(16px,1.4vw,19px); letter-spacing:.04em; color:var(--ink); margin-top:14px; margin-bottom:20px; }
.phi-row__desc{ margin-top:22px; color:var(--ink-2);
  font-size:15px; line-height:30px; max-width:46ch; }
@media(max-width:860px){
  .phi-rows{ gap:clamp(44px,10vw,72px); }
  .phi-row{ grid-template-columns:1fr; gap:16px; }
  .phi-row__index{ writing-mode:horizontal-tb; letter-spacing:.24em; }
  .phi-row__desc{ max-width:none; }
}

/* ===== SP 全体調整（2026-07-11）===== */
/* contact 実績メトリクス＝フッター重なし(-90px)で最終行が切れる→下余白で吸収 */
/* （padding-bottomは上のルールに付与済み） */
/* 長文リード（bs-lead / セクション導入lead）の desktop用<br>はSPでは自然折返しに＝孤立行防止 */
@media(max-width:640px){
  .bs-lead br, .sec-head .lead br{ display:none; }
}

/* ===================================================================
   websupport Site#125 反映（2026-07-12 / #5193-5219）
   ※.cta 系は front-page/サブページ統一（社長指示）と併せて全ページ共通
   =================================================================== */
/* #5193 JOURNAL見出し（大・トップ左）を太く */
.jfeature__title{ font-weight:700; }
/* #5194 JOURNAL見出し（小・リスト右）を太く */
.jitem__title{ font-weight:700; }
/* #5195 サービスシーンカード見出し サイズ・行間 */
.scene-card__title{ font-size:22px; line-height:40px; }
/* #5196 シーンカード VIEW MORE 細く */
.scene-card__more{ font-weight:300; }
/* #5199 セクション見出し 太く・字間 */
.sec-title{ font-weight:300; letter-spacing:2px; }
/* #5200/#5205 lead-wide 細く・字間 */
.lead-wide{ font-weight:300; letter-spacing:2px; }
/* #5201/#5206/#5210 lead サイズ・太さ・行間・字間 */
.lead{ font-size:15px; font-weight:300; line-height:30px; letter-spacing:2px; }
/* #5202 svc-rowx 英字ラベル削除 */
.svc-rowx__en{ display:none; }
/* #5203 about（page-id-515）のこの svc-rowx 見出しだけ 太く・字間 */
body.page-id-515 .svc-rowx__title{ font-weight:700; letter-spacing:2px; }
/* #5204 svc-rowx 本文 字間 */
.svc-rowx__desc{ letter-spacing:2px; }
/* #5207 phi-row インデックス 大きく・濃く */
.phi-row__index{ font-size:14px; color:#141414; }
/* #5208 phi-row 和文サブ サイズ・太さ・余白 */
.phi-row__ja{ font-size:17px; font-weight:300; margin:15px 0 40px; }
/* #5209 phi-row 本文 字間 */
.phi-row__desc{ letter-spacing:2px; }
/* #5213 下層ヒーロー英字 字間 7px→5px 相当 */
.page-hero__en{ letter-spacing:.11em; }
/* #5214 サービス特集の通し番号 削除 */
.svc-feature__no{ display:none; }
/* #5215 サービス特集 本文 細く・字間 */
.svc-feature__desc{ font-weight:300; letter-spacing:2px; }
/* #5216→#5237 サービス特集 見出し列幅（339→700→500pxに再調整） */
.svc-feature__row{ grid-template-columns:500px minmax(0,1fr) auto; }
@media(max-width:920px){ .svc-feature__row{ grid-template-columns:1fr; } }
/* #5217 CTA 見出し 20px・上余白詰め（全CTA共通） */
.cta h2{ font-size:20px; margin:0 0 20px; }
/* #5218 CTA kicker 行間 */
.cta .kicker{ line-height:54px; }
/* #5219 CTA 本文 細く・字間 */
.cta p{ font-weight:300; letter-spacing:2px; }
/* #5197/#5211/#5212 CTAボタンを大きく（幅約2倍） */
.cta .btn{ min-width:630px; padding:32px 48px; font-size:18px; gap:16px; justify-content:center; } /* #6141 約2倍サイズ＋font拡大／#6311 font 16→18px */
/* #5198 JOURNAL一覧ボタンを大きく（幅約2倍） */
#journal .btn-row .btn{ min-width:340px; justify-content:center; }
/* #5231 svc-rowx メディア枠に動画を入れた場合も画像と同挙動で敷き詰める */
.svc-rowx__media video{ width:100%; height:100%; object-fit:cover; display:block; }
/* #5291 左端の縦組み装飾ラベル（Issues / What we do / Works 等）を全ページ非表示 */
.vmark{ display:none; }

/* #5328 SP改行用（デフォルトは非表示＝PCは1行）。SPで有効化はmedia内 */
.br-sp{ display:none; }
/* ===== websupport #5307-5317 / #5328-5338 スマホ版 個別調整＋社長指示（2026-07-12）===== */
@media(max-width:640px){
  /* #5307 ヒーロー見出し（この要素のみ） */
  body.home .hero-full--center h1{ font-size:20px; line-height:36px; }
  /* #5308 ヒーローサブ（この要素のみ） */
  body.home .hero-full--center .hero-sub{ font-size:12px; font-weight:300; line-height:20px; }
  /* #5309/#5310→#5329/#5330 ブランドストーリー ステートメント2行（inline上書きのため!important） */
  body.home #about .bs-statement{ font-size:18px !important; line-height:36px !important; }
  /* #5311 ブランドストーリー リード（行間＋左右30px） */
  body.home #about .bs-lead{ line-height:30px; padding:0 40px; } /* #6342/#6396 行間28→30 */
  /* #5312→社長指示：SPはサービスカードを画面いっぱい（左右余白なし・全幅ブリード）＋カード間の余白なし */
  body.home #service .scene-grid{ gap:0; width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); }
  /* #5313→#5333→#6343 シーンカード見出し（全ページ・全同一クラス） */
  .scene-card__title{ font-size:30px; }
  /* #5314 Works 縦積みの間隔 */
  body.home #works .works-stack{ gap:20px; } /* #6345 40→20 */
  /* #5315 JOURNAL コンテナ左右余白30px */
  body.home #journal > .container{ padding-left:30px; padding-right:30px; }
  /* #5316 フッター(#company) コンテナ左右余白30px */
  #company > .container{ padding-left:30px; padding-right:30px; }
  /* #5317 フッターロゴを大きく（160→250px） */
  .footer-brand .fname img{ width:250px; }
  /* 社長指示：SPはフッターのサイトマップ（リンク3列）を非表示 */
  .footer-col{ display:none; }
  /* #5328 ヒーロー見出しのSP改行を有効化 */
  .br-sp{ display:inline; }
  /* #5331 ブランドストーリー内側paddingを圧縮（inline上書き!important） */
  body.home #about .brandstory__inner{ padding:40px 24px !important; }
  /* #5332 #about 下マージン 100→80px（inline上書き!important） */
  body.home #about{ margin-bottom:80px !important; }
  /* #5334 JOURNALリスト項目 a の内側gapを20pxに（全ページ・全同一クラス） */
  .jitem a{ gap:20px; }
  /* #5335 #journal 下paddingを150→100pxに */
  body.home #journal{ padding-top:100px !important; padding-bottom:150px !important; } /* #6352 下100→150 */
  /* #5336 footer-top 下padding30px・下線を消す */
  #company .footer-top{ padding-bottom:30px; border-bottom-width:0; }
  /* #5337/#5338 ボタン文字を14pxに（全ページ・全btn） */
  .btn{ font-size:14px; }
}

/* ===== websupport #5339-5348 /about/ スマホ版 個別調整（2026-07-12）=====
   他ページの同一クラスに波及させないため about（page-id-515）にスコープ。inlineは!importantで上書き。 */
@media(max-width:640px){
  /* #5339 who-we-are 見出し（inline上書き） */
  body.page-id-515 .who-we-are .sec-title{ font-size:24px !important; line-height:40px !important; }
  /* #5340 who-we-are リード（inline上書き） */
  body.page-id-515 .who-we-are .lead-wide{ font-size:14px !important; line-height:28px !important; }
  /* #5341/#5345/#5348 about内の .lead 一律 14px/行間28px */
  body.page-id-515 .lead{ font-size:14px; line-height:28px; }
  /* #5342 svc-rowx 見出し */
  body.page-id-515 .svc-rowx__title{ font-size:28px; line-height:50px; }
  /* #5343 svc-rowx 本文（inline上書き） */
  body.page-id-515 .svc-rowx__desc{ font-size:14px !important; line-height:28px !important; }
  /* #5344 section3下部 lead-wide（inline上書き・13px） */
  body.page-id-515 #main > section:nth-of-type(3) > div:nth-of-type(3) > p{ font-size:13px !important; line-height:28px !important; }
  /* #5346 phi-row 本文（全ページ・全同一クラス） */
  .phi-row__desc{ font-size:14px; line-height:28px; }
  /* #5347 phi-rows の縦間隔（全ページ・全同一クラス） */
  .phi-rows{ gap:60px; }
}

/* ===== websupport #5482-5487 サービス詳細ほか スマホ版（全ページ・同一クラス）=====
   /service/marketing/ 起点。bare の p/h3 でなく .chk 配下・共有クラスにスコープ。 */
@media(max-width:640px){
  /* #5485/#5486 .container 両サイド padding 30px（全ページ共通・スマホ標準） */
  .container{ padding-inline:30px; }
  /* #5482 .lead 16px/32px → 14px/28px（全ページ） */
  .lead{ font-size:15px; line-height:30px; }
  /* #5484 .chk h3 20px → 18px（全ページ） */
  .chk h3{ font-size:18px; }
  /* #5483 .chk p 13px/24.7px → 14px/28px（全ページ） */
  .chk p{ font-size:14px; line-height:26px; }
  /* #5487 .feat3 gap 28px → 60px（全ページ） */
  .feat3{ gap:60px; }
}

/* websupport #6141 CTAボタン SP：全幅・約2倍高さ・font拡大（2026-07-18） #6141 SP */
@media(max-width:640px){
  .cta .btn{ min-width:0; width:100%; padding:24px 20px; font-size:16px; } /* #6311→#6350 SP font 18→16px */
}

/* websupport #6241/#6362 /journal/ 記事一覧セクション：上padding0・下padding250px（この要素のみ） */
.journal-articles { padding-top: 0; padding-bottom: 250px; }


/* ===== websupport #6341-6355 トップ スマホ版 個別調整（2026-07-18・batch2）===== */
@media(max-width:640px){
  /* #6341 Scroll指標をヒーロー下部中央へ（縦組み→横組み・画面下中央固定） */
  .side-scroll{ position:fixed; left:50%; right:auto; bottom:18px; transform:translateX(-50%);
    writing-mode:horizontal-tb; text-orientation:mixed; margin:0; flex-direction:column; }
  /* #6344 シーンカード本文（全ページ・全同一クラス） 12.5→13px */
  .scene-card__sub{ font-size:13px; }
  /* #6346 works-pickup キャプション行間 7→5px（全ページ・全同一クラス） */
  .works-pickup__cap{ gap:5px; }
  /* #6347 トップJOURNAL journal-layout 縦間隔 34→40px（この要素のみ） */
  body.home #journal .journal-layout{ gap:40px; }
  /* #6348 トップJOURNAL リスト項目サムネ幅 150px（jitem サムネ列） */
  body.home #journal .jitem a{ grid-template-columns:1fr; gap:14px; } /* #6480 全幅縦カード */
  /* #6349 トップJOURNAL 一覧ボタンを80%サイズに */
  body.home #journal .btn-row .btn{ transform:scale(.8); transform-origin:center; }
  /* #6351 CTA 背景画像を上へ50px（この要素のみ） */
  .cta__bg img{ margin-top:0; } /* #6351→#6508 margin除去（全ページ統一） */
  /* #6353 CTA kicker 30.4→34px（当該要素） */
  .cta .kicker{ font-size:34px; }
  /* #6354 CTA 見出しh2 20→14px（当該要素） */
  .cta h2{ font-size:14px; }
  /* #6355 フッター footer-bottom padding 30 0 0 0 → 0 0 20 0（この要素のみ） */
  .footer-bottom{ padding:0 0 20px; } /* #6355→全ページ統一 */
}


/* ===== websupport #6370-6373 ＋ 社長指示：トップ スマホ版（2026-07-18・batch3）===== */
@media(max-width:640px){
  /* 社長指示：フッター上CTA・フッターの上部角丸 60→30px（SP） */
  .cta{ border-radius:30px 30px 0 0; }
  .site-footer{ border-radius:30px 30px 0 0; }
  /* #6370 .jdate 13→12px・行間25.4→20px（全ページ同一クラス） */
  .jdate{ font-size:12px; line-height:20px; }
  /* #6371 .jitem__title 16→14px・行間27.2→24px（全ページ同一クラス） */
  .jitem__title{ font-size:18px; line-height:34px; } /* #6371→#6491 */
  /* #6372 トップJOURNAL 一覧ボタン font 14→16px（当該のみ） */
  body.home #journal .btn-row .btn{ font-size:16px; }
  /* #6373 トップJOURNAL btn-row 幅 354→400px（当該のみ・狭幅は100%で溢れ回避） */
  body.home #journal .btn-row{ width:400px; max-width:100%; margin-inline:auto; }
}


/* ===== websupport #6374-6389 トップ/journal スマホ版（2026-07-18・batch4）===== */
@media(max-width:640px){
  /* #6397-6412 bs-lead のSP改行(br-sp)を有効化（.bs-lead br{display:none}に詳細度で勝つ） */
  .bs-lead br.br-sp{ display:inline; }
  /* #6374/#6381 journal-list gap 20→30（全ページ同一クラス） */
  .journal-list{ gap:40px; } /* #6374→#6490 */
  /* #6375/#6380 jfeature__body 下margin 30（front/journalとも同値） */
  .jfeature__body{ margin-bottom:30px; }
  /* #6376 jfeature__title margin 12/16→10/10（全ページ同一クラス） */
  .jfeature__title{ margin:10px 0 10px; }
  /* #6379(+#6378) sec-bigtitle__ja 14→12px・字間3.4→1px（全ページ同一クラス） */
  .sec-bigtitle__ja{ font-size:12px; letter-spacing:1px; }
  /* #6377 front #works sec-bigtitle(h2) 36→40px（当該のみ） */
  body.home #works .sec-bigtitle{ font-size:40px; }
  /* #6382(+#6348) journalリスト(.jitem)サムネ列150px（front/journal共通） */
  .jitem a{ grid-template-columns:1fr; gap:14px; } /* #6480 全幅縦カード（写真上・下に日付/タイトル/カテゴリ）*/
  /* #6383 jrnl-card__cat 13→12px */
  .jrnl-card__cat{ font-size:12px; }
  /* #6384/#6387 jrnl-grid 行gap 30→50（列24維持） */
  .jrnl-grid{ gap:50px 24px; }
  /* #6385 related card 先頭タグ(#カテゴリ)を非表示 */
  .jrnl-card__tags .jrnl-card__tag:first-child{ display:none; }
  /* #6386 jrnl-card__tag 14.5→12px（全ページ同一クラス） */
  .jrnl-card__tag{ font-size:12px; }
  /* #6388 jrnl-card__title margin-top 10→20px（全ページ同一クラス） */
  .jrnl-card__title{ margin:9px 0 13px; font-size:18px; } /* #6388/#6492/#6494 */
  /* #6389 jrnl-card__client 14.5→12px（全ページ同一クラス） */
  .jrnl-card__client{ font-size:12px; }
}

/* websupport #6419 CTA背景画像 SP下padding100px（全ページ・.cta__bg img） */
@media(max-width:640px){
  .cta__bg img{ padding-bottom:0; } /* #6419→#6508→#6512 170→0 */
}

/* 社長指示：フッターSNSアイコン(ig/x/note＝リンク未設定)を非表示 */
.footer-sns{ display:none; }

/* お問い合わせフォーム 送信ステータス */
.form-status{ margin-top:16px; font-size:14px; line-height:1.8; }
.form-status.is-ok{ color:#2b7a3f; }
.form-status.is-err{ color:#c0392b; }
#tbContactForm.is-sending{ opacity:.65; pointer-events:none; }


/* ===== websupport #6481-6483 ＋ CTA/フッター全ページ統一 スマホ版（2026-07-19）===== */
@media(max-width:640px){
  /* #6481 CTA 内側padding →80/100（SP全ページ統一・body.homeの120/180にも勝たせる） */
  .cta__inner, body.home .cta__inner{ padding:80px 0 100px; }
  /* #6482 phi-row__en 26→36px・行間70px（全ページ同一クラス） */
  .phi-row__en{ font-size:36px; line-height:70px; }
  /* #6483 phi-row__ja 17→16px・行間30px（全ページ同一クラス） */
  .phi-row__ja{ font-size:16px; line-height:30px; }
}

/* ===== websupport #6484-6485 スマホ版（2026-07-19）===== */
@media(max-width:640px){
  /* #6484 .sec-title 27.2→24px・行間40px（全ページ同一クラス） */
  .sec-title{ font-size:24px; line-height:40px; }
  /* #6485 .svc-feature__title 字間0.4→1px（全ページ同一クラス） */
  .svc-feature__title{ letter-spacing:1px; }
}

/* ===== websupport #6493-6497 journal スマホ版（2026-07-19）===== */
@media(max-width:640px){
  /* #6493 .jrnl-card__cat を jtagピル風に */
  .jrnl-card__cat{ display:inline-block; border:1px solid var(--line); border-radius:999px; padding:5px 16px; font-size:12px; letter-spacing:.04em; color:var(--ink-2); }
  /* #6495 .jrnl-detail__date 13→12px・字間2.1→1px（全ページ） */
  .jrnl-detail__date{ font-size:12px; letter-spacing:1px; }
  /* #6496 .jrnl-detail__title 22→20px・行間38（全ページ） */
  .jrnl-detail__title{ font-size:20px; line-height:38px; }
  /* #6497 journal詳細カテゴリリンク 14.5→12px（bare a波及回避） */
  .jrnl-detail__cat-val a{ font-size:12px; }
}

/* ===== websupport #6498-6501 journal記事本文 スマホ版（2026-07-19・jrnl-content配下に限定）===== */
@media(max-width:640px){
  /* #6498 本文p 15→14px・行間28（全ページ／jrnl-content配下） */
  .jrnl-content p{ font-size:14px; line-height:28px; }
  /* #6500 h2.add_ttl 22.5→20px・太700・字間1px */
  .jrnl-content h2.add_ttl{ font-size:20px; font-weight:700; letter-spacing:1px; }
  /* #6501 h3.add_ttl_02 17.6→18px・太700 */
  .jrnl-content h3.add_ttl_02{ font-size:16px; font-weight:700; line-height:30px; } /* #6501→#6502 */
}

/* ===== websupport #6503-6504 関連記事カード スマホ版（.jrnl-related限定）===== */
@media(max-width:640px){
  /* #6503 タグを見出しの上へ＋12px */
  .jrnl-related .jrnl-card{ display:flex; flex-direction:column; }
  .jrnl-related .jrnl-card__media{ order:0; }
  .jrnl-related .jrnl-card__sep{ order:1; }
  .jrnl-related .jrnl-card__tags{ order:2; font-size:12px; margin-top:12px; }
  .jrnl-related .jrnl-card__title{ order:3; }
  .jrnl-related .jrnl-card__client{ order:4; }
  /* #6504 client を jtagピル風に */
  .jrnl-related .jrnl-card__client{ display:inline-block; align-self:flex-start; border:1px solid var(--line); border-radius:999px; padding:5px 16px; font-size:12px; letter-spacing:.04em; color:var(--ink-2); }
}

/* ===== websupport #6506 journal関連セクション 下padding 0（SP・当該のみ）===== */
@media(max-width:640px){
  .jrnl-related{ padding-bottom:0; }
}

/* ===== websupport #6507/#6509 トップ スマホ版（2026-07-19）===== */
@media(max-width:640px){
  /* #6507 トップJOURNAL feature body 下margin 30→0（当該のみ） */
  body.home #journal .jfeature__body{ margin-bottom:0; }
  /* #6509 フッター会社説明文 13→12px（当該のみ） */
  #company .footer-brand p{ font-size:12px; }
}

/* ===== websupport #6511 CTAボタン 下margin80px（SP・全ページ）===== */
@media(max-width:640px){
  .cta .btn{ margin-bottom:80px; }
}

/* 社長指示：SPフッター会社説明文を幅100%（max-width:34ch解除）*/
@media(max-width:640px){
  .footer-brand p{ max-width:100%; }
}