/* A案：深緑 × 生成り。公開用スタイル。ビルド不要。 */
:root{--ink:#263b34;--green:#234d3c;--green-dark:#193b2e;--paper:#f7f5ee;--white:#fff;--muted:#52645b;--line:#d5ddd5;--soft:#edf0e9;--accent:#a28a58;--max:1160px}
*{box-sizing:border-box}
html{scroll-padding-top:110px}
body{margin:0;background:var(--white);color:var(--ink);font-family:'Noto Sans JP','Hiragino Kaku Gothic ProN','Yu Gothic',Meiryo,sans-serif;font-size:17px;line-height:1.95;overflow-wrap:anywhere}
img{display:block;max-width:100%;height:auto}
a{color:var(--green);text-underline-offset:.3em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid #886b2f;outline-offset:5px}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{font-weight:600;line-height:1.55;letter-spacing:.03em}
h1{font-size:clamp(30px,3.1vw,40px)}
h2{font-size:clamp(25px,2.5vw,32px)}
h3{font-size:24px}
.wrap{width:min(calc(100% - 64px),var(--max));margin-inline:auto}
.skip-link{position:fixed;left:16px;top:-100px;padding:10px 18px;background:var(--green);color:white;z-index:100}
.skip-link:focus{top:10px}
.site-header{position:sticky;top:0;z-index:20;background:var(--white);border-bottom:1px solid var(--line)}
.header-inner{min-height:88px;display:flex;align-items:center;gap:26px}
.brand{color:var(--ink);text-decoration:none;display:block;flex-shrink:0;line-height:1.3}
.brand-en{display:block;font-size:24px;font-weight:700;letter-spacing:.12em}
.brand-ja{display:block;font-size:11px;letter-spacing:.06em;margin-top:6px}
.site-nav{display:flex;gap:22px;align-items:center;margin-left:auto;font-size:14px;font-weight:500}
.site-nav a{text-decoration:none;white-space:nowrap}
.site-nav a:hover,.site-nav a[aria-current=page]{text-decoration:underline}
.button{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:56px;padding:12px 27px;border:1px solid var(--green);background:var(--green);color:white;text-decoration:none;font-weight:500;font-size:16px;line-height:1.6}
.button:hover{background:var(--green-dark);border-color:var(--green-dark)}
.button::after{content:'→';font-family:Arial,sans-serif;font-size:21px;line-height:1}
.header-cta{font-size:14px;min-height:46px;padding:10px 18px;gap:14px;white-space:nowrap}
.hero-section{background:var(--paper);padding:82px 0 92px}
.hero{display:grid;grid-template-columns:1.15fr 1fr;gap:50px;align-items:center}
.hero h1{margin-bottom:24px;letter-spacing:0;line-height:1.7;text-wrap:balance}
.hero h1 span{display:block;color:var(--green)}
.hero .lead{color:var(--muted);font-size:17px;margin-bottom:32px;line-height:2.1;max-width:35em}
.hero-visual{border:1px solid var(--line);padding:15px;background:#fcfbf7}
.hero-visual img{width:100%;aspect-ratio:4/3;object-fit:cover}
/* 支給画像の左下ピクセル：PC (0,940) = rgb(245 243 234)。
   1920pxで拡大を止め、画像全体を表示して人物の横切れを防ぐ。 */
.hero-section.hero-section--illustrated{--hero-bg:rgb(245 243 234);--hero-gutter:clamp(24px,4vw,76px);position:relative;isolation:isolate;background:var(--hero-bg);padding:0}
.hero-section--illustrated .hero{position:relative;display:flex;align-items:center;width:100%;max-width:1920px;margin-inline:auto;min-height:min(56.279904vw,1080.574px);padding-block:clamp(48px,5vw,96px)}
.hero-section--illustrated .hero-copy{position:relative;z-index:1;width:calc(45% - var(--hero-gutter));max-width:640px;margin-left:var(--hero-gutter)}
.hero-section--illustrated .hero h1{font-size:clamp(26px,2.5vw,40px)}
.hero-section--illustrated .hero-visual{display:block;position:absolute;inset:0 0 auto;width:100%;max-width:1920px;aspect-ratio:1672/941;height:auto;margin-inline:auto;padding:0;border:0;background:transparent;pointer-events:none}
.hero-section--illustrated .hero-visual img{width:100%;height:100%;aspect-ratio:auto;object-fit:contain;object-position:right top}
.hero-section--illustrated .hero-visual::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgb(245 243 234 / 0) 91%,var(--hero-bg) 100%)}
.section{padding:92px 0}
.tint{background:var(--paper)}
.section-heading{text-align:center;margin-bottom:44px}
.eyebrow{color:var(--muted);font-size:12px;font-weight:500;letter-spacing:.22em;margin-bottom:9px;line-height:1.5}
.section-heading h2{margin-bottom:18px}
.section-heading p:last-child{margin-bottom:0}
.section-intro{color:var(--muted);font-size:16px}
.service{display:grid;grid-template-columns:350px 1fr;align-items:center;gap:44px;padding:36px 0;border-top:1px solid var(--line)}
.service:last-child{padding-bottom:0}
.service.reverse{grid-template-columns:1fr 350px}
.service.reverse .service-image{order:2}
.service-image{background:var(--soft)}
.service-image picture{display:block}
.service-image img{width:100%;aspect-ratio:16/10;object-fit:cover}
.service-number{font-family:Arial,sans-serif;font-size:13px;letter-spacing:.15em;color:var(--muted);margin-bottom:10px}
.service h3{margin-bottom:15px}
.service p{font-size:16px;margin-bottom:14px}
.service .description{color:var(--muted)}
.service .price{margin:22px 0 0;border-top:1px solid var(--line);padding-top:16px;font-size:16px;color:var(--green);font-weight:500}
.works{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
.work{margin:0}
.work img{aspect-ratio:16/10;width:100%;object-fit:cover;object-position:top;border:1px solid var(--line)}
.work figcaption{padding:22px 0 0}
.work h3{font-size:20px;margin-bottom:4px}
.work p{color:var(--muted);font-size:15px;margin-bottom:0}
.company-table{width:100%;border-collapse:collapse;text-align:left}
.company-table th,.company-table td{border-bottom:1px solid var(--line);padding:22px 8px;font-size:16px;vertical-align:top}
.company-table th{width:160px;font-weight:500;color:var(--muted)}
.company-summary{max-width:850px;margin-inline:auto}
.company-table tr:first-child th,.company-table tr:first-child td{border-top:1px solid var(--line)}
.section-action{text-align:center;margin-top:32px}
.text-link{display:inline-flex;align-items:center;gap:30px;font-size:16px;font-weight:500}
.text-link::after{content:'→';font-family:Arial,sans-serif}
.cta-band{background:var(--green);color:white;padding:60px 0}
.cta-inner{display:grid;grid-template-columns:1fr auto;gap:50px;align-items:center}
.cta-band h2{font-size:30px;margin-bottom:12px}
.cta-band p{color:#e1e9df;font-size:16px;margin-bottom:0}
.cta-band .button{background:var(--paper);color:var(--green);border-color:var(--paper);padding-inline:32px}
.cta-band .button:hover{background:white;border-color:white}
.site-footer{padding:52px 0 24px;background:var(--paper)}
.footer-inner{display:grid;grid-template-columns:1.6fr 1fr;gap:48px}
.footer-company{font-size:14px;color:var(--muted);margin:22px 0 0;line-height:2}
.footer-nav{display:grid;grid-template-columns:1fr 1fr;gap:16px 26px;align-content:start;font-size:14px}
.footer-nav a{text-decoration:none}
.footer-nav a:hover{text-decoration:underline}
.copyright{border-top:1px solid var(--line);margin:32px 0 0;padding-top:20px;font-family:Arial,sans-serif;font-size:12px;color:var(--muted);letter-spacing:.04em}
.page-heading{background:var(--paper);padding:54px 0 60px}
.breadcrumbs{font-size:13px;color:var(--muted);margin:0 0 26px}
.breadcrumbs a{color:var(--muted)}
.page-heading h1{margin-bottom:0;font-size:34px}
.content-wrap{max-width:900px;margin-inline:auto}
.history{margin-top:64px}
.history h2{font-size:26px;margin-bottom:26px}
.history dl{margin:0}
.history dl>div{display:grid;grid-template-columns:150px 1fr;gap:28px;border-top:1px solid var(--line);padding:23px 8px}
.history dt{color:var(--green);font-weight:500}
.history dd{margin:0;color:var(--muted);font-size:16px}
.contact-content{max-width:760px;margin-inline:auto}
.contact-intro{font-size:16px;color:var(--muted);margin-bottom:28px}
.form-embed{width:100%}
.form-embed iframe{display:block;width:100%;height:1600px;border:0}
.form-fallback{font-size:15px;color:var(--muted);margin:20px 0 0}
.policy{font-size:16px;line-height:2}
.policy>p{color:var(--muted)}
.policy section{margin-top:42px}
.policy h2{font-size:23px;margin-bottom:16px}
.policy ul{padding-left:1.5em}
.policy li{margin-bottom:10px}
.policy a{overflow-wrap:anywhere}
.policy-dates{margin-top:52px;border-top:1px solid var(--line);padding-top:24px;text-align:right;color:var(--muted)}
.policy-dates p{margin-bottom:4px}
@media(max-width:768px){
 html{scroll-padding-top:155px}
 body{font-size:16px}
 .wrap{width:calc(100% - 40px)}
 .header-inner{min-height:0;display:grid;grid-template-columns:1fr auto;gap:12px 14px;padding-block:16px 12px}
 .brand-en{font-size:21px;letter-spacing:.1em}.brand-ja{font-size:10px;margin-top:4px}
 .header-cta{font-size:12px;padding:9px 12px;min-height:42px;gap:10px}
 .site-nav{grid-row:2;grid-column:1/-1;margin-left:0;justify-content:space-between;gap:12px;font-size:13px;border-top:1px solid var(--line);padding-top:10px}
 .hero-section{padding:44px 0 50px}.hero{grid-template-columns:1fr;gap:34px}
 .hero h1{font-size:clamp(27px,5.5vw,34px);line-height:1.7;margin-bottom:20px}
 .hero .lead{font-size:16px;margin-bottom:26px;line-height:2}
 .hero-visual{padding:10px}.hero-visual img{aspect-ratio:4/3}
 /* SPの左下ピクセル (0,1401) = rgb(249 245 238)。
    人物の水平な下端 (y=856、画像高の約61.1%) までに背景色へ溶かす。 */
 .hero-section.hero-section--illustrated{--hero-bg:rgb(249 245 238)}
 .hero-section--illustrated .hero{display:block;min-height:0;padding:83vw 0 48px}
 .hero-section--illustrated .hero-copy{width:calc(100% - 40px);max-width:640px;margin-inline:auto}
 .hero-section--illustrated .hero h1{font-size:clamp(26px,5.5vw,34px)}
 .hero-section--illustrated .hero-visual{aspect-ratio:1122/1402}
 .hero-section--illustrated .hero-visual::after{background:linear-gradient(to bottom,rgb(249 245 238 / 0) 54%,rgb(249 245 238 / .25) 56%,rgb(249 245 238 / .8) 59%,var(--hero-bg) 61.2%)}
 .section{padding:58px 0}.section-heading{margin-bottom:30px}.section-intro{font-size:15px}
 .service,.service.reverse{grid-template-columns:1fr;gap:24px;padding:30px 0}
 .service.reverse .service-image{order:0}.service-image img{aspect-ratio:16/10}
 .service h3{font-size:22px}.service p{font-size:16px}.service .price{font-size:15px}
 .works{grid-template-columns:1fr;gap:38px}.work{max-width:450px;width:100%;margin-inline:auto}
 .work img{aspect-ratio:16/10}.work figcaption{padding-top:18px}
 .company-table th{width:100px}.company-table th,.company-table td{font-size:15px;padding:18px 5px}
 .cta-band{padding:44px 0}.cta-inner{grid-template-columns:1fr;gap:26px}.cta-band h2{font-size:25px}
 .cta-band .button{justify-self:start}
 .site-footer{padding-top:38px}.footer-inner{grid-template-columns:1fr;gap:30px}.footer-nav{gap:14px 18px}
 .footer-company{font-size:13px}.copyright{font-size:11px;line-height:1.8}
 .page-heading{padding:30px 0 36px}.breadcrumbs{margin-bottom:20px}.page-heading h1{font-size:27px}
 .history{margin-top:44px}.history dl>div{grid-template-columns:1fr;gap:7px;padding:18px 5px}
 .form-embed iframe{height:1900px}
 .policy{font-size:16px}.policy h2{font-size:21px}.policy section{margin-top:32px}
}
