/* 2026-10-11 Codex: layout and warm design consolidated. */
.contact-inner .contact-alternatives{font-size:13px;color:#d8e9db;margin:20px 0 0}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.85 var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}img{max-width:100%;display:block}button,summary{font:inherit}.container{width:min(1180px,calc(100% - 48px));margin-inline:auto}.skip{position:absolute;left:-9999px;top:0;padding:10px;background:#fff;z-index:1000}.skip:focus{left:10px}.site-header{background:var(--paper);border-bottom:1px solid #e6eadf;position:relative;z-index:10}.header-inner{height:88px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:flex-end;gap:17px;line-height:1}.brand:hover{text-decoration:none}.brand-name{font-size:29px;font-weight:700;letter-spacing:-.07em;color:var(--green);line-height:1}.brand-sub{font-size:11px;letter-spacing:.03em;white-space:nowrap;padding-bottom:3px}.desktop-nav{display:flex;align-items:center;gap:28px;font-size:13px;font-weight:700}.desktop-nav a.active{color:var(--green-mid);border-bottom:2px solid var(--green-mid)}.nav-contact{display:inline-block;color:white;background:var(--green);padding:12px 17px;border-radius:2px}.mobile-menu{display:none}.kicker{font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--green-mid);margin:0 0 17px}.kicker.light{color:var(--lime)}h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.45;letter-spacing:-.035em}h1 em{font-style:normal;color:var(--lime)}.section-title{font-size:clamp(30px,3.5vw,48px);font-weight:600;margin-bottom:20px}.section{padding:100px 0}.body-lead{font-size:18px;line-height:1.95}.section-intro{max-width:760px;color:#40564a;font-size:17px;margin-bottom:45px}.button{min-height:54px;display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:12px 22px;border-radius:2px;font-weight:700;font-size:14px;white-space:nowrap;transition:transform .2s ease,background-color .2s ease}.button:hover{text-decoration:none;transform:translateY(-2px)}.button-line{background:transparent;border:1px solid rgba(255,255,255,.75);color:white}.button-outline{background:transparent;border:1px solid rgba(255,255,255,.7);color:white}.hero-actions{display:flex;flex-wrap:wrap;gap:11px}.hero-fine{font-size:12px;color:#cfdbcd;margin:12px 0 0}.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;min-height:565px;align-items:center;gap:40px;padding-block:70px 55px}.hero-copy h1,.subhero h1{font-size:clamp(43px,5.2vw,76px);font-weight:600;line-height:1.33;margin:0 0 22px}.hero-lead{max-width:610px;font-size:17px;line-height:2;color:#e5eee4;margin-bottom:29px}.hero-bottom{border-top:1px solid rgba(255,255,255,.19);display:flex;gap:35px;padding:16px 0 18px;color:#b9d1bc;font-size:12px;letter-spacing:.04em}.intro-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:65px;align-items:end;margin-bottom:45px}.intro-grid .body-lead{margin-bottom:21px}.text-link{display:inline-flex;align-items:center;gap:10px;border-bottom:1px solid var(--green);font-weight:700;font-size:14px;padding-bottom:4px;color:var(--green)}.text-link:hover{text-decoration:none;gap:15px}.benefit:last-child{border-right:0}.steps-grid article>span{font-size:11px;letter-spacing:.12em;color:var(--green-mid);font-weight:700}.steps-grid h3{font-size:22px;margin:25px 0 11px}.steps-grid p{font-size:14px;color:var(--muted);margin:0}.online-grid{display:grid;grid-template-columns:1fr .95fr;gap:90px;align-items:center}.online-panel .button{margin-top:15px}.online-diagram{display:grid;gap:7px;padding:31px;background:rgba(255,255,255,.075);border:1px solid rgba(255,255,255,.17)}.online-diagram>div{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:13px 15px;background:rgba(255,255,255,.08);border-left:3px solid var(--lime)}.online-diagram b{font-size:21px}.online-diagram span{font-size:13px;color:#d8e8dc}.online-diagram i{height:14px;width:1px;background:var(--lime);margin-left:30px}.fee-heading{display:flex;justify-content:space-between;align-items:end;gap:50px}.fee-heading>p{max-width:430px;color:var(--muted)}.fee-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:25px auto 20px}.fee-card{background:white;padding:35px;border:1px solid #dce3d6;box-shadow:0 8px 30px rgba(6,63,50,.025)}.fee-card.featured{border-top:5px solid var(--green-mid)}.fee-tag{color:var(--green-mid);font-size:12px;font-weight:700;letter-spacing:.07em}.fee-card h3{font-size:25px;margin:15px 0 27px}.fee-amount{font-size:14px;margin:0 0 10px}.fee-amount strong{font-size:40px;line-height:1.1;font-weight:700;letter-spacing:-.05em;color:var(--green)}.fee-amount strong span{font-size:17px;letter-spacing:0}.fee-online{font-size:14px;color:var(--green);background:#eaf2e7;padding:12px 14px;min-height:53px}.fee-detail{border-top:1px solid var(--line);margin:22px 0 0;padding-top:17px;font-size:14px;line-height:2;color:#3c5146}.fee-desc{font-size:13px;color:var(--muted);margin:13px 0 0}.fineprint{font-size:12px;color:#5e7062;max-width:920px;margin:0 0 15px}.person-grid,.advisor-grid{display:grid;grid-template-columns:.72fr 1fr;gap:90px;align-items:center}.person-image,.advisor-photo{max-width:390px;aspect-ratio:4/4.5;overflow:hidden;background:#dce5d8}.person-image img,.advisor-photo img{width:100%;height:100%;object-fit:cover;object-position:center 28%}.person-copy p:not(.kicker):not(.person-name),.advisor-section p:not(.kicker):not(.person-name){color:var(--muted)}.person-name{font-size:18px;font-weight:700;margin:25px 0}.person-name small{display:block;font-size:12px;font-weight:400;color:var(--muted)}.season-section{padding:75px 0;background:#e9efdc}.season-grid{display:flex;justify-content:space-between;align-items:end;gap:40px}.season-grid h2{font-size:clamp(26px,3.1vw,38px)}.season-grid p:not(.kicker){max-width:750px;margin-bottom:0}.contact-panel{background:var(--green-deep);color:white;padding:90px 0}.contact-inner{max-width:800px;text-align:center}.contact-inner h2{font-size:clamp(29px,3.4vw,44px);margin-bottom:16px}.contact-inner p:not(.kicker){color:#d8e9db}.contact-inner .hero-actions{justify-content:center;margin:29px 0 13px}.footer{background:#edf0e8;padding:48px 0;color:var(--green)}.footer-inner{display:flex;justify-content:space-between;gap:30px}.footer p{font-size:12px;margin:13px 0 0}.footer-inner>div:last-child{font-size:12px;color:var(--muted)}.mobile-bar{display:none}.breadcrumb{display:flex;gap:10px;align-items:center;padding-block:15px;font-size:12px;color:#64766a}.breadcrumb a{text-decoration:underline}.subhero{background:var(--green);color:white;overflow:hidden}.subhero-grid{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:60px;min-height:470px;padding-block:60px}.subhero-lead{font-size:17px;max-width:610px;color:#e2ede1;margin-bottom:28px}.subhero-art{height:340px;position:relative;border:1px solid rgba(255,255,255,.26);background:radial-gradient(circle at 72% 40%,rgba(184,221,147,.24),transparent 42%)}.subhero-word{position:absolute;bottom:24px;right:27px;font-size:67px;font-weight:700;letter-spacing:-.1em;color:rgba(255,255,255,.15)}.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.steps-grid article{border-top:2px solid var(--green);padding:25px 20px 10px;background:#f7f8f1}.expect-section{background:#e8eee4;padding:80px 0}.expect-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:start}.expect-grid p:not(.kicker){color:#435a4a}.online-detail-grid{display:grid;grid-template-columns:1fr .86fr;gap:100px;align-items:center}.online-detail p:not(.kicker){color:#40564a}.flow-card{background:var(--green);color:#fff;padding:40px}.flow-card h3{font-size:24px;margin-bottom:23px}.flow-card ol{list-style:none;margin:0;padding:0}.flow-card li{display:grid;grid-template-columns:105px 1fr;gap:15px;padding:17px 0;border-top:1px solid rgba(255,255,255,.2);font-size:13px}.flow-card li b{color:var(--lime);font-size:15px}.flow-card li span{color:#e0ece2}.annual-details{border:1px solid #cad8c7;background:#fff;max-width:850px;margin-top:25px}.annual-details summary{cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:16px 20px;color:var(--green);font-weight:700;list-style:none}.annual-details summary::-webkit-details-marker{display:none}.annual-details[open] summary span{transform:rotate(45deg)}.annual-details>div{border-top:1px solid var(--line);padding:17px 20px;font-size:14px;color:#4a5a4e}.annual-details p:last-child{margin-bottom:0}
@media(max-width:1000px){.desktop-nav{gap:15px;font-size:12px}.brand-sub{display:none}.hero-grid,.subhero-grid{gap:25px}.online-grid,.online-detail-grid{gap:45px}.person-grid,.advisor-grid{gap:45px}.expect-grid{gap:45px}}
@media(max-width:760px){.container{width:min(100% - 36px,560px)}.header-inner{height:66px}.brand-name{font-size:25px}.desktop-nav{display:none}.mobile-menu{display:block;position:relative}.mobile-menu summary{display:grid;gap:5px;cursor:pointer;list-style:none;padding:10px}.mobile-menu summary::-webkit-details-marker{display:none}.mobile-menu summary span{display:block;width:23px;height:2px;background:var(--green)}.mobile-menu nav{position:absolute;top:46px;right:0;width:min(280px,85vw);background:var(--paper);box-shadow:0 15px 35px rgba(0,0,0,.16);padding:12px;display:grid;z-index:20}.mobile-menu nav a{padding:9px 12px;border-bottom:1px solid var(--line);font-size:14px}.mobile-menu nav a:last-child{border:0}.hero-grid,.subhero-grid{display:block;min-height:0;padding-block:65px 45px}.hero-copy h1,.subhero h1{font-size:clamp(38px,10vw,55px)}.hero-lead,.subhero-lead{font-size:15px}.hero-bottom{display:grid;gap:4px;font-size:11px}.section{padding:66px 0}.section-title{font-size:clamp(29px,8vw,40px)}.intro-grid,.online-grid,.online-detail-grid,.expect-grid,.person-grid,.advisor-grid{display:block}.intro-grid>div+div{margin-top:24px}.steps-grid{display:block}.steps-grid article{border:1px solid var(--line);margin-top:12px}.online-diagram{margin-top:36px;padding:17px}.fee-heading,.season-grid{display:block}.fee-heading>p{margin-top:15px}.fee-cards{display:block}.fee-card{margin-top:15px;padding:27px}.fee-amount strong{font-size:35px}.person-image,.advisor-photo{width:min(80%,300px);height:310px;margin-bottom:35px}.season-grid .button{margin-top:28px}.footer-inner{display:block}.footer-inner>div:last-child{margin-top:25px}.subhero-art{height:180px;margin-top:32px}.subhero-word{font-size:55px}.expect-grid>div+div{margin-top:22px}.flow-card{margin-top:32px;padding:25px}.flow-card li{grid-template-columns:82px 1fr}.contact-panel{padding:66px 0 82px}.hero-actions .button{min-width:0;flex:1;padding-inline:12px;font-size:12px}.mobile-bar{display:grid;grid-template-columns:1fr 1fr;position:fixed;bottom:0;left:0;right:0;z-index:30;background:var(--paper);padding:8px max(8px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom));gap:8px;box-shadow:0 -5px 20px rgba(0,0,0,.15)}.mobile-bar a{display:grid;place-items:center;min-height:48px;font-size:13px;font-weight:700;border:1px solid var(--green);color:var(--green)}.mobile-bar a:last-child{background:var(--green);color:#fff}body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}}
@media(max-width:380px){.hero-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.hero-actions .button{width:100%;min-width:0;white-space:normal;text-align:center;padding-inline:5px;line-height:1.35}.online-diagram>div{display:block}.online-diagram span{display:block}.flow-card li{display:block}.flow-card li span{display:block}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button,.text-link{transition:none}}/* 2026-10-10: consultation-first demo additions */
.hero-bottom a{color:inherit;text-decoration:underline;text-underline-offset:3px}.route-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:18px}.route-card{display:flex;flex-direction:column;min-height:290px;padding:35px;background:#f2f5eb;border:1px solid #d8e2d2}.route-card.route-primary{background:#e4eee1;border-top:4px solid var(--green-mid)}.route-label,.role-card>span{font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--green-mid)}.route-card h3{font-size:clamp(23px,2.5vw,31px);margin:19px 0 12px}.route-card p{color:#405749;font-size:15px;line-height:1.9;margin-bottom:25px}.route-card a{margin-top:auto;align-self:start;font-size:14px;font-weight:700;color:var(--green);border-bottom:1px solid var(--green)}.decision-note{display:flex;gap:20px;align-items:baseline;padding:24px 0 0;color:#405749;font-size:14px}.decision-note b{white-space:nowrap;color:var(--green)}.season-grid{display:block;max-width:1180px}.season-grid>div{max-width:880px}.personal-aside{margin-top:21px;padding:17px 21px;border-left:3px solid var(--green-mid);background:rgba(255,255,255,.55);font-size:14px;color:#415446}.personal-links{display:flex;flex-wrap:wrap;gap:18px 30px;margin-top:22px}.personal-footnote{display:block;margin-top:17px;font-size:11px;color:#607260}.consultation-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:30px 0 18px;text-align:left}.consultation-steps>div{padding:17px 13px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18)}.consultation-steps b{display:block;color:var(--lime);font-size:12px}.consultation-steps span{font-size:13px;color:white}.contact-inner .contact-reassurance{font-size:14px;font-weight:700;color:white!important;margin:0 0 12px}.plan-roles{background:#fbfcf6}.role-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.role-card{background:white;border:1px solid var(--line);padding:32px}.role-card:first-child{border-top:4px solid var(--green-mid)}.role-card h3{font-size:24px;margin:18px 0 16px}.role-card>p{color:#405749;font-size:14px;min-height:118px}.role-split{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:20px}.role-split>div{background:#eef3e9;padding:14px}.role-split b{color:var(--green);font-size:13px}.role-split p{font-size:12px;line-height:1.7;margin:6px 0 0;color:#415647}.roles-footnote{font-size:12px;color:#5e7062;margin:16px 0 0}
@media(max-width:760px){.route-grid,.role-grid{grid-template-columns:1fr}.route-card{min-height:0;padding:26px}.decision-note{display:block}.decision-note b{display:block;margin-bottom:5px}.consultation-steps{grid-template-columns:1fr;gap:6px}.consultation-steps>div{display:flex;align-items:center;gap:13px;padding:10px 14px}.role-card{padding:24px}.role-card>p{min-height:0}.role-split{grid-template-columns:1fr 1fr}.personal-links{display:grid;gap:15px}.personal-links .text-link{justify-self:start}}

/* 2026-10-10 Codex: 風景写真の光、白と淡い緑、日本語1書体を軸にした明るい再設計デモ。 */
:root {
  --green: #006039;
  --green-deep: #00482c;
  --green-mid: #006039;
  --lime: #d8eee0;
  --cream: #ecf6ef;
  --paper: #fafcfa;
  --ink: var(--green);
  --body: #395947;
  --muted: #58715f;
  --on-green: #fff;
  --line: #dce8df;
  --sans: 'Shippori Mincho B1', 'Yu Mincho', 'Hiragino Mincho ProN', serif;
}

body { background: var(--paper); }
h1, h2, h3, .subhero-quote { font-family: var(--sans); font-weight: 500; letter-spacing: .005em; }
/* 明示した改行の内側でも、画面幅による片寄った1〜2文字の孤立を避ける。 */
h1, h2, h3, .hero-statement { text-wrap: balance; word-break: auto-phrase; }
/* <br> の内側では balance が働かないため、節ごとにブロックにして balance を効かせる。 */
h1 > .ln, h2 > .ln, h3 > .ln { display: block; }
/* 説明文の末尾と日本語の語中での不自然な改行を抑える。 */
p, li, dd { text-wrap: pretty; }
.page-intro > p:not(.kicker), .contact-inner > p:not(.kicker) { text-wrap: balance; }
.copy-unit { display: inline-block; white-space: nowrap; }
.fee-amount strong, .fee-online b, .price-callout .amount, .annual-details strong { white-space: nowrap; }
.kicker { letter-spacing: .14em; color: var(--green-mid); }
/* 色の役割：写真上は深緑、濃緑の面では淡色。light ラベルを深緑の共通指定にしない。 */
.kicker.light { color: #cfe8d2; }
.hero .kicker.light, .subhero .kicker.light, .contact-panel .kicker.light { color: var(--green); }
.section-title { font-weight: 500; line-height: 1.52; }
.site-header { background: rgba(250, 252, 250, .97); border-bottom-color: #dfebe2; }
.header-inner { height: 82px; }
.brand-name { font-family: var(--sans); font-size: 34px; letter-spacing: .13em; font-weight: 600; }
.brand-sub { font-size: 10px; letter-spacing: .04em; }
.desktop-nav { font-weight: 500; }
.nav-contact, .button { border-radius: 999px; }
.nav-contact { background: var(--green); }
.button-primary { background: var(--green); color: #fff; }
.button-line { background: #06c755; border-color: #06c755; color: #073b25; }
.button-outline { border-color: var(--green); color: var(--green); }
.button-secondary { background: var(--green); }
.button:focus-visible, a:focus-visible, summary:focus-visible { outline: 3px solid #b69a65; outline-offset: 4px; }

/* 写真の光を残し、深緑は文字とボタンで効かせる。 */
.hero, .subhero {
  color: var(--ink);
  background: var(--paper);
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.hero::before, .subhero::before,
.hero::after, .subhero::after { content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.hero::before { background: url('/assets/hero.jpg') center 52% / cover no-repeat; }
.hero::after { background: linear-gradient(90deg, rgba(250, 252, 250, .94) 0%, rgba(250, 252, 250, .84) 50%, rgba(250, 252, 250, .17) 74%, rgba(250, 252, 250, .02) 100%); }
.hero .container, .subhero .container { position: relative; z-index: 1; }
.hero-grid { display: flex; align-items: center; min-height: 575px; padding-block: 43px 35px; }
.hero-copy { max-width: 610px; }
.hero-copy .hero-mark { margin: 0 0 14px; color: var(--green); font-family: var(--sans); font-size: clamp(76px, 7vw, 104px); font-weight: 500; letter-spacing: .025em; line-height: 1; }
.hero-statement { max-width: 590px; margin: 0 0 16px; color: var(--ink); font-size: clamp(28px, 2.9vw, 39px); font-weight: 500; letter-spacing: .01em; line-height: 1.53; }
/* em は強調色ではなく改行用。見出し内で行ごとの色を変えない。 */
.subhero h1 { color: var(--green); }
.subhero h1 em { color: inherit; }
.hero-lead, .subhero-lead { color: var(--body); line-height: 1.95; }
.hero-lead { max-width: 550px; margin-bottom: 21px; }
.hero-value-list { display: flex; flex-wrap: wrap; gap: 7px 18px; max-width: 620px; margin: 20px 0 0; }
.hero-value-list span { padding: 2px 0 2px 10px; border-left: 2px solid #83af8e; color: var(--green); font-size: 13px; line-height: 1.5; }
.hero-fine { color: var(--muted); }
.hero-bottom { border-top: 1px solid rgba(0, 96, 57, .2); color: var(--body); }
.hero-bottom a { display: inline-flex; align-items: center; gap: .35em; color: var(--green); text-decoration: none; border: 0; transition: opacity .2s ease; }
.hero-bottom a:hover { opacity: .72; text-decoration: none; }
.hero .button-primary, .subhero .button-primary { background: var(--green); color: #fff; }
.hero .button-line, .subhero .button-line { background: #06c755; border-color: #06c755; color: #073b25; }

.intro-section { padding-top: 86px; }
.route-card, .role-card, .fee-card {
  border-radius: 14px; border-color: var(--line); box-shadow: 0 14px 32px rgba(46,67,50,.035);
}
.route-card { background: #fff; }
.route-card.route-primary { background: #f0f8f2; border-top-color: var(--green-mid); }
.route-card h3 { line-height: 1.55; }
.route-card p { color: #506457; }
.decision-note { color: #566858; }
.decision-note b { color: var(--green); }
.text-link { color: var(--green); }
.subhero-secondary { display: inline-flex; margin-top: 18px; }
.proof-section { background: #0b4a39; color: var(--on-green); padding-block: 82px 72px; }
.proof-section .kicker, .proof-section .section-title { color: var(--on-green); }
.proof-section .section-intro { color: #e3f0e7; }
.proof-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.proof-card { padding: 31px; border: 1px solid var(--line); border-radius: 14px; background: #f8fcf9; color: var(--green); }
.proof-label { color: var(--green); font-size: 13px; letter-spacing: .08em; }
.proof-card h3 { font-size: clamp(23px, 2.2vw, 30px); color: var(--green); line-height: 1.55; }
.proof-card p:not(.proof-label) { color: var(--muted); }
.proof-card small { display: block; color: #58715f; font-size: 13px; line-height: 1.8; }

/* 人柄と既存のお客様の声を、料金より前で伝える。 */
.person-section { background: linear-gradient(120deg, #f8fcf9 0%, #edf7f1 58%, #f4faf6 100%); }
.person-grid { grid-template-columns: .67fr 1fr; gap: 8%; }
.person-image { max-width: 370px; border-radius: 46% 46% 8px 8px / 12% 12% 8px 8px; box-shadow: 20px 20px 0 -8px #dceee1; }
.person-copy .section-title { margin-bottom: 22px; }
.person-name { font-family: var(--sans); font-size: 20px; }

/* Published customer comments, reproduced without editing the wording. */
.testimonial-section { background: #f3f8f4; }
.testimonial-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 34px; }
.testimonial-grid .vcard { display: flex; flex-direction: column; min-width: 0; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 17px 23px 25px; box-shadow: 0 12px 30px rgba(0,72,44,.05); }
.testimonial-grid .vq { color: #96c5a6; font-size: 47px; line-height: .8; margin: 0 0 15px; }
.testimonial-grid .vt { color: var(--green); font-size: 18px; line-height: 1.6; margin: 0 0 15px; }
.testimonial-grid .vd { color: var(--green); font-size: 14px; line-height: 1.9; margin: 0 0 18px; flex: 1; }
.testimonial-grid .vm { color: var(--green); font-size: 12px; border-top: 1px solid var(--line); padding-top: 12px; margin: 0; }
@media (max-width: 1000px) { .testimonial-grid { grid-template-columns: 1fr; gap: 14px; } }

.online-panel { background: #edf7f1; color: var(--green); padding-block: 112px; }
.online-panel .kicker.light { color: var(--green); }
.online-panel .section-title { color: var(--green); }
.online-panel p:not(.kicker) { color: var(--muted); }
.online-panel .button-outline { background: var(--green); border-color: var(--green); color: #fff; }
.online-diagram { border-radius: 12px; background: #fff; border-color: var(--line); }
.online-diagram>div { background: #f7fbf8; border-left-color: #8eb79b; }
.online-diagram b { color: var(--green); }
.online-diagram span { color: var(--muted); }
.online-diagram i { background: #8eb79b; }
.fee-section, .price-detail { background: #f4faf6; }
.fee-section { padding-block: 106px 94px; }
.fee-section .section-title, .online-panel .section-title { font-size: clamp(35px, 3.8vw, 52px); }
.proof-section .section-title, .column-section .section-title { font-size: clamp(30px, 2.9vw, 40px); }
.fee-card.featured { border-top-color: var(--green-mid); }
.fee-online { background: #e8f5ec; }
.personal-fee-note { margin-top: 35px; padding: 25px 29px; background: #fff; border-left: 4px solid var(--green); border-radius: 0 12px 12px 0; }
.personal-fee-note .kicker { margin-bottom: 8px; }
.personal-fee-note h3 { color: var(--green); font-size: 21px; margin-bottom: 9px; }
.personal-fee-note p:not(.kicker) { color: var(--muted); margin-bottom: 15px; }
.column-section { background: var(--paper); }
.column-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 19px; }
.column-card { display: flex; flex-direction: column; min-height: 240px; padding: 24px 6px; background: transparent; border: 0; border-top: 2px solid var(--line); border-radius: 0; transition: border-color .2s ease; }
.column-card:hover { text-decoration: none; border-top-color: var(--green); }
.column-card span { color: var(--green-mid); font-size: 13px; font-weight: 700; letter-spacing: .05em; }
.column-card h3 { margin: 20px 0 13px; color: var(--ink); font-size: 22px; line-height: 1.65; }
.column-card p { color: var(--muted); font-size: 15px; }
.column-card b { margin-top: auto; color: var(--green); font-size: 14px; }
.season-section { background: #e9f5ed; }
.personal-aside { background: rgba(255,255,255,.7); }
.contact-panel { background: linear-gradient(90deg, rgba(250,252,250,.96), rgba(250,252,250,.83) 62%, rgba(250,252,250,.51)), url('/assets/cta.jpg') center 42% / cover no-repeat; color: var(--ink); }
.contact-inner { max-width: 840px; }
.contact-inner .section-title, .contact-inner h2 { font-family: var(--sans); font-weight: 500; }
.contact-head-unit { display: inline-block; white-space: nowrap; }
.contact-inner p:not(.kicker) { color: var(--body); }
.contact-inner small { color: var(--muted); }
.contact-inner .button-primary { background: var(--green); color: #fff; }
.contact-inner .button-line { background: #06c755; border-color: #06c755; color: #073b25; }
.contact-inner .contact-alternatives { color: #456952; }
.contact-alternatives span { display: inline-block; white-space: nowrap; }
.contact-inner .contact-reassurance { color: var(--green) !important; }
.consultation-steps>div { border-radius: 8px; background: rgba(255,255,255,.88); border-color: #d6e9dc; }
.consultation-steps b { color: var(--green); }
.consultation-steps span { color: var(--ink); }
.footer { background: #063f30; color: #f4faf5; }
.footer .brand-name { color: #fff; }
.footer p, .footer-inner>div:last-child { color: #e2eee6; }
.footer nav { display: flex; flex-wrap: wrap; gap: 16px 28px; align-items: flex-start; font-size: 14px; }
.footer nav a { border-bottom: 1px solid rgba(255,255,255,.48); }

/* 法人詳細も、予防線より「一緒に進める」印象にする。 */
.subhero-grid { display: flex; align-items: center; min-height: 460px; }
.subhero-grid > div:first-child { width: min(100%, 680px); }
.subhero::before { background: url('/assets/cta.jpg') center 42% / cover no-repeat; }

/* ===== 下層3ページのヒーロー背景（2026-10-11 Claude）=====
   それまでは3ページとも cta.jpg を流用していた。cta.jpg は 700x933 の縦長で、
   1440px のヒーローに cover で当てると横に引き伸ばしたうえ2倍以上に拡大されてボケる。
   さらに同じページの最下部（.contact-panel）にも同じ cta.jpg が出るので、
   1ページ内で同じ写真が2回、4ページで7回出ていた。
   差し替え元：projects/travel（人物・観光名所が写っていないもの／幅2000px／明るさ調整済み）。
   ----- 戻し方：この節を消すだけで cta.jpg の流用に戻る ----- */
.subhero-corporate::before { background-image: url('/assets/hero-park.jpg');  background-position: center 48%; }
.subhero-online::before    { background-image: url('/assets/hero-park2.jpg');  background-position: center 46%; }
.subhero-about::before     { background-image: url('/assets/hero-grass.jpg'); background-position: center 52%; }
.subhero::after { background: linear-gradient(95deg, rgba(250,252,250,.97) 0%, rgba(250,252,250,.88) 52%, rgba(250,252,250,.22) 74%, rgba(250,252,250,.02) 100%); }
.subhero h1 { font-size: clamp(40px, 4.4vw, 62px); font-weight: 500; line-height: 1.55; }
.subhero-art { display: none; }
.subhero-note { color: var(--green-mid); font-size: 11px; letter-spacing: .14em; }
.subhero-quote { z-index: 1; margin-top: 29px; color: var(--green); font-size: clamp(22px, 2.4vw, 32px); line-height: 1.8; }
.subhero-word { z-index: 0; font-size: 59px; color: rgba(36,88,67,.09); }
.service-section { background: var(--paper); }
.steps-grid article { background: #f4faf6; border-top-color: var(--green-mid); border-radius: 6px; }
.plan-roles { background: #eff8f2; }
.role-card:first-child { border-top-color: var(--green-mid); }
.role-split>div { border-radius: 6px; background: #f1f8f3; }
.expect-section { background: #e9f5ed; }
.flow-card { background: #0b4a39; border-radius: 12px; }
.advisor-section { background: #f0f8f3; }
.advisor-photo { border-radius: 46% 46% 8px 8px / 12% 12% 8px 8px; box-shadow: 20px 20px 0 -8px #dceee1; }

/* 見出し・補足・スマホでも同じ明朝体を使う。装飾ラベルだけ極小にしない。 */
.brand-sub, .kicker, .hero-fine, .fineprint, .person-name small,
.personal-footnote, .roles-footnote,
.route-label, .role-card>span, .subhero-note { font-size: 13px; }
.consultation-steps span, .role-split p, .flow-card li, .flow-card li span { font-size: 14px; }
.role-split b, .flow-card li b { font-size: 15px; }
.personal-consult { margin-top: 26px; padding: 18px 23px; background: #fff; border-left: 4px solid var(--green); }
.personal-consult p { margin: 0 0 9px !important; }
.online-panel .button-outline:hover { background: var(--green-deep); color: #fff; }
.page-intro { max-width: 770px; margin: 0 auto 50px; text-align: center; }
.page-intro p { color: var(--muted); font-size: 17px; }
.about-values { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.about-values article { padding: 28px; border: 1px solid var(--line); border-top: 4px solid var(--green); background: #fff; }
.about-values h3 { color: var(--green); font-size: 23px; }
.about-values p { color: var(--muted); font-size: 15px; margin: 0; }
.office-facts { display: grid; grid-template-columns: repeat(2, 1fr); max-width: 840px; margin: auto; border-top: 1px solid var(--line); }
.office-facts div { padding: 17px 10px; border-bottom: 1px solid var(--line); }
.office-facts dt { color: var(--green); font-weight: 700; }
.office-facts dd { margin: 4px 0 0; color: var(--muted); }
.related-links { display: flex; flex-wrap: wrap; gap: 15px; }
.related-links a { max-width: 100%; padding: 12px 20px; border: 1px solid var(--green); border-radius: 999px; color: var(--green); background: #fff; font-weight: 700; overflow-wrap: anywhere; text-wrap: balance; }
.related-links a:hover { background: #edf7ef; text-decoration: none; }
.online-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.online-facts article { padding: 27px; background: #fff; border: 1px solid var(--line); border-radius: 12px; }
.online-facts h3 { font-size: 22px; color: var(--green); }
.online-facts p { color: var(--muted); margin-bottom: 0; }
.online-facts-note { margin-top: 20px; color: var(--muted); font-size: 17px; }
.page-section-soft { background: #eff7f1; }
.price-callout { padding: 26px 30px; border-left: 4px solid var(--green); background: #fff; }
.price-callout strong { color: var(--green); font-size: 23px; }
.price-callout .amount { display: inline-block; }
.price-callout p { margin: 10px 0 0; color: var(--muted); }

@media (min-width: 761px) and (max-width: 1100px) {
  .desktop-nav { display: none; }
  .mobile-menu { display: block; position: relative; }
  .mobile-menu summary { display: grid; gap: 5px; padding: 10px; cursor: pointer; list-style: none; }
  .mobile-menu summary::-webkit-details-marker { display: none; }
  .mobile-menu summary span { display: block; width: 23px; height: 2px; background: var(--green); }
  .mobile-menu nav { position: absolute; top: 46px; right: 0; z-index: 20; display: grid; width: min(280px, 85vw); padding: 12px; background: var(--paper); box-shadow: 0 15px 35px rgba(0,0,0,.16); }
  .mobile-menu nav a { padding: 9px 12px; border-bottom: 1px solid var(--line); font-size: 14px; }
  .mobile-menu nav a:last-child { border: 0; }
}

@media (max-width: 760px) {
  .header-inner { height: 66px; }
  .brand-name { font-size: 24px; }
  .hero::before { background-position: 63% center; }
  .hero::after { background: linear-gradient(180deg, rgba(250,252,250,.88) 0%, rgba(250,252,250,.80) 52%, rgba(250,252,250,.66) 100%); }
  .subhero::after { background: linear-gradient(180deg, rgba(250,252,250,.92), rgba(250,252,250,.8) 60%, rgba(250,252,250,.70)); }
  /* スマホはヒーローの下端に写真が出るので、その上に重なる注記だけ濃くする（AA 4.5 を満たすため・2026-10-11）*/
  .hero-fine { color: #1f4433; }
  .hero-grid, .subhero-grid { min-height: 0; padding-block: 36px 36px; }
  .hero-copy .hero-mark { font-size: clamp(65px, 17vw, 108px); letter-spacing: .005em; margin-bottom: 12px; }
  .hero-statement { font-size: clamp(23px, 6.2vw, 31px); }
  .subhero h1 { font-size: clamp(32px, 8.2vw, 45px); }
  .hero-lead, .subhero-lead { font-size: 15px; line-height: 1.92; }
  .subhero-art { display: none; }
  .hero-bottom { gap: 8px; }
  .intro-section { padding-top: 65px; }
  .column-grid { grid-template-columns: 1fr; }
  .proof-grid { grid-template-columns: 1fr; }
  .proof-card { padding: 23px; }
  .column-card { min-height: 0; }
  .person-grid, .advisor-grid { display: block; }
  .person-image, .advisor-photo { width: min(74%, 270px); height: 300px; margin: 0 auto 34px; }
  .mobile-bar { background: #fafcfa; }
  .mobile-bar { transition: opacity .2s ease, transform .2s ease; }
  .mobile-bar--quiet { opacity: 0; transform: translateY(100%); pointer-events: none; }
  .mobile-bar a { border-radius: 999px; }
  .mobile-bar a:last-child { background: #06c755; border-color: #06c755; color: #073b25; }
  .hero-actions .button { font-size: 14px; }
  .hero-value-list { gap: 6px 11px; margin: 18px 0 0; }
  .hero-value-list span { font-size: 11px; padding: 3px 8px; background: rgba(250,252,250,.82); border-radius: 0 4px 4px 0; }
  .personal-fee-note { padding: 21px 20px; }
  .role-split { grid-template-columns: 1fr; }
  .about-values, .online-facts, .office-facts { grid-template-columns: 1fr; }
  .footer nav { margin-top: 28px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .mobile-bar { transition: none; }
}

@media (max-width: 360px) {
  .section-title { font-size: 27px; }
  .subhero h1 { font-size: 29px; }
  .hero-statement { font-size: 23px; }
  .role-card h3, .route-card h3 { font-size: 21px; }
}

/* タブレット幅では狭い3列・入れ子2列を解き、文の折り返しに余裕を戻す。 */
@media (min-width: 761px) and (max-width: 1000px) {
  .intro-grid, .online-grid, .online-detail-grid, .expect-grid { grid-template-columns: 1fr; gap: 30px; }
  .person-grid, .advisor-grid { grid-template-columns: minmax(240px, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 4vw, 48px); }
  .column-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steps-grid, .about-values, .route-grid, .role-grid,
  .fee-cards, .consultation-steps { grid-template-columns: 1fr; }
  .consultation-steps > div { display: flex; align-items: center; gap: 16px; padding: 12px 17px; }
  .subhero-grid { min-height: 0; }
  .subhero-art { display: none; }
  .column-card { min-height: 0; }
  .person-image, .advisor-photo { width: 100%; max-width: 330px; }
  .fee-cards { display: grid; }
  .role-card > p { min-height: 0; }
}

@media (min-width: 860px) and (max-width: 1000px) {
  .route-grid, .fee-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* AIO refresh: questions are useful to readers first; markup mirrors this visible content. */
.aio-faq-section { background: #f7faf7; }
.aio-faq-list { max-width: 940px; margin: 28px auto 0; border-top: 1px solid rgba(0,96,57,.2); }
.aio-faq-list details { border-bottom: 1px solid rgba(0,96,57,.2); padding: 0 18px; }
.aio-faq-list summary { position: relative; list-style: none; cursor: pointer; color: var(--green); font-size: clamp(17px,2vw,22px); font-weight: 600; line-height: 1.65; padding: 22px 36px 22px 0; }
.aio-faq-list summary::-webkit-details-marker { display: none; }
.aio-faq-list summary::after { content: '+'; position: absolute; right: 0; top: 20px; font-size: 27px; line-height: 1.2; font-weight: 400; }
.aio-faq-list details[open] summary::after { content: '−'; }
.aio-faq-list p { max-width: 72ch; margin: 0 0 24px; line-height: 1.95; color: var(--green); }
.aio-all-articles { display: inline-flex; grid-column: 1 / -1; justify-self: start; margin-top: 0; }
.hero-actions .button { min-height: 56px; font-size: 16px; }
.hero-actions .button-primary { min-width: 190px; padding-inline: 26px; }
.hero-actions .button-line { min-width: 160px; }
@media (max-width: 700px) {
  .aio-faq-list { margin-top: 19px; }
  .aio-faq-list details { padding-inline: 4px; }
  .aio-faq-list summary { font-size: 17px; padding: 18px 30px 18px 0; }
  .aio-faq-list summary::after { top: 17px; }
  .aio-faq-list p { font-size: 15px; line-height: 1.85; }
  .hero-actions .button { min-height: 52px; font-size: 14px; min-width: 0; }
  .proof-section, .online-panel, .fee-section { padding-block: 66px; }
}


/* ===== 植物の線画（2026-10-11 実装 → 同日「外して」で HTML から要素を削除。経緯のコメントは残置） =====
   【現状】どのページにも .hero-art 要素が無いので、旧定義は使っていない。
   【戻し方】hero-grid / subhero-grid の中に次を入れるだけ：
     <div class="hero-art" aria-hidden="true"><div class="art-frame">
       <span class="art-sprout art-sprout-one"></span>
       <span class="art-sprout art-sprout-two"></span>
       <span class="art-sprout art-sprout-three"></span>
     </div></div>
   【ただし】2026-10-11 に先生と「ある／ない」を見比べて、**「なし」を採用**している。
   理由：右は空白ではなく**写真が見えている領域**で、線画は半透明の白で
   写真の一番きれいな抜け（空・芝生）を覆うため。線画は aria-hidden で情報価値も無い。
   植物のモチーフを使うなら**深緑の面（online-panel）**が合う（styles.css の元の明るい線の定義が生きる）。 =====
   旧植物CSSは _trash/warm.before-merge_20261011_codex.css に保管。 */

@media (max-width: 380px) {
  .hero-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero-actions .button, .hero-actions .button-primary, .hero-actions .button-line {
    box-sizing: border-box; width: 100%; min-width: 0; max-width: 100%;
    padding-inline: 5px; white-space: normal; text-align: center; font-size: 13px; line-height: 1.35;
  }
}


/* ===== 問い合わせフォーム（本番 index から移植・2026-10-11）===== */
.lnote{margin-left:.5em;font-size:.74rem;font-weight:400;color:var(--green);letter-spacing:.02em;}
.cta-assure{display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:center;margin:0 0 2rem;font-size:.88rem;color:#E2EEE6;}
.cta-assure span{display:inline-flex;align-items:center;gap:.4em;}
.cta-assure span::before{content:"\2713";color:#fff;font-weight:700;}
/* ---------- contact form ---------- */
  .cform{max-width:640px;margin:0 auto;background:#fff;border-radius:20px;padding:34px 30px 30px;text-align:left;box-shadow:0 22px 50px rgba(0,0,0,.20);}
.cform .frow2{display:grid;grid-template-columns:1fr;gap:0 16px;}
.cform .frow2{grid-template-columns:1fr 1fr;}
.cform label{display:block;font-family:var(--sans);font-size:.82rem;color:#4C6B5A;letter-spacing:.05em;margin:0 0 .4rem;}
.cform .req{display:inline-block;color:#fff;background:#B0503C;border-radius:4px;font-size:.66rem;letter-spacing:.08em;padding:.15em .6em;margin-left:.5em;vertical-align:middle;}
.cform input,.cform select,.cform textarea{width:100%;font-family:var(--sans);font-size:16px;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:.75em 1em;margin:0 0 1.15rem;}
.cform input:focus,.cform select:focus,.cform textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(0,96,57,.14);}
.cform textarea{min-height:132px;resize:vertical;}
.cform .btn-submit{width:100%;justify-content:center;background:var(--green);color:#fff;border:none;cursor:pointer;font-weight:700;font-size:1rem;padding:1.05em 2em;}
.cform .btn-submit:hover{background:var(--green-deep);transform:translateY(-2px);}
.cform .fnote{font-size:.78rem;color:#4C6B5A;text-align:center;margin:1rem 0 0;line-height:1.8;}
.hp-field{position:absolute;left:-9999px;top:-9999px;height:1px;width:1px;overflow:hidden;}
.cform-wrap{max-width:720px;margin:34px auto 0;text-align:left}

.cform .cform-submit{width:100%;justify-content:center;border:none;cursor:pointer;font-size:16px;padding:16px 24px}
