/* =========================================================
   THE PHOENIX — style.css（原創 code）
   ========================================================= */
/* ==========================================================
   THE PHOENIX — homepage design draft v1
   design spirit: neie.jp（配色・氛圍參考）/ 原創 code
   ========================================================== */
:root{
  --base:#d9d8d0;      /* 暖灰米 底色 */
  --cream:#f2f1e9;     /* 淺米 區塊底 */
  --ink:#3d3d3b;       /* 主文字 炭灰 */
  --sub:#6e6d69;       /* 次要文字 */
  --brown:#4e3c33;     /* 品牌深棕（按鈕/點綴） */
  --dark:#33312c;      /* footer 深底 */
  --line:rgba(61,61,59,.22);
  --serif:'Noto Serif JP', serif;
  --sans:'Noto Sans JP', sans-serif;
  --en:'Inter', sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  background:var(--base);
  color:var(--ink);
  font-weight:300;
  line-height:2;
  letter-spacing:.06em;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}

/* ---------- 共用 ---------- */
.inner{width:min(1300px,100% - 8vw);margin-inline:auto}
.eyebrow{
  display:flex;align-items:baseline;gap:16px;margin-bottom:34px;
}
.eyebrow .en{
  font-family:var(--en);font-weight:400;font-size:13px;letter-spacing:.34em;
  text-transform:uppercase;color:var(--brown);
}
.eyebrow .jp{font-size:12px;color:var(--sub);letter-spacing:.2em}
.h-serif{
  font-family:var(--serif);font-weight:500;
  font-size:clamp(24px,3vw,38px);line-height:1.9;letter-spacing:.1em;
}
.lead{max-width:640px;color:var(--sub);font-size:14px}

/* 膠囊按鈕（neie 精神：深棕膠囊＋箭頭，純 CSS 重畫） */
.btn{
  display:inline-flex;align-items:center;gap:18px;
  background:var(--brown);color:#f5f3ee;
  border-radius:999px;padding:16px 12px 16px 34px;
  font-size:13px;letter-spacing:.22em;font-weight:400;
  transition:opacity .4s;
}
.btn .arw{
  width:34px;height:34px;border-radius:50%;
  background:rgba(245,243,238,.14);
  display:grid;place-items:center;font-family:var(--en);font-size:14px;
  transition:transform .4s;
}
.btn:hover{opacity:.85}
.btn:hover .arw{transform:translateX(4px)}

/* 底線文字連結（CV 區用） */
.linkline{
  display:inline-flex;align-items:center;gap:14px;
  font-size:13px;letter-spacing:.24em;padding-bottom:10px;
  border-bottom:1px solid currentColor;
}
.linkline .arw{
  width:26px;height:26px;border-radius:50%;border:1px solid currentColor;
  display:grid;place-items:center;font-family:var(--en);font-size:12px;
  transition:transform .4s;
}
.linkline:hover .arw{transform:translateX(4px)}

/* 進場動畫 */
.rv{opacity:0;transform:translateY(28px);transition:opacity 1s ease,transform 1s ease}
.rv.is-in{opacity:1;transform:none}

/* ---------- Header（neie 式：hero 無底條，捲動後滑出置中 logo 條） ---------- */
.hd{
  position:fixed;inset:0 0 auto 0;z-index:50;
  display:flex;align-items:center;
  padding:16px 2.2vw;transition:background .5s,padding .5s;
}
.hd.is-scrolled{background:rgba(242,241,233,.97);padding:4px 2.2vw;box-shadow:0 1px 0 rgba(61,61,59,.06)}
.hd__left{position:relative;flex:1;display:flex;align-items:center;min-height:50px}
/* 滿版時的左上兩欄小字導覽 */
.hd__nav{
  position:absolute;left:0;top:0;
  display:grid;grid-template-rows:repeat(3,auto);grid-auto-flow:column;
  gap:6px 40px;font-size:13px;line-height:1.9;letter-spacing:.12em;color:#fff;
  text-shadow:0 1px 16px rgba(0,0,0,.4);
  transition:opacity .5s,visibility .5s;
}
.hd__nav a:hover{opacity:.7}
.hd.is-scrolled .hd__nav,
body.menu-open .hd__nav{opacity:0;visibility:hidden;pointer-events:none}
/* 捲動後出現的「● menu」按鈕 */
.hd__menuBtn{
  position:absolute;left:0;top:50%;transform:translateY(-50%);
  display:flex;flex-direction:column;align-items:center;gap:6px;
  background:none;border:0;cursor:pointer;color:var(--ink);
  font-family:var(--en);font-size:11px;letter-spacing:.18em;
  opacity:0;visibility:hidden;transition:opacity .5s,visibility .5s;
  padding:4px 8px;
}
.hd__menuBtn .dot{width:5px;height:5px;border-radius:50%;background:currentColor}
.hd.is-scrolled .hd__menuBtn,
body.menu-open .hd__menuBtn{opacity:1;visibility:visible}
/* 捲動後置中 logo */
.hd__logo{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  display:flex;align-items:center;gap:12px;white-space:nowrap;
  opacity:0;visibility:hidden;transition:opacity .5s,visibility .5s;
}
.hd__logo img{width:60px;filter:invert(1) brightness(.55)}
.hd.is-scrolled .hd__logo,
body.menu-open .hd__logo{opacity:1;visibility:visible}
/* 右上 CTA（neie 式方形按鈕） */
.hd__cta{display:flex;gap:8px;margin-left:auto}
.hd__cta a{font-size:11px;letter-spacing:.14em;padding:7px 15px;transition:opacity .3s}
.hd__cta a:hover{opacity:.8}
.hd__cta .c1{background:#fff;color:var(--ink)}
.hd__cta .c2{background:var(--brown);color:#f5f3ee}

/* ---------- 抽屜選單 ---------- */
.drawer{
  position:fixed;inset:0;z-index:40;background:var(--cream);
  opacity:0;visibility:hidden;transition:opacity .6s,visibility .6s;
  display:flex;align-items:center;
}
body.menu-open .drawer{opacity:1;visibility:visible}
.drawer__in{width:100%;max-width:1100px;margin:0 auto;padding:12vh 6vw 8vh;
  display:grid;grid-template-columns:1.4fr 1fr;gap:60px;align-items:center}
.drawer__nav li{border-bottom:1px solid var(--line)}
.drawer__nav a{
  display:flex;align-items:baseline;gap:20px;padding:20px 6px;
  font-family:var(--serif);font-size:clamp(20px,2.6vw,28px);letter-spacing:.14em;
  transition:opacity .3s;
}
.drawer__nav a:hover{opacity:.5}
.drawer__nav .en{font-family:var(--en);font-size:11px;letter-spacing:.3em;color:var(--brown);width:110px;flex:0 0 auto}
.drawer__info{font-size:12px;color:var(--sub);line-height:2.4}
.drawer__info strong{display:block;font-family:var(--en);letter-spacing:.28em;color:var(--ink);margin-bottom:10px}

/* ---------- Hero ---------- */
.hero{position:relative;height:100svh;min-height:640px;overflow:hidden}
.hero__bg{position:absolute;inset:0;background:url('../img/img2.webp') center/cover no-repeat}
.hero__bg::after{content:'';position:absolute;inset:0;
  background:linear-gradient(to bottom,rgba(30,28,25,.18),rgba(30,28,25,.42))}
.hero__logo{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;
  display:flex;flex-direction:column;align-items:center;gap:20px;color:#fff;
  transition:opacity .6s;
}
.hero__logo img{width:clamp(110px,12vw,160px);filter:drop-shadow(0 2px 24px rgba(0,0,0,.3))}
.hero__logo span{
  font-family:var(--en);font-weight:400;font-size:clamp(14px,1.5vw,19px);
  letter-spacing:.5em;text-indent:.5em;text-shadow:0 1px 18px rgba(0,0,0,.35);
}
.hd.is-scrolled ~ main .hero__logo{opacity:0}
.hero__copy{
  position:absolute;left:6vw;bottom:12vh;color:#fff;z-index:2;
}
.hero__copy .en{
  font-family:var(--en);font-weight:300;font-size:12px;letter-spacing:.42em;
  display:block;margin-bottom:26px;
}
.hero__copy h1{
  font-family:var(--serif);font-weight:500;
  font-size:clamp(26px,3.6vw,46px);line-height:2;letter-spacing:.14em;
  text-shadow:0 2px 30px rgba(0,0,0,.25);
}
.hero__scroll{
  position:absolute;right:5vw;bottom:0;z-index:2;color:#fff;
  font-family:var(--en);font-size:10px;letter-spacing:.4em;
  display:flex;flex-direction:column;align-items:center;gap:14px;
}
.hero__scroll::after{
  content:'';width:1px;height:90px;background:linear-gradient(#fff,transparent);
  animation:scrl 2.2s ease infinite;transform-origin:top;
}
@keyframes scrl{0%{transform:scaleY(0)}45%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}

/* ---------- Mission ---------- */
.mission{padding:150px 0 110px}
.mission .h-serif{margin-bottom:36px}

/* ---------- Stats ---------- */
.stats{padding:0 0 150px}
.stats__grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0 44px;margin-top:20px;
}
.stats__item{text-align:center}
.stats__item .stat-icon{width:74px;height:74px;margin:0 auto 26px;color:var(--brown);display:block}
.stats__item .lab{font-size:12px;color:var(--sub);letter-spacing:.14em;min-height:3em;line-height:1.8}
.stats__item .num{
  font-family:var(--serif);font-size:clamp(34px,3.4vw,48px);font-weight:500;
  color:var(--brown);line-height:1.4;letter-spacing:.04em;margin-top:4px;
}
.stats__item .num small{font-size:.38em;letter-spacing:.1em;margin-left:6px;color:var(--ink)}

/* ---------- Service ---------- */
.service{background:var(--cream);padding:130px 0}
.service__head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;margin-bottom:56px}
.service__rail{
  overflow:hidden;
  padding:4px max(4vw,calc((100vw - 1300px)/2)) 30px;
}
.service__track{
  display:flex;gap:34px;
  transition:transform .9s cubic-bezier(.4,0,.2,1);will-change:transform;
}
.svc{flex:0 0 min(400px,78vw);display:flex;flex-direction:column}
.svc figure{overflow:hidden;aspect-ratio:3/4}
.svc img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s ease}
.svc:hover img{transform:scale(1.06)}
.svc .no{font-family:var(--en);font-size:12px;letter-spacing:.3em;color:var(--brown);margin:26px 0 8px}
.svc h3{font-family:var(--serif);font-weight:500;font-size:20px;letter-spacing:.12em;margin-bottom:12px}
.svc p{font-size:12.5px;color:var(--sub);line-height:1.95;margin-bottom:22px}
.svc .linkline{
  margin-top:auto;align-self:flex-start;color:var(--ink);
  font-size:12px;letter-spacing:.2em;gap:12px;padding-bottom:8px;
  border-bottom-color:var(--line);
}
.svc .linkline .arw{background:var(--brown);border-color:var(--brown);color:#f5f3ee;width:24px;height:24px;font-size:11px}
.service__ctrl{display:flex;gap:14px;justify-content:flex-end;padding:0 max(4vw,calc((100vw - 1300px)/2))}
.service__ctrl button{
  width:52px;height:52px;border-radius:50%;border:1px solid var(--line);
  background:none;cursor:pointer;font-family:var(--en);font-size:16px;color:var(--ink);
  transition:background .3s,color .3s;
}
.service__ctrl button:hover{background:var(--brown);color:#f5f3ee;border-color:var(--brown)}

/* ---------- Works（方案 A：全幅フィルムストリップ） ---------- */
.works{padding:150px 0}
.works__head{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:30px;margin-bottom:64px}
.works__count{font-family:var(--en);font-size:12px;letter-spacing:.3em;color:var(--sub)}
.works__count b{font-family:var(--serif);font-size:44px;font-weight:500;color:var(--brown);margin-right:8px}
.marq{overflow:hidden;margin-bottom:26px}
.marq__track{display:flex;gap:24px;width:max-content;animation:marqL 55s linear infinite}
.marq--rev .marq__track{animation:marqR 60s linear infinite}
.marq:hover .marq__track{animation-play-state:paused}
@keyframes marqL{from{transform:translateX(0)}to{transform:translateX(-25%)}}
@keyframes marqR{from{transform:translateX(-25%)}to{transform:translateX(0)}}
.marq figure{position:relative;flex:0 0 auto;overflow:hidden}
.marq img{height:300px;width:auto;display:block;transition:transform 1s ease}
.marq figure:hover img{transform:scale(1.04)}
.marq figcaption{
  position:absolute;left:0;bottom:0;
  background:rgba(38,35,31,.72);color:#f2f1e9;
  font-size:10.5px;letter-spacing:.18em;padding:6px 14px;
}
.works__more{text-align:center;margin-top:70px}

/* ---------- Message ---------- */
.message{background:var(--cream);padding:140px 0}
.message__grid{display:grid;grid-template-columns:5fr 6fr;gap:7%;align-items:center}
.message__photo{overflow:hidden}
.message__photo img{aspect-ratio:4/5;object-fit:cover;width:100%}
.message__body .quote{
  font-family:var(--serif);font-weight:500;font-size:clamp(21px,2.4vw,30px);
  line-height:2.1;letter-spacing:.12em;margin-bottom:30px;
}
.message__body p{font-size:13.5px;color:var(--sub);margin-bottom:1.6em}
.message__sign{display:flex;justify-content:flex-end;align-items:baseline;gap:18px;margin-top:34px}
.message__sign .role{font-size:11px;color:var(--sub);letter-spacing:.2em}
.message__sign .name{font-family:var(--serif);font-size:21px;letter-spacing:.3em}

/* ---------- CV（雙格 CTA） ---------- */
.cv{display:grid;grid-template-columns:1fr 1fr}
.cv__panel{
  position:relative;min-height:520px;display:grid;place-items:center;
  color:#fff;text-align:center;padding:80px 8%;overflow:hidden;
}
.cv__panel .bg{position:absolute;inset:0;background-size:cover;background-position:center;
  transition:transform 1.4s ease}
.cv__panel:hover .bg{transform:scale(1.05)}
.cv__panel .bg::after{content:'';position:absolute;inset:0;background:rgba(38,35,31,.52);transition:background .6s}
.cv__panel:hover .bg::after{background:rgba(38,35,31,.4)}
.cv__panel--doc .bg{background-image:url('../img/works-hotel-after.webp')}
.cv__panel--rec .bg{background-image:url('../img/recruit-hero.webp')}
.cv__in{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:24px}
.cv__in h2{font-family:var(--serif);font-weight:500;font-size:clamp(22px,2.2vw,28px);letter-spacing:.3em}
.cv__in .en{font-family:var(--en);font-size:10px;letter-spacing:.4em;opacity:.75}
.cv__in p{font-size:13px;line-height:2.2;opacity:.92}

/* ---------- Footer ---------- */
.ft{background:var(--dark);color:#f2f1e9;padding:100px 0 40px;font-size:14px}
.ft__grid{display:grid;grid-template-columns:1.2fr 1fr 1.2fr;gap:60px;margin-bottom:80px}
.ft__brand img{width:64px;margin-bottom:24px}
.ft__brand .nm{font-family:var(--en);letter-spacing:.32em;color:#f2f1e9;font-size:15px}
.ft__brand .co{margin-top:10px;font-size:13px}
.ft h3{font-family:var(--en);font-size:12px;letter-spacing:.3em;color:#b9b5aa;margin-bottom:22px;font-weight:400}
.ft__nav li{margin-bottom:12px}
.ft__nav a{display:inline-flex;gap:12px;align-items:baseline;transition:opacity .3s}
.ft__nav a:hover{opacity:.6}
.ft__nav .en{font-family:var(--en);font-size:11px;letter-spacing:.26em;color:#b9b5aa}
.ft__info p{margin-bottom:14px;line-height:1.9;font-size:13.5px}
.ft__license{font-size:12px;color:#b9b5aa;line-height:2}
.ft__bottom{
  border-top:1px solid rgba(242,241,233,.14);padding-top:30px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;
  font-size:12px;color:#b9b5aa;letter-spacing:.12em;
}

/* ---------- Back to top ---------- */
.totop{
  position:fixed;right:26px;bottom:26px;z-index:30;
  width:52px;height:52px;border-radius:50%;border:1px solid var(--line);
  background:rgba(242,241,233,.9);cursor:pointer;font-family:var(--en);
  color:var(--ink);opacity:0;visibility:hidden;transition:.4s;
}
.totop.is-show{opacity:1;visibility:visible}

/* ---------- RWD ---------- */
@media (max-width:990px){
  .stats__grid{grid-template-columns:repeat(2,1fr);gap:44px 34px}
  .message__grid{grid-template-columns:1fr;gap:50px}
  .drawer__in{grid-template-columns:1fr;gap:40px}
  .ft__grid{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){
  .marq img{height:200px}
  .cv{grid-template-columns:1fr}
  .cv__panel{min-height:420px}
  .hd__nav{display:none}
  .hd__menuBtn{opacity:1;visibility:visible;color:#fff}
  .hd.is-scrolled .hd__menuBtn,body.menu-open .hd__menuBtn{color:var(--ink)}
}
@media (max-width:480px){
  .stats__grid{grid-template-columns:1fr 1fr;gap:36px 24px}
  .ft__grid{grid-template-columns:1fr;gap:44px}
  .hd__cta .c1{display:none}
  .hero__copy{right:6vw}
  .hero__copy h1{font-size:20px;letter-spacing:.1em}
  .hero__copy br{display:none}
}


/* ---------- 子頁 header（一律米色細 bar） ---------- */
.hd--page{background:rgba(242,241,233,.97);padding:4px 2.2vw;box-shadow:0 1px 0 rgba(61,61,59,.06)}
.hd--page .hd__nav{display:none}
.hd--page .hd__menuBtn,.hd--page .hd__logo{opacity:1;visibility:visible}
.ft a{transition:opacity .3s}
.ft a:hover{opacity:.7}

/* ---------- Page Hero（子頁上方：留邊大圖＋左標題右說明，無麵包屑） ---------- */
.phero{padding:88px 0 0}
.phero__wrap{width:min(1300px,100% - 8vw);margin-inline:auto}
.phero__img{width:100%;aspect-ratio:10/3;object-fit:cover}
.phero__row{
  display:grid;grid-template-columns:1fr 1.35fr;gap:7%;
  width:min(1300px,100% - 8vw);margin-inline:auto;padding:70px 0 110px;align-items:start;
}
.phero__title .en{
  font-family:var(--en);font-size:11px;letter-spacing:.4em;text-transform:uppercase;
  color:var(--brown);display:block;margin-bottom:16px;
}
.phero__title h1{font-family:var(--serif);font-weight:500;font-size:clamp(30px,3.4vw,44px);letter-spacing:.16em;line-height:1.7}
.phero__desc{font-size:14px;color:var(--sub);padding-top:14px}


/* 資料表格（会社概要・募集要項） */
.dtable{border-top:1px solid var(--line)}
.dtable__row{display:grid;grid-template-columns:220px 1fr;gap:30px;padding:22px 4px;border-bottom:1px solid var(--line)}
.dtable__row dt{font-size:12.5px;color:var(--sub);letter-spacing:.14em;padding-top:2px}
.dtable__row dd{font-size:13.5px;line-height:2.1}
.dtable__row dd a{text-decoration:underline;text-underline-offset:4px}



@media (max-width:990px){
  .phero__row{grid-template-columns:1fr;gap:26px;padding-bottom:80px}
}
@media (max-width:768px){
  .phero__img{aspect-ratio:16/9}
  .dtable__row{grid-template-columns:1fr;gap:2px;padding:18px 4px}
}


/* ========== company ========== */
.vmvsec{padding:0 0 160px;overflow:hidden}
.vz h3{font-family:var(--serif);font-weight:500;font-size:clamp(20px,2.2vw,27px);letter-spacing:.12em;margin-bottom:18px}
.vz p{font-size:13.5px;color:var(--sub);max-width:480px}
.vz1{display:grid;grid-template-columns:repeat(12,1fr);gap:0 4%;margin-bottom:170px}
.vz1__img{grid-column:1/9;overflow:hidden}
.vz1__img img{width:100%;aspect-ratio:16/10;object-fit:cover}
.vz1__txt{grid-column:9/13;align-self:end;padding-bottom:10px}
.vz2{display:grid;grid-template-columns:repeat(12,1fr);gap:0 4%;margin-bottom:170px}
.vz2__img{grid-column:7/13;overflow:hidden}
.vz2__img img{width:100%;aspect-ratio:3/2;object-fit:cover}
.vz2__txt{grid-column:1/7;padding-top:90px}
.vz3{display:grid;grid-template-columns:repeat(12,1fr);gap:0 4%}
.vz3__txt{grid-column:7/13;padding-top:100px}
.vz3__img{grid-column:1/6;margin-top:-40px;overflow:hidden}
.vz3__img img{width:100%;aspect-ratio:4/5;object-fit:cover}
@media (max-width:990px){
  .vz1{grid-template-columns:1fr;gap:28px;margin-bottom:100px}
  .vz1__img,.vz1__txt{grid-column:auto}
  .vz2{grid-template-columns:1fr;gap:28px;margin-bottom:100px}
  .vz2__img,.vz2__txt{grid-column:auto}
  .vz2__txt{padding-top:0}
  .vz3{grid-template-columns:1fr;gap:28px}
  .vz3__txt,.vz3__img{grid-column:auto}
  .vz3__txt{padding-top:0}
  .vz3__img{margin-top:0}
}
.about{background:var(--cream);padding:120px 0}
.access{padding:130px 0 140px}
.access__grid{display:grid;grid-template-columns:2fr 1fr;gap:6%;align-items:center}
.access__map{width:100%;aspect-ratio:13/8;border:0;filter:grayscale(1) sepia(.18) saturate(.9) brightness(1.02) contrast(.92)}
.access__info p{font-size:13.5px;margin-bottom:16px}
.access__info .lb{font-size:11px;letter-spacing:.24em;color:var(--brown);font-family:var(--en);display:block}
@media (max-width:990px){.access__grid{grid-template-columns:1fr;gap:36px}}

/* ========== service ========== */
.slist{padding:0 0 130px}
.srow{display:grid;grid-template-columns:1fr 1.35fr;gap:5%;padding:80px 0;border-bottom:1px solid var(--line);align-items:center}
.srow:first-of-type{border-top:1px solid var(--line)}
.srow__img{overflow:hidden}
.srow__img img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform 1.2s ease}
.srow__img:hover img{transform:scale(1.04)}
.srow .no{font-family:var(--en);font-size:12px;letter-spacing:.3em;color:var(--brown);margin-bottom:10px}
.srow h2{font-family:var(--serif);font-weight:500;font-size:clamp(21px,2.3vw,27px);letter-spacing:.12em;margin-bottom:16px}
.srow .desc{font-size:13.5px;color:var(--sub);max-width:460px;margin-bottom:26px}
.srow__ops .lb{font-family:var(--en);font-size:10px;letter-spacing:.3em;color:var(--brown);text-transform:uppercase;display:block;margin-bottom:8px}
.srow__ops ul{display:grid;grid-template-columns:1fr 1fr;gap:6px 26px;max-width:460px}
.srow__ops li{font-size:12.5px;letter-spacing:.08em;line-height:1.9;color:var(--ink);display:flex;gap:10px;align-items:baseline;border-bottom:1px solid rgba(61,61,59,.12);padding-bottom:6px}
.srow__ops li i{font-style:normal;font-family:var(--en);font-size:10px;color:var(--brown);letter-spacing:.2em}
.strength{background:var(--cream);padding:120px 0 130px}
.strength__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:34px;margin-top:26px}
.stg{text-align:center}
.stg svg{width:64px;height:64px;margin:0 auto 20px;color:var(--brown);display:block}
.stg h4{font-family:var(--serif);font-weight:500;font-size:15.5px;letter-spacing:.1em;line-height:1.9;margin-bottom:8px}
.stg p{font-size:12px;color:var(--sub);line-height:1.9}
@media (max-width:990px){.srow{grid-template-columns:1fr;gap:26px;padding:56px 0}.strength__grid{grid-template-columns:1fr 1fr;gap:40px 24px}}
@media (max-width:480px){.srow__ops ul{grid-template-columns:1fr}}

/* ========== works ========== */
.wlist{padding:0 0 130px}
.wlayout{display:grid;grid-template-columns:210px 1fr;gap:6%;align-items:start}
.wnav{position:sticky;top:110px}
.wnav li{border-bottom:1px solid rgba(61,61,59,.12)}
.wnav a{display:flex;gap:12px;align-items:baseline;padding:14px 2px;font-size:12.5px;letter-spacing:.1em;color:var(--sub);transition:color .3s;line-height:1.7}
.wnav a .no{font-family:var(--en);font-size:10px;letter-spacing:.22em;flex:0 0 auto}
.wnav a.is-active{color:var(--ink)}
.wnav a.is-active .no{color:var(--brown)}
.wnav a:hover{color:var(--ink)}
.wsec{display:grid;grid-template-columns:1fr 1.15fr;gap:6%;padding:70px 0;border-bottom:1px solid var(--line);align-items:center;scroll-margin-top:100px}
.wsec:first-of-type{padding-top:10px}
.wsec:last-of-type{border-bottom:0}
.wsec .no{font-family:var(--en);font-size:12px;letter-spacing:.3em;color:var(--brown);margin-bottom:10px}
.wsec h2{font-family:var(--serif);font-weight:500;font-size:clamp(20px,2.1vw,25px);letter-spacing:.12em;margin-bottom:16px}
.wsec .desc{font-size:13.5px;color:var(--sub);max-width:400px}
.wsec__img{overflow:hidden}
.wsec__img img{width:100%;aspect-ratio:3/2;object-fit:cover;transition:transform 1.2s ease}
.wsec__img:hover img{transform:scale(1.04)}
.ba{display:grid;gap:18px}
.ba figure{position:relative;overflow:hidden}
.ba img{width:100%;aspect-ratio:16/9;object-fit:cover}
.ba figcaption{
  position:absolute;top:0;left:0;background:var(--brown);color:#f5f3ee;
  font-family:var(--en);font-size:10.5px;letter-spacing:.24em;padding:6px 16px;
}
.insta{background:var(--cream);padding:110px 0;text-align:center}
.insta__qr{width:150px;margin:34px auto 20px;border:1px solid var(--line)}
.insta h2{font-family:var(--serif);font-weight:500;font-size:clamp(20px,2.2vw,26px);letter-spacing:.14em}
.insta p{font-size:12.5px;color:var(--sub)}
.insta a.acc{font-family:var(--en);font-size:13px;letter-spacing:.18em;text-decoration:underline;text-underline-offset:5px}
@media (max-width:900px){.wlayout{grid-template-columns:1fr}.wnav{display:none}.wsec{grid-template-columns:1fr;gap:24px;padding:52px 0}}

/* ========== recruit ========== */
.jobs{padding:0 0 120px}
.jobs__note{font-size:13px;color:var(--sub);margin-bottom:70px}
.jobs__note a{text-decoration:underline;text-underline-offset:4px}
.job{margin-bottom:110px}
.job__head{display:flex;align-items:baseline;gap:22px;margin-bottom:30px;flex-wrap:wrap}
.job__head .no{font-family:var(--en);font-size:11px;letter-spacing:.26em;color:var(--brown);border:1px solid var(--brown);padding:4px 14px}
.job__head h2{font-family:var(--serif);font-weight:500;font-size:clamp(21px,2.3vw,27px);letter-spacing:.12em}
.jobs__entry{text-align:center}

/* ========== contact ========== */
.cform{padding:0 0 130px}
.cform__in{max-width:1350px;margin:0 auto;padding:0 6vw}
.frow{display:grid;grid-template-columns:250px 1fr;gap:30px;padding:28px 4px;border-bottom:1px solid var(--line);align-items:start}
.frow:first-of-type{border-top:1px solid var(--line)}
.frow label.lb{font-size:13px;letter-spacing:.12em;padding-top:10px;display:flex;gap:10px;align-items:baseline}
.frow .req{font-size:10px;letter-spacing:.14em;color:#f5f3ee;background:var(--brown);padding:2px 8px;flex:0 0 auto}
.frow input[type=text],.frow input[type=email],.frow input[type=tel],.frow textarea{
  width:100%;background:#fff;border:1px solid var(--line);padding:13px 16px;
  font-family:var(--sans);font-size:14px;letter-spacing:.06em;color:var(--ink);
}
.frow input:focus,.frow textarea:focus{outline:1.5px solid var(--brown)}
.frow textarea{min-height:170px;resize:vertical}
.radios{display:flex;flex-direction:column;gap:10px;padding-top:8px}
.radios label{display:flex;gap:12px;align-items:center;font-size:13.5px;cursor:pointer}
.radios input{accent-color:var(--brown);width:16px;height:16px}
.cform__privacy{text-align:center;margin:44px 0 30px;font-size:13px}
.cform__privacy a{text-decoration:underline;text-underline-offset:4px}
.cform__privacy input{accent-color:var(--brown);width:15px;height:15px;margin-right:10px;vertical-align:-2px}
.cform__submit{text-align:center}
@media (max-width:768px){.frow{grid-template-columns:1fr;gap:8px;padding:20px 4px}.frow label.lb{padding-top:0}}