:root{
  --bg:#111113; --bg2:#0b0b0c; --card:#161618; --line:#2a2a2d;
  --ink:#e8e6e0; --mut:#9a988f; --gold:#b08d57; --green:#1c5238; --green-h:#236a46;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font-family:'Zen Kaku Gothic New',sans-serif;font-weight:400;line-height:1.8;-webkit-font-smoothing:antialiased}
.serif{font-family:'Shippori Mincho',serif}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.gold-rule{width:98%;height:1px;background:var(--gold);margin:5px auto}
.topstrip{background:var(--bg2);font-size:12px;letter-spacing:.08em;color:var(--mut)}
.topstrip .wrap{display:flex;justify-content:flex-end;gap:22px;padding:7px 24px}
header{position:sticky;top:0;z-index:50;background:rgba(17,17,19,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav{display:flex;flex-direction:column;align-items:center;gap:14px;padding:18px 24px;position:relative}
.brand{display:block}
.brand img{width:350px;max-width:72vw;height:auto;display:block}
.menu{display:flex;gap:26px;font-size:13px;letter-spacing:.1em;color:#c8c6bd}
.menu a:hover{color:#fff}
.menu .on{color:#fff}
.burger{display:none;position:absolute;right:10px;top:8px;font-size:26px;background:none;border:0;color:var(--ink);cursor:pointer}
.hero{position:relative;height:40vh;min-height:300px;overflow:hidden;background:#000}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease}
.slide.active{opacity:1}
.slide img{width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.15) 0%,rgba(0,0,0,0) 35%,rgba(0,0,0,.65) 100%)}
.hero-cap{position:absolute;left:0;right:0;bottom:34px;z-index:3}
.hero-cap .ey{font-size:12px;letter-spacing:.3em;color:var(--gold)}
.hero-cap .ti{font-size:30px;color:#fff;margin-top:6px}
.hero-ctrl{position:absolute;left:24px;top:24px;z-index:3;display:flex;gap:10px}
.hero-ctrl button{width:42px;height:42px;border:1px solid rgba(255,255,255,.45);background:rgba(0,0,0,.15);border-radius:50%;color:#fff;font-size:18px;cursor:pointer;transition:.2s}
.hero-ctrl button:hover{background:rgba(255,255,255,.15)}
.hero-count{position:absolute;right:24px;bottom:40px;z-index:3;font-size:15px;letter-spacing:.12em;color:#fff}
.dots{position:absolute;left:50%;transform:translateX(-50%);bottom:18px;z-index:3;display:flex;gap:8px}
.dots span{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.4);cursor:pointer}
.dots span.on{background:var(--gold)}
.phero{position:relative;height:40vh;min-height:300px;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;background:#000}
.phero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 60%;opacity:.5}
.phero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.3),rgba(0,0,0,.55))}
.phero .inner{position:relative;z-index:2}
.phero .en{font-size:36px;color:#fff}
.phero .jp{font-size:13px;color:#d8d6cd;letter-spacing:.22em;margin-top:10px}
.lead{text-align:center;max-width:760px;margin:0 auto 44px;color:#bdbcb3;font-size:14px;line-height:2}
section{padding:64px 0}
.sec-head{text-align:center;margin-bottom:40px}
.sec-head .en{font-size:28px;color:#fff}
.sec-head .jp{font-size:13px;color:var(--mut);letter-spacing:.14em;margin-top:6px}
.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.fcard{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.fcard .ph{height:200px;overflow:hidden}
.fcard .ph img{width:100%;height:100%;object-fit:cover;transition:.4s}
.fcard:hover .ph img{transform:scale(1.05)}
.feat .fcard .ph img{filter:brightness(.6);transition:none}
.feat .fcard:hover .ph img{transform:none}
.fcard .bd{padding:18px 20px 22px}
.fcard h3{font-size:17px;color:#fff;font-weight:500}
.fcard p{font-size:13px;color:var(--mut);margin-top:8px}
.newlist{margin-top:8px}
.newlist a{display:block;font-size:13.5px;color:#cbcabf;padding:3px 0;transition:color .2s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.newlist a::before{content:"・";color:var(--gold)}
.newlist a:hover{color:var(--gold)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.car{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:transform .2s ease,border-color .2s}
.car:hover{transform:translateY(-4px);border-color:#3c3c40}
.car .ph{position:relative;height:200px;overflow:hidden}
.car .ph img{width:100%;height:100%;object-fit:cover;transition:.5s}
.car:hover .ph img{transform:scale(1.06)}
.car .tag{position:absolute;top:12px;left:12px;background:rgba(0,0,0,.55);color:#fff;font-size:11px;letter-spacing:.08em;padding:4px 10px;border-radius:3px}
.car .bd{padding:18px 18px 20px}
.car .mk{font-size:11px;letter-spacing:.12em;color:var(--gold)}
.car .nm{font-size:18px;color:#fff;margin:5px 0 10px}
.car .pr{font-size:18px;color:#fff;font-weight:500}
.car .pr.ask{color:var(--gold)}
.spec{font-size:12.5px;color:var(--mut);line-height:1.95;border-top:1px solid var(--line);margin-top:14px;padding-top:12px}
.spec b{color:#cdccc4;font-weight:400;display:inline-block;width:42px}
.btns{display:flex;gap:10px;margin-top:16px}
.btns a{flex:1;text-align:center;font-size:12.5px;padding:11px 0;border-radius:4px}
.btns .enq{background:var(--green);color:#dfeee4}
.btns .enq:hover{background:var(--green-h)}
.btns .det{border:1px solid #45453f;color:#cdccc4}
.btns .det:hover{border-color:var(--gold);color:#fff}
.more{text-align:center;margin-top:42px}
.more a{display:inline-block;border:1px solid var(--gold);color:#e7d8bd;font-size:13px;letter-spacing:.14em;padding:13px 40px;border-radius:3px}
.more a:hover{background:var(--gold);color:#1a1a1a}
.about{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.about .tx h3{font-size:22px;color:#fff;font-weight:500}
.about .tx p{font-size:14px;color:#bdbcb3;margin-top:14px}
.about .im{height:300px;border-radius:12px;overflow:hidden}
.about .im img{width:100%;height:100%;object-fit:cover}
.cta{background:var(--bg2);padding:54px 24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;max-width:1180px;margin:0 auto}
.cta-left,.cta-right{text-align:center}
.cta h3{font-size:23px;color:#fff;font-weight:500}
.cta p{font-size:13px;color:var(--mut);margin-top:10px}
.cta .tel{font-size:34px;color:var(--gold);letter-spacing:.05em;margin-top:14px}
.cta-label{font-size:12px;letter-spacing:.14em;color:var(--mut);margin-bottom:16px}
.media-links{display:flex;gap:18px;justify-content:center;align-items:center;flex-wrap:wrap}
.media-links a{display:block;border:1px solid var(--line);border-radius:6px;overflow:hidden;transition:.2s}
.media-links a:hover{transform:translateY(-2px);border-color:var(--gold)}
.media-links img{height:80px;width:auto;max-width:100%;display:block}
.sns{display:flex;justify-content:center;gap:30px;padding:30px 0;font-size:22px;color:#b8b6ad}
.sns a:hover{color:#fff}
footer{background:#070708;color:#6f6e68;text-align:center;font-size:12px;letter-spacing:.08em;padding:22px}
.maps{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.mapcard .mh{font-size:17px;color:#fff}
.mapcard .addr{font-size:12.5px;color:var(--mut);margin:6px 0 12px}
.mapbox{height:300px;border-radius:10px;overflow:hidden;border:1px solid var(--line)}
.mapbox iframe{width:100%;height:100%;border:0;filter:grayscale(1) brightness(.68) contrast(1.08)}
.cform{max-width:720px;margin:0 auto}
.cform .row2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.cform input,.cform textarea{width:100%;background:var(--card);border:1px solid var(--line);border-radius:6px;color:var(--ink);font-family:inherit;font-size:14px;padding:13px 14px;line-height:1.6}
.cform input::placeholder,.cform textarea::placeholder{color:#6f6e68}
.cform input:focus,.cform textarea:focus{outline:none;border-color:var(--gold)}
.cform textarea{resize:vertical}
.send{margin-top:18px;background:var(--green);color:#dfeee4;border:0;border-radius:5px;font-size:14px;letter-spacing:.12em;padding:14px 54px;cursor:pointer;font-family:inherit}
.send:hover{background:var(--green-h)}
.gallery{max-width:1100px;width:95%;margin:0 auto}
.gmain{background:#0b0b0c;border:1px solid var(--line);border-radius:12px;overflow:hidden;aspect-ratio:16/10;display:flex;align-items:center;justify-content:center}
.gmain img{width:100%;height:100%;object-fit:contain;cursor:zoom-in}
.gthumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px;margin-top:10px}
.gthumb{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px;border:1px solid var(--line);cursor:pointer;opacity:.55;transition:.2s}
.gthumb.on,.gthumb:hover{opacity:1;border-color:var(--gold)}
.lightbox{display:none;position:fixed;inset:0;background:rgba(0,0,0,.93);z-index:200;align-items:center;justify-content:center;cursor:zoom-out}
.lightbox.open{display:flex}
.lightbox img{max-width:90%;max-height:90%;object-fit:contain}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);font-size:46px;line-height:1;color:#fff;cursor:pointer;padding:6px 20px;user-select:none;opacity:.7;z-index:2}
.lb-nav:hover{opacity:1}
.lb-prev{left:6px}
.lb-next{right:6px}
.lb-close{position:absolute;top:12px;right:22px;font-size:38px;line-height:1;color:#fff;cursor:pointer;opacity:.7;z-index:2}
.lb-close:hover{opacity:1}
.detail{max-width:1100px;width:95%;margin:0 auto}
.dhead{text-align:center;margin-bottom:36px}
.dhead .mk{font-size:12px;letter-spacing:.18em;color:var(--gold)}
.dhead h1{font-size:30px;color:#fff;font-weight:500;margin:8px 0 4px}
.dhead .sub{font-size:14px;color:var(--mut)}
.dhead .price{font-size:30px;color:#fff;margin-top:18px}
.dhead .price.ask{color:var(--gold)}
.dhead .price span{font-size:13px;color:var(--mut);margin-left:10px}
.dgrid{display:grid;grid-template-columns:300px 1fr;gap:40px;align-items:start}
.spec-table{border:1px solid var(--line);border-radius:12px;overflow:hidden}
.spec-table dl{display:grid;grid-template-columns:90px 1fr;margin:0;font-size:13.5px}
.spec-table dt{background:#161618;color:var(--mut);padding:12px 14px;border-bottom:1px solid var(--line);margin:0}
.spec-table dd{padding:12px 14px;border-bottom:1px solid var(--line);color:#e8e6e0;margin:0}
.spec-table dl:last-of-type dt,.spec-table dl:last-of-type dd{border-bottom:0}
.desc h3{font-size:16px;color:#fff;font-weight:500;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.desc .body{font-size:14px;color:#cbcabf;line-height:2;margin-bottom:30px}
.detail-video{max-width:900px;width:95%;margin:50px auto 0}
.detail-video .vbox{position:relative;padding-bottom:56.25%;height:0;border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.detail-video .vbox iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.maplink{text-decoration:underline;text-decoration-color:transparent;text-underline-offset:3px;transition:color .2s,text-decoration-color .2s}
.maplink:hover{color:var(--gold);text-decoration-color:var(--gold)}
.info-table{max-width:680px;margin:0 auto;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.info-table dl{display:grid;grid-template-columns:130px 1fr;margin:0;font-size:13.5px}
.info-table dt{background:#161618;color:var(--mut);padding:13px 16px;border-bottom:1px solid var(--line);margin:0}
.info-table dd{padding:13px 16px;border-bottom:1px solid var(--line);color:#e8e6e0;margin:0}
.info-table dl:last-of-type dt,.info-table dl:last-of-type dd{border-bottom:0}
@media(max-width:860px){
  .menu{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:var(--bg);border-bottom:1px solid var(--line)}
  .menu.open{display:flex}
  .menu a{padding:14px 24px;border-top:1px solid var(--line)}
  .burger{display:block}
  .feat,.grid,.about,.maps,.cform .row2,.cta-grid,.dgrid,.cols2{grid-template-columns:1fr}
  .about .im{height:220px}
  .hero{height:30vh;min-height:220px}
  .hero-cap{bottom:26px}
  .hero-cap .ey{font-size:10px}
  .hero-cap .ti{font-size:17px;line-height:1.35;margin-top:4px;max-width:88%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hero-count{font-size:12px;bottom:30px}
  .dots{bottom:8px}
  .phero{height:30vh;min-height:220px}
  .phero .en{font-size:26px}
  .topstrip .wrap{justify-content:center;gap:14px}
}

/* ===== インラインstyleから集約したクラス（2026/06/30 くろちゃん） ===== */
.sec-alt{background:#0e0e10}                 /* 濃色セクション背景 */
.sec-pt-sm{padding-top:20px}                 /* セクション上余白(小) */
.sec-pt-xs{padding-top:10px}                 /* セクション上余白(極小) */
.sec-pb-sm{padding-bottom:30px}              /* セクション下余白(小) */
.center{text-align:center}
.nobr{display:inline-block}                  /* 日本語フレーズを途中で改行させない（読点等の区切りでのみ折返し） */
.gold-rule.spaced{margin:14px 0}             /* 区切り線の上下に余白 */
.grid-empty{grid-column:1/-1;text-align:center;color:var(--mut)}  /* 一覧0件メッセージ */
.about-narrow{max-width:800px}               /* 会社案内 本文幅 */
.greeting{font-size:14px;color:#cbcabf;line-height:2.1;text-align:center}  /* 代表挨拶 */
.addr-note{color:var(--mut);font-size:13px}  /* 住所の小書き */
.gmain.is-empty{color:var(--mut)}            /* 画像準備中 */
.btns-narrow{max-width:360px}                /* 単独ボタンの最大幅 */
.is-dim{opacity:.85}                         /* SOLD画像を少し暗く */

/* ===== 詳細ギャラリー：メイン画像の高さ抑制＋前後ナビ＋ライトボックスのズーム（2026/06/30 くろちゃん） ===== */
/* 13インチ等の低い画面でも下のサムネイルが見えるよう、メイン画像の高さを画面基準で上限化（画像はcontainで縮小・見切れなし） */
.gmain{position:relative;aspect-ratio:auto;height:clamp(300px,60vh,660px)}
.gnav{position:absolute;top:50%;transform:translateY(-50%);width:54px;height:54px;border:1px solid rgba(255,255,255,.6);border-radius:50%;background:rgba(0,0,0,.5);color:#fff;font-size:30px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:2;transition:background .2s,border-color .2s,transform .1s;box-shadow:0 2px 12px rgba(0,0,0,.45)}
.gnav:hover{background:var(--gold);border-color:var(--gold);color:#1a1a1a}
.gnav:active{transform:translateY(-50%) scale(.92)}
.gprev{left:16px}
.gnext{right:16px}
@media(max-width:560px){.gnav{width:46px;height:46px;font-size:26px}.gmain{height:clamp(240px,46vh,460px)}}
@media(max-width:400px){.hero-cap .ti{font-size:15px;max-width:75%}}
.lightbox img{cursor:zoom-in;touch-action:none;will-change:transform}  /* ズーム/パン操作用 */

/* ===== ▼ページ読み込み時のフェードイン（試験導入 2026/06/30）─ 不要なら下の3行を削除 ▼ ===== */
@keyframes pageFade{from{opacity:0}to{opacity:1}}
body{animation:pageFade .8s ease both}
/* ===== ▲ここまで削除すれば元に戻ります▲ ===== */

/* ===== 言語スイッチャー（国旗トグル 2026/07/01 くろちゃん） ===== */
.topstrip .wrap{justify-content:space-between;flex-wrap:wrap}
.tinfo{display:flex;gap:22px;align-items:center}
.langsw{display:flex;gap:8px;align-items:center}
.langsw a{display:inline-flex;width:26px;height:18px;border-radius:3px;overflow:hidden;line-height:0;opacity:.45;outline:1.5px solid transparent;outline-offset:1px;transition:opacity .2s,outline-color .2s}
.langsw a:hover{opacity:.85}
.langsw a.on{opacity:1;outline-color:var(--gold)}
.langsw svg{display:block;width:100%;height:100%}
@media(max-width:560px){.topstrip .wrap{justify-content:center;gap:12px}.tinfo{gap:14px}}
/* 英語時はスペックのラベルが長いので幅を広げる */
html[lang="en"] .spec b{width:auto;min-width:64px;padding-right:8px}
html[lang="en"] .spec-table dl{grid-template-columns:120px 1fr}
html[lang="en"] .info-table dl{grid-template-columns:170px 1fr}