@charset "UTF-8";
body{margin:0;background:#F6F5F3;color:#222222;font-family:游ゴシック体,YuGothic,"游ゴシック Medium","Yu Gothic Medium",游ゴシック,"Yu Gothic",sans-serif;-webkit-font-smoothing:antialiased;font-size:16px}
a{color:#222222;text-decoration:none}a:hover{color:#111111}
*{box-sizing:border-box}
:focus-visible{outline:2px solid #3366CC;outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.root{min-height:100vh;display:flex;flex-direction:column}
.root>*{width:100%}
.in{max-width:1200px;margin:0 auto;padding:0 40px}

/* header */
.hd{background:#F6F5F3;border-bottom:1px solid #CCCAC6}
.hd1{display:flex;align-items:center;gap:20px;min-height:84px}
.hd1 .logo img{height:44px;width:auto;display:block}
.hd1 .kind{font-size:12px;letter-spacing:.14em;padding-left:20px;border-left:1px solid #CCCAC6;line-height:1.7;white-space:nowrap}
.hd-tel{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;line-height:1.3}
.hd-tel b{font-size:22px;font-weight:400;letter-spacing:.06em;color:#111111}
.hd-tel span{font-size:11px;letter-spacing:.08em}
.rsv{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;background:#111111;color:#FFFFFF !important;font-size:14px;letter-spacing:.12em}
.rsv:hover{background:#3C3C3C}
.hd2wrap{border-top:1px solid #ECEBE8}
.hd2{display:flex;justify-content:space-between;align-items:center}
.hd2 a{position:relative;display:inline-flex;align-items:center;min-height:56px;font-size:15px;letter-spacing:.12em}
.hd2 a::after{content:'';position:absolute;left:0;right:.12em;bottom:12px;height:1px;background:#111111;transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.hd2 a:hover::after,.hd2 a:focus-visible::after{transform:scaleX(1)}
.menu{display:none;width:48px;height:48px;align-items:center;justify-content:center;background:none;border:1px solid #CCCAC6;color:#222222}

/* section head */
.sec{padding-top:112px}
.sh{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;padding-bottom:24px;margin-bottom:40px;border-bottom:1px solid #CCCAC6}
.eb{display:block;font-size:12px;letter-spacing:.24em;color:#6E6E6E;margin-bottom:12px;font-weight:400}
.st{font-size:28px;font-weight:400;letter-spacing:.16em;color:#111111;margin:0;line-height:1.5}
.lead{font-size:15px;line-height:2;letter-spacing:.06em;margin:8px 0 0}
.more{display:inline-flex;align-items:center;gap:16px;min-height:44px;font-size:14px;letter-spacing:.14em;color:#111111}
.more::after{content:'';width:32px;height:1px;background:#111111;transition:width .25s}
.more:hover::after{width:48px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 32px;background:#111111;color:#FFFFFF;font-size:15px;letter-spacing:.14em}
a.btn:hover{background:#3C3C3C;color:#FFFFFF}
.btn-o{background:transparent;color:#111111;border:1px solid #111111}
a.btn-o:hover{background:#FFFFFF;color:#111111}

/* listings */
.sub{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:0 0 16px}
.sub h3{font-size:18px;font-weight:400;letter-spacing:.14em;color:#111111;margin:0}
.sub h3 span{font-size:13px;color:#6E6E6E;margin-left:12px;letter-spacing:.08em}
.land{list-style:none;margin:0 0 72px;padding:0;border-top:1px solid #323232}
.lr{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr) 140px;gap:24px;align-items:center;min-height:88px;padding:12px 8px;border-bottom:1px solid #CCCAC6;position:relative}
.lr:hover{background:#FFFFFF}
.lr .nm{font-size:17px;letter-spacing:.06em;color:#111111;line-height:1.6}
.lr .nm small{display:block;font-size:12px;letter-spacing:.12em;color:#6E6E6E}
.lr .nm a::after{content:'';position:absolute;inset:0}
.lr .k{font-size:11px;letter-spacing:.14em;color:#6E6E6E;display:none}
.lr .v{font-size:15px;color:#111111}
.lr .pr{text-align:right;font-size:24px;color:#111111}
.lr .pr em{font-style:normal;font-size:13px;margin-left:2px}
.lh{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr) 140px;gap:24px;padding:0 8px 10px;font-size:11px;letter-spacing:.14em;color:#6E6E6E}
.lh span:last-child{text-align:right}
.homes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:48px 28px}
.hm{display:flex;flex-direction:column;gap:6px}
.hm .ph{position:relative;aspect-ratio:4/3;overflow:hidden;margin-bottom:10px}
.hm .ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.hm:hover .ph img{transform:scale(1.03)}
.hm .tags{position:absolute;left:0;top:0;display:flex}
.hm .tag{background:#F6F5F3;color:#111111;font-size:12px;letter-spacing:.1em;padding:4px 10px;white-space:nowrap}
.hm .tag.rf{background:#323232;color:#FFFFFF}
.hm small{font-size:12px;letter-spacing:.12em;color:#6E6E6E}
.hm .nm{font-size:15px;line-height:1.7;color:#111111}
.hm .pr{font-size:21px;color:#111111}
.hm .pr em{font-style:normal;font-size:13px;margin-left:2px}
.hm .sp{font-size:13px}

.acts{display:flex;gap:12px;flex-wrap:wrap}

/* sell */
.sell{background:#323232;color:#F6F5F3;padding:96px 0}
.sell .eb{color:#BDBDBD}
.sell-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:80px;align-items:start}
.sell h2{font-size:30px;font-weight:400;letter-spacing:.14em;line-height:1.7;margin:0 0 20px;color:#FFFFFF}
.sell p{margin:0;font-size:16px;line-height:2.1;letter-spacing:.04em}
.steps{list-style:none;margin:0 0 32px;padding:0;border-top:1px solid #555555}
.steps li{display:grid;grid-template-columns:120px minmax(0,1fr);gap:20px;padding:20px 0;border-bottom:1px solid #555555}
.steps b{font-size:16px;font-weight:400;letter-spacing:.12em;color:#FFFFFF}
.steps span{font-size:14px;line-height:1.9}
.sell-cta{display:flex;align-items:center;gap:32px;flex-wrap:wrap}
.sell-tel b{display:block;font-size:30px;font-weight:400;letter-spacing:.06em;color:#FFFFFF}
.sell-tel span{display:block;font-size:12px;letter-spacing:.08em;color:#CCCCCC;margin-top:4px}
.btn-l{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 36px;background:#F6F5F3;color:#111111;font-size:15px;letter-spacing:.14em}
a.btn-l:hover{background:#FFFFFF;color:#111111}
/* news */
.news{display:grid;grid-template-columns:300px minmax(0,1fr);gap:64px;align-items:start}
.nl{list-style:none;margin:0;padding:0;border-top:1px solid #323232}
.nl-row{display:grid;grid-template-columns:112px 112px minmax(0,1fr);gap:24px;align-items:center;min-height:64px;padding:10px 8px;border-bottom:1px solid #CCCAC6;font-size:15px;line-height:1.7;letter-spacing:.04em}
.nl-row:hover{background:#FFFFFF}
.nl-row:hover .nl-ttl{text-decoration:underline;text-underline-offset:4px;color:#111111}
.nl-row time{font-size:13px;letter-spacing:.08em}
.nl-cat{justify-self:start;font-size:12px;letter-spacing:.1em;border:1px solid #323232;padding:2px 12px;white-space:nowrap}

/* contact */
.contact{margin-top:112px;background:#FFFFFF;padding:88px 0}
.contact .sh{border-bottom:0;padding-bottom:0}
.ct{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #323232;border-bottom:1px solid #CCCAC6}
.ct>div{padding:32px 32px 36px;border-left:1px solid #ECEBE8;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.ct>div:first-child{border-left:0;padding-left:0}
.ct h3{font-size:18px;font-weight:400;letter-spacing:.14em;color:#111111;margin:0}
.ct p{margin:0 0 8px;font-size:14px;line-height:1.9}
.ct .big{font-size:32px;letter-spacing:.06em;color:#111111;line-height:1.2}
.ct .big small{display:block;font-size:12px;letter-spacing:.1em;color:#222222}

/* footer */
.sf{flex:1 0 auto;background:#EFEEEB;border-top:1px solid #CCCAC6}
.sf a:hover{color:#111111;text-decoration:underline;text-underline-offset:4px}
.sf-in{max-width:1200px;margin:0 auto;padding:64px 40px 32px}
.sf-top{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1.8fr);gap:64px;align-items:start}
.sf-logo{height:46px;width:auto;display:block;margin-bottom:20px}
.sf-addr{margin:0;font-size:13px;line-height:1.8}
.sf-addr div{display:grid;grid-template-columns:88px minmax(0,1fr);gap:8px;padding:3px 0}
.sf-addr dd{margin:0;color:#111111}
.sf-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.sf-nav h2{font-size:14px;font-weight:500;margin:0 0 10px;padding-bottom:10px;border-bottom:1px solid #323232;letter-spacing:.14em;color:#111111}
.sf-nav ul{list-style:none;margin:0;padding:0}
.sf-nav a{display:flex;align-items:center;min-height:44px;font-size:14px;letter-spacing:.06em}
.sf-lic{display:flex;flex-wrap:wrap;gap:8px 32px;margin-top:40px;padding:18px 0;border-top:1px solid #CCCAC6;border-bottom:1px solid #CCCAC6;font-size:12px;line-height:1.8;letter-spacing:.04em}
.sf-bottom{display:flex;align-items:center;gap:24px;padding-top:12px;font-size:12px}
.sf-bottom ul{list-style:none;margin:0;padding:0;display:flex;gap:24px}
.sf-bottom ul a{display:inline-flex;align-items:center;min-height:44px}
.sf-bottom small{margin-left:auto;font-size:12px;letter-spacing:.08em}
.sf-top-btn{width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #323232}


/* 現在地 */
.hd2 a.cur::after{transform:scaleX(1)}
.hd2 a.cur{color:#111111}

/* 下層ページ見出し */
.crumb{padding-top:20px}
.crumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;font-size:12px;letter-spacing:.08em}
.crumb li{display:flex;align-items:center}
.crumb li+li::before{content:'／';margin:0 10px;color:#323232}
.crumb a{display:inline-flex;align-items:center;min-height:44px}
.crumb a:hover{text-decoration:underline;text-underline-offset:4px}
.crumb [aria-current]{color:#111111}
.pgh{padding:40px 0 48px;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:64px;align-items:end;border-bottom:1px solid #CCCAC6}
.pgh h1{font-size:36px;font-weight:400;letter-spacing:.16em;line-height:1.5;color:#111111;margin:0}
.pgh .lead{margin:0;font-size:16px}
.ph-img{margin-top:48px}
.steps.wide li{grid-template-columns:200px minmax(0,1fr)}
.ph-img img{width:100%;height:420px;object-fit:cover;display:block}

/* 本文ブロック */
.blk{padding-top:96px}
.h2{font-size:26px;font-weight:400;letter-spacing:.14em;line-height:1.7;color:#111111;margin:0}
.h3{font-size:20px;font-weight:400;letter-spacing:.12em;line-height:1.7;color:#111111;margin:0}
.txt{font-size:16px;line-height:2.1;letter-spacing:.04em;margin:0}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:80px;align-items:center}
.split img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block}
.split .h2{margin-bottom:20px}
.band{background:#FFFFFF;margin-top:96px;padding:96px 0}
.band+.blk{padding-top:96px}

/* カード（白地・枠線なし） */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.card{background:#FFFFFF;padding:32px 28px 34px;display:flex;flex-direction:column;gap:10px}
.band .card{background:#F6F5F3}
.card small{font-size:12px;letter-spacing:.16em;color:#6E6E6E}
.card b{font-size:19px;font-weight:400;letter-spacing:.1em;color:#111111}
.card p{margin:0;font-size:14px;line-height:1.95}

/* 流れ（横） */
.flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid #323232}
.flow li{padding:24px 20px 28px 0;border-right:1px solid #CCCAC6;margin-right:20px}
.flow li:last-child{border-right:0;margin-right:0}
.flow em{display:block;font-style:normal;font-size:13px;letter-spacing:.14em;color:#6E6E6E;margin-bottom:10px;font-variant-numeric:tabular-nums}
.flow b{display:block;font-size:17px;font-weight:400;letter-spacing:.1em;color:#111111;margin-bottom:8px}
.flow span{font-size:13px;line-height:1.9}

/* 表（物件概要・会社概要） */
.spec{margin:0;border-top:1px solid #323232}
.spec div{display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px;padding:18px 8px;border-bottom:1px solid #CCCAC6;font-size:15px;line-height:1.9}
.spec dt{color:#6E6E6E;font-size:14px;letter-spacing:.08em}
.spec dd{margin:0;color:#111111}
.spec2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px}
.spec2 .spec div{grid-template-columns:140px minmax(0,1fr)}

/* タブ・絞り込み */
.tabs{display:flex;flex-wrap:wrap;gap:0}
.tab{position:relative;min-height:52px;padding:0 24px;background:none;border:0;font-family:inherit;font-size:15px;letter-spacing:.12em;color:#222222;cursor:pointer}
.tab:hover{color:#111111}
.tab::after{content:'';position:absolute;left:24px;right:24px;bottom:4px;height:2px;background:#111111;transform:scaleX(0);transition:transform .3s ease}
.tab.on{color:#111111}
.tab.on::after{transform:scaleX(1)}
.filter{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:20px;align-items:end;background:#FFFFFF;padding:24px 28px;margin-top:24px}
.fld{display:flex;flex-direction:column;gap:8px}
.fld label,.fld .lb{font-size:13px;letter-spacing:.1em;color:#111111}
.sel,.inp,.ta{width:100%;min-height:48px;padding:0 14px;border:1px solid #CCCAC6;background:#FFFFFF;font-family:inherit;font-size:15px;color:#111111;border-radius:0}
.sel{appearance:none;background-image:linear-gradient(45deg,transparent 50%,#111111 50%),linear-gradient(135deg,#111111 50%,transparent 50%);background-position:calc(100% - 20px) 21px,calc(100% - 15px) 21px;background-size:5px 5px;background-repeat:no-repeat;padding-right:40px}
.sel:focus,.inp:focus,.ta:focus{outline:2px solid #3366CC;outline-offset:0;border-color:#3366CC}
.ta{min-height:180px;padding:12px 14px;line-height:1.8;resize:vertical}
.filter .btn{min-height:48px}
.sortbar{display:flex;justify-content:space-between;align-items:center;margin:40px 0 16px}
.sortbar .fld{flex-direction:row;align-items:center;gap:12px}
.sortbar .sel{width:200px}

/* ページ送り */
.pager{display:flex;justify-content:center;gap:8px;margin-top:64px}
.pager a,.pager span{display:inline-flex;align-items:center;justify-content:center;min-width:48px;height:48px;border:1px solid #CCCAC6;font-size:14px}
.pager [aria-current]{background:#111111;border-color:#6E6E6E;color:#FFFFFF}
.pager a:hover{border-color:#6E6E6E}

/* 詳細ページ */
.dt{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:56px;align-items:start;padding-top:40px}
.gal-main{aspect-ratio:3/2;background:#ECEBE8;overflow:hidden}
.gal-main img{width:100%;height:100%;object-fit:cover;display:block}
.gal-th{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-top:8px}
.gal-th button{padding:0;border:0;background:#ECEBE8;aspect-ratio:4/3;cursor:pointer;opacity:.55;transition:opacity .25s;overflow:hidden}
.gal-th button:hover{opacity:.85}
.gal-th button.on{opacity:1;outline:2px solid #111111;outline-offset:2px}
.gal-th img{width:100%;height:100%;object-fit:cover;display:block}
.gal-cap{margin:12px 0 0;font-size:13px}
.side{position:sticky;top:24px;background:#FFFFFF;padding:32px 32px 28px}
.side .tags{display:flex;gap:0;margin-bottom:16px}
.tg{font-size:12px;letter-spacing:.1em;padding:4px 10px;background:#F6F5F3;color:#111111;white-space:nowrap}
.tg.rf{background:#323232;color:#FFFFFF}
.side small{display:block;font-size:13px;letter-spacing:.12em;color:#6E6E6E}
.side h1{font-size:24px;font-weight:400;letter-spacing:.1em;line-height:1.6;color:#111111;margin:6px 0 18px}
.side .price{font-size:40px;color:#111111;letter-spacing:.02em;line-height:1.2}
.side .price em{font-style:normal;font-size:16px;margin-left:4px}
.side .price-s{font-size:13px;margin:6px 0 20px}
.side .kv{margin:0 0 24px;border-top:1px solid #CCCAC6}
.side .kv div{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid #ECEBE8;font-size:14px}
.side .kv dt{color:#6E6E6E}
.side .kv dd{margin:0;color:#111111}
.side .btn{width:100%}
.side .btn+.btn{margin-top:10px}
.side .tel{display:block;margin-top:20px;padding-top:18px;border-top:1px solid #ECEBE8;text-align:center}
.side .tel b{display:block;font-size:24px;font-weight:400;letter-spacing:.06em;color:#111111}
.side .tel span{font-size:12px}
.pt{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.pt li{border-top:1px solid #323232;padding-top:18px}
.pt b{display:block;font-size:17px;font-weight:400;letter-spacing:.1em;color:#111111;margin-bottom:8px}
.pt span{font-size:14px;line-height:1.9}
.map{height:360px;background:#ECEBE8;display:flex;align-items:center;justify-content:center;font-size:14px;letter-spacing:.12em;color:#222222}
.note{font-size:12px;line-height:1.8;margin:16px 0 0}

/* よくある質問 */
.faq{list-style:none;margin:0;padding:0;border-top:1px solid #323232}
.faq li{border-bottom:1px solid #CCCAC6}
.faq button{width:100%;display:grid;grid-template-columns:40px minmax(0,1fr) 24px;gap:12px;align-items:center;min-height:72px;padding:12px 8px;background:none;border:0;text-align:left;font-family:inherit;font-size:16px;letter-spacing:.06em;color:#111111;cursor:pointer}
.faq button:hover{background:#FFFFFF}
.faq .q{font-size:18px;color:#6E6E6E}
.faq .ic{position:relative;width:16px;height:16px}
.faq .ic::before,.faq .ic::after{content:'';position:absolute;left:0;right:0;top:7px;height:1px;background:#222222;transition:transform .3s}
.faq .ic::after{transform:rotate(90deg)}
.faq .open .ic::after{transform:rotate(0)}
.faq .a{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;padding:0 8px 28px}
.faq .a span:first-child{font-size:18px;color:#323232}
.faq .a p{margin:0;font-size:15px;line-height:2}

/* フォーム */
.fm{border-top:1px solid #323232}
.fm-row{display:grid;grid-template-columns:260px minmax(0,1fr);gap:32px;padding:28px 0;border-bottom:1px solid #CCCAC6}
.fm-row>.lb,.fm-row>label{display:flex;align-items:flex-start;gap:12px;padding-top:12px;font-size:15px;letter-spacing:.08em;color:#111111}
.req,.opt{display:inline-block;font-size:11px;letter-spacing:.1em;padding:2px 8px;white-space:nowrap}
.req{background:#111111;color:#FFFFFF}
.opt{border:1px solid #CCCAC6;color:#222222}
.hint{font-size:13px;line-height:1.8;margin:8px 0 0}
.err{font-size:13px;margin:8px 0 0;color:#9A3B2E}
.inp.ng{border-color:#9A3B2E}
.choices{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;border:0}
.choices legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ch{position:relative}
.ch input{position:absolute;opacity:0;width:1px;height:1px}
.ch span{display:inline-flex;align-items:center;min-height:48px;padding:0 20px;border:1px solid #CCCAC6;background:#FFFFFF;font-size:15px;letter-spacing:.06em;cursor:pointer}
.ch input:checked+span{border-color:#6E6E6E;background:#111111;color:#FFFFFF}
.ch input:focus-visible+span{outline:2px solid #3366CC;outline-offset:2px}
.two-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.agree{display:flex;align-items:center;gap:12px;justify-content:center;margin:40px 0 24px;font-size:15px}
.agree input{width:20px;height:20px;accent-color:#6E6E6E}
.agree a{text-decoration:underline;text-underline-offset:4px}
.fm-act{display:flex;justify-content:center}
.fm-act .btn{min-width:320px;min-height:60px;border:0;font-family:inherit;cursor:pointer}

/* お知らせ詳細・本文 */
.article{max-width:760px}
.article .meta{display:flex;align-items:center;gap:16px;font-size:13px;margin-bottom:16px}
.article h1{font-size:28px;font-weight:400;letter-spacing:.1em;line-height:1.7;color:#111111;margin:0 0 32px;padding-bottom:28px;border-bottom:1px solid #CCCAC6}
.article p{font-size:16px;line-height:2.1;margin:0 0 24px}
.article h2{font-size:20px;font-weight:400;letter-spacing:.1em;color:#111111;margin:48px 0 16px;padding-left:0}
.article img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block;margin:8px 0 32px}
.pn{display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:center;margin-top:64px;padding-top:24px;border-top:1px solid #CCCAC6;font-size:14px}
.pn a{display:inline-flex;align-items:center;min-height:44px}
.pn .c{justify-self:center}
.pn .r{justify-self:end}

/* 施工事例 */
.wk{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 28px}
.wk a{display:flex;flex-direction:column;gap:6px}
.wk .ci{display:block;aspect-ratio:3/2;overflow:hidden;background:#ECEBE8;margin-bottom:10px}
.wk img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.wk a:hover img{transform:scale(1.04)}
.wk small{font-size:12px;letter-spacing:.12em;color:#6E6E6E}
.wk b{font-size:16px;font-weight:400;letter-spacing:.06em;color:#111111}
.wd-hero img{width:100%;height:560px;object-fit:cover;display:block}
.wd-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.wd-g img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block}
.wd-g .w{grid-column:1/-1}
.wd-g .w img{aspect-ratio:21/9}

/* 線は1本だけ：見出しの下線はなくし、表やリストの上線に任せる */
.sh{border-bottom:0;padding-bottom:0;margin-bottom:32px}
.pgh{border-bottom:0}
.ct{border-bottom:0}
.sf{border-top:0}
.side .tel{border-top:0;padding-top:8px}
/* Instagram */
.hd-ig{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;color:#111111}
.hd-ig:hover{color:#6E6E6E}
.sf-bottom ul a.sf-ig{gap:8px}
.sf-ig svg{flex:none}
/* ボタン：黒の面＋細い線の矢印 */
.btn,.rsv,.btn-l{font-weight:400;transition:background-color .35s ease,color .35s ease,border-color .35s ease}
.btn{min-height:56px;padding:0 24px 0 28px;background:#111111;color:#FFFFFF;font-size:14px;letter-spacing:.16em}
.btn::after,.btn-l::after{content:'';display:block;flex:none;width:22px;height:1px;margin-left:14px;background:currentColor;transform:scaleX(.64);transform-origin:left;transition:transform .35s ease}
a.btn:hover,button.btn:hover{background:#3C3C3C;color:#FFFFFF}
.btn:hover::after,.btn-l:hover::after{transform:scaleX(1)}
.btn-o{background:transparent;color:#111111;border:1px solid #111111}
a.btn-o:hover{background:#FFFFFF;color:#111111;border-color:#111111}
.rsv{min-height:48px;padding:0 26px;background:#111111;color:#FFFFFF !important;font-size:13px;letter-spacing:.2em}
.rsv:hover{background:#3C3C3C}
.acts{align-items:center;gap:16px 36px}
.btn-l{min-height:56px;padding:0 24px 0 28px;background:#FFFFFF;color:#111111;font-size:14px;letter-spacing:.16em}
a.btn-l:hover{background:#ECEBE8;color:#111111}
.ch input:checked+span{border-color:#111111;background:#111111;color:#FFFFFF}
.pager [aria-current]{background:#111111;border-color:#111111}
@media (prefers-reduced-motion:reduce){.btn,.rsv,.btn-l,.btn::after,.btn-l::after{transition:none}}
/* 入力の段階 */
.stepper{list-style:none;margin:0 0 40px;padding:0;display:flex;gap:0;counter-reset:st}
.stepper li{flex:1;display:flex;align-items:center;gap:12px;padding:14px 0;border-top:2px solid #CCCAC6;font-size:14px;letter-spacing:.1em;color:#6E6E6E}
.stepper li[aria-current]{border-top-color:#6E6E6E;color:#111111}
.stepper b{font-weight:400;font-size:13px;font-variant-numeric:tabular-nums}
.stepper+.fm{border-top:0}
/* 下層共通の締め（問い合わせ帯の上余白） */
.contact{margin-top:112px}
main:has(> .band:last-child)+.contact{margin-top:0;border-top:1px solid #ECEBE8}
.sell .sell-cta{margin-top:8px}
@media (prefers-reduced-motion:reduce){.hd2 a::after,.tab::after,.more::after,.hm .ph img,.cs img,.wk img,.gal-th button,.faq .ic::before,.faq .ic::after{transition:none}}
@media (max-width:1100px){.hd2wrap{display:none}.menu{display:inline-flex}.hd1 .kind,.hd-tel span{display:none}.pgh,.split,.dt,.news,.spec2{grid-template-columns:minmax(0,1fr);gap:32px}.cards,.wk,.pt,.homes{grid-template-columns:repeat(2,minmax(0,1fr))}.flow{grid-template-columns:repeat(2,minmax(0,1fr))}.filter{grid-template-columns:repeat(2,minmax(0,1fr))}.ct{grid-template-columns:minmax(0,1fr)}.ct>div{border-left:0;padding-left:0;border-top:1px solid #CCCAC6}.sf-top{grid-template-columns:minmax(0,1fr)}.side{position:static}.lh{display:none}.lr .k{display:block}.lr{grid-template-columns:repeat(2,minmax(0,1fr))}.lr .nm{grid-column:1/-1}.lr .pr{text-align:left}}
@media (max-width:640px){.in{padding:0 16px}.hd-tel{display:none}.pgh h1{font-size:28px}.ph-img img{height:240px}.cards,.wk,.pt,.homes,.flow,.filter,.sf-nav{grid-template-columns:minmax(0,1fr)}.fm-row,.spec div{grid-template-columns:minmax(0,1fr);gap:8px}.two-in{grid-template-columns:minmax(0,1fr)}.fm-act .btn{min-width:0;width:100%}.nl-row{grid-template-columns:auto 1fr;row-gap:6px}.nl-ttl{grid-column:1/-1}}


/* ===== スマートフォン（〜640px） ===== */
.hd-sptel,.spbar{display:none}
@media (max-width:640px){
body{font-size:15px}
.hd1{min-height:60px;gap:4px}
.hd1 .logo img{height:34px}
.hd1 .kind,.hd-tel,.rsv,.hd-ig{display:none}
.hd-sptel{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;margin-left:auto;color:#111111}
.menu{display:inline-flex;width:44px;height:44px;border:0;color:#111111}
.hero{height:400px}
.hn-w{bottom:80px}
.hn-t{display:none}
.purpose{margin-top:-56px}
.pp-head{padding:16px 20px 4px}
.pp-head h2{font-size:16px}
.pp-head span,.pp span{display:none}
.pp a{padding:16px 20px;min-height:0;gap:2px;border-left:0;border-top:1px solid #ECEBE8}
.pp a:first-child{border-top:0}
.pp b{font-size:18px}
.pp i{margin-top:6px}
.sec{padding-top:56px}
.blk{padding-top:64px}
.st{font-size:22px;letter-spacing:.12em}
.lead{font-size:14px}
.sh{flex-direction:column;align-items:flex-start;gap:8px;margin-bottom:24px}
.crumb{padding-top:8px}
.pgh{padding:16px 0 28px;gap:12px}
.pgh h1{font-size:25px;letter-spacing:.1em}
.ph-img{margin-top:24px}
.ph-img img{height:220px}
.homes{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 12px}
#land .homes .hm:nth-child(n+5),#land .lr>span:nth-child(4),.news .nl li:nth-child(n+4){display:none}
.sub{flex-wrap:wrap;gap:4px 16px}
.land{margin-bottom:48px}
.hm .nm{font-size:13px;line-height:1.6}
.hm .pr{font-size:18px}
.hm .sp{font-size:12px}
.hm .tag{font-size:11px;padding:3px 6px}
.lr{padding:14px 0;gap:6px 16px;min-height:0}
.lr .nm{font-size:16px}
.lr .pr{font-size:21px}
.reform{margin-top:56px;padding:48px 0}
.rf-img img{aspect-ratio:16/9}
.rf{gap:24px}
.rf p.t{margin-bottom:20px}
.svc{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:24px}
.svc li{padding:12px 8px 12px 0}
.svc li:nth-child(even){padding-left:12px;border-left:1px solid #CCCAC6}
.svc b{font-size:15px}
.svc span{font-size:12px;line-height:1.6}
.rf h3,.about h3,.sell h2,.h2{font-size:22px;letter-spacing:.1em}
.sell{padding:48px 0}
.sell-g{gap:24px}
.steps li{padding:14px 0}
.band{margin-top:64px;padding:64px 0}
.about{gap:24px}
.about img{aspect-ratio:16/9}
.about p{margin-bottom:16px}
.proof{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:28px}
.proof div{padding:16px 12px 18px 0;border-left:0;border-top:0}
.proof b{font-size:18px}
.cases{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.cases .cs:nth-child(n+5){display:none}
.wk{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px}
.wk b{font-size:14px}
.cards{gap:12px}
.card{padding:24px 20px}
.flow{grid-template-columns:minmax(0,1fr)}
.flow li{display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:8px;border-right:0;margin-right:0;padding:16px 0;border-bottom:1px solid #CCCAC6}
.flow li:last-child{border-bottom:0}
.flow em{grid-row:span 2;margin:2px 0 0}
.flow b{margin-bottom:4px}
.news{gap:24px}
.contact{margin-top:48px;padding:40px 0}
.ct>div{padding:24px 0}
.ct .big{font-size:28px}
.sf-in{padding:40px 16px 96px}
.sf-logo{margin-bottom:12px}
.sf-lic{margin-top:24px}
.sf-nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 20px}
.sf-nav>div:last-child{grid-column:1/-1}
.sf-lic{flex-direction:column;gap:4px}
.sf-bottom{flex-wrap:wrap}
.sf-bottom ul{flex-wrap:wrap;gap:0 20px}
.tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 4px}
.tab{padding:0 14px;white-space:nowrap;flex:none}
.tab::after{left:14px;right:14px}
.filter{padding:20px;gap:14px;margin-top:16px}
.sortbar{flex-direction:column;align-items:stretch;gap:12px;margin:28px 0 12px}
.sortbar .fld{justify-content:space-between}
.sortbar .sel{width:60%}
.dt{padding-top:16px;gap:24px}
.gal-th{grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}
.side{padding:24px 20px}
.side .price{font-size:34px}
.spec2{gap:0}
.pt{gap:20px}
.map{height:220px}
.wd-hero img{height:280px}
.wd-g{grid-template-columns:minmax(0,1fr)}
.article h1{font-size:22px}
.pn{grid-template-columns:1fr 1fr;row-gap:4px}
.pn .c{grid-column:1/-1;grid-row:2;justify-self:center}
.fm-row{padding:20px 0}
.stepper li{font-size:12px;letter-spacing:.04em;gap:6px}
.choices{gap:8px}
.ch span{padding:0 14px;font-size:14px}
.spbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:30;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:#FFFFFF;border-top:1px solid #CCCAC6}
.spbar a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;font-size:14px;letter-spacing:.1em}
.sb-tel{border:1px solid #111111;color:#111111}
.sb-rsv{background:#111111;color:#FFFFFF !important}
}
/* メニュー画面 */
.spm{padding-top:8px;padding-bottom:40px}
.spm ul{list-style:none;margin:0;padding:0;border-top:1px solid #323232}
.spm li a{display:flex;align-items:center;justify-content:space-between;min-height:60px;border-bottom:1px solid #CCCAC6;font-size:17px;letter-spacing:.1em;color:#111111}
.spm li a::after{content:'';width:20px;height:1px;background:#111111}
.spm .sub2{margin-top:24px}
.spm .sub2 a{min-height:52px;font-size:15px}
.spm-ct{display:flex;flex-direction:column;gap:12px;margin-top:32px}
.spm-ct .btn{width:100%}
.spm-tel{display:block;text-align:center;padding:12px 0}
.spm-tel b{display:block;font-size:28px;font-weight:400;letter-spacing:.06em;color:#111111}
.spm-tel span{font-size:12px}
.spm-ig{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;font-size:14px;letter-spacing:.1em}
@media (max-width:640px){
.btn{padding:0 18px 0 22px;letter-spacing:.1em}
.st,.h2,.pgh h1,.rf h3,.about h3,.sell h2{text-wrap:balance}
}

/* スマホのメニュー（全画面） */
.spm-ov{position:fixed;inset:0;z-index:100;background:#F6F5F3;overflow-y:auto;-webkit-overflow-scrolling:touch}
.spm-ov[hidden]{display:none}
.spm-ov .hd1{border-bottom:0}
.spm-ov .menu{display:inline-flex;margin-left:auto}
.spm-ov .hd1 .hd-sptel{margin-left:auto}
.spm-ov .hd1 .hd-sptel+.menu{margin-left:0}
body.menu-open{overflow:hidden}
.spm{padding-top:8px;padding-bottom:40px}
.spm ul{list-style:none;margin:0;padding:0;border-top:1px solid #323232}
.spm li a{display:flex;align-items:center;justify-content:space-between;min-height:60px;border-bottom:1px solid #CCCAC6;font-size:17px;letter-spacing:.1em;color:#111111}
.spm li a::after{content:'';width:20px;height:1px;background:#111111}
.spm .sub2{margin-top:24px}
.spm .sub2 a{min-height:52px;font-size:15px}
.spm-ct{display:flex;flex-direction:column;gap:12px;margin-top:32px}
.spm-ct .btn{width:100%}
.spm-tel{display:block;text-align:center;padding:12px 0}
.spm-tel b{display:block;font-size:28px;font-weight:400;letter-spacing:.06em;color:#111111}
.spm-tel span{font-size:12px}
.spm-ig{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;font-size:14px;letter-spacing:.1em}
button.menu{font:inherit;cursor:pointer;padding:0}
/* データを読み込む前・読み込めないとき */
.ld{min-height:120px}
.ld-msg{padding:40px 0;font-size:15px;color:#6E6E6E;line-height:1.9}
[data-empty-hide][hidden]{display:none !important}
/* 写真の切り取り（管理画面で決めた位置・拡大） */
.crop{position:relative;overflow:hidden}
.crop>img.cr{position:absolute;max-width:none;object-fit:fill}
/* ---- 本番用の追加（データ表示・フォーム） ---- */
.wd-hero .wd-f{height:560px;background:#ECEBE8}
.wd-g .wd-f{aspect-ratio:3/2;background:#ECEBE8}
.wd-g .wd-f.w{aspect-ratio:21/9;grid-column:1/-1}
.art-f{aspect-ratio:16/9;margin:8px 0 32px;background:#ECEBE8}
.article .art-f img{margin:0;aspect-ratio:auto}
.map-f{padding:0}
.map-f iframe{width:100%;height:100%;border:0;display:block}
.pd-txt p{margin:0 0 1.2em}
.pd-txt p:last-child{margin-bottom:0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fm-err{margin:24px 0 0;padding:14px 16px;border:1px solid #9A3B2E;background:#FFFFFF;color:#9A3B2E;font-size:14px;line-height:1.8;text-align:center}
.cf-spec{margin-top:8px}
.cf-act{flex-direction:column;align-items:center;gap:16px;margin-top:40px}
.cf-back{background:none;border:0;font-family:inherit;cursor:pointer;padding:0}
.cf-done{background:#FFFFFF;padding:48px 40px;text-align:center}
.cf-done .txt{margin-top:16px}
.cf-done .acts{justify-content:center}
.btn[disabled]{opacity:.6;cursor:default}
ul.ld,div.ld{min-height:160px}
li.ld-msg{list-style:none}
@media (max-width:640px){.wd-hero .wd-f{height:280px}.wd-g .wd-f.w{aspect-ratio:3/2}.cf-done{padding:32px 20px}}
@media (max-width:1100px){.spec2 .spec+.spec{border-top:0}}

/* 確認用の見本表示の帯 */
.demo-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;padding:10px 16px;background:#3366CC;color:#FFFFFF;font-family:system-ui,-apple-system,sans-serif;font-size:13px;line-height:1.5}
.demo-bar span{flex:1;min-width:240px}
.demo-bar a{color:#FFFFFF;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}

/* 枠のボタン：右に矢印の線（ご用件のボタンとそろえる） */
.btn-o::after{width:30px;height:8px;margin-left:16px;background:currentColor;transform:none;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='8' viewBox='0 0 36 8'%3E%3Cpath d='M0 7.5h34L27 1' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat center/contain;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='8' viewBox='0 0 36 8'%3E%3Cpath d='M0 7.5h34L27 1' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat center/contain;transition:transform .3s ease}
.btn-o:hover::after{transform:translateX(5px)}
@media (prefers-reduced-motion:reduce){.btn-o::after{transition:none}}
.demo-looks{display:flex;flex-wrap:wrap;gap:6px;flex:1 1 100%;order:3}
.demo-looks a{padding:4px 10px;border:1px solid rgba(255,255,255,.6);text-decoration:none !important}
.demo-looks a[aria-current]{background:#FFFFFF;color:#3366CC !important}

/* =============================================================
   2026-10-11 決定：白い背景 × 本文ゴシック体（見出しだけ明朝体）
   ヘーベルハウスと同じ使い分け。白かった面は淡い灰色の面に入れ替えて区切りを残す
   ============================================================= */
body{background:#FFFFFF}
.hd,.spm-ov{background:#FFFFFF}
.hd2wrap{border-top-color:#F0EFEC}
.band,.card,.filter,.side,.contact,.reform,.cf-done,.spbar{background:#F5F4F1}
.band .card{background:#FFFFFF}
.pm-b{background:#FFFFFF}
.lr:hover,.nl-row:hover,.faq button:hover{background:#F5F4F1}
a.btn-o:hover,a.btn-l:hover{background:#F5F4F1}
.sel,.inp,.ta,.ch span{background:#FFFFFF}
.sf{background:#FFFFFF;border-top:1px solid #CCCAC6}
body,button,input,select,textarea{font-family:游ゴシック体,YuGothic,"游ゴシック Medium","Yu Gothic Medium",游ゴシック,"Yu Gothic",sans-serif;font-weight:400}
/* 見出しは Zen Old Mincho（ヘーベルハウスのサイトと同じ）。本文は游ゴシック */
h1,h2,.st,.h2,.pgh h1,.side h1,.article h1,.pm-head h2,.ct h3,.sell h2{font-family:'Zen Old Mincho','Hiragino Mincho ProN','Yu Mincho','Noto Serif CJK JP',serif;font-weight:400}
.side .price,.lr .pr,.hm .pr,.hd-tel b,.ct .big,.spm-tel b,.side .tel b,.sell-tel b{font-family:'Zen Old Mincho','Hiragino Mincho ProN','Yu Mincho','Noto Serif CJK JP',serif;font-weight:400}
/* ゴシックは字間を詰めた方が読みやすい */
p,.txt,.lead,dd,dt,li,.lr,.hm,.nl-row,.spec,.kv,.hint,.note,.gal-cap,.sf-addr,.sf-lic{letter-spacing:.03em}
.txt,.lead,.article p,.pd-txt p{line-height:1.9}
.hd2 a,.tab,.more,.btn,.rsv,.btn-l,.pm-b b,.pp b{letter-spacing:.08em}
small,.eb,.hm small,.lr .nm small,.pm-b small{letter-spacing:.08em}

/* 見出しは明朝体の太さ500（本文のゴシックに負けないように） */
h1,h2,.st,.h2,.pgh h1,.side h1,.article h1,.pm-head h2,.sell h2,.ct h3,.side .price,.lr .pr,.hm .pr{font-weight:400}

/* ヘッダー：上にスクロールすると出てくる（下にスクロールすると隠れる） */
.hd{position:sticky;top:0;z-index:50;transition:transform .35s ease}
.hd.hd-hide{transform:translateY(-100%)}
.hd.hd-float{border-bottom-color:#CCCAC6}
@media (prefers-reduced-motion:reduce){.hd{transition:none}}

/* 一覧の行：押したときに背景は変えず、名前に下線が出るだけにする（行のどこを押しても開く） */
.lr:hover,.nl-row:hover,.faq button:hover{background:transparent}
.lr .nm a::after{content:'';position:absolute;inset:0}
.lr .nm a{text-decoration:underline;text-decoration-color:transparent;text-underline-offset:5px;text-decoration-thickness:1px;transition:text-decoration-color .25s}
.lr:hover .nm a,.lr .nm a:focus-visible{text-decoration-color:currentColor}
.lr .nm a:focus-visible{outline:0}
.lr .nm a:focus-visible::after{outline:2px solid #3366CC;outline-offset:-2px}
.nl-row .nl-ttl{text-decoration:underline;text-decoration-color:transparent;text-underline-offset:5px;text-decoration-thickness:1px;transition:text-decoration-color .25s}
.nl-row:hover .nl-ttl,.nl-row:focus-visible .nl-ttl{text-decoration-color:currentColor;color:#111111}
.faq button:hover>span:nth-child(2){text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
@media (prefers-reduced-motion:reduce){.lr .nm a,.nl-row .nl-ttl{transition:none}}

/* ヘッダーのロゴを大きく */
.hd1 .logo img{height:58px}
@media (max-width:640px){.hd1 .logo img{height:42px}}

/* =============================================================
   2026-10-11 デザイン確認の反映（全ページ・3サイズ）
   ============================================================= */
/* 隠したものは必ず隠す（display の指定が hidden を上書きしてFAQの回答が出たままになっていた） */
[hidden]{display:none !important}

/* 小さすぎる文字は12px以上に */
.lr .k,.lh,.req,.opt,.hd-tel span,.hm .tag{font-size:12px}

/* 日本語の改行：1文字だけ次の行に落ちないように（文節で折り返す） */
.hm .nm,.lr .nm a,.nl-ttl,.wk b,.side h1,.article h1,.card b,.pt b,.pm-b b,.ct p{word-break:auto-phrase;text-wrap:pretty}

/* ボタンの矢印を1種類にそろえる（黒・白・枠のボタンすべて、ご用件のボタンと同じ矢印） */
.btn::after,.btn-l::after{width:30px;height:8px;margin-left:16px;background:currentColor;transform:none;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='8' viewBox='0 0 36 8'%3E%3Cpath d='M0 7.5h34L27 1' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat center/contain;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='8' viewBox='0 0 36 8'%3E%3Cpath d='M0 7.5h34L27 1' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat center/contain;transition:transform .3s ease}
.btn:hover::after,.btn-l:hover::after{transform:translateX(5px)}
@media (prefers-reduced-motion:reduce){.btn::after,.btn-l::after{transition:none}}

/* 押せる場所の高さを44px以上に（ヘッダーの電話番号・ロゴ） */
.hd-tel{min-height:44px;justify-content:center}
.hd1 .logo{display:inline-flex;align-items:center;min-height:44px}

/* ===== タブレット（641〜1100px）：スマホの形を引き伸ばさず、幅に合わせて並べる ===== */
@media (min-width:641px) and (max-width:1100px){
.lh{display:grid}
.lr .k{display:none}
.lh,.lr{grid-template-columns:minmax(0,2fr) minmax(0,1.5fr) minmax(0,1fr) 120px;gap:16px}
.lh>span:nth-child(4),.lr>span:nth-child(4){display:none}
.lr .nm{grid-column:auto}
.lr .pr{text-align:right}
.homes,.wk{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 20px}
.cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.card{padding:24px 20px 26px}
.rf-img img,.about img{aspect-ratio:16/9}
.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
.proof{grid-template-columns:repeat(2,minmax(0,1fr))}
.proof div{border-top:0;border-left:0;padding:20px 16px 22px 0}
.proof div:nth-child(n+3){border-top:1px solid #CCCAC6}
.proof div:nth-child(even){border-left:1px solid #CCCAC6;padding-left:20px}
.ct{grid-template-columns:repeat(3,minmax(0,1fr))}
.ct>div{border-top:0;border-left:1px solid #ECEBE8;padding:28px 16px 32px}
.ct .btn{width:100%;padding:0 16px 0 18px;justify-content:space-between;font-size:13px;letter-spacing:.04em;white-space:nowrap}
.spec2{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:32px}
.spec2 .spec+.spec{border-top:1px solid #323232}
.spec2 .spec div{grid-template-columns:112px minmax(0,1fr);gap:16px;padding:14px 8px}
.ct>div:first-child{border-left:0;padding-left:0}
.ct .big{font-size:24px;padding:1px 0}
.flow{grid-template-columns:minmax(0,1fr)}
.flow li{display:grid;grid-template-columns:48px 168px minmax(0,1fr);align-items:baseline;column-gap:12px;border-right:0;margin-right:0;padding:18px 0;border-bottom:1px solid #CCCAC6}
.flow li:last-child{border-bottom:0}
.flow em,.flow b{margin:0}
.wd-hero .wd-f{height:420px}
}

/* ===== スマートフォン ===== */
/* 物件一覧の絞り込み：スマホでは開閉式 */
.f-tg{display:none;width:100%;align-items:center;justify-content:space-between;min-height:52px;margin-top:16px;padding:0 18px;border:1px solid #111111;background:#FFFFFF;font-family:inherit;font-size:15px;letter-spacing:.08em;color:#111111;cursor:pointer}
.f-tg small{font-size:12px;color:#6E6E6E;margin-left:8px;letter-spacing:.06em}
.f-tg i{position:relative;flex:none;width:14px;height:14px}
.f-tg i::before,.f-tg i::after{content:'';position:absolute;left:0;right:0;top:6px;height:1px;background:currentColor;transition:transform .3s}
.f-tg i::after{transform:rotate(90deg)}
.f-tg[aria-expanded="true"] i::after{transform:rotate(0)}
@media (max-width:640px){
.f-tg{display:flex}
.filter:not(.open){display:none}
.filter.open{margin-top:8px}
.hm .tag{padding:3px 7px}
.pm-b small{font-size:12px}
/* 物件概要の表：1行を低くして、ラベルと値を横に並べる */
.spec div,.spec2 .spec div{grid-template-columns:96px minmax(0,1fr);gap:12px;padding:12px 4px;font-size:14px;line-height:1.7}
.spec dt{font-size:13px;letter-spacing:.04em}
/* 写真の小さい一覧：横にスクロールして、1枚を押しやすい大きさに */
.gal-th{display:flex;overflow-x:auto;gap:6px;padding:4px 3px 6px;scrollbar-width:none}
.gal-th::-webkit-scrollbar{display:none}
.gal-th button{flex:0 0 76px}
/* フッター：見出しの前をあける */
.sf-nav>div:last-child{margin-top:20px}
}
@media (prefers-reduced-motion:reduce){.f-tg i::before,.f-tg i::after{transition:none}}

/* 写真の拡大表示 */
.zoom{cursor:zoom-in}
.zoom:focus-visible{outline:2px solid #3366CC;outline-offset:2px}
.zoom::after{content:'';position:absolute;right:12px;bottom:12px;z-index:1;width:36px;height:36px;background:rgba(255,255,255,.92) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none' stroke='%23111' stroke-width='1.2'%3E%3Ccircle cx='7.5' cy='7.5' r='5.5'/%3E%3Cpath d='M11.5 11.5L17 17M7.5 5v5M5 7.5h5'/%3E%3C/svg%3E") no-repeat center/18px;pointer-events:none}
.lbx{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;background:rgba(17,17,17,.97)}
.lbx-img{display:block;max-width:calc(100% - 160px);max-height:calc(100% - 120px);object-fit:contain}
.lbx button{position:absolute;display:flex;align-items:center;justify-content:center;width:56px;height:56px;padding:0;border:0;background:transparent;color:#FFFFFF;cursor:pointer}
.lbx button:focus-visible{outline:2px solid #FFFFFF;outline-offset:-4px}
.lbx-x{top:12px;right:12px}
.lbx-p{left:16px;top:50%;margin-top:-28px}
.lbx-nx{right:16px;top:50%;margin-top:-28px}
.lbx-n{position:absolute;left:0;right:0;bottom:24px;margin:0;text-align:center;color:#FFFFFF;font-size:13px;letter-spacing:.12em}
@media (max-width:640px){.lbx-img{max-width:100%;max-height:calc(100% - 160px)}.lbx-p,.lbx-nx{top:auto;bottom:12px;margin:0}.lbx-p{left:12px}.lbx-nx{right:12px}.lbx-n{bottom:30px}}

/* ヘッダーの電話番号：番号と受付時間を同じ幅にそろえ、中央で重ねる */
.hd-tel{display:inline-grid;justify-items:center;align-content:center;row-gap:3px;line-height:1}
.hd-tel b{font-size:26px;letter-spacing:.06em;line-height:1.1}
.hd-tel span{font-size:12px;letter-spacing:.02em;line-height:1.3;white-space:nowrap}
@media (max-width:1100px){.hd-tel b{font-size:22px;letter-spacing:.04em}}

/* =============================================================
   動き（2026-10-11）：控えめな「ふわっと出る」だけに統一
   - 画面に入ったブロックが 16px 下から薄く現れる（0.7秒・最後はゆっくり止まる）
   - 並んだカード・行は 70ms ずつずらす
   - 写真は枠の中で少し引いて止まる
   - ページ上部の見出しと「ご用件から選ぶ」は読み込み時に現れる
   - 動きを減らす設定の人には何も動かさない（.mo が付かない）
   ============================================================= */
:root{--mo-e:cubic-bezier(.22,1,.36,1)}
@keyframes moUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes moFade{from{opacity:0}to{opacity:1}}
@keyframes moZoom{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
.mo [data-mo]{opacity:0;transform:translateY(16px);transition:opacity .7s var(--mo-e),transform .7s var(--mo-e);transition-delay:var(--d,0ms)}
.mo [data-mo].mo-in{opacity:1;transform:none}
/* 写真：枠の中で 1.06 → 1 に */
.mo [data-mo] :is(.crop,.ph,.ci,.ph-img,.rf-img) img,.mo [data-mo]:is(.crop,.ph-img,.rf-img,.wd-f,.cs) img{scale:1.06;transition:scale 1.4s var(--mo-e);transition-delay:var(--d,0ms)}
.mo [data-mo].mo-in :is(.crop,.ph,.ci,.ph-img,.rf-img) img,.mo [data-mo].mo-in:is(.crop,.ph-img,.rf-img,.wd-f,.cs) img{scale:1}
.ph-img,.rf-img{overflow:hidden}
/* 読み込み時 */
.mo .pgh>*{animation:moUp .8s var(--mo-e) .08s both}
.mo .pgh>*:nth-child(2){animation-delay:.2s}
.mo .pm-pnl{animation:moUp .9s var(--mo-e) .25s both}
.mo .pm-b{animation:moUp .7s var(--mo-e) both}
.mo .pm-b:nth-child(1){animation-delay:.4s}.mo .pm-b:nth-child(2){animation-delay:.47s}.mo .pm-b:nth-child(3){animation-delay:.54s}.mo .pm-b:nth-child(4){animation-delay:.61s}
/* 開いたときに薄く現れる（FAQの回答・絞り込み・メニュー・写真の拡大） */
.mo .faq .a{animation:moFade .35s ease both}
.mo .filter.open{animation:moFade .3s ease both}
.mo .spm-ov{animation:moFade .25s ease both}
.mo .spm li{animation:moUp .5s var(--mo-e) both}
.mo .spm li:nth-child(2){animation-delay:.04s}.mo .spm li:nth-child(3){animation-delay:.08s}.mo .spm li:nth-child(4){animation-delay:.12s}.mo .spm li:nth-child(5){animation-delay:.16s}.mo .spm li:nth-child(6){animation-delay:.2s}.mo .spm li:nth-child(n+7){animation-delay:.24s}
.mo .lbx{animation:moFade .25s ease both}
.mo .lbx-img{animation:moZoom .35s var(--mo-e) both}
@media (prefers-reduced-motion:reduce){.mo [data-mo]{opacity:1;transform:none;transition:none}.mo *{animation:none !important}}

/* フォーム：エラーの枠はすべての入力欄で赤く。iPhoneで入力時に拡大されないよう16px */
.ta.ng,.sel.ng,.inp.ng{border-color:#9A3B2E}
#cf>.fm-err{margin:0 0 8px}
@media (max-width:640px){.sel,.inp,.ta{font-size:16px}}
/* 詳細ページ：読み込み中も場所を確保して、下の欄が後から押し下げられないように */
#pd.ld,#wd.ld,#nd.ld{min-height:100vh}

/* パンくずは1行に（長い名前は…で省略。読み込み後に2行になって下が動くのを防ぐ） */
.crumb ol{flex-wrap:nowrap;min-height:44px}
.crumb li{flex:none}
.crumb li:last-child{flex:0 1 auto;min-width:0;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.crumb li:last-child::before{display:inline}

/* スマホではヘッダーの電話番号を隠す（電話アイコンに任せる） */
@media (max-width:640px){.hd-tel{display:none}}

/* 進め方（流れ）：上の線が左から右へ伸び、線が届いた順に各段階が現れる。PCは各段階の頭に小さな四角の印 */
.flow{position:relative}
@media (min-width:1101px){
.flow>li{position:relative}
.flow>li::before{content:'';position:absolute;left:0;top:-4px;width:7px;height:7px;background:#111111}
}
.mo .flow{border-top-color:transparent}
.mo .flow::before{content:'';position:absolute;left:0;right:0;top:-1px;height:1px;background:#323232;transform:scaleX(0);transform-origin:left;transition:transform 1.6s cubic-bezier(.45,0,.2,1)}
.mo .flow.go::before{transform:scaleX(1)}
.mo .flow>li{opacity:0;transform:translateX(-10px);transition:opacity .6s var(--mo-e),transform .6s var(--mo-e)}
.mo .flow>li::before{transform:scale(0);transition:transform .4s var(--mo-e)}
.mo .flow.go>li{opacity:1;transform:none}
.mo .flow.go>li::before{transform:none}
.mo .flow.go>li:nth-child(1),.mo .flow.go>li:nth-child(1)::before{transition-delay:.05s}
.mo .flow.go>li:nth-child(2),.mo .flow.go>li:nth-child(2)::before{transition-delay:.35s}
.mo .flow.go>li:nth-child(3),.mo .flow.go>li:nth-child(3)::before{transition-delay:.65s}
.mo .flow.go>li:nth-child(4),.mo .flow.go>li:nth-child(4)::before{transition-delay:.95s}
.mo .flow.go>li:nth-child(5),.mo .flow.go>li:nth-child(5)::before{transition-delay:1.25s}
/* タブレット・スマホは縦並びなので、線は上から順に段階が現れるだけ */
@media (max-width:1100px){.mo .flow>li{transform:translateY(10px)}.mo .flow::before{transition-duration:1s}}

/* 2026-11-04 見出しの文字間を詰め、太さを上げる（ヘーベルハウスの見出しに合わせる） */
h1,h2,.st,.h2,.h3,.pgh h1,.side h1,.article h1,.pm-head h2,.ct h3,.sell h2{letter-spacing:.04em;font-weight:600}
.side .price,.lr .pr,.hm .pr,.hd-tel b,.ct .big,.spm-tel b,.side .tel b,.sell-tel b{font-weight:500}