/*
Theme Name: null
Theme URI: https://blog.syukyakushien.com/
Description: 個人事業「null」のコーポレート＋オウンドメディア統合テーマ。白×黒、Sulphur Point＋ヒラギノ、余白広め。コーポレート面（TOP/採用/お問い合わせ/規約/運営者情報）とブログ面（syukyaku-blog の機能を継承）を同一デザインシステムで提供する。
Author: null
Version: 2.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: syukyaku-blog
*/

/* =========================================================
   デザイントークン / ベース
   ========================================================= */
:root {
  color-scheme: light;
  --bg:#ffffff;
  --ink:#0b0b0b;
  --soft:#F9F9F9;
  --line:rgba(11,11,11,.14);
  --line-soft:rgba(11,11,11,.08);
  --en:"Sulphur Point","Helvetica Neue",sans-serif;
  --jp:"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP","Yu Gothic",Meiryo,sans-serif;
  --gutter:clamp(20px,5vw,72px);
  --maxw:1360px;
  --content:820px;
  --sec-pad:clamp(60px,9.6vh,112px);
}
* { margin:0; padding:0; box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { background:var(--bg); color:var(--ink); font-family:var(--en),var(--jp);
  -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img { max-width:100%; height:auto; }
a { color:inherit; }
button { font:inherit; }
.container { width:100%; max-width:var(--maxw); margin:0 auto; padding-left:var(--gutter); padding-right:var(--gutter); }
.screen-reader-text { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* サブページはヘッダー高ぶん本文を下げる（フロントはヒーローがあるので不要） */
body:not(.is-front) { padding-top:clamp(68px,10vw,100px); }

/* =========================================================
   ヘッダー（共通）
   ========================================================= */
.brand { font-family:var(--en); font-weight:700; font-size:clamp(24px,2.6vw,34px); letter-spacing:.14em; line-height:1;
  color:var(--ink); text-decoration:none; transition:color .3s; }

/* サブページ: スクロールアップで出現する固定ヘッダー */
.site-header { position:fixed; inset:0 0 auto 0; z-index:60; width:100%; max-width:var(--maxw); margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; padding:clamp(16px,2.6vw,30px) var(--gutter);
  background:rgba(255,255,255,.82); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  transition:transform .4s cubic-bezier(.2,.7,.2,1); }
.site-header.hide { transform:translateY(-105%); }
.site-header .burger { display:flex; }

/* フロント: ヒーロー内の透明ヘッダー（PCナビ付き） */
.site-header--hero { position:absolute; inset:0 0 auto 0; max-width:var(--maxw); margin:0 auto; z-index:60;
  display:flex; align-items:center; justify-content:space-between; padding:clamp(20px,3vw,40px) var(--gutter); }
.site-header--hero .brand { font-size:clamp(26px,2.6vw,36px); }
.nav { display:flex; align-items:center; gap:clamp(18px,2.4vw,40px); font-family:var(--jp); font-weight:700;
  font-size:clamp(13px,1vw,15px); letter-spacing:.06em; color:var(--ink); }
.nav a { color:inherit; text-decoration:none; opacity:.8; transition:opacity .25s; }
.nav a:hover { opacity:1; }
.nav .nav-cta { opacity:1; border:1px solid var(--ink); border-radius:999px; padding:.7em 1.6em;
  transition:background .3s, color .3s; }
.nav .nav-cta:hover { background:var(--ink); color:#fff; }

/* ハンバーガー（黒丸に白2本） */
.burger { display:flex; width:50px; height:50px; border-radius:50%; background:var(--ink); border:none; cursor:pointer;
  flex-direction:column; align-items:center; justify-content:center; gap:7px; padding:0; }
.burger span { display:block; width:18px; height:2px; background:#fff; border-radius:1px;
  transition:transform .35s cubic-bezier(.2,.7,.2,1); }
.burger.open span:nth-child(1){ transform:translateY(4.5px) rotate(45deg); }
.burger.open span:nth-child(2){ transform:translateY(-4.5px) rotate(-45deg); }
/* フロントのヒーローヘッダーではスマホのみバーガー表示 */
.site-header--hero .burger { display:none; width:52px; height:52px; }
@media (max-width:640px){ .site-header--hero .nav{ display:none; } .site-header--hero .burger{ display:flex; } }

/* モバイルメニュー（全画面・黒） */
.mobile-menu { position:fixed; inset:0; z-index:50; background:var(--ink); color:#fff;
  display:flex; flex-direction:column; justify-content:center; gap:clamp(22px,4vh,34px); padding:0 var(--gutter);
  opacity:0; visibility:hidden; transition:opacity .4s ease, visibility .4s; }
.mobile-menu.open { opacity:1; visibility:visible; }
.mobile-menu a { color:#fff; text-decoration:none; font-family:var(--jp); font-weight:700;
  font-size:clamp(22px,6.4vw,30px); letter-spacing:.04em; }
.mobile-menu .mm-cta { display:inline-flex; align-self:flex-start; border:1px solid rgba(255,255,255,.6); border-radius:999px;
  padding:.7em 1.6em; font-size:clamp(17px,4.8vw,21px); margin-top:.4em; }
.mobile-menu .mm-legal { margin-top:clamp(28px,6vh,48px); display:flex; gap:1.6em; }
.mobile-menu .mm-legal a { font-weight:400; font-size:12px; opacity:.55; }
body.menu-open { overflow:hidden; }
body.menu-open .brand { color:#fff; }
body.menu-open .site-header { background:transparent; -webkit-backdrop-filter:none; backdrop-filter:none; }

/* フロント: スクロールアップで出てくる固定ヘッダー */
.reveal-header { position:fixed; inset:0 0 auto 0; z-index:70; width:100%; max-width:var(--maxw); margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; padding:clamp(14px,2.2vw,24px) var(--gutter);
  background:rgba(255,255,255,.82); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  transform:translateY(-105%); transition:transform .4s cubic-bezier(.2,.7,.2,1); }
.reveal-header.show { transform:translateY(0); }
.reveal-header .burger { display:flex; width:46px; height:46px; }
body.menu-open .reveal-header { background:transparent; -webkit-backdrop-filter:none; backdrop-filter:none; }

/* =========================================================
   オープニングアニメーション（フロント）
   ========================================================= */
.opening { position:fixed; inset:0; z-index:200; background:var(--bg);
  display:flex; align-items:center; justify-content:center; overflow:hidden; }
.opening-title { font-family:var(--jp); font-weight:700; line-height:1.32; letter-spacing:.015em; white-space:nowrap;
  font-size:clamp(20px,3.2vw,40px); color:var(--ink); transform-origin:top left; will-change:transform; }
.opening-title .caret { display:inline-block; width:3px; height:1em; margin-left:.05em; background:var(--ink);
  transform:translateY(.16em); animation:caretBlink .75s steps(1) infinite; }
@keyframes caretBlink { 50%{ opacity:0; } }
body.opening-lock { overflow:hidden; }
@media (prefers-reduced-motion:reduce){ .opening{ display:none; } }

/* =========================================================
   ヒーロー（フロント）
   ========================================================= */
#hero { position:relative; width:100%; min-height:100svh; overflow:hidden; background:var(--bg); }
#gfx { position:absolute; inset:0; width:100%; height:100%; display:block; z-index:1; }
.hero-copy { position:relative; z-index:2; height:100svh; display:flex; flex-direction:column; justify-content:center; align-items:flex-start;
  width:100%; max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter); pointer-events:none; }
.hero-title { font-family:var(--jp); font-size:clamp(28px,4.6vw,66px); font-weight:700; line-height:1.32; letter-spacing:.015em;
  white-space:nowrap; color:var(--ink); opacity:0; animation:rise 1s cubic-bezier(.2,.7,.2,1) .2s forwards; }
.hero-sub { font-family:var(--en); margin-top:clamp(16px,2vw,28px); font-size:clamp(15px,1.6vw,24px); font-weight:400; letter-spacing:.04em;
  color:var(--ink); opacity:0; animation:rise 1s cubic-bezier(.2,.7,.2,1) .36s forwards; }
@media (max-width:820px){
  .hero-copy{ justify-content:center; padding:0 var(--gutter) 22vh; }
  .hero-title{ font-size:clamp(34px,10vw,46px); }
  .hero-sub{ font-size:clamp(15px,3.9vw,21px); }
}
@keyframes rise { from{opacity:0; transform:translateY(18px);} to{opacity:1; transform:translateY(0);} }
@media (prefers-reduced-motion:reduce){ .hero-title,.hero-sub{ animation:none; opacity:1; } }

/* =========================================================
   コンセプト（フロント）
   ========================================================= */
.concept { position:relative; background:#fff; color:var(--ink);
  padding:var(--sec-pad) 0 calc(var(--sec-pad) + clamp(68px,11vh,132px)); }
.concept::after { content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
  --grid: clamp(48px,6vw,84px);
  background-image:
    linear-gradient(to right, rgba(11,11,11,.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(11,11,11,.06) 1px, transparent 1px);
  background-size: var(--grid) var(--grid);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 20%, #000 62%, transparent 88%);
          mask-image: linear-gradient(to bottom, transparent 0%, #000 20%, #000 62%, transparent 88%);
  opacity:0; transition:opacity 1.4s ease; }
.concept.in::after { opacity:1; }
@media (prefers-reduced-motion:reduce){ .concept::after{ opacity:1; transition:none; } }
.concept-inner { position:relative; z-index:1; width:100%; max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter); }
.concept h2 { font-family:var(--jp); font-weight:700; font-size:clamp(24.5px,3.5vw,50.5px); line-height:1.9; letter-spacing:.04em; }
.concept h2 .mark { background:var(--ink); color:#fff; padding:.14em .34em; font-feature-settings:"palt" 1;
  -webkit-box-decoration-break:clone; box-decoration-break:clone; }
.concept p { font-family:var(--jp); font-weight:700; font-size:clamp(19px,2.4vw,30px); line-height:2.05; letter-spacing:.02em;
  color:var(--ink); opacity:.92; margin-top:clamp(32px,4.5vw,60px); max-width:46em; }
.concept p .br { display:block; height:.55em; }
.scroll-cue { position:absolute; left:50%; transform:translateX(-50%); bottom:clamp(16px,3vh,40px); z-index:1; pointer-events:none;
  width:1px; height:clamp(52px,8vh,92px); background:rgba(11,11,11,.14); overflow:hidden; }
.scroll-cue span { position:absolute; left:0; top:0; width:100%; height:42%;
  background:linear-gradient(to bottom, rgba(11,11,11,0), rgba(11,11,11,.65));
  animation:cueDown 1.9s cubic-bezier(.4,0,.2,1) infinite; }
@keyframes cueDown { 0%{ transform:translateY(-110%);} 55%,100%{ transform:translateY(260%);} }
@media (prefers-reduced-motion:reduce){ .scroll-cue span{ animation:none; opacity:.4; } }
@media (max-width:820px){
  .concept h2{ font-size:clamp(29.5px,8.2vw,42.5px); line-height:1.5; }
  .concept p{ font-size:clamp(16px,4.4vw,19px); line-height:2.05; }
}
@media (min-width:1024px){
  .concept-inner{ display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(56px,6vw,110px); align-items:start; }
  .concept h2{ font-size:clamp(28.5px,2.8vw,44.5px); }
  .concept p{ margin-top:.35em; max-width:none; font-size:clamp(16px,1.4vw,21px); line-height:2.1; }
}

/* スクロールリビール（フロント・ブログ共通） */
.reveal { opacity:0; transform:translateY(22px); transition:opacity 1s cubic-bezier(.2,.7,.2,1), transform 1s cubic-bezier(.2,.7,.2,1); }
.reveal.in { opacity:1; transform:translateY(0); }
.reveal.d1 { transition-delay:.12s; } .reveal.d2 { transition-delay:.24s; }
html.no-js .reveal { opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* =========================================================
   ギャラリー（画像マーキー・フロント）
   ========================================================= */
.gallery { background:#fff; padding:clamp(28px,4vh,56px) 0; overflow:hidden; }
.gallery-track { display:flex; align-items:flex-start; gap:clamp(16px,1.6vw,28px); width:max-content;
  animation:galleryScroll 40s linear infinite; }
.gallery:hover .gallery-track { animation-play-state:paused; }
.g-item { flex:0 0 auto; width:clamp(240px,24vw,360px); aspect-ratio:4/5; border-radius:14px; overflow:hidden;
  background:linear-gradient(135deg,#e7e7e5,#d3d3d1); }
.g-item:nth-child(even) { margin-top:clamp(18px,3vw,44px); }
.g-item img { width:100%; height:100%; object-fit:cover; display:block; }
@keyframes galleryScroll { from{ transform:translateX(0);} to{ transform:translateX(-50%);} }
@media (prefers-reduced-motion:reduce){ .gallery-track{ animation:none; } }

/* =========================================================
   セクション見出し（共通）
   ========================================================= */
.sec-label { display:inline-flex; align-items:center; gap:.7em; font-family:var(--jp); font-weight:700;
  font-size:clamp(14px,1.4vw,18px); letter-spacing:.1em; color:var(--ink); }
.sec-label .dot { width:.5em; height:.5em; border-radius:50%; background:var(--ink); flex:0 0 auto; }
.sec-big { display:block; font-family:var(--en); font-weight:700; color:var(--ink);
  font-size:clamp(44px,7vw,96px); line-height:1; letter-spacing:.01em; margin-top:clamp(8px,1.4vw,20px); }
@media (max-width:820px){ .sec-big{ font-size:clamp(44px,12vw,62px); } }

/* =========================================================
   事業紹介（フロント）
   ========================================================= */
.services { position:relative; background:#fff; color:var(--ink); padding:var(--sec-pad) 0; }
.services-inner { position:relative; z-index:2; width:100%; max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter); }
.services-head { margin-bottom:clamp(48px,7vw,96px); }
.services-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(36px,5vw,80px) clamp(32px,4vw,64px); }
.svc-card { display:flex; flex-direction:column; text-decoration:none; color:var(--ink); }
.svc-thumb { position:relative; aspect-ratio:16/9; border-radius:18px; overflow:hidden;
  background:linear-gradient(135deg,#e7e7e5,#d3d3d1); box-shadow:0 20px 48px rgba(0,0,0,.10); }
.svc-thumb img { width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .9s cubic-bezier(.2,.7,.2,1); }
.svc-card:hover .svc-thumb img { transform:scale(1.05); }
.svc-arrow { position:absolute; right:clamp(16px,2vw,26px); bottom:clamp(16px,2vw,26px);
  width:clamp(52px,4.4vw,68px); height:clamp(52px,4.4vw,68px); border-radius:50%; background:var(--ink);
  display:flex; align-items:center; justify-content:center; color:#fff;
  transition:transform .4s cubic-bezier(.2,.7,.2,1), background .3s; }
.svc-arrow svg { width:38%; height:38%; transition:transform .4s cubic-bezier(.2,.7,.2,1); }
.svc-card:hover .svc-arrow { transform:scale(1.08); }
.svc-card:hover .svc-arrow svg { transform:translateX(3px); }
.svc-tag { align-self:flex-start; margin-top:clamp(22px,2.6vw,34px);
  font-family:var(--jp); font-weight:700; font-size:clamp(11.5px,1.05vw,13px); letter-spacing:.06em; line-height:1.5;
  color:#fff; background:var(--ink); border-radius:6px; padding:.5em 1.05em; }
.svc-card h3 { font-family:var(--jp); font-weight:700; font-size:clamp(20px,2vw,28px); letter-spacing:.02em;
  margin-top:clamp(22px,2.6vw,34px); }
.svc-tag + h3 { margin-top:clamp(10px,1.2vw,14px); }
.svc-card p { font-family:var(--jp); font-weight:400; font-size:clamp(14px,1.4vw,17px); line-height:2; letter-spacing:.02em;
  color:var(--ink); opacity:.72; margin-top:clamp(12px,1.4vw,18px); }
@media (max-width:760px){
  .services-grid { grid-template-columns:1fr; gap:clamp(40px,9vw,56px); }
}
@media (max-width:820px){ .svc-card h3{ font-size:clamp(23px,6.2vw,30px); } }

/* =========================================================
   ブログセクション（フロント・横カルーセル）
   ========================================================= */
.blog { position:relative; background:#F9F9F9; color:var(--ink); padding:var(--sec-pad) 0; }
.blog-inner { width:100%; max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter); }
.blog-head { margin-bottom:clamp(36px,5vw,60px); padding-bottom:clamp(22px,2.6vw,36px); border-bottom:1px solid rgba(11,11,11,.14);
  display:flex; align-items:flex-end; justify-content:space-between; gap:1em 2em; flex-wrap:wrap; }
.blog-more { font-family:var(--jp); font-weight:700; font-size:clamp(13px,1.05vw,15px); letter-spacing:.04em;
  color:var(--ink); text-decoration:none; display:inline-flex; align-items:center; gap:.5em;
  border-bottom:1px solid var(--ink); padding-bottom:.35em; }
.blog-more svg { width:1em; height:1em; transition:transform .4s cubic-bezier(.2,.7,.2,1); }
.blog-more:hover svg { transform:translateX(4px); }
.blog-viewport { overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.blog-viewport::-webkit-scrollbar { display:none; }
.blog-track { display:flex; gap:clamp(20px,2.4vw,40px); }
.post { flex:0 0 auto; width:clamp(270px,30vw,400px); scroll-snap-align:start; text-decoration:none; color:var(--ink);
  display:flex; flex-direction:column; }
.post-thumb { position:relative; aspect-ratio:16/9; border-radius:14px; overflow:hidden;
  background:linear-gradient(135deg,#e7e7e5,#d3d3d1); }
.post-thumb img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.post:hover .post-thumb img { transform:scale(1.05); }
.post:hover .post-title { text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px; }
.post-meta { order:2; display:flex; align-items:center; flex-wrap:wrap; gap:.6em .9em; margin-top:clamp(16px,1.6vw,22px);
  font-family:var(--jp); font-size:clamp(11px,.9vw,13px); }
.post-cat { font-weight:700; letter-spacing:.06em; border:1px solid rgba(11,11,11,.4); border-radius:4px; padding:.4em .8em; }
.post-date { opacity:.5; letter-spacing:.06em; }
.post-title { order:3; font-family:var(--jp); font-weight:700; font-size:clamp(16px,1.25vw,19px); line-height:1.62; letter-spacing:.01em;
  margin-top:clamp(8px,1vw,12px);
  display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.blog-controls { display:flex; align-items:center; gap:clamp(20px,4vw,60px); margin-top:clamp(40px,5vw,72px); }
.blog-progress { flex:1; height:2px; background:rgba(11,11,11,.14); position:relative; overflow:hidden; }
.blog-progress span { position:absolute; left:0; top:0; height:100%; background:var(--ink); width:30%;
  transition:left .4s cubic-bezier(.2,.7,.2,1), width .4s cubic-bezier(.2,.7,.2,1); }
.blog-nav { display:flex; gap:12px; }
.blog-btn { width:clamp(48px,4vw,60px); height:clamp(48px,4vw,60px); border-radius:50%; border:1px solid rgba(11,11,11,.35);
  background:transparent; color:var(--ink); cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background .3s, color .3s, border-color .3s, opacity .3s; }
.blog-btn svg { width:34%; height:34%; }
.blog-btn:hover { background:var(--ink); color:#fff; border-color:var(--ink); }
.blog-btn:disabled { opacity:.3; cursor:default; }
.blog-btn:disabled:hover { background:transparent; color:var(--ink); border-color:rgba(11,11,11,.35); }
@media (max-width:760px){ .post { width:78vw; } }

/* =========================================================
   採用セクション（フロント）
   ========================================================= */
.recruit { position:relative; overflow:hidden; background:#fff; color:var(--ink); }
.recruit-grid { display:grid; grid-template-columns:1fr 1fr; align-items:stretch; min-height:clamp(680px,86vh,980px); }
.recruit-text { display:flex; flex-direction:column; justify-content:center; align-items:flex-start;
  padding:var(--sec-pad) clamp(28px,4vw,64px) var(--sec-pad) max(var(--gutter), calc((100vw - var(--maxw))/2 + var(--gutter))); }
.recruit-heading { font-family:var(--jp); font-weight:700; font-size:clamp(24px,2.6vw,40px); line-height:1.5; letter-spacing:.02em;
  margin-top:clamp(18px,2.2vw,28px); }
.recruit-lead { font-family:var(--jp); font-weight:400; font-size:clamp(15px,1.4vw,18px); line-height:2; letter-spacing:.02em;
  opacity:.72; margin-top:clamp(20px,2.2vw,30px); max-width:32em; }
.recruit-btn { display:inline-flex; align-items:center; gap:.7em; margin-top:clamp(32px,4vw,52px);
  font-family:var(--jp); font-weight:700; font-size:clamp(14px,1.1vw,16px); letter-spacing:.04em;
  color:#fff; background:var(--ink); border:1px solid var(--ink); border-radius:999px; padding:.95em 2em;
  text-decoration:none; transition:background .3s, color .3s; }
.recruit-btn svg { width:1.05em; height:1.05em; transition:transform .4s cubic-bezier(.2,.7,.2,1); }
.recruit-btn:hover { background:transparent; color:var(--ink); }
.recruit-btn:hover svg { transform:translateX(4px); }
.recruit-photo { position:relative; overflow:hidden; margin-block:var(--sec-pad);
  background:linear-gradient(135deg,#e7e7e5,#d3d3d1);
  border-top-left-radius:clamp(40px,6vw,120px); border-bottom-left-radius:clamp(40px,6vw,120px); }
.recruit-photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
@media (max-width:760px){
  .recruit { overflow:visible; }
  .recruit-grid { display:flex; flex-direction:column; min-height:0; }
  .recruit-photo { order:1; --rh:clamp(300px,64vw,440px);
    width:calc(100% - var(--gutter)); margin-left:var(--gutter);
    height:var(--rh); margin-block:calc(-.5 * var(--rh)) 0;
    border-radius:clamp(28px,6vw,44px) 0 0 clamp(28px,6vw,44px); }
  .recruit-text { order:2; padding:clamp(28px,6vw,44px) var(--gutter) var(--sec-pad); }
  .blog { padding-bottom:calc(.5 * clamp(300px,64vw,440px) + var(--sec-pad)); }
}

/* =========================================================
   コンタクトCTA（フロント）
   ========================================================= */
.contact { background:var(--ink); color:#fff; text-align:center; display:flex; justify-content:center;
  padding:calc(var(--sec-pad) * 1.3) var(--gutter); }
.contact-box { display:inline-flex; flex-direction:column; align-items:center; gap:clamp(14px,1.8vw,24px);
  color:var(--ink); background:#fff; text-decoration:none; border:1px solid #fff; border-radius:clamp(14px,2vw,24px);
  padding:clamp(40px,6vw,80px) clamp(44px,8vw,120px);
  transition:background .3s, color .3s, border-color .3s; }
.contact-box:hover { background:transparent; color:#fff; border-color:rgba(255,255,255,.55); }
.contact-big { font-family:var(--en); font-weight:700; line-height:1; letter-spacing:.01em; color:inherit;
  font-size:clamp(44px,7vw,96px); }
.contact-sub { display:inline-flex; align-items:center; gap:.6em; color:inherit;
  font-family:var(--jp); font-weight:700; font-size:clamp(14px,1.2vw,17px); letter-spacing:.04em; }
.contact-sub svg { width:1.05em; height:1.05em; transition:transform .4s cubic-bezier(.2,.7,.2,1); }
.contact-box:hover .contact-sub svg { transform:translateX(4px); }
@media (max-width:820px){
  .contact{ padding:calc(var(--sec-pad) * .75) var(--gutter); }
  .contact-box{ width:100%; padding:clamp(36px,9vw,56px) clamp(20px,5vw,44px); }
  .contact-big{ font-size:clamp(44px,12vw,62px); }
}

/* =========================================================
   フッター（黒・全ページ共通）
   ========================================================= */
.footer { background:var(--ink); color:#fff; border-top:1px solid rgba(255,255,255,.14);
  padding:clamp(44px,7vh,80px) 0 clamp(24px,4vh,40px); margin-top:0; }
body:not(.is-front) .footer { margin-top:var(--sec-pad); }
.footer-inner { width:100%; max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter); }
.footer-top { display:flex; justify-content:space-between; align-items:flex-start; gap:2em 3em; flex-wrap:wrap; }
.footer-brand { font-family:var(--en); font-weight:700; font-size:clamp(28px,2.8vw,40px); letter-spacing:.14em; line-height:1; }
.footer-note { display:block; font-family:var(--jp); font-weight:400; font-size:11px; line-height:1.9;
  letter-spacing:.04em; opacity:.5; margin-top:1em; max-width:30em; }
.footer-nav { display:flex; flex-wrap:wrap; gap:1em 2em; font-family:var(--jp); font-weight:700; font-size:13px; letter-spacing:.05em; }
.footer-nav a { color:#fff; text-decoration:none; opacity:.75; transition:opacity .25s; }
.footer-nav a:hover { opacity:1; }
.footer-nav ul { display:flex; flex-wrap:wrap; gap:1em 2em; list-style:none; }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; gap:1em 2em; flex-wrap:wrap;
  margin-top:clamp(32px,5vh,56px); padding-top:clamp(18px,2.6vh,26px); border-top:1px solid rgba(255,255,255,.12); }
.footer-legal { display:flex; gap:1.6em; font-family:var(--jp); font-size:11.5px; letter-spacing:.04em; }
.footer-legal a { color:#fff; text-decoration:none; opacity:.55; transition:opacity .25s; }
.footer-legal a:hover { opacity:.9; }
.footer-copy { font-family:var(--en); font-size:11.5px; letter-spacing:.1em; opacity:.4; }

/* =========================================================
   サブページ共通
   ========================================================= */
.page-wrap { padding:calc(var(--sec-pad) * .7) 0 var(--sec-pad); }
.page-head { padding-bottom:clamp(24px,3vw,40px); border-bottom:1px solid rgba(11,11,11,.14); margin-bottom:clamp(32px,4.5vw,56px); }
.lead { font-family:var(--jp); font-size:clamp(14px,1.25vw,16px); line-height:2.1; letter-spacing:.02em; max-width:42em;
  margin-bottom:clamp(36px,5vw,56px); }
.lead a { color:inherit; }

/* 黒丸ボタン（汎用） */
.btn-ink { display:inline-flex; align-items:center; gap:.7em; font-family:var(--jp); font-weight:700;
  font-size:clamp(14px,1.15vw,16px); letter-spacing:.04em; color:#fff; background:var(--ink); border:1px solid var(--ink);
  border-radius:999px; padding:.9em 2em; text-decoration:none; cursor:pointer; transition:background .3s, color .3s; }
.btn-ink svg { width:1.05em; height:1.05em; transition:transform .4s cubic-bezier(.2,.7,.2,1); }
.btn-ink:hover { background:transparent; color:var(--ink); }
.btn-ink:hover svg { transform:translateX(4px); }

/* --- 採用ページ --- */
.recruit-copy { font-family:var(--jp); font-weight:700; font-size:clamp(22px,2.4vw,34px); line-height:1.6; letter-spacing:.02em;
  margin-bottom:clamp(16px,2vw,24px); }
.job { border:1px solid rgba(11,11,11,.14); border-radius:18px; overflow:hidden; margin-bottom:clamp(32px,4vw,48px); }
.job-head { display:flex; align-items:center; justify-content:space-between; gap:1em 2em; flex-wrap:wrap;
  padding:clamp(22px,3vw,34px) clamp(22px,3.2vw,40px); background:#F9F9F9; border-bottom:1px solid rgba(11,11,11,.1); }
.job-title { font-family:var(--jp); font-weight:700; font-size:clamp(18px,1.8vw,24px); letter-spacing:.03em; }
.job-badge { font-family:var(--jp); font-weight:700; font-size:11.5px; letter-spacing:.08em; color:#fff; background:var(--ink);
  border-radius:999px; padding:.45em 1.2em; }
.job-body { padding:clamp(10px,1.4vw,18px) clamp(22px,3.2vw,40px) clamp(26px,3.4vw,42px); }
.job .row { display:grid; grid-template-columns:clamp(120px,15vw,180px) 1fr; gap:.6em 2em;
  padding:clamp(14px,1.8vw,20px) 0; border-bottom:1px solid rgba(11,11,11,.08); }
.job .row:last-of-type { border-bottom:none; }
.job dt { font-family:var(--jp); font-weight:700; font-size:clamp(12.5px,1.05vw,14px); letter-spacing:.04em; }
.job dd { font-family:var(--jp); font-weight:400; font-size:clamp(12.5px,1.05vw,14px); line-height:2; letter-spacing:.02em; }
.job dd ul { padding-left:1.4em; }
@media (max-width:640px){ .job .row { grid-template-columns:1fr; gap:.3em; } }
.recruit-note { font-family:var(--jp); font-size:12.5px; line-height:2; opacity:.55; margin-top:clamp(28px,3.6vw,44px); }
.recruit-note a { color:inherit; }

/* --- お問い合わせページ（フォーム） --- */
.contact-form { max-width:720px; }
.field { margin-bottom:clamp(24px,3vw,36px); }
.field label { display:block; font-family:var(--jp); font-weight:700; font-size:clamp(13px,1.1vw,15px); letter-spacing:.04em;
  margin-bottom:.8em; }
.field label .req { display:inline-block; margin-left:.8em; font-size:10.5px; color:#fff; background:var(--ink);
  border-radius:4px; padding:.25em .6em; vertical-align:middle; letter-spacing:.08em; }
.field input, .field select, .field textarea,
.contact-form input[type="text"], .contact-form input[type="email"], .contact-form input[type="tel"],
.contact-form select, .contact-form textarea {
  width:100%; font-family:var(--jp); font-size:clamp(14px,1.2vw,16px);
  color:var(--ink); background:#F9F9F9; border:1px solid rgba(11,11,11,.16); border-radius:10px;
  padding:1em 1.2em; outline:none; transition:border-color .25s, background .25s; -webkit-appearance:none; appearance:none; }
.field select, .contact-form select { background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b0b0b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 1.1em center; background-size:1em; }
.field input:focus, .field select:focus, .field textarea:focus,
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { border-color:var(--ink); background:#fff; }
.field textarea, .contact-form textarea { min-height:220px; resize:vertical; line-height:1.9; }
.form-note { font-family:var(--jp); font-size:12px; line-height:1.9; opacity:.55; margin-top:clamp(20px,2.4vw,30px); }
.form-note a { color:inherit; }
/* Contact Form 7 を使う場合の調整 */
.contact-form .wpcf7-form p { margin-bottom:clamp(24px,3vw,36px); font-family:var(--jp); font-weight:700;
  font-size:clamp(13px,1.1vw,15px); letter-spacing:.04em; }
.contact-form .wpcf7-form input[type="submit"] { width:auto; display:inline-flex; align-items:center;
  font-family:var(--jp); font-weight:700; font-size:clamp(15px,1.3vw,17px); letter-spacing:.04em;
  color:#fff; background:var(--ink); border:1px solid var(--ink); border-radius:999px; padding:1em 2.4em;
  cursor:pointer; transition:background .3s, color .3s; }
.contact-form .wpcf7-form input[type="submit"]:hover { background:transparent; color:var(--ink); }

/* --- 運営者情報ページ --- */
dl.info { max-width:820px; }
dl.info .row { display:grid; grid-template-columns:clamp(140px,18vw,220px) 1fr; gap:1em 2em;
  padding:clamp(18px,2.4vw,26px) 0; border-bottom:1px solid rgba(11,11,11,.1); }
dl.info dt { font-family:var(--jp); font-weight:700; font-size:clamp(13px,1.15vw,15px); letter-spacing:.04em; }
dl.info dd { font-family:var(--jp); font-weight:400; font-size:clamp(13px,1.15vw,15px); line-height:1.9; letter-spacing:.02em; }
dl.info dd a { color:inherit; }
dl.info dd .small { display:block; font-size:11.5px; opacity:.55; margin-top:.5em; }
@media (max-width:640px){ dl.info .row { grid-template-columns:1fr; gap:.4em; } }

/* --- 個人情報利用規約ページ --- */
.policy { max-width:860px; font-family:var(--jp); font-size:clamp(13px,1.15vw,15px); line-height:2.1; letter-spacing:.02em; }
.policy .lead { margin-bottom:clamp(32px,4vw,48px); }
.policy h2 { font-size:clamp(15px,1.35vw,18px); font-weight:700; letter-spacing:.04em;
  margin:clamp(36px,4.5vw,56px) 0 clamp(12px,1.6vw,18px); padding-left:.9em; border-left:3px solid var(--ink); }
.policy p { margin-bottom:1em; }
.policy ol { padding-left:1.6em; margin-bottom:1em; }
.policy ol > li { margin-bottom:.6em; }
.policy ul { padding-left:1.6em; margin:0.4em 0 0.8em; list-style:disc; }
.policy ul > li { margin-bottom:.35em; }
.policy .contact-info { background:#F9F9F9; border-radius:12px; padding:clamp(18px,2.4vw,28px) clamp(20px,2.8vw,32px); margin-top:1.2em; }
.policy .contact-info p { margin-bottom:.3em; }
.policy .contact-info a { color:inherit; }
.policy .enacted { margin-top:clamp(32px,4vw,48px); text-align:right; opacity:.6; font-size:12.5px; }

/* =========================================================
   ブログ: 共通レイアウト
   ========================================================= */
.blog-main { width:100%; max-width:var(--maxw); margin:0 auto; padding:calc(var(--sec-pad) * .5) var(--gutter) var(--sec-pad); }
.blog-cols { display:flex; flex-direction:column; gap:clamp(40px,5vw,56px); }
@media (min-width:1024px){ .blog-cols { flex-direction:row; gap:clamp(44px,4vw,64px); } }
.blog-cols > .col-main { min-width:0; flex:1; }

/* パンくず */
.crumbs { font-family:var(--jp); font-size:12.5px; letter-spacing:.03em; margin-bottom:clamp(20px,2.6vw,32px); opacity:.6; }
.crumbs ol { display:flex; flex-wrap:wrap; align-items:center; list-style:none; }
.crumbs a { color:inherit; text-decoration:none; }
.crumbs a:hover { text-decoration:underline; text-underline-offset:3px; }
.crumbs-sep { padding:0 .7em; opacity:.5; }
.crumbs .is-current { display:-webkit-box; -webkit-line-clamp:1; line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }

/* アーカイブ見出し */
.archive-head { padding-bottom:clamp(20px,2.6vw,32px); border-bottom:1px solid rgba(11,11,11,.14); margin-bottom:clamp(28px,3.6vw,44px); }
.archive-title { font-family:var(--jp); font-weight:700; font-size:clamp(24px,2.6vw,36px); letter-spacing:.02em; line-height:1.5; }
.archive-desc { font-family:var(--jp); font-size:clamp(13px,1.1vw,14.5px); line-height:2; opacity:.65; margin-top:.8em; max-width:46em; }
.archive-count { font-family:var(--jp); font-size:12px; opacity:.5; margin-top:.8em; }
.archive-children { display:flex; flex-wrap:wrap; gap:.6em; margin-top:1.2em; }

/* チップ（カテゴリ・タグ・業種） */
.chip { display:inline-flex; align-items:center; font-family:var(--jp); font-weight:700; font-size:11.5px; letter-spacing:.06em;
  color:var(--ink); border:1px solid rgba(11,11,11,.4); border-radius:4px; padding:.4em .8em; text-decoration:none;
  transition:background .25s, color .25s, border-color .25s; }
a.chip:hover { background:var(--ink); color:#fff; border-color:var(--ink); }
.chip-cat { background:var(--ink); color:#fff; border-color:var(--ink); }
a.chip-cat:hover { background:transparent; color:var(--ink); }
.chip-tag { border-color:rgba(11,11,11,.22); font-weight:400; }
.chip-count { opacity:.45; margin-left:.5em; }

/* 記事カード（グリッド） */
.bcard { display:flex; flex-direction:column; text-decoration:none; color:var(--ink); }
.bcard-thumb { position:relative; aspect-ratio:16/9; border-radius:14px; overflow:hidden;
  background:linear-gradient(135deg,#e7e7e5,#d3d3d1); display:block; }
.bcard-thumb img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.bcard:hover .bcard-thumb img { transform:scale(1.05); }
.bcard-thumb .noimg { display:flex; width:100%; height:100%; align-items:center; justify-content:center;
  font-family:var(--en); font-size:11px; letter-spacing:.2em; opacity:.4; }
.bcard-meta { display:flex; align-items:center; flex-wrap:wrap; gap:.6em .9em; margin-top:clamp(14px,1.4vw,20px);
  font-family:var(--jp); font-size:clamp(11px,.9vw,12.5px); }
.bcard-date { opacity:.5; letter-spacing:.06em; }
.bcard-title { font-family:var(--jp); font-weight:700; font-size:clamp(15px,1.2vw,17.5px); line-height:1.62; letter-spacing:.01em;
  margin-top:clamp(8px,1vw,12px);
  display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.bcard:hover .bcard-title { text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px; }
.bcard-grid { display:grid; grid-template-columns:1fr; gap:clamp(28px,4vw,44px) clamp(24px,3vw,40px); }
@media (min-width:640px){ .bcard-grid { grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px){ .bcard-grid.cols-3 { grid-template-columns:repeat(3,1fr); } }

/* 記事カード（リスト・アーカイブ用） */
.bcard-row { display:flex; gap:clamp(16px,2.4vw,28px); align-items:flex-start; padding:clamp(20px,2.6vw,28px) 0;
  border-bottom:1px solid rgba(11,11,11,.1); text-decoration:none; color:var(--ink); }
.bcard-row .bcard-thumb { flex:0 0 auto; width:clamp(112px,20vw,192px); aspect-ratio:16/9; border-radius:10px; }
.bcard-row .bcard-body { min-width:0; flex:1; }
.bcard-row .bcard-title { margin-top:.5em; font-size:clamp(14.5px,1.3vw,18px); -webkit-line-clamp:2; }
.bcard-row .bcard-excerpt { font-family:var(--jp); font-size:13.5px; line-height:1.9; opacity:.6; margin-top:.6em;
  display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
@media (max-width:640px){ .bcard-row .bcard-excerpt { display:none; } }
.bcard-row:hover .bcard-title { text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px; }

/* 記事カード（サイドバー・ミニ） */
.bcard-mini { display:flex; gap:12px; align-items:flex-start; padding:12px 0; text-decoration:none; color:var(--ink);
  border-bottom:1px solid rgba(11,11,11,.08); }
.bcard-mini:last-child { border-bottom:none; }
.bcard-mini .bcard-thumb { flex:0 0 auto; width:104px; aspect-ratio:16/9; border-radius:8px; }
.bcard-mini h4 { font-family:var(--jp); font-weight:700; font-size:12.5px; line-height:1.6;
  display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.bcard-mini:hover h4 { text-decoration:underline; text-underline-offset:3px; }
.bcard-mini time { display:block; font-family:var(--jp); font-size:10.5px; opacity:.45; margin-top:.4em; }

/* サイドバー */
.sidebar { width:100%; }
@media (min-width:1024px){ .sidebar { width:300px; flex:0 0 auto; } }
.side-sec { margin-bottom:clamp(36px,4vw,48px); }
.side-title { font-family:var(--jp); font-weight:700; font-size:15px; letter-spacing:.04em;
  padding-bottom:.7em; border-bottom:1px solid var(--ink); margin-bottom:.6em;
  display:flex; align-items:center; gap:.6em; }
.side-title::before { content:""; width:.45em; height:.45em; border-radius:50%; background:var(--ink); }
.side-list { list-style:none; }
.side-list li { border-bottom:1px solid rgba(11,11,11,.08); }
.side-list li a { display:block; font-family:var(--jp); font-size:13.5px; font-weight:700; text-decoration:none; color:var(--ink);
  padding:.9em .2em; transition:opacity .2s; }
.side-list li a:hover { opacity:.6; }
.side-chips { display:flex; flex-wrap:wrap; gap:.6em; padding-top:.6em; }

/* 検索フォーム */
.search-form { display:flex; align-items:center; gap:10px; }
.search-form input[type="search"] { flex:1; font-family:var(--jp); font-size:14px; color:var(--ink);
  background:#F9F9F9; border:1px solid rgba(11,11,11,.16); border-radius:999px; padding:.85em 1.4em; outline:none;
  transition:border-color .25s, background .25s; -webkit-appearance:none; appearance:none; }
.search-form input[type="search"]:focus { border-color:var(--ink); background:#fff; }
.search-form button { flex:0 0 auto; font-family:var(--jp); font-weight:700; font-size:13px; letter-spacing:.04em;
  color:#fff; background:var(--ink); border:1px solid var(--ink); border-radius:999px; padding:.85em 1.6em; cursor:pointer;
  transition:background .3s, color .3s; }
.search-form button:hover { background:transparent; color:var(--ink); }

/* ページネーション */
.pagination { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:clamp(44px,5vw,64px);
  font-family:var(--jp); font-size:13.5px; }
.pagination .page-numbers { display:inline-flex; align-items:center; justify-content:center; min-width:44px; height:44px;
  padding:0 1em; border:1px solid rgba(11,11,11,.25); border-radius:999px; color:var(--ink); text-decoration:none; font-weight:700;
  transition:background .25s, color .25s, border-color .25s; }
.pagination a.page-numbers:hover { background:var(--ink); color:#fff; border-color:var(--ink); }
.pagination .page-numbers.current { background:var(--ink); color:#fff; border-color:var(--ink); }
.pagination .page-numbers.dots { border:none; min-width:auto; }

/* =========================================================
   ブログ: 記事詳細
   ========================================================= */
.article { min-width:0; flex:1; max-width:var(--content); margin:0 auto; }
@media (min-width:1024px){ .article { margin:0; } }
.article-head { margin-bottom:clamp(24px,3vw,36px); }
.article-chips { display:flex; flex-wrap:wrap; gap:.5em; margin-bottom:1em; }
.article-title { font-family:var(--jp); font-weight:700; font-size:clamp(24px,2.8vw,38px); line-height:1.6; letter-spacing:.02em;
  margin-bottom:.6em; }
.article-dates { display:flex; flex-wrap:wrap; gap:.4em 1.4em; font-family:var(--jp); font-size:12.5px; opacity:.5; }
.article-eyecatch { margin-bottom:clamp(28px,3.4vw,40px); overflow:hidden; border-radius:14px; aspect-ratio:16/9;
  background:linear-gradient(135deg,#e7e7e5,#d3d3d1); }
.article-eyecatch img { width:100%; height:100%; object-fit:cover; display:block; }

/* 概要ボックス */
.intro-box { margin-bottom:clamp(28px,3.4vw,40px); padding:clamp(20px,2.6vw,28px) clamp(22px,3vw,32px);
  background:#F9F9F9; border-left:3px solid var(--ink); border-radius:0 12px 12px 0; }
.intro-box .intro-label { font-family:var(--en); font-size:11px; letter-spacing:.22em; text-transform:uppercase;
  opacity:.5; margin-bottom:.9em; font-weight:700; }
.intro-box .article-intro { font-family:var(--jp); font-size:clamp(13.5px,1.1vw,14.5px); line-height:2; opacity:.85; }
.intro-box .article-intro p { margin-bottom:.6em; }
.intro-box .article-intro p:last-child { margin-bottom:0; }

/* 目次 */
.toc-box { margin-bottom:clamp(28px,3.4vw,40px); padding:clamp(22px,2.8vw,30px) clamp(24px,3.2vw,36px);
  background:#fff; border:1px solid rgba(11,11,11,.16); border-radius:14px; font-family:var(--jp); }
.toc-box .toc-title { font-weight:700; font-size:15px; letter-spacing:.08em; margin-bottom:1em;
  display:flex; align-items:center; gap:.6em; }
.toc-box .toc-title::before { content:""; width:.45em; height:.45em; border-radius:50%; background:var(--ink); }
.toc-box ol { list-style:none; counter-reset:toc; }
.toc-box ol li { counter-increment:toc; border-bottom:1px solid rgba(11,11,11,.07); }
.toc-box ol li:last-child { border-bottom:none; }
.toc-box ol a { display:flex; gap:1em; align-items:baseline; font-size:13.5px; font-weight:700; line-height:1.7;
  color:var(--ink); text-decoration:none; padding:.7em .2em; }
.toc-box ol a::before { content:counter(toc, decimal-leading-zero); font-family:var(--en); font-size:12px; opacity:.4; }
.toc-box ol a:hover { opacity:.6; }

/* 本文タイポグラフィ */
.article-body { font-family:var(--jp); font-size:clamp(14.5px,1.2vw,16px); line-height:2.1; letter-spacing:.02em; }
.article-body > * + * { margin-top:1.4em; }
.article-body h2 { font-size:clamp(19px,1.8vw,24px); font-weight:700; line-height:1.6; letter-spacing:.03em;
  margin-top:clamp(48px,6vw,72px); padding:.5em .9em; background:var(--ink); color:#fff; border-radius:8px; }
.article-body h3 { font-size:clamp(16.5px,1.5vw,20px); font-weight:700; line-height:1.6;
  margin-top:clamp(36px,4.5vw,56px); padding-left:.85em; border-left:3px solid var(--ink); }
.article-body h4 { font-size:clamp(15px,1.3vw,17px); font-weight:700; margin-top:2.2em; }
.article-body a { color:var(--ink); text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px; }
.article-body a:hover { opacity:.6; }
.article-body ul, .article-body ol { padding-left:1.6em; }
.article-body ul { list-style:disc; }
.article-body li { margin-bottom:.5em; }
.article-body blockquote { border-left:3px solid rgba(11,11,11,.25); padding:.2em 0 .2em 1.4em; opacity:.75; }
.article-body img { border-radius:12px; }
.article-body figure figcaption { font-size:12px; opacity:.5; margin-top:.7em; text-align:center; }
.article-body table { width:100%; border-collapse:collapse; font-size:13.5px; }
.article-body th, .article-body td { border:1px solid rgba(11,11,11,.16); padding:.8em 1em; text-align:left; line-height:1.8; }
.article-body th { background:#F9F9F9; font-weight:700; }
.article-body pre { background:var(--ink); color:#fff; border-radius:12px; padding:1.4em 1.6em; overflow-x:auto;
  font-size:13px; line-height:1.8; }
.article-body code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.92em; }
.article-body :not(pre) > code { background:#F1F1F0; border-radius:4px; padding:.15em .45em; }
.article-body hr { border:none; border-top:1px solid rgba(11,11,11,.14); margin:3em 0; }

/* タグ行 */
.tags-row { display:flex; flex-wrap:wrap; align-items:center; gap:.5em; margin-top:clamp(28px,3.4vw,40px); }
.tags-row .tags-label { font-family:var(--jp); font-size:12px; opacity:.45; margin-right:.4em; }

/* 著者ボックス */
.author-box { display:flex; gap:16px; align-items:flex-start; border:1px solid rgba(11,11,11,.14); border-radius:14px;
  background:#fff; padding:clamp(18px,2.4vw,26px); }
.author-box img.avatar { border-radius:50%; flex:0 0 auto; }
.author-box .author-label { font-family:var(--jp); font-size:11px; opacity:.45; margin-bottom:.3em; }
.author-box .author-name { font-family:var(--jp); font-weight:700; font-size:15px; }
.author-box .author-name a { color:inherit; text-decoration:none; }
.author-box .author-name a:hover { text-decoration:underline; text-underline-offset:3px; }
.author-box .author-bio { font-family:var(--jp); font-size:13px; line-height:1.9; opacity:.7; margin-top:.5em; }
.author-box .author-url { display:inline-block; font-family:var(--jp); font-size:12px; margin-top:.6em; color:inherit;
  text-decoration:underline; text-underline-offset:3px; word-break:break-all; }

/* 記事末 CTA（メタボックス設定・バナー型） */
.cta-banner { margin:clamp(40px,5vw,56px) 0; border:1px solid rgba(11,11,11,.14); border-radius:18px; overflow:hidden; background:#fff; }
.cta-banner .cta-grid { display:grid; grid-template-columns:1fr; }
@media (min-width:760px){ .cta-banner .cta-grid.has-image { grid-template-columns:5fr 7fr; } }
.cta-banner .cta-image { background:#F1F1F0; overflow:hidden; aspect-ratio:16/9; }
@media (min-width:760px){ .cta-banner .cta-image { aspect-ratio:auto; } }
.cta-banner .cta-image img { width:100%; height:100%; object-fit:cover; display:block; }
.cta-banner .cta-body { padding:clamp(24px,3.2vw,36px); display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.cta-banner h3 { font-family:var(--jp); font-weight:700; font-size:clamp(16px,1.5vw,20px); line-height:1.7; margin-bottom:.7em; }
.cta-banner .cta-text { font-family:var(--jp); font-size:13.5px; line-height:2; opacity:.7; margin-bottom:1.4em; }

/* 前後の記事 */
.post-nav { display:grid; grid-template-columns:1fr; gap:12px; margin-top:clamp(40px,5vw,56px); }
@media (min-width:640px){ .post-nav { grid-template-columns:1fr 1fr; } }
.post-nav a { display:block; border:1px solid rgba(11,11,11,.16); border-radius:12px; padding:1.1em 1.3em;
  text-decoration:none; color:var(--ink); transition:border-color .25s, background .25s; }
.post-nav a:hover { border-color:var(--ink); }
.post-nav .nav-dir { display:block; font-family:var(--jp); font-size:11px; opacity:.45; margin-bottom:.4em; }
.post-nav .nav-title { display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  font-family:var(--jp); font-weight:700; font-size:13.5px; line-height:1.7; }
.post-nav .is-next { text-align:right; }

/* 関連記事 */
.related { margin-top:clamp(48px,6vw,72px); padding-top:clamp(28px,3.4vw,40px); border-top:1px solid rgba(11,11,11,.14); }
.related h2 { font-family:var(--jp); font-weight:700; font-size:clamp(17px,1.6vw,21px); letter-spacing:.03em;
  margin-bottom:clamp(20px,2.6vw,28px); display:flex; align-items:center; gap:.6em; }
.related h2::before { content:""; width:.45em; height:.45em; border-radius:50%; background:var(--ink); }

/* コメント */
.comments-area { margin-top:clamp(48px,6vw,72px); padding-top:clamp(28px,3.4vw,40px); border-top:1px solid rgba(11,11,11,.14);
  font-family:var(--jp); font-size:14px; }
.comments-area h2, .comments-area h3 { font-weight:700; font-size:17px; margin-bottom:1em; }
.comments-area ol { list-style:none; }
.comments-area .comment { padding:1.2em 0; border-bottom:1px solid rgba(11,11,11,.08); }
.comments-area textarea, .comments-area input[type="text"], .comments-area input[type="email"], .comments-area input[type="url"] {
  width:100%; font-family:var(--jp); font-size:14px; color:var(--ink); background:#F9F9F9;
  border:1px solid rgba(11,11,11,.16); border-radius:10px; padding:.9em 1.1em; outline:none; }
.comments-area textarea:focus, .comments-area input:focus { border-color:var(--ink); background:#fff; }
.comments-area .form-submit input[type="submit"] { width:auto; font-weight:700; color:#fff; background:var(--ink);
  border:1px solid var(--ink); border-radius:999px; padding:.9em 2.2em; cursor:pointer; transition:background .3s, color .3s; }
.comments-area .form-submit input[type="submit"]:hover { background:transparent; color:var(--ink); }
.comments-area .comment-form p { margin-bottom:1.2em; }
.comments-area label { display:block; font-weight:700; font-size:13px; margin-bottom:.5em; }

/* 404 */
.notfound { text-align:center; max-width:640px; margin:0 auto; }
.notfound .nf-code { font-family:var(--en); font-weight:700; font-size:clamp(80px,16vw,150px); line-height:1; opacity:.08; }
.notfound h1 { font-family:var(--jp); font-weight:700; font-size:clamp(18px,2vw,24px); margin:0.4em 0 1em; }
.notfound p { font-family:var(--jp); font-size:14px; line-height:2; opacity:.6; margin-bottom:2.2em; }
.notfound .search-form { max-width:420px; margin:0 auto 2.4em; }

/* 記事なし */
.content-none { text-align:center; padding:clamp(48px,8vw,96px) 0; }
.content-none p.title { font-family:var(--jp); font-weight:700; font-size:16.5px; margin-bottom:.8em; }
.content-none p.desc { font-family:var(--jp); font-size:13.5px; opacity:.6; margin-bottom:2em; }
.content-none .search-form { max-width:420px; margin:0 auto 2em; }

/* WPコア調整 */
.wp-block-image img { border-radius:12px; }
.alignwide { max-width:1000px; margin-left:auto; margin-right:auto; }
.aligncenter { display:block; margin-left:auto; margin-right:auto; }