@charset "UTF-8";
/* ============================================================
   RIN ARCHITECTS — デザイン住宅・建築設計事務所向けテンプレート
   WordPress組込前提の共通スタイルシート

   ▼ カラーテーマ
   :root（既定 = beige）のCSS変数を、html[data-theme] で上書き。
   ACFオプションページ「サイト基本設定 > カラーテーマ」と連携想定。
   カスタムカラーは変数値の差し替えのみで対応可能。
============================================================ */

/* ==========================================================
   Design Tokens
========================================================== */
:root{
  /* — Theme: 01 Beige（リュクスベージュ / 既定） — */
  --c-bg:        #F7F5F0;
  --c-bg-soft:   #EFEBE3;
  --c-ink:       #1D1C19;
  --c-sub:       #55524B;
  --c-acc:       #A2916F;
  --c-acc-pale:  #CFC5B2;
  --c-acc-weak:  rgba(162,145,111,.07);
  --c-line:      rgba(29,28,25,.16);
  --c-line-soft: rgba(29,28,25,.09);
  --c-header-bg: rgba(247,245,240,.92);
  --c-inv-bg:    #1D1C19;
  --c-inv-ink:   #EDEAE3;
  --c-inv-sub:   rgba(237,234,227,.66);
  --c-inv-line:  rgba(237,234,227,.2);
  --c-on-photo:  #FFFFFF;

  --font-en: 'Cormorant Garamond', 'Noto Serif CJK JP', 'Times New Roman', serif;
  --font-jp: 'Zen Kaku Gothic New', 'Noto Sans CJK JP', 'Hiragino Kaku Gothic ProN', sans-serif;

  --w-max: 1360px;
  --pad-x: clamp(20px, 5vw, 72px);
  --sec-y: clamp(96px, 14vw, 200px);
  --ease: cubic-bezier(.22,.61,.2,1);
  --dur: .9s;
}

/* — Theme: 02 Mono（ギャラリーモノクローム） — */
html[data-theme="mono"]{
  --c-bg:        #FBFBFA;
  --c-bg-soft:   #F0F0EE;
  --c-ink:       #141413;
  --c-sub:       #55555220;
  --c-sub:       #565653;
  --c-acc:       #8A8A85;
  --c-acc-pale:  #CFCFCA;
  --c-acc-weak:  rgba(20,20,19,.05);
  --c-line:      rgba(20,20,19,.16);
  --c-line-soft: rgba(20,20,19,.09);
  --c-header-bg: rgba(251,251,250,.92);
  --c-inv-bg:    #131312;
}

/* — Theme: 03 Indigo（藍 / ジャパニーズモダン） — */
html[data-theme="indigo"]{
  --c-bg:        #F5F6F6;
  --c-bg-soft:   #EAEEEE;
  --c-ink:       #1A2027;
  --c-sub:       #46525C;
  --c-acc:       #4A6379;
  --c-acc-pale:  #AEBEC9;
  --c-acc-weak:  rgba(74,99,121,.07);
  --c-line:      rgba(26,32,39,.16);
  --c-line-soft: rgba(26,32,39,.09);
  --c-header-bg: rgba(245,246,246,.92);
  --c-inv-bg:    #171C22;
}

/* — Theme: 04 Forest（モスグリーン / 自然素材系） — */
html[data-theme="forest"]{
  --c-bg:        #F5F4EE;
  --c-bg-soft:   #EAE9DF;
  --c-ink:       #22261E;
  --c-sub:       #4A5044;
  --c-acc:       #6D7658;
  --c-acc-pale:  #C0C5AC;
  --c-acc-weak:  rgba(109,118,88,.08);
  --c-line:      rgba(34,38,30,.16);
  --c-line-soft: rgba(34,38,30,.09);
  --c-header-bg: rgba(245,244,238,.92);
  --c-inv-bg:    #1C2018;
}

/* — Theme: 05 Night（墨と真鍮 / ダークラグジュアリー） — */
html[data-theme="night"]{
  --c-bg:        #191816;
  --c-bg-soft:   #211F1C;
  --c-ink:       #ECE8DF;
  --c-sub:       #A8A296;
  --c-acc:       #B49B6A;
  --c-acc-pale:  #CBB88F;
  --c-acc-weak:  rgba(180,155,106,.09);
  --c-line:      rgba(236,232,223,.2);
  --c-line-soft: rgba(236,232,223,.1);
  --c-header-bg: rgba(25,24,22,.9);
  --c-inv-bg:    #131211;
}

/* ==========================================================
   Base
========================================================== */
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--c-bg);
  color:var(--c-ink);
  font-family:var(--font-jp);
  font-weight:300;
  font-size:15px;
  line-height:2.1;
  letter-spacing:.06em;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  transition:background .6s ease, color .6s ease;
}
img{display:block;width:100%;height:100%;object-fit:cover;}
a{color:inherit;text-decoration:none;}
ul,ol{list-style:none;}
button{font-family:inherit;}
:focus-visible{outline:1.5px solid var(--c-acc);outline-offset:3px;}

.wrap{max-width:var(--w-max);margin:0 auto;padding-inline:var(--pad-x);}
.wrap--narrow{max-width:960px;}

.en{
  font-family:var(--font-en);
  font-weight:300;
  letter-spacing:.08em;
  line-height:1.05;
}
.sec-label{
  display:flex;align-items:center;gap:18px;
  font-family:var(--font-en);
  font-size:12px;letter-spacing:.34em;
  color:var(--c-sub);
  text-transform:uppercase;
  margin-bottom:clamp(28px,4vw,52px);
}
.sec-label::before{content:"";width:44px;height:1px;background:var(--c-acc);}
.sec-label .no{color:var(--c-acc);letter-spacing:.2em;}
.sec-title-jp{
  font-size:clamp(22px,3vw,34px);
  font-weight:300;letter-spacing:.22em;line-height:1.9;
}
.sec-title-en{
  font-size:clamp(46px,7.5vw,104px);
  color:var(--c-ink);
}
.lead{
  font-size:clamp(14px,1.4vw,15.5px);
  line-height:2.4;letter-spacing:.1em;
  color:var(--c-sub);
}
.tate{
  writing-mode:vertical-rl;
  letter-spacing:.42em;
  font-weight:300;
  color:var(--c-sub);
}

/* Reveal */
.rv{opacity:0;transform:translateY(28px);transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease);}
.rv.is-in{opacity:1;transform:none;}
.rv-img{overflow:hidden;}
.rv-img img{transform:scale(1.08);transition:transform 1.6s var(--ease);}
.rv-img.is-in img{transform:scale(1);}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .rv,.rv-img img{opacity:1 !important;transform:none !important;transition:none !important;}
  .hero-slide{transition:none !important;}
}

/* ==========================================================
   Header（WP: header.php / ACF: ロゴ・メニュー）
========================================================== */
.header{
  position:fixed;inset:0 0 auto 0;z-index:100;
  display:flex;justify-content:space-between;align-items:center;
  padding:26px var(--pad-x);
  transition:background .5s var(--ease), padding .5s var(--ease), color .4s;
  color:var(--c-on-photo);
}
.header.is-solid{
  background:var(--c-header-bg);
  backdrop-filter:blur(8px);
  color:var(--c-ink);
  padding-block:16px;
  border-bottom:1px solid var(--c-line-soft);
}
.brand{display:flex;flex-direction:column;line-height:1.3;}
.brand .en{font-size:21px;letter-spacing:.24em;}
.brand small{font-size:10px;letter-spacing:.3em;font-weight:300;opacity:.75;}
.gnav{display:flex;gap:clamp(18px,2.6vw,38px);align-items:center;}
.gnav a{
  font-family:var(--font-en);
  font-size:12.5px;letter-spacing:.22em;
  position:relative;padding-block:6px;
}
.gnav a::after{
  content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;
  background:currentColor;transform:scaleX(0);transform-origin:right;
  transition:transform .5s var(--ease);
}
.gnav a:hover::after,
.gnav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left;}
.nav-contact{
  border:1px solid currentColor;
  padding:10px 26px !important;
  transition:background .4s,color .4s;
}
.nav-contact::after{display:none;}
.header:not(.is-solid) .nav-contact:hover{background:var(--c-on-photo);color:#1D1C19;}
.header.is-solid .nav-contact:hover{background:var(--c-ink);color:var(--c-bg);}
.menu-btn{display:none;}
.sp-nav{display:none;}

/* ==========================================================
   Hero（TOP / ACF: FVスライダー）
========================================================== */
.hero{position:relative;height:100svh;min-height:640px;color:var(--c-on-photo);overflow:hidden;}
.hero-slides{position:absolute;inset:0;}
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity 2.2s ease;}
.hero-slide.is-act{opacity:1;}
.hero-slide img{will-change:transform;}
.hero::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(to top, rgba(15,14,12,.55), rgba(15,14,12,.08) 45%, rgba(15,14,12,.18));
}
.hero-inner{position:absolute;inset:auto 0 0 0;z-index:2;padding:0 var(--pad-x) clamp(56px,9vh,110px);}
.hero-copy-en{font-size:clamp(44px,7.6vw,110px);line-height:1.04;letter-spacing:.04em;margin-bottom:26px;}
.hero-copy-en em{font-style:italic;color:var(--c-acc-pale);}
.hero-copy-jp{font-size:clamp(13px,1.5vw,16px);letter-spacing:.3em;line-height:2.3;font-weight:300;}
.hero-tate{
  position:absolute;top:50%;right:calc(var(--pad-x) - 6px);transform:translateY(-50%);
  z-index:2;color:var(--c-on-photo);font-size:13px;opacity:.85;
}
.hero-scroll{
  position:absolute;bottom:0;z-index:3;
  font-family:var(--font-en);font-size:10.5px;letter-spacing:.4em;color:var(--c-on-photo);
  display:flex;flex-direction:column;align-items:center;gap:14px;
  transform:translateX(-50%);left:50%;
}
.hero-scroll span{writing-mode:vertical-rl;}
.hero-scroll::after{
  content:"";width:1px;height:64px;background:rgba(255,255,255,.7);
  animation:scrollline 2.4s var(--ease) infinite;transform-origin:top;
}
@keyframes scrollline{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.hero-index{
  position:absolute;z-index:2;bottom:clamp(56px,9vh,110px);right:var(--pad-x);
  font-family:var(--font-en);font-size:12px;letter-spacing:.3em;color:var(--c-on-photo);opacity:.8;
}

/* ==========================================================
   下層共通：ページヘッド（WP: page.php 各テンプレ）
========================================================== */
.page-head{padding:calc(96px + clamp(48px,8vw,104px)) 0 clamp(44px,6vw,72px);}
.ph-en{font-size:clamp(50px,8vw,108px);line-height:1;}
.ph-jp{font-size:clamp(13px,1.5vw,16px);letter-spacing:.3em;color:var(--c-sub);margin-top:20px;font-weight:300;}
.breadcrumb{
  display:flex;flex-wrap:wrap;gap:14px;
  font-family:var(--font-en);font-size:10.5px;letter-spacing:.22em;
  color:var(--c-sub);margin-top:clamp(26px,4vw,40px);
}
.breadcrumb li+li::before{content:"/";margin-right:14px;color:var(--c-acc);}
.breadcrumb a{transition:color .3s;}
.breadcrumb a:hover{color:var(--c-ink);}
.page-kv{height:clamp(240px,44vw,520px);}
.page-body{padding-block:clamp(64px,9vw,120px) var(--sec-y);}

/* ==========================================================
   TOP: 02 Message
========================================================== */
.message{padding-block:var(--sec-y);position:relative;}
.message .wrap{display:grid;grid-template-columns:auto 1fr;gap:clamp(40px,8vw,130px);align-items:start;}
.message-tate{
  font-size:clamp(24px,3.2vw,38px);
  letter-spacing:.5em;line-height:2.4;
  height:clamp(460px,50vw,680px);
  color:var(--c-ink);
}
.message-body{padding-top:clamp(8px,2vw,30px);max-width:600px;}
.message-ghost{
  position:absolute;top:clamp(20px,4vw,60px);right:calc(-1 * clamp(10px,2vw,30px));
  font-size:clamp(90px,16vw,230px);
  color:transparent;-webkit-text-stroke:1px var(--c-line-soft);
  pointer-events:none;user-select:none;white-space:nowrap;line-height:1;
}
.message-body h2{
  font-size:clamp(19px,2.2vw,26px);
  font-weight:300;letter-spacing:.2em;line-height:2.2;
  margin-bottom:34px;
}
.message-body p{margin-bottom:1.8em;}
.message-body p:last-of-type{margin-bottom:0;}

.more{
  display:inline-flex;align-items:center;gap:22px;
  font-family:var(--font-en);font-size:12.5px;letter-spacing:.3em;
  margin-top:44px;color:var(--c-ink);
}
.more .line{width:64px;height:1px;background:var(--c-ink);position:relative;transition:width .5s var(--ease);}
.more .line::after{
  content:"";position:absolute;right:0;bottom:0;width:10px;height:1px;background:var(--c-ink);
  transform:rotate(28deg);transform-origin:right bottom;
}
.more:hover .line{width:96px;}

/* ==========================================================
   TOP: 03 Concept
========================================================== */
.concept{position:relative;padding-bottom:var(--sec-y);}
.concept-img{height:clamp(340px,62vh,640px);}
.concept-img img{will-change:transform;}
.concept-panel{
  position:relative;max-width:640px;
  background:var(--c-bg);
  margin:calc(-1 * clamp(70px,10vw,150px)) auto 0 auto;
  padding:clamp(36px,5vw,64px) clamp(28px,5vw,64px) 0;
  transition:background .6s ease;
}
.concept-panel .sec-title-jp{margin-bottom:26px;}

/* ==========================================================
   TOP: 04 Craft（下層 design.html 共用）
========================================================== */
.craft{padding-block:var(--sec-y);background:var(--c-bg-soft);transition:background .6s ease;}
.craft--page{background:transparent;padding-block:0 var(--sec-y);}
.craft-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:30px;margin-bottom:clamp(48px,7vw,90px);}
.craft-list{display:flex;flex-direction:column;gap:clamp(64px,9vw,120px);}
.craft-item{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(20px,3vw,48px);align-items:center;}
.craft-item .ci-img{grid-column:1 / span 7;height:clamp(240px,36vw,460px);}
.craft-item .ci-txt{grid-column:8 / span 5;}
.craft-item:nth-child(even) .ci-img{grid-column:6 / span 7;order:2;}
.craft-item:nth-child(even) .ci-txt{grid-column:1 / span 5;order:1;}
.ci-no{font-family:var(--font-en);font-size:13px;letter-spacing:.3em;color:var(--c-acc);margin-bottom:14px;}
.ci-en{font-size:clamp(30px,3.6vw,46px);margin-bottom:6px;}
.ci-jp{font-size:13px;letter-spacing:.3em;color:var(--c-sub);margin-bottom:20px;}
.craft-index{
  display:flex;flex-wrap:wrap;gap:10px 26px;
  margin-top:clamp(52px,7vw,84px);
  padding-top:34px;border-top:1px solid var(--c-line);
  font-family:var(--font-en);font-size:12.5px;letter-spacing:.26em;color:var(--c-sub);
}
.craft-index li{display:flex;gap:10px;align-items:baseline;}
.craft-index li span{color:var(--c-acc);font-size:11px;}

/* ==========================================================
   Works 共通（TOP 非対称グリッド / 一覧 / 関連実績）
========================================================== */
.works{padding-block:var(--sec-y);}
.works-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:30px;margin-bottom:clamp(48px,6vw,80px);}
.works-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(20px,3.4vw,56px) clamp(16px,2.6vw,40px);}
.work{display:block;position:relative;}
.work figure{overflow:hidden;}
.work img{transition:transform 1.4s var(--ease);}
.work:hover img{transform:scale(1.05);}
.work-meta{margin-top:16px;display:flex;flex-direction:column;gap:2px;}
.work-cat{font-family:var(--font-en);font-size:10.5px;letter-spacing:.3em;color:var(--c-acc);text-transform:uppercase;}
.work-title{font-size:14.5px;letter-spacing:.18em;font-weight:300;}
.work-place{font-size:11.5px;letter-spacing:.2em;color:var(--c-sub);}
/* TOP用 非対称リズム */
.works-grid .work:nth-of-type(6n+1){grid-column:1 / span 5;}
.works-grid .work:nth-of-type(6n+1) figure{aspect-ratio:4/5;}
.works-grid .work:nth-of-type(6n+2){grid-column:7 / span 6;margin-top:clamp(60px,8vw,120px);}
.works-grid .work:nth-of-type(6n+2) figure{aspect-ratio:5/4;}
.works-grid .work:nth-of-type(6n+3){grid-column:2 / span 5;margin-top:calc(-1 * clamp(10px,3vw,50px));}
.works-grid .work:nth-of-type(6n+3) figure{aspect-ratio:1/1;}
.works-grid .work:nth-of-type(6n+4){grid-column:8 / span 5;margin-top:clamp(30px,5vw,70px);}
.works-grid .work:nth-of-type(6n+4) figure{aspect-ratio:4/5;}
.works-grid .work:nth-of-type(6n+5){grid-column:1 / span 6;margin-top:clamp(20px,4vw,60px);}
.works-grid .work:nth-of-type(6n+5) figure{aspect-ratio:5/4;}
.works-grid .work:nth-of-type(6n){grid-column:8 / span 4;margin-top:clamp(50px,7vw,110px);}
.works-grid .work:nth-of-type(6n) figure{aspect-ratio:1/1;}
.works-more{display:flex;justify-content:center;margin-top:clamp(60px,8vw,100px);}

/* 一覧・関連用 整列グリッド（件数可変） */
.wgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(36px,5vw,64px) clamp(18px,2.6vw,36px);}
.wgrid .work figure{aspect-ratio:4/5;}
.wgrid .work{transition:opacity .5s var(--ease), transform .5s var(--ease);}
.wgrid .work.is-hide{display:none;}

/* カテゴリーフィルター（Works / FAQ / News 共用） */
.filter{
  display:flex;flex-wrap:wrap;gap:clamp(16px,3vw,34px);
  border-bottom:1px solid var(--c-line);
  margin-bottom:clamp(44px,6vw,72px);
}
.filter button{
  background:none;border:0;cursor:pointer;
  font-family:var(--font-en);font-size:12.5px;letter-spacing:.26em;
  color:var(--c-sub);padding:4px 2px 16px;
  border-bottom:1px solid transparent;margin-bottom:-1px;
  transition:color .3s,border-color .3s;
}
.filter button small{display:block;font-family:var(--font-jp);font-size:9.5px;letter-spacing:.24em;margin-top:4px;}
.filter button:hover{color:var(--c-ink);}
.filter button.is-act{color:var(--c-ink);border-color:var(--c-ink);}

/* ==========================================================
   Flow（TOP: 横スクロール / 下層: 縦タイムライン）
========================================================== */
.flow{padding-block:var(--sec-y);background:var(--c-inv-bg);color:var(--c-inv-ink);transition:background .6s ease;}
.flow .sec-label{color:var(--c-inv-ink);}
.flow .sec-title-jp{color:var(--c-inv-ink);}
.flow-head{margin-bottom:clamp(48px,6vw,80px);display:grid;grid-template-columns:1fr auto;align-items:end;gap:30px;}
.flow-lead{color:var(--c-inv-sub);max-width:560px;}
.flow-track{
  display:grid;grid-auto-flow:column;grid-auto-columns:clamp(230px,24vw,300px);
  overflow-x:auto;padding-bottom:22px;
  scrollbar-width:thin;scrollbar-color:var(--c-acc) transparent;
}
.flow-step{border-left:1px solid var(--c-inv-line);padding:8px 26px 0;}
.flow-step:last-child{border-right:1px solid var(--c-inv-line);}
.fs-no{font-family:var(--font-en);font-size:15px;letter-spacing:.24em;color:var(--c-acc);margin-bottom:60px;}
.fs-title{font-size:16.5px;letter-spacing:.24em;font-weight:300;margin-bottom:16px;color:var(--c-inv-ink);}
.fs-txt{font-size:12.5px;line-height:2.1;color:var(--c-inv-sub);}
.flow-note{margin-top:34px;font-family:var(--font-en);font-size:11px;letter-spacing:.3em;color:var(--c-inv-sub);}

/* 下層 flow.html: 縦タイムライン（ACF: 繰り返し） */
.timeline{max-width:900px;border-top:1px solid var(--c-line);}
.tl-item{
  display:grid;grid-template-columns:150px 1fr;gap:clamp(24px,4vw,54px);
  padding:clamp(36px,5vw,54px) 6px;
  border-bottom:1px solid var(--c-line);
}
.tl-no{font-family:var(--font-en);font-size:clamp(28px,3.4vw,40px);letter-spacing:.14em;color:var(--c-acc);line-height:1.2;}
.tl-no small{display:block;font-size:10px;letter-spacing:.3em;color:var(--c-sub);margin-top:10px;text-transform:uppercase;}
.tl-title{font-size:clamp(17px,2vw,21px);letter-spacing:.24em;font-weight:300;margin-bottom:14px;}
.tl-txt{color:var(--c-sub);}
.tl-tag{
  display:inline-block;margin-top:18px;
  font-size:10.5px;letter-spacing:.24em;color:var(--c-acc);
  border:1px solid var(--c-acc-pale);padding:4px 16px;
}

/* ==========================================================
   Staff
========================================================== */
.staff{padding-block:var(--sec-y);}
.staff-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:30px;margin-bottom:clamp(48px,6vw,80px);}
.staff-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3vw,44px);}
.staff-grid--page{grid-template-columns:repeat(2,1fr);gap:clamp(40px,6vw,80px) clamp(24px,4vw,56px);}
.staff-card figure{aspect-ratio:3/4;overflow:hidden;}
.staff-card img{transition:transform 1.4s var(--ease);filter:saturate(.9);}
.staff-card:hover img{transform:scale(1.04);}
.staff-meta{margin-top:16px;}
.staff-role{font-family:var(--font-en);font-size:10.5px;letter-spacing:.28em;color:var(--c-acc);text-transform:uppercase;}
.staff-name{font-size:15px;letter-spacing:.22em;margin-top:2px;}
.staff-name small{font-family:var(--font-en);font-size:11px;letter-spacing:.2em;color:var(--c-sub);margin-left:12px;}
.staff-grid--page .staff-name{font-size:18px;}
.staff-prof{margin-top:14px;font-size:13px;color:var(--c-sub);line-height:2.2;}

/* ==========================================================
   Voice
========================================================== */
.voice{padding-block:var(--sec-y);background:var(--c-bg-soft);transition:background .6s ease;}
.voice-inner{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(24px,4vw,56px);align-items:center;}
.voice-img{grid-column:1 / span 6;aspect-ratio:4/3;}
.voice-txt{grid-column:7 / span 6;position:relative;}
.voice-txt .sec-label{margin-bottom:30px;}
.voice-quote{
  font-size:clamp(17px,1.9vw,21px);
  line-height:2.4;letter-spacing:.14em;font-weight:300;margin-bottom:28px;
}
.voice-attr{font-size:12px;letter-spacing:.24em;color:var(--c-sub);}
.voice-mark{
  font-family:var(--font-en);font-style:italic;
  font-size:clamp(64px,7vw,96px);line-height:.5;
  color:var(--c-acc-pale);
  display:block;margin:26px 0 30px;
}
/* 下層 voice.html: 交互リスト */
.voice-list{display:flex;flex-direction:column;gap:clamp(72px,10vw,130px);}
.voice-row{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(24px,4vw,56px);align-items:center;}
.voice-row figure{grid-column:1 / span 6;aspect-ratio:4/3;}
.voice-row .voice-txt{grid-column:7 / span 6;}
.voice-row:nth-child(even) figure{grid-column:7 / span 6;order:2;}
.voice-row:nth-child(even) .voice-txt{grid-column:1 / span 6;order:1;}

/* ==========================================================
   News
========================================================== */
.news{padding-block:var(--sec-y);}
.news-inner{display:grid;grid-template-columns:auto 1fr;gap:clamp(40px,8vw,140px);}
.news-list{border-top:1px solid var(--c-line);}
.news-item{
  display:grid;grid-template-columns:120px 110px 1fr;gap:26px;align-items:baseline;
  padding:26px 4px;border-bottom:1px solid var(--c-line);
  transition:background .4s;
}
.news-item:hover{background:var(--c-acc-weak);}
.news-date{font-family:var(--font-en);font-size:12.5px;letter-spacing:.18em;color:var(--c-sub);}
.news-cat{font-size:10.5px;letter-spacing:.26em;color:var(--c-acc);border:1px solid var(--c-acc-pale);text-align:center;padding:3px 0;}
.news-title{font-size:14px;letter-spacing:.12em;}

/* ==========================================================
   CTA（共通パーツ / WP: template-parts/cta.php）
========================================================== */
.cta{position:relative;color:var(--c-on-photo);padding-block:clamp(110px,17vw,220px);overflow:hidden;}
.cta-bg{position:absolute;inset:0;}
.cta-bg::after{content:"";position:absolute;inset:0;background:rgba(16,15,13,.58);}
.cta-inner{position:relative;z-index:2;text-align:center;display:flex;flex-direction:column;align-items:center;}
.cta-en{font-size:clamp(40px,6.4vw,84px);margin-bottom:22px;}
.cta-en em{font-style:italic;color:var(--c-acc-pale);}
.cta-jp{font-size:clamp(13px,1.5vw,15.5px);letter-spacing:.28em;line-height:2.4;margin-bottom:52px;color:rgba(255,255,255,.88);}
.cta-btn{
  font-family:var(--font-en);font-size:13px;letter-spacing:.34em;
  border:1px solid rgba(255,255,255,.85);
  padding:20px 74px;color:var(--c-on-photo);
  transition:background .5s,color .5s;
}
.cta-btn:hover{background:#fff;color:#1D1C19;}
.cta-tel{margin-top:34px;font-family:var(--font-en);font-size:13px;letter-spacing:.24em;color:rgba(255,255,255,.75);}
.cta-tel strong{font-size:19px;font-weight:400;color:#fff;margin-left:14px;}

/* ==========================================================
   Footer（WP: footer.php）
========================================================== */
.footer{background:var(--c-inv-bg);color:var(--c-inv-sub);padding:clamp(70px,9vw,110px) 0 40px;transition:background .6s ease;}
.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:clamp(36px,5vw,70px);padding-bottom:64px;}
.f-brand .en{font-size:24px;letter-spacing:.24em;color:var(--c-inv-ink);}
.f-brand small{display:block;font-size:10px;letter-spacing:.3em;margin-top:6px;}
.f-brand address{font-style:normal;font-size:12px;line-height:2.3;letter-spacing:.12em;margin-top:26px;}
.f-col h4{font-family:var(--font-en);font-size:11px;letter-spacing:.34em;color:var(--c-acc);margin-bottom:22px;font-weight:400;}
.f-col ul{display:flex;flex-direction:column;gap:10px;}
.f-col a{font-size:12.5px;letter-spacing:.16em;transition:color .3s;}
.f-col a:hover{color:var(--c-inv-ink);}
.f-bottom{
  border-top:1px solid var(--c-inv-line);
  padding-top:28px;
  display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
  font-family:var(--font-en);font-size:10.5px;letter-spacing:.24em;
}
.f-sns{display:flex;gap:26px;}
.f-sns a:hover{color:var(--c-inv-ink);}

/* ==========================================================
   About（about.html）
========================================================== */
.ab-intro{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(24px,4vw,60px);margin-bottom:var(--sec-y);}
.ab-intro-txt{grid-column:1 / span 6;}
.ab-intro-txt h2{font-size:clamp(20px,2.4vw,28px);font-weight:300;letter-spacing:.2em;line-height:2.1;margin-bottom:30px;}
.ab-intro-img{grid-column:8 / span 5;aspect-ratio:3/4;margin-top:clamp(30px,5vw,70px);}
.ab-wide{height:clamp(280px,52vw,560px);margin-bottom:var(--sec-y);}
.ceo{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(24px,4vw,60px);align-items:start;margin-bottom:var(--sec-y);}
.ceo-img{grid-column:1 / span 5;aspect-ratio:4/5;}
.ceo-txt{grid-column:7 / span 6;}
.ceo-txt h2{font-size:clamp(19px,2.2vw,25px);font-weight:300;letter-spacing:.2em;line-height:2.1;margin:26px 0 28px;}
.ceo-sign{margin-top:38px;display:flex;align-items:baseline;gap:20px;}
.ceo-sign small{font-size:11px;letter-spacing:.26em;color:var(--c-sub);}
.ceo-sign span{font-size:21px;letter-spacing:.3em;}
.philosophy-list{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,44px);counter-reset:phi;}
.phi-item{border-top:1px solid var(--c-ink);padding-top:26px;}
.phi-item .en{font-size:13px;letter-spacing:.3em;color:var(--c-acc);display:block;margin-bottom:16px;}
.phi-item h3{font-size:16.5px;font-weight:300;letter-spacing:.22em;margin-bottom:16px;}
.phi-item p{font-size:13px;color:var(--c-sub);}
.story{position:relative;margin-top:var(--sec-y);}
.story-bg{height:clamp(300px,52vw,540px);}
.story-panel{
  position:relative;max-width:760px;background:var(--c-bg);
  margin:calc(-1 * clamp(60px,9vw,130px)) auto 0;
  padding:clamp(36px,5vw,64px) clamp(28px,5vw,64px) 0;
  transition:background .6s ease;
}

/* ==========================================================
   Concept（concept.html）
========================================================== */
.cp-block{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(24px,4vw,60px);align-items:center;margin-bottom:var(--sec-y);}
.cp-block figure{grid-column:1 / span 7;height:clamp(260px,40vw,480px);}
.cp-block .cp-txt{grid-column:8 / span 5;}
.cp-block:nth-of-type(even) figure{grid-column:6 / span 7;order:2;}
.cp-block:nth-of-type(even) .cp-txt{grid-column:1 / span 5;order:1;}
.cp-txt h2{font-size:clamp(19px,2.2vw,26px);font-weight:300;letter-spacing:.22em;line-height:2;margin-bottom:24px;}
.cp-full{margin-bottom:var(--sec-y);}
.cp-full figure{height:clamp(300px,56vw,600px);margin-bottom:clamp(30px,4vw,50px);}
.cp-full .cp-txt{max-width:680px;margin:0 auto;text-align:center;}
.cp-statement{
  text-align:center;max-width:800px;margin:0 auto var(--sec-y);
  font-size:clamp(18px,2.4vw,26px);letter-spacing:.24em;line-height:2.4;font-weight:300;
}

/* ==========================================================
   Company（company.html）
========================================================== */
.def{border-top:1px solid var(--c-line);max-width:960px;}
.def-row{display:grid;grid-template-columns:240px 1fr;gap:20px;padding:26px 6px;border-bottom:1px solid var(--c-line);}
.def-row dt{font-size:13px;letter-spacing:.24em;color:var(--c-sub);}
.def-row dt small{display:block;font-family:var(--font-en);font-size:10px;letter-spacing:.28em;color:var(--c-acc);margin-top:2px;text-transform:uppercase;}
.def-row dd{font-size:14px;letter-spacing:.12em;}
.map-ph{
  margin-top:var(--sec-y);
  aspect-ratio:16/7;min-height:280px;
  background:
    linear-gradient(var(--c-line-soft) 1px, transparent 1px),
    linear-gradient(90deg, var(--c-line-soft) 1px, transparent 1px),
    var(--c-bg-soft);
  background-size:44px 44px, 44px 44px, auto;
  display:grid;place-items:center;
  transition:background .6s ease;
}
.map-ph p{font-family:var(--font-en);font-size:12px;letter-spacing:.3em;color:var(--c-sub);text-align:center;line-height:2.4;}
.map-ph p small{display:block;font-family:var(--font-jp);font-size:10.5px;letter-spacing:.2em;}

/* ==========================================================
   Works detail（works-detail.html）
========================================================== */
.wd-head{margin-bottom:clamp(40px,6vw,64px);}
.wd-head .work-cat{font-size:12px;}
.wd-title{font-size:clamp(28px,4vw,44px);font-weight:300;letter-spacing:.24em;line-height:1.8;margin:14px 0 10px;}
.wd-place{font-size:12.5px;letter-spacing:.24em;color:var(--c-sub);}
.wd-lead{max-width:720px;margin-bottom:clamp(48px,7vw,88px);}
.wd-gallery{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(16px,2.6vw,36px);margin-bottom:var(--sec-y);}
.wd-gallery figure:nth-child(1){grid-column:1 / -1;aspect-ratio:16/9;}
.wd-gallery figure:nth-child(2){grid-column:1 / span 7;aspect-ratio:4/3;}
.wd-gallery figure:nth-child(3){grid-column:8 / span 5;aspect-ratio:3/4;}
.wd-gallery figure:nth-child(4){grid-column:1 / span 5;aspect-ratio:3/4;margin-top:clamp(20px,4vw,60px);}
.wd-gallery figure:nth-child(5){grid-column:6 / span 7;aspect-ratio:4/3;}
.wd-cols{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(30px,5vw,80px);margin-bottom:var(--sec-y);}
.wd-spec{grid-column:1 / span 5;}
.wd-points{grid-column:7 / span 6;}
.wd-sub{font-family:var(--font-en);font-size:12px;letter-spacing:.32em;color:var(--c-acc);text-transform:uppercase;display:flex;align-items:center;gap:16px;margin-bottom:28px;}
.wd-sub::after{content:"";flex:1;height:1px;background:var(--c-line);}
.spec-row{display:grid;grid-template-columns:150px 1fr;gap:14px;padding:16px 4px;border-bottom:1px solid var(--c-line-soft);font-size:13.5px;}
.spec-row dt{color:var(--c-sub);letter-spacing:.2em;}
.point{padding:20px 0;border-bottom:1px solid var(--c-line-soft);}
.point h3{font-size:15px;font-weight:300;letter-spacing:.2em;margin-bottom:10px;display:flex;gap:16px;align-items:baseline;}
.point h3 span{font-family:var(--font-en);font-size:12px;color:var(--c-acc);letter-spacing:.2em;}
.point p{font-size:13px;color:var(--c-sub);}
.related h2{margin-bottom:clamp(36px,5vw,56px);}
.wd-nav{display:flex;justify-content:space-between;margin-top:var(--sec-y);padding-top:30px;border-top:1px solid var(--c-line);font-family:var(--font-en);font-size:12px;letter-spacing:.3em;}
.wd-nav a{color:var(--c-sub);transition:color .3s;}
.wd-nav a:hover{color:var(--c-ink);}

/* ==========================================================
   FAQ（faq.html）
========================================================== */
.faq-list{border-top:1px solid var(--c-line);max-width:960px;}
.acc{border-bottom:1px solid var(--c-line);}
.acc.is-hide{display:none;}
.acc-q{
  width:100%;background:none;border:0;cursor:pointer;text-align:left;
  display:grid;grid-template-columns:auto 1fr auto;gap:clamp(16px,3vw,30px);align-items:baseline;
  padding:clamp(22px,3vw,30px) 6px;
  font-size:15px;letter-spacing:.14em;font-weight:300;line-height:2;color:var(--c-ink);
  transition:background .3s;
}
.acc-q:hover{background:var(--c-acc-weak);}
.acc-q .q{font-family:var(--font-en);font-style:italic;font-size:19px;color:var(--c-acc);}
.acc-toggle{position:relative;width:16px;height:16px;align-self:center;}
.acc-toggle::before,.acc-toggle::after{
  content:"";position:absolute;inset:50% auto auto 0;width:100%;height:1px;background:var(--c-ink);
  transition:transform .45s var(--ease);
}
.acc-toggle::after{transform:rotate(90deg);}
.acc.is-open .acc-toggle::after{transform:rotate(0);}
.acc-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease);}
.acc.is-open .acc-a{grid-template-rows:1fr;}
.acc-a-inner{overflow:hidden;}
.acc-a-body{
  display:grid;grid-template-columns:auto 1fr;gap:clamp(16px,3vw,30px);
  padding:0 6px clamp(24px,3vw,32px);
  color:var(--c-sub);font-size:13.5px;
}
.acc-a-body .a{font-family:var(--font-en);font-style:italic;font-size:19px;color:var(--c-acc-pale);line-height:1.4;}

/* ==========================================================
   News list / detail（news.html / news-detail.html）
========================================================== */
.pagination{display:flex;gap:10px;justify-content:center;margin-top:clamp(50px,7vw,80px);font-family:var(--font-en);font-size:12.5px;letter-spacing:.1em;}
.pagination a{
  width:46px;height:46px;display:grid;place-items:center;
  border:1px solid var(--c-line);transition:background .3s,color .3s,border-color .3s;
}
.pagination a:hover{border-color:var(--c-ink);}
.pagination a.is-act{background:var(--c-ink);color:var(--c-bg);border-color:var(--c-ink);}
.article{max-width:760px;margin:0 auto;}
.article-head{margin-bottom:clamp(36px,5vw,56px);}
.article-meta{display:flex;gap:20px;align-items:center;margin-bottom:20px;}
.article-title{font-size:clamp(21px,2.8vw,30px);font-weight:300;letter-spacing:.16em;line-height:2;}
.article-kv{aspect-ratio:16/9;margin-bottom:clamp(36px,5vw,56px);}
.article-body p{margin-bottom:1.8em;color:var(--c-sub);}
.article-body h2{
  font-size:17.5px;font-weight:400;letter-spacing:.2em;line-height:1.9;
  border-left:2px solid var(--c-acc);padding-left:20px;
  margin:56px 0 24px;color:var(--c-ink);
}
.article-back{display:flex;justify-content:center;margin-top:clamp(50px,7vw,80px);}

/* ==========================================================
   Contact（contact.html）
========================================================== */
.contact-grid{display:grid;grid-template-columns:1fr 380px;gap:clamp(40px,6vw,90px);align-items:start;}
.form-row{display:grid;grid-template-columns:230px 1fr;gap:20px;padding:clamp(20px,3vw,28px) 0;border-bottom:1px solid var(--c-line-soft);}
.form-row > label,.form-label{font-size:13px;letter-spacing:.2em;padding-top:12px;}
.req{
  display:inline-block;margin-left:12px;
  font-size:9.5px;letter-spacing:.2em;color:var(--c-acc);
  border:1px solid var(--c-acc-pale);padding:1px 8px;vertical-align:middle;
}
input[type="text"],input[type="email"],input[type="tel"],select,textarea{
  width:100%;background:transparent;
  border:1px solid var(--c-line);
  padding:14px 16px;font-family:inherit;font-size:14px;letter-spacing:.08em;
  color:var(--c-ink);transition:border-color .3s;
  border-radius:0;-webkit-appearance:none;appearance:none;
}
select{background-image:linear-gradient(45deg, transparent 49%, var(--c-sub) 50%),linear-gradient(-45deg, transparent 49%, var(--c-sub) 50%);background-position:calc(100% - 22px) 55%,calc(100% - 16px) 55%;background-size:6px 6px;background-repeat:no-repeat;}
textarea{min-height:180px;resize:vertical;}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--c-acc);}
.radio-set{display:flex;flex-wrap:wrap;gap:14px 28px;padding-top:10px;}
.radio-set label{display:flex;align-items:center;gap:10px;font-size:13.5px;cursor:pointer;}
input[type="radio"],input[type="checkbox"]{
  appearance:none;width:16px;height:16px;border:1px solid var(--c-line);
  display:grid;place-items:center;cursor:pointer;transition:border-color .3s;
}
input[type="radio"]{border-radius:50%;}
input[type="radio"]::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c-acc);transform:scale(0);transition:transform .25s;}
input[type="radio"]:checked{border-color:var(--c-acc);}
input[type="radio"]:checked::before{transform:scale(1);}
input[type="checkbox"]::before{content:"";width:9px;height:5px;border-left:1.5px solid var(--c-acc);border-bottom:1.5px solid var(--c-acc);transform:rotate(-45deg) scale(0);transition:transform .25s;margin-top:-2px;}
input[type="checkbox"]:checked{border-color:var(--c-acc);}
input[type="checkbox"]:checked::before{transform:rotate(-45deg) scale(1);}
.form-agree{display:flex;justify-content:center;gap:12px;align-items:center;margin:38px 0 30px;font-size:13px;}
.form-agree a{text-decoration:underline;text-underline-offset:4px;color:var(--c-sub);}
.form-submit{display:flex;justify-content:center;}
.btn-primary{
  font-family:var(--font-en);font-size:13px;letter-spacing:.34em;
  background:var(--c-ink);color:var(--c-bg);
  border:1px solid var(--c-ink);
  padding:20px 84px;cursor:pointer;
  transition:background .5s,color .5s;
}
.btn-primary:hover{background:transparent;color:var(--c-ink);}
.contact-aside{border:1px solid var(--c-line);padding:clamp(26px,4vw,40px);}
.contact-aside h3{font-family:var(--font-en);font-size:12px;letter-spacing:.32em;color:var(--c-acc);text-transform:uppercase;margin-bottom:18px;font-weight:400;}
.contact-aside .tel{font-family:var(--font-en);font-size:26px;letter-spacing:.12em;margin-bottom:6px;}
.contact-aside p{font-size:12.5px;color:var(--c-sub);line-height:2.2;}
.contact-aside hr{border:0;border-top:1px solid var(--c-line-soft);margin:26px 0;}
.contact-map{margin-top:var(--sec-y);}
.contact-map .map-ph{margin-top:0;}

/* ==========================================================
   Privacy 等 テキストページ
========================================================== */
.txt-page{max-width:820px;}
.txt-page > p{color:var(--c-sub);margin-bottom:2em;}
.txt-sec{margin-bottom:clamp(36px,5vw,52px);}
.txt-sec h2{
  font-size:16.5px;font-weight:400;letter-spacing:.2em;
  border-left:2px solid var(--c-acc);padding-left:20px;
  margin-bottom:18px;
}
.txt-sec p,.txt-sec li{font-size:13.5px;color:var(--c-sub);}
.txt-sec ul{padding-left:2px;}
.txt-sec ul li{padding-left:20px;position:relative;margin-bottom:6px;}
.txt-sec ul li::before{content:"";position:absolute;left:2px;top:14px;width:8px;height:1px;background:var(--c-acc);}

/* ==========================================================
   テーマスイッチャー（テンプレート機能 / 左下固定）
   WP化の際は ACF オプション「カラーテーマ」+ 管理画面プレビュー用
========================================================== */
.theme-sw{position:fixed;left:22px;bottom:22px;z-index:120;}
.tsw-btn{
  width:58px;height:58px;border-radius:50%;
  background:var(--c-ink);color:var(--c-bg);
  border:0;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  box-shadow:0 10px 34px rgba(0,0,0,.22);
  transition:transform .4s var(--ease), background .6s ease, color .6s ease;
}
.tsw-btn:hover{transform:translateY(-3px);}
.tsw-btn .dot{
  width:17px;height:17px;border-radius:50%;
  background:conic-gradient(var(--c-acc) 0 50%, var(--c-bg-soft) 50% 100%);
  border:1px solid rgba(255,255,255,.25);
}
.tsw-btn small{font-family:var(--font-en);font-size:8.5px;letter-spacing:.24em;}
.tsw-panel{
  position:absolute;left:0;bottom:calc(100% + 16px);
  width:284px;
  background:var(--c-bg);
  border:1px solid var(--c-line);
  box-shadow:0 20px 60px rgba(0,0,0,.16);
  padding:20px 16px 14px;
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .4s var(--ease), transform .4s var(--ease), visibility .4s, background .6s ease;
}
.theme-sw.is-open .tsw-panel{opacity:1;visibility:visible;transform:none;}
.tsw-head{
  font-family:var(--font-en);font-size:10.5px;letter-spacing:.32em;
  color:var(--c-sub);text-transform:uppercase;
  padding:0 8px 14px;margin-bottom:8px;
  border-bottom:1px solid var(--c-line-soft);
}
.tsw-item{
  width:100%;background:none;border:0;cursor:pointer;
  display:flex;align-items:center;gap:14px;
  padding:11px 8px;text-align:left;
  color:var(--c-sub);
  transition:background .3s,color .3s;
}
.tsw-item:hover{background:var(--c-acc-weak);color:var(--c-ink);}
.tsw-item.is-act{color:var(--c-ink);}
.tsw-item .sw{display:flex;width:44px;height:20px;border:1px solid var(--c-line-soft);}
.tsw-item .sw i{flex:1;}
.tsw-item .nm{font-family:var(--font-en);font-size:11.5px;letter-spacing:.2em;line-height:1.4;}
.tsw-item .nm small{display:block;font-family:var(--font-jp);font-size:9.5px;letter-spacing:.18em;opacity:.7;}
.tsw-item .ck{margin-left:auto;font-family:var(--font-en);font-size:12px;color:var(--c-acc);opacity:0;transition:opacity .3s;}
.tsw-item.is-act .ck{opacity:1;}
.tsw-note{font-size:9px;letter-spacing:.14em;color:var(--c-sub);opacity:.7;padding:10px 8px 0;line-height:1.9;}

/* ==========================================================
   Responsive
========================================================== */
@media (max-width:1024px){
  .contact-grid{grid-template-columns:1fr;}
  .contact-aside{max-width:520px;}
}
@media (max-width:860px){
  body{font-size:14px;}
  .gnav{display:none;}
  .menu-btn{
    display:flex;flex-direction:column;gap:7px;justify-content:center;align-items:center;
    width:52px;height:52px;background:transparent;border:0;cursor:pointer;color:inherit;
  }
  .menu-btn span{display:block;width:30px;height:1px;background:currentColor;transition:transform .4s var(--ease),opacity .3s;}
  .menu-btn.is-open span:nth-child(1){transform:translateY(8px) rotate(24deg);}
  .menu-btn.is-open span:nth-child(2){opacity:0;}
  .menu-btn.is-open span:nth-child(3){transform:translateY(-8px) rotate(-24deg);}
  .sp-nav{
    display:flex;
    position:fixed;inset:0;background:rgba(24,23,20,.97);z-index:90;
    flex-direction:column;justify-content:center;gap:8px;
    padding:0 var(--pad-x);
    opacity:0;pointer-events:none;transition:opacity .5s var(--ease);
    color:#EDEAE3;
  }
  .sp-nav.is-open{opacity:1;pointer-events:auto;}
  .sp-nav a{padding:12px 0;display:flex;align-items:baseline;gap:18px;border-bottom:1px solid rgba(255,255,255,.08);}
  .sp-nav .en{font-size:22px;letter-spacing:.18em;}
  .sp-nav small{font-size:10px;letter-spacing:.3em;opacity:.6;}

  .hero-tate,.hero-index{display:none;}
  .hero-scroll{left:auto;right:10px;transform:none;}
  .hero-inner{padding-bottom:clamp(70px,12vh,120px);padding-right:60px;}

  .message .wrap{grid-template-columns:1fr;gap:44px;}
  .message-tate{height:auto;writing-mode:horizontal-tb;letter-spacing:.24em;line-height:2;font-size:22px;}
  .message-ghost{font-size:80px;top:10px;}

  .craft-item,.craft-item:nth-child(even){display:flex;flex-direction:column;gap:22px;}
  .craft-item .ci-img,.craft-item:nth-child(even) .ci-img{width:100%;order:0;height:auto;aspect-ratio:4/3;}
  .craft-head,.works-head,.flow-head,.staff-head{grid-template-columns:1fr;gap:16px;}

  .works-grid{display:flex;flex-direction:column;gap:44px;}
  .works-grid .work:nth-of-type(n){grid-column:auto;margin-top:0;}
  .works-grid .work:nth-of-type(even){width:86%;align-self:flex-end;}
  .works-grid .work:nth-of-type(odd){width:92%;}
  .wgrid{grid-template-columns:repeat(2,1fr);gap:30px 14px;}

  .voice-inner,.voice-row,.voice-row:nth-child(even){display:flex;flex-direction:column;gap:30px;}
  .voice-row figure,.voice-row:nth-child(even) figure{order:0;width:100%;}
  .news-inner{grid-template-columns:1fr;gap:30px;}
  .news-item{grid-template-columns:86px 1fr;grid-template-rows:auto auto;gap:6px 16px;padding:20px 2px;}
  .news-cat{grid-column:2;grid-row:1;justify-self:start;padding:2px 14px;}
  .news-date{grid-column:1;grid-row:1;}
  .news-title{grid-column:1 / -1;grid-row:2;}
  .staff-grid,.staff-grid--page{grid-template-columns:1fr 1fr;gap:18px;}
  .footer-grid{grid-template-columns:1fr;gap:40px;}

  .ab-intro,.ceo{display:flex;flex-direction:column;gap:28px;}
  .ab-intro-img,.ceo-img{width:100%;margin-top:0;}
  .philosophy-list{grid-template-columns:1fr;gap:30px;}
  .cp-block,.cp-block:nth-of-type(even){display:flex;flex-direction:column;gap:22px;}
  .cp-block figure,.cp-block:nth-of-type(even) figure{order:0;width:100%;height:auto;aspect-ratio:4/3;}
  .def-row{grid-template-columns:1fr;gap:4px;padding:18px 4px;}
  .tl-item{grid-template-columns:1fr;gap:14px;}
  .wd-gallery{display:flex;flex-direction:column;gap:14px;}
  .wd-gallery figure{margin:0 !important;}
  .wd-cols{display:flex;flex-direction:column;gap:50px;}
  .form-row{grid-template-columns:1fr;gap:8px;padding:16px 0;}
  .form-row > label,.form-label{padding-top:0;}
  .theme-sw{left:14px;bottom:14px;}
  .tsw-btn{width:52px;height:52px;}
}