:root{--navy:#004d92;--blue:#1a66ad;--bluel:#eaf2f9;--gold:#b28e29;--txt:#1e2730;--sub:#5b6878;
--line:#dfe5ec;--bg:#f4f6f8;--maxw:1180px}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Noto Sans JP',sans-serif;color:var(--txt);font-size:14px;line-height:1.7;background:#fff;padding-top:44px}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
ul{list-style:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.sec{padding:40px 0}
.sec.alt{background:var(--bg)}
.num{font-family:Oswald,'Noto Sans JP',sans-serif;font-weight:600}
.shead{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.shead h2{font-size:22px;color:var(--txt)}
.shead h2 em{font-style:normal;color:var(--navy)}
.shead .en{font-size:11px;color:var(--gold);letter-spacing:.18em;margin-left:10px;font-family:Oswald,sans-serif}
.shead .more{font-size:12px;font-weight:700;color:var(--blue);border:1px solid var(--blue);padding:6px 16px;border-radius:3px;white-space:nowrap}
header{position:sticky;top:44px;z-index:900;background:#fff;border-bottom:1px solid var(--line)}
.hd{max-width:1240px;margin:0 auto;padding:8px 18px;display:flex;align-items:center;gap:16px}
.hd .logo{display:flex;align-items:center;gap:8px}
.hd .logo img{height:34px}
.hd nav{display:flex;gap:0;margin-left:auto}
.hd nav a{font-size:11.5px;font-weight:600;padding:8px 7px;border-radius:3px;white-space:nowrap}
.hd nav a:hover{background:var(--bluel)}
.hd .tel{text-align:right;line-height:1.2;margin-left:8px}
.hd .tel b{font-size:19px;color:var(--navy);font-family:Oswald,'Noto Sans JP',sans-serif;font-weight:600;white-space:nowrap}
.hd .tel span{font-size:9px;color:var(--sub);display:block}
.hd .cta{display:flex;gap:7px}
.hd .cta a{font-size:11.5px;font-weight:700;padding:9px 13px;border-radius:3px;white-space:nowrap}
.hd .cta .doc{background:var(--navy);color:#fff}
.hd .cta .visit{border:1.5px solid var(--navy);color:var(--navy)}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.card{background:#fff;border:1px solid var(--line);border-radius:5px;overflow:hidden}
.card .bd{padding:13px 15px 15px}
.card h3{font-size:16px;margin-bottom:4px}
.card p{font-size:11.5px;color:var(--sub);line-height:1.65}
.card .tagline{display:inline-block;font-size:10px;font-weight:700;color:var(--blue);background:var(--bluel);border-radius:3px;padding:2px 8px;margin-bottom:6px}
.card .lk{font-size:11px;font-weight:700;color:var(--blue);margin-top:8px;display:inline-block}
.excard{background:#fff;border:1px solid var(--line);border-radius:5px;overflow:hidden}
.excard .bd{padding:9px 11px 11px}
.excard .tag{font-size:9px;font-weight:700;padding:2px 7px;border-radius:2px;color:#fff;display:inline-block;margin-bottom:4px}
.excard p{font-size:11px;line-height:1.55;color:var(--txt)}
.excard .meta{font-size:9.5px;color:var(--sub);margin-top:3px}
.ctaband{background:linear-gradient(120deg,#003a6f,#1a66ad);color:#fff;padding:30px 0}
.ctaband .in{max-width:var(--maxw);margin:0 auto;padding:0 22px;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.ctaband .t b{font-size:19px;display:block}
.ctaband .t span{font-size:12px;color:#cfe0f2}
.ctaband .tel{font-size:30px;font-family:Oswald,'Noto Sans JP',sans-serif;font-weight:600;line-height:1.1}
.ctaband .tel small{display:block;font-size:10px;font-family:'Noto Sans JP';font-weight:400;color:#cfe0f2}
.ctaband .bb{display:flex;gap:10px}
.ctaband .bb a{font-size:13px;font-weight:700;padding:13px 22px;border-radius:4px}
.ctaband .bb .w{background:#fff;color:var(--navy)}
.ctaband .bb .o{border:1.5px solid #fff;color:#fff}
footer{background:#13202e;color:#b9c5d2;padding:28px 0 0;font-size:11.5px}
.ft{max-width:var(--maxw);margin:0 auto;padding:0 22px;display:grid;grid-template-columns:4fr 5fr 3fr;gap:30px}
.ft .lg{filter:brightness(0) invert(1);opacity:.9;height:30px;width:auto}
.ft h4{color:#fff;font-size:12px;margin-bottom:8px}
.ft a{display:inline-block;padding:2px 10px 2px 0;color:#b9c5d2}
.ft .addr{line-height:1.8;font-size:10.5px}
.cp{background:#0d161f;color:#7e8b99;text-align:center;font-size:10px;padding:8px;margin-top:22px}
.phero{display:grid;grid-template-columns:6fr 6fr;min-height:360px}
.phero .l{background:linear-gradient(150deg,#003a6f,#0a5ca6);color:#fff;padding:30px 38px;display:flex;flex-direction:column;justify-content:center}
.phero .tag{display:inline-block;background:var(--gold);color:#fff;font-size:11px;font-weight:700;padding:3px 12px;border-radius:3px;margin-bottom:10px;width:fit-content}
.phero h1{font-size:26px;line-height:1.5;margin-bottom:8px}
.phero h1 .en{font-family:Oswald,'Noto Sans JP',sans-serif;font-weight:600}
.phero p{font-size:12.5px;color:#d7e5f2;margin-bottom:14px}
.phero .chips{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:14px}
.phero .chips span{border:1px solid rgba(255,255,255,.45);border-radius:14px;font-size:11px;padding:4px 12px;color:#eaf2fa}
.phero .r{background-size:cover;background-position:center}
/* 2026-10-02 AUN: K/C-spaceヒーロー写真がcover+固定min-heightで見切れていたため(特にC-space)、
   ページごとの実比率でaspect-ratioを指定し高さを可変にする（align-self:startでgridのstretchを解除） */
body.page-template-page-buy_kspace .phero .r{aspect-ratio:1600/900;height:auto;align-self:start}
body.page-template-page-buy_cspace .phero .r{aspect-ratio:1400/1050;height:auto;align-self:start}
.crumb{font-size:10.5px;color:#8b97a4;padding:8px 0}
.qa{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.qa .q{background:#fff;border:1px solid var(--line);border-radius:5px;padding:13px 15px}
.qa .q b{display:flex;gap:8px;font-size:12.5px;color:var(--navy);margin-bottom:5px;align-items:flex-start}
.qa .q b i{font-style:normal;background:var(--navy);color:#fff;width:18px;height:18px;border-radius:50%;font-size:10.5px;display:flex;align-items:center;justify-content:center;flex:none;font-family:Oswald,sans-serif;margin-top:2px}
.qa .q p{font-size:11.5px;color:var(--sub);line-height:1.65}
.ptbl{width:100%;border-collapse:collapse;font-size:11.5px}
.ptbl th,.ptbl td{border-bottom:1px solid var(--line);padding:5px 8px;text-align:left}
.ptbl th{color:var(--sub);font-weight:500;width:46%}
.feat3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:14px}
.feat3 .fc{background:#fff;border:1px solid var(--line);border-radius:5px;padding:20px 18px;text-align:center}
.feat3 .fc img{width:52px;height:52px;object-fit:contain;margin:0 auto 10px}
.feat3 .fc .ftag{display:inline-block;font-size:9px;font-weight:700;color:var(--gold);letter-spacing:.12em;font-family:Oswald,sans-serif;margin-bottom:6px}
.feat3 .fc h3{font-size:14.5px;margin-bottom:7px;line-height:1.4}
.feat3 .fc p{font-size:11.5px;color:var(--sub);line-height:1.65;text-align:left}
.flowgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.fitem{background:#fff;border:1px solid var(--line);border-radius:5px;overflow:hidden}
.fitem .fph{aspect-ratio:600/338;height:auto;background-size:cover;background-position:center}
.fitem .fbd{padding:10px 13px 13px}
.fitem .fno{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--navy);color:#fff;font-size:10px;font-family:Oswald,sans-serif;font-weight:600;margin-bottom:5px}
.fitem .flabel{font-size:8.5px;color:var(--gold);font-weight:700;letter-spacing:.1em;font-family:Oswald,sans-serif;margin-left:6px}
.fitem b{display:block;font-size:12.5px;margin-bottom:3px}
.fitem p{font-size:11px;color:var(--sub);line-height:1.6}
.fitem.done{border-color:var(--navy)}
#tb{position:fixed;top:0;left:0;right:0;min-height:44px;background:#1d2733;color:#fff;display:flex;align-items:center;gap:8px 10px;padding:5px 14px;z-index:9999;font-size:12px;flex-wrap:wrap}
#tb .nm{opacity:.85;margin-right:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
#tb button{background:#334153;color:#fff;border:0;border-radius:5px;padding:6px 12px;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;white-space:nowrap}
#tb button.on{background:#3d7ec9}
@media print{#tb{display:none}body{padding-top:0}header{position:static}}
@media(max-width:900px){
 .hd nav{display:none}
 .phero{grid-template-columns:1fr!important}
 .phero .r{min-height:220px;order:-1}
 .grid4{grid-template-columns:1fr 1fr!important}
 .grid3{grid-template-columns:1fr 1fr!important}
 .grid2{grid-template-columns:1fr!important}
 .feat3{grid-template-columns:1fr!important}
 .flowgrid{grid-template-columns:1fr 1fr!important}
 .qa{grid-template-columns:1fr!important}
 .ft{grid-template-columns:1fr!important}
 .ctaband .in{flex-direction:column;align-items:stretch;text-align:center;gap:14px}
 .ctaband .tel{font-size:26px}
 .ctaband .bb{flex-direction:column;width:100%}
 .ctaband .bb a{text-align:center}
}
@media(max-width:560px){
 .grid4{grid-template-columns:1fr 1fr}
 .hd .tel{display:none}
 .flowgrid{grid-template-columns:1fr!important}
 .hd{flex-wrap:wrap;padding:7px 14px;gap:8px}
 .hd .logo{margin-right:auto}
 .hd .cta{width:100%;margin-left:0;gap:6px}
 .hd .cta a{flex:1 1 0;min-width:0;text-align:center;padding:9px 4px;font-size:10.5px;overflow:hidden;text-overflow:ellipsis}
}

/* ===== global nav: 全ページ共通（2026-07-30 統一） ===== */
/* header */
header{position:sticky;top:44px;z-index:900;background:#fff;border-bottom:1px solid var(--line)}.hd{max-width:1240px;margin:0 auto;padding:8px 18px;display:flex;align-items:center;gap:16px}.hd .logo{display:flex;align-items:center;gap:8px}.hd .logo img{height:34px}.hd nav{display:flex;gap:0;margin-left:auto}.hd nav a{font-size:11.5px;font-weight:600;padding:8px 7px;border-radius:3px;white-space:nowrap}.hd nav a:hover{background:var(--bluel)}.hd nav .hasdd{position:relative}.hd nav .hasdd>.dd{position:absolute;top:100%;left:0;min-width:230px;background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.12);padding:6px;display:none;z-index:950}.hd nav .hasdd:hover>.dd{display:block}.hd nav .hasdd>.dd a{display:block;font-size:12px;font-weight:600;padding:9px 12px;border-radius:4px;white-space:nowrap;color:var(--navy)}.hd nav .hasdd>.dd a:hover{background:var(--bluel)}.hd .tel{text-align:right;line-height:1.2;margin-left:8px}.hd .tel b{font-size:19px;color:var(--navy);font-family:Oswald,'Noto Sans JP',sans-serif;font-weight:600;white-space:nowrap}.hd .tel span{font-size:9px;color:var(--sub);display:block}.hd .cta{display:flex;gap:7px}.hd .cta a{font-size:11.5px;font-weight:700;padding:9px 13px;border-radius:3px;white-space:nowrap}.hd .cta .doc{background:var(--navy);color:#fff}.hd .cta .visit{border:1.5px solid var(--navy);color:var(--navy)}.ctaband .tel{font-size:30px;font-family:Oswald,'Noto Sans JP',sans-serif;font-weight:600;line-height:1.1}.ctaband .tel small{display:block;font-size:10px;font-family:'Noto Sans JP';font-weight:400;color:#cfe0f2}.rentcta .tel{text-align:center;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.3);border-radius:8px;padding:14px}.rentcta .tel span{font-size:11px;color:#cfe0f2}.rentcta .tel b{font-size:30px;font-family:Oswald,'Noto Sans JP',sans-serif;display:block;line-height:1.15}.rentcta .tel small{font-size:10px;color:#cfe0f2}@media print{header{position:static}}@media(max-width:900px){.hd nav{display:none}}@media(max-width:560px){.hd .tel{display:none}.ctaband .tel{font-size:26px}.hd{flex-wrap:wrap;padding:7px 14px;gap:8px}.hd .logo{margin-right:auto}.hd .cta{width:100%;margin-left:0;gap:6px}.hd .cta a{flex:1 1 0;min-width:0;text-align:center;padding:9px 4px;font-size:10.5px;overflow:hidden;text-overflow:ellipsis}}/* branded header with people illustrations (元サイト踏襲) */
.uhd.ppl{position:relative;padding:0 100px}

/* global nav: 「サービス」(.hasdd)だけ縦位置がずれるのを是正（2026-07-31） */
.hd nav{align-items:center}
.hd nav>a,.hd nav>.hasdd{display:flex;align-items:center}
.hd nav>.hasdd>a{display:flex;align-items:center}

/* --- 構築時の上書き（編集ツールバー用の逃げを解除） --- */
#tb{display:none!important}
header{top:0!important}

/* ===== 2026-09-08 AUN指摘対応（K-space / C-space） =====
   k-space-detail.css は K-space と C-space の2ページで共有しているため、
   ページ単位の調整は body_class（page-template-page-buy_kspace / -cspace）でスコープする。 */

/* B42: 外壁デザインを A-space と同じ「見本写真＋名称」の並びに変更 */
.ksw{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.ksw figure{margin:0}
.ksw img{width:100%;height:72px;object-fit:cover;border:1px solid var(--line);border-radius:4px;display:block}
.ksw figcaption{font-size:10.5px;line-height:1.4;text-align:center;margin-top:5px;color:var(--txt)}

/* B43: 「01 フレーム」カードが隣のカードの高さに引き伸ばされ、下に約170pxの空白ができていた。
   カードを中身の高さで止めて空白をなくす。 */
body.page-template-page-buy_kspace .grid2{align-items:start}

/* B79: 「04 オプション品」は「03 サッシ・ドア」のリード（カラー選択ボックス h=58px）が無いため、
   表と写真の行位置が39pxずれていた。リードの高さを揃えて行と写真の位置を一致させる。 */
@media(min-width:901px){
  body.page-template-page-buy_kspace .grid2 > .card:nth-child(4) > .bd > p:first-of-type{min-height:58px;margin-bottom:8px}
}

/* ===== 2026-10-01 AUN P5: 「他のシリーズも見る」をA-spaceと同じ写真バナー型に統一 =====
   A-space側は common/css/v5/a-space.css の .kcnav。K/C-spaceはこのCSSを読まないため同内容をここに追加。 */
.kcnav{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:12px}
.kcnav a{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:2/1;height:auto;display:flex;align-items:center;padding:0 24px;color:#fff}/* 2026-10-02 AUN P10: height:120px+coverで大きく見切れていたため、ブロックを写真比率(2:1)に拡大 */
.kcnav .bg{position:absolute;inset:0;background-size:cover;background-position:center}
.kcnav .ov{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,20,40,.55),rgba(0,20,40,.15) 60%,rgba(0,20,40,0))}
/* 2026-10-03 AUN u09: 118%拡大（写真の切り取り）は廃止。A-space写真は白い余白を除いた aspace-mv-trim.jpg に差し替え */
.kcnav .tx{position:relative;z-index:2}
.kcnav .tx b{font-size:18px;font-family:Oswald,'Noto Sans JP',sans-serif;display:block}
.kcnav .tx span{font-size:12px}
@media(max-width:700px){.kcnav{grid-template-columns:1fr}}
/* 2026-10-03 AUN u09: 写真を各シリーズページのMVに統一。枠＝写真比率（--r・PHP側でインライン指定）で切らずに表示し、
   横幅を比率で配分して2枚の高さを揃える（上の grid/2:1 指定を上書き） */
.kcnav{display:flex;align-items:flex-start}
.kcnav a{--r:2/1;flex:calc(var(--r)) 1 0;min-width:0;aspect-ratio:var(--r);padding:0}/* 左右余白はflex配分の誤差になるため .tx 側へ */
.kcnav .tx{padding:0 24px}
@media(max-width:700px){.kcnav{flex-direction:column;align-items:stretch}.kcnav a{flex:none;width:100%}}
/* 2026-10-03: K-spaceのMV（16:9）がSP390で min-height:220px に押されて幅391pxになり、1pxの横スクロールが出ていたため解除 */
@media(max-width:900px){body.page-template-page-buy_kspace .phero .r{min-height:0}}

/* ===== 2026-10-01 AUN P6: K-space=カーキ(gold)／C-space=ブルーでイメージカラーを差別化 =====
   TOPの「spaceシリーズ」K-space・C-spaceの文字色（--gold／--blue）に合わせる。
   k-space-detail.css は両ページ共有のため、WordPressのbody_classでページ単位にスコープする。 */
body.page-template-page-buy_kspace .phero .l{background:linear-gradient(150deg,#5e4a1a,var(--gold))}
body.page-template-page-buy_cspace .phero .l{background:linear-gradient(150deg,var(--navy),var(--blue))}
body.page-template-page-buy_cspace .phero .tag{background:var(--blue)}
body.page-template-page-buy_kspace .shead h2 em{color:var(--gold)}
body.page-template-page-buy_cspace .shead h2 em{color:var(--blue)}

/* ===== 2026-10-07 見切れ・フチ最終修正（K-space）=====
   02 外壁デザイン6枠: 高さ72pxの cover で上下が切れていた（PC差-28%・SP差-58%）→ 枠＝写真の比率（約654×200）で表示。
   SPの3列だと幅98px・高さ30pxと小さくなるため、560px以下は2列に */
body.page-template-page-buy_kspace .ksw img{height:auto;object-fit:cover}
@media(max-width:560px){body.page-template-page-buy_kspace .ksw{grid-template-columns:repeat(2,1fr)}}

/* 2026-10-21 松村FB: 「他のシリーズも見る」のカードが左右で幅が違う（C-spaceページでA:C=480:640）→ A-spaceページ（10/20）と同じく
   2等分・同じ高さ（16:10枠で cover）。K-space・C-spaceの両ページに効く */
.kcnav a{flex:1 1 0;aspect-ratio:16/10}
@media(max-width:700px){.kcnav a{flex:none;width:100%}}