@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,.hd2 a.cur::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}

/* hero */
/* 最初の画面に「ご用件から選ぶ」の板（見出し＋4つのボタン）まで入る高さ：画面の高さ − ヘッダー142px − 板の見える部分140px。上限640px */
.hero{position:relative;height:640px;height:clamp(440px,calc(100vh - 282px),640px);height:clamp(440px,calc(100svh - 282px),640px);overflow:hidden;background:#ECEBE8}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:opacity 1.4s ease}
.hero>img.on{opacity:1;animation:kb 7s ease-out forwards}
@keyframes kb{from{transform:scale(1.06)}to{transform:scale(1)}}
/* 写真の右下。板（ご用件から選ぶ）の上端より上に来る高さで、右端から少し内側 */
.hn-w{position:absolute;right:72px;bottom:92px;z-index:2;color:#FFFFFF;text-shadow:0 1px 10px rgba(0,0,0,.35)}
/* 右下の丸：外側の線が1枚の表示時間（6秒）で一周する。中は今の番号 */
.hn-ring{position:relative;display:grid;place-items:center;width:56px;height:56px;padding:0;border:0;background:none;color:#FFFFFF;cursor:pointer;font:inherit}
.hn-ring:focus-visible{outline:2px solid #FFFFFF;outline-offset:4px;border-radius:50%}
.hn-ring:hover .hn-rt{stroke:rgba(255,255,255,.6)}
.hn-ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);overflow:visible}
.hn-rt{fill:none;stroke:rgba(255,255,255,.35);stroke-width:1.5}
.hn-rp{fill:none;stroke:#FFFFFF;stroke-width:1.5;stroke-linecap:butt;stroke-dasharray:163.4;stroke-dashoffset:163.4;animation:ring 6s linear forwards;filter:drop-shadow(0 1px 3px rgba(0,0,0,.4))}
.hero.held .hn-rp,.hero.paused .hn-rp{animation-play-state:paused}
@keyframes ring{from{stroke-dashoffset:163.4}to{stroke-dashoffset:0}}
.hn-t{position:relative;font-size:13px;letter-spacing:.12em;font-variant-numeric:tabular-nums;margin-left:.12em}


/* purpose entry */
.purpose{position:relative;margin-top:-72px;z-index:2}
.pp-wrap{background:#FFFFFF}
.pp-head{display:flex;align-items:center;gap:20px;padding:20px 28px 0;flex-wrap:wrap}
.pp-head h2{font-size:18px;font-weight:400;letter-spacing:.2em;margin:0;color:#111111}
.pp-head span{font-size:13px;letter-spacing:.08em}
.pp{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.pp a{position:relative;display:flex;flex-direction:column;gap:8px;padding:24px 28px 30px;border-left:1px solid #ECEBE8;min-height:184px}
.pp a:first-child{border-left:0}
.pp a:hover{background:#FAFAF9}
.pp small{font-size:12px;letter-spacing:.16em;color:#6E6E6E}
.pp b{font-size:20px;font-weight:400;letter-spacing:.12em;color:#111111}
.pp span{font-size:14px;line-height:1.9}
.pp i{font-style:normal;margin-top:auto;display:inline-flex;align-items:center;gap:12px;font-size:13px;letter-spacing:.14em;color:#111111}
.pp i::after{content:'';width:28px;height:1px;background:#111111;transition:width .25s}
.pp a:hover i::after{width:44px}

/* 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}

/* reform */
.reform{margin-top:112px;background:#FFFFFF;padding:104px 0}
.rf{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:80px;align-items:start}
.rf-img img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;display:block}
.rf-img p{margin:12px 0 0;font-size:13px;letter-spacing:.06em}
.rf h3{font-size:26px;font-weight:400;letter-spacing:.14em;line-height:1.8;color:#111111;margin:0 0 20px}
.rf p.t{margin:0 0 32px;font-size:16px;line-height:2.1;letter-spacing:.04em}
.svc{list-style:none;margin:0 0 36px;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid #CCCAC6}
.svc li{padding:18px 16px 18px 0;border-bottom:1px solid #CCCAC6}
.svc b{display:block;font-size:16px;font-weight:400;letter-spacing:.1em;color:#111111}
.svc span{font-size:13px;line-height:1.8}
.svc li:nth-child(even){padding-left:20px;border-left:1px solid #CCCAC6}
.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}

/* about / proof */
.about{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:80px;align-items:center}
.about img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block}
.about h3{font-size:26px;font-weight:400;letter-spacing:.14em;line-height:1.8;color:#111111;margin:0 0 20px}
.about p{margin:0 0 28px;font-size:16px;line-height:2.1;letter-spacing:.04em}
.proof{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:64px;border-top:1px solid #323232;border-bottom:1px solid #CCCAC6}
.proof div{padding:24px 20px 26px;border-left:1px solid #CCCAC6}
.proof div:first-child{border-left:0;padding-left:0}
.proof small{display:block;font-size:12px;letter-spacing:.14em;color:#6E6E6E}
.proof b{display:block;font-size:22px;font-weight:400;letter-spacing:.06em;color:#111111;margin:6px 0 4px}
.proof span{font-size:12px;line-height:1.7}

/* cases: 写真のみのギャラリー（均一） */
.cs-r{display:flex;flex-direction:column;align-items:flex-end;gap:12px;flex:none}
.cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.cs{display:block;overflow:hidden;aspect-ratio:3/2;background:#ECEBE8}
.cs img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease,opacity .3s}
.cs:hover img{transform:scale(1.04)}
.cs:focus-visible{outline-offset:-4px}

/* 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}

@media (prefers-reduced-motion:reduce){.hd2 a::after,.hero>img,.hm .ph img,.cs img,.more::after,.ht-more::after,.pp i::after{transition:none}.hn-rp,.hero>img.on{animation:none}.hn-rp{stroke-dashoffset:0}}
@media (max-width:1100px){.cs-r{align-items:flex-start}.hd2wrap{display:none}.menu{display:inline-flex}.hd1 .kind,.hd-tel span{display:none}.pp{grid-template-columns:repeat(2,minmax(0,1fr))}.pp a:nth-child(3){border-left:0}.pp a{border-top:1px solid #ECEBE8}.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}.homes{grid-template-columns:repeat(2,minmax(0,1fr))}.rf,.sell-g,.about,.news{grid-template-columns:minmax(0,1fr);gap:40px}.proof,.ct{grid-template-columns:minmax(0,1fr)}.proof div,.ct>div{border-left:0;padding-left:0;border-top:1px solid #CCCAC6}.sf-top{grid-template-columns:minmax(0,1fr)}.sh{flex-wrap:wrap}}
@media (max-width:640px){.in{padding:0 16px}.hd-tel{display:none}.hero{height:520px}.ht-catch{font-size:26px}.purpose{margin-top:-64px}.pp{grid-template-columns:minmax(0,1fr)}.pp a{border-left:0;min-height:0}.homes,.sf-nav{grid-template-columns:minmax(0,1fr)}.cases{grid-template-columns:repeat(2,minmax(0,1fr))}.svc{grid-template-columns:minmax(0,1fr)}.svc li:nth-child(even){padding-left:0;border-left:0}.steps li{grid-template-columns:minmax(0,1fr);gap:4px}.nl-row{grid-template-columns:auto 1fr;row-gap:6px}.nl-ttl{grid-column:1/-1}}
/* 線は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}}

/* ===== スマートフォン（〜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{right:20px;bottom:76px}
.hn-ring{width:44px;height:44px}
.hn-t{font-size:12px}
.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}}

/* 確認用の見本表示の帯 */
.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}

/* ご用件から選ぶ：写真に重なる白い板の中に、小見出し入りの枠のボタンを4つ（ヘーベルハウスのボタンを参考） */
/* ご用件から選ぶ：枠ではなく線で4列に区切る（2026-10-30 A案） */
.pm-pnl{background:#FFFFFF;padding:32px 0 0}
/* 見出しはほかの欄の見出し（.st 28px）と同じ大きさ・字間。補足は .lead と同じ15px */
.pm-head{display:flex;align-items:baseline;gap:20px;flex-wrap:wrap;padding:0 40px;margin-bottom:28px}
.pm-head h2{font-size:28px;font-weight:400;letter-spacing:.16em;margin:0;color:#111111;line-height:1.5}
.pm-head span{font-size:15px;letter-spacing:.06em;color:#222222}
.pm-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid #CCCAC6}
/* 項目名はカード（.card b 19px・ゴシック）と同じ階層。見出しより小さく */
.pm-b{display:flex;flex-direction:column;gap:8px;min-width:0;padding:24px 28px 28px;border-left:1px solid #ECEBE8;background:#FFFFFF;color:#111111;transition:background-color .3s ease}
.pm-b:first-child{border-left:0}
.pm-b small{font-size:12px;letter-spacing:.24em;color:#6E6E6E}
.pm-b b{font-size:19px;font-weight:400;letter-spacing:.1em;line-height:1.6;word-break:keep-all}
.pm-b i{display:block;flex:none;width:28px;height:7px;margin-top:10px;background:currentColor;-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}
.pm-b:hover,.pm-b:focus-visible{background:#F5F4F1}
.pm-b:hover i,.pm-b:focus-visible i{transform:translateX(6px)}
@media (max-width:1100px){.pm-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pm-b:nth-child(3){border-left:0}.pm-b:nth-child(n+3){border-top:1px solid #ECEBE8}}
@media (max-width:640px){.pm-pnl{padding:20px 0 0}.pm-head{padding:0 16px;margin-bottom:16px}.pm-head h2{font-size:22px;letter-spacing:.12em}.pm-head span{display:none}.pm-b{padding:16px 16px 18px;gap:4px}.pm-b small{font-size:12px;letter-spacing:.12em}.pm-b b{font-size:16px}.pm-b i{width:24px;margin-top:8px}}
@media (prefers-reduced-motion:reduce){.pm-b,.pm-b i{transition:none}}

/* 枠のボタン：右に矢印の線（ご用件のボタンとそろえる） */
.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}
.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,.pp b{letter-spacing:.08em}
small,.eb,.hm small,.lr .nm 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}