/* =========================================================
   studio テーマ  — 上品・画像主役の多ページサイト（オリジナル）
   エディトリアルな余白／セリフ見出し／温かみのあるニュートラル配色
   ========================================================= */
:root{
  --bg:#faf8f4;
  --panel:#ffffff;
  --ink:#2a2622;
  --sub:#7a716a;
  --line:#e7e0d6;
  --accent:#a87f53;      /* 落ち着いたブロンズ */
  --accent-d:#8c673f;
  --dark:#211d19;
  --serif:"Times New Roman","YuMincho","Hiragino Mincho ProN",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.95;
  font-size:15px;-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
.wrap{max-width:1120px;margin:0 auto;padding:0 28px;}
.narrow{max-width:760px;margin:0 auto;}

/* 見出し共通 */
.eyebrow{font-family:var(--sans);font-size:11px;letter-spacing:.34em;color:var(--accent);font-weight:700;text-transform:uppercase;}
h1,h2,h3{font-family:var(--serif);font-weight:400;color:var(--ink);letter-spacing:.02em;}
.sec-title{font-size:clamp(26px,3.4vw,38px);line-height:1.4;margin:12px 0 0;}

/* ---- ヘッダー ---- */
.s-head{position:fixed;top:0;left:0;right:0;z-index:60;background:rgba(250,248,244,.86);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line);}
.s-head .wrap{display:flex;align-items:center;justify-content:space-between;height:70px;}
.s-logo{font-family:var(--serif);font-size:22px;letter-spacing:.16em;color:var(--ink);}
.s-logo small{display:block;font-family:var(--sans);font-size:9px;letter-spacing:.3em;color:var(--accent);margin-top:2px;}
.s-nav{display:flex;align-items:center;gap:26px;}
.s-nav a{font-size:12.5px;letter-spacing:.08em;color:var(--ink);position:relative;}
.s-nav a:hover{color:var(--accent);}
.s-nav .navcta{border:1px solid var(--ink);border-radius:2px;padding:9px 18px;font-size:11px;letter-spacing:.14em;}
.s-nav .navcta:hover{background:var(--ink);color:#fff;}
.s-burger{display:none;border:none;background:none;font-size:22px;cursor:pointer;color:var(--ink);}

/* ---- ヒーロー ---- */
.hero{position:relative;height:92vh;min-height:560px;display:flex;align-items:flex-end;color:#fff;overflow:hidden;}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,17,14,.15),rgba(20,17,14,.55));}
.hero .inner{position:relative;z-index:2;padding-bottom:9vh;}
.hero .eyebrow{color:#e9d9c3;}
.hero h1{color:#fff;font-size:clamp(34px,6vw,68px);line-height:1.25;margin:16px 0 18px;}
.hero p{max-width:520px;color:#efe7dc;font-size:15px;}

/* ---- セクション ---- */
.section{padding:110px 0;}
.section.tint{background:#f3eee6;}
.section.dark{background:var(--dark);color:#e8e1d6;}
.section.dark h2,.section.dark h3{color:#fff;}
.sec-head{margin-bottom:56px;}
.sec-head.center{text-align:center;}
.lead{font-size:16px;color:var(--sub);line-height:2.1;}
.section.dark .lead{color:#bcb2a4;}

/* コンセプト（画像＋テキスト） */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center;}
.split.rev{direction:rtl;}
.split.rev>*{direction:ltr;}
.split .ph{overflow:hidden;border-radius:2px;}
.split .ph img{width:100%;height:100%;min-height:420px;object-fit:cover;transition:transform .8s;}
.split:hover .ph img{transform:scale(1.04);}
.split .tx h2{margin-top:14px;}
.split .tx p{color:var(--sub);margin:22px 0 0;}

/* サービス（3カード） */
.svc-3{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;}
.svc-3 .it{}
.svc-3 .it .ph{overflow:hidden;border-radius:2px;aspect-ratio:4/3;}
.svc-3 .it .ph img{width:100%;height:100%;object-fit:cover;transition:transform .8s;}
.svc-3 .it:hover .ph img{transform:scale(1.05);}
.svc-3 .it .no{font-size:11px;letter-spacing:.2em;color:var(--accent);margin-top:18px;}
.svc-3 .it h3{font-size:21px;margin:6px 0 8px;}
.svc-3 .it p{color:var(--sub);font-size:14px;margin:0;}

/* ギャラリー（カラム） */
.gallery{column-count:3;column-gap:18px;}
.gallery img{width:100%;margin:0 0 18px;border-radius:2px;}
@media(max-width:760px){.gallery{column-count:2;}}

/* ニュース */
.news{max-width:820px;margin:0 auto;}
.news a{display:flex;gap:26px;align-items:center;padding:18px 4px;border-bottom:1px solid var(--line);}
.news a:first-child{border-top:1px solid var(--line);}
.news .nth{width:140px;height:90px;object-fit:cover;border-radius:2px;flex-shrink:0;}
.news .nb{display:flex;flex-direction:column;gap:5px;}
.news .d{font-size:12px;letter-spacing:.08em;color:var(--sub);}
.news .t{font-family:var(--serif);font-size:20px;color:var(--ink);line-height:1.4;}
.news a:hover .t{color:var(--accent);}
@media(max-width:760px){.news .nth{width:96px;height:68px;}.news .t{font-size:17px;}}

/* ボタン */
.btn{display:inline-block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;padding:15px 40px;border:1px solid currentColor;border-radius:2px;transition:.25s;}
.btn:hover{background:var(--ink);color:#fff;border-color:var(--ink);}
.btn-light{color:#fff;}
.btn-light:hover{background:#fff;color:var(--ink);}
.center{text-align:center;}
.more{margin-top:50px;}

/* CTA帯 */
.cta-band{position:relative;color:#fff;text-align:center;padding:120px 0;overflow:hidden;}
.cta-band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.cta-band::after{content:"";position:absolute;inset:0;background:rgba(20,17,14,.55);}
.cta-band .inner{position:relative;z-index:2;}
.cta-band h2{color:#fff;font-size:32px;}
.cta-band p{color:#e6ddd0;margin:14px 0 30px;}

/* ---- フッター ---- */
.s-foot{background:var(--dark);color:#bcb2a4;padding:64px 0 30px;}
.s-foot .top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:30px;}
.s-foot .flogo{font-family:var(--serif);font-size:22px;letter-spacing:.16em;color:#fff;}
.s-foot nav{display:flex;flex-wrap:wrap;gap:18px;}
.s-foot nav a{font-size:12.5px;color:#c9c0b2;}
.s-foot nav a:hover{color:var(--accent);}
.s-foot .copy{border-top:1px solid #34302a;margin-top:40px;padding-top:22px;font-size:11.5px;letter-spacing:.06em;text-align:center;}

/* ---- 下層ページ ---- */
.page-hero{position:relative;height:300px;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;overflow:hidden;}
.page-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.page-hero::after{content:"";position:absolute;inset:0;background:rgba(20,17,14,.45);}
.page-hero .inner{position:relative;z-index:2;}
.page-hero h1{color:#fff;font-size:34px;margin:8px 0 0;}
.page-body{padding:90px 0;}
.entry{font-size:15.5px;line-height:2.05;color:#3a352f;}
.entry h2{font-size:25px;margin:48px 0 18px;padding-bottom:12px;border-bottom:1px solid var(--line);}
.entry h3{font-size:19px;margin:30px 0 12px;}
.entry p{margin:0 0 20px;}
.entry img{border-radius:2px;margin:24px 0;}
.entry ul{list-style:none;margin:0 0 24px;padding:0;}
.entry ul li{position:relative;padding:9px 0 9px 22px;border-bottom:1px solid var(--line);color:#3a352f;font-size:14.5px;}
.entry ul li::before{content:"";position:absolute;left:2px;top:18px;width:7px;height:7px;background:var(--accent);border-radius:50%;}
.entry ul li strong{color:var(--ink);}

/* 下層パーツ（固定ページ本文から利用） */
.lead-x{font-family:var(--serif);font-size:22px;line-height:1.9;color:var(--ink);text-align:center;margin:0 0 50px;}
.def{border-top:1px solid var(--line);}
.def dl{display:grid;grid-template-columns:200px 1fr;gap:0;margin:0;}
.def dt{padding:20px 10px;border-bottom:1px solid var(--line);font-weight:700;color:var(--ink);}
.def dd{padding:20px 10px;border-bottom:1px solid var(--line);margin:0;color:var(--sub);}
.steps{counter-reset:st;}
.steps .s{display:grid;grid-template-columns:64px 1fr;gap:22px;padding:26px 0;border-bottom:1px solid var(--line);}
.steps .s::before{counter-increment:st;content:counter(st,decimal-leading-zero);font-family:var(--serif);font-size:28px;color:var(--accent);}
.steps .s h3{margin:0 0 6px;font-size:19px;}
.steps .s p{margin:0;color:var(--sub);font-size:14px;}
.voices{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.voice{background:var(--panel);border:1px solid var(--line);border-radius:2px;padding:30px;}
.voice .q{font-family:var(--serif);font-size:18px;color:var(--ink);margin:0 0 12px;}
.voice .n{font-size:12px;color:var(--accent);letter-spacing:.08em;}
.cols-2{columns:2;column-gap:40px;}

/* フォーム */
.f-field{margin-bottom:22px;}
.f-field label{display:block;font-size:13px;letter-spacing:.06em;color:var(--ink);margin-bottom:7px;}
.f-field .req{color:var(--accent);}
.f-field input,.f-field textarea{width:100%;padding:13px 15px;border:1px solid var(--line);border-radius:2px;background:#fff;font-size:15px;font-family:inherit;}
.f-field input:focus,.f-field textarea:focus{outline:none;border-color:var(--accent);}

/* 一覧（記事） */
.alist{max-width:860px;margin:0 auto;}
.arow{display:flex;gap:26px;align-items:center;padding:24px 0;border-bottom:1px solid var(--line);}
.arow .th{width:160px;height:108px;object-fit:cover;flex-shrink:0;background:#efe9df;border-radius:2px;}
.arow .b .d{font-size:12px;color:var(--sub);letter-spacing:.06em;}
.arow .b .t{font-family:var(--serif);font-size:20px;margin-top:6px;color:var(--ink);}
.arow:hover .b .t{color:var(--accent);}

/* スマホ用 固定お問い合わせバー（PCでは非表示） */
.m-cta{display:none;}
@media(max-width:820px){
  .m-cta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:90;gap:1px;
    background:var(--line);box-shadow:0 -2px 14px rgba(20,17,14,.18);}
  .m-cta a{flex:1;text-align:center;padding:16px 0;font-size:14px;letter-spacing:.1em;font-weight:700;}
  .m-cta .m-tel{background:var(--ink);color:#fff;}
  .m-cta .m-contact{background:var(--accent);color:#fff;}
  body{padding-bottom:54px;}   /* バーに本文が隠れないように */
}

/* レスポンシブ */
@media(max-width:820px){
  .s-nav{display:none;}
  .s-burger{display:block;}
  .s-nav.open{display:flex;position:absolute;top:70px;left:0;right:0;flex-direction:column;align-items:flex-start;
    background:var(--bg);border-bottom:1px solid var(--line);padding:18px 28px;gap:16px;}
  .split{grid-template-columns:1fr;gap:30px;}
  .split.rev{direction:ltr;}
  .svc-3{grid-template-columns:1fr;}
  .gallery{column-count:1;}
  .def dl{grid-template-columns:1fr;}
  .def dt{border-bottom:none;padding-bottom:0;}
  .voices,.cols-2{grid-template-columns:1fr;columns:1;}
  .section{padding:70px 0;}
}