/* 2026-10-02 全ページ共通のフッター（Home / About / Price & Flow） */
.yf{--yf-ink:#30332f;--yf-paper:#f7f7f2;--yf-muted:#b5b9b0;--yf-line:rgba(247,247,242,.16);--yf-lime:#e2ff72;--yf-gutter:clamp(28px,5.8vw,96px);position:relative;z-index:7;background:var(--yf-ink);color:var(--yf-paper);padding:clamp(56px,7vw,88px) var(--yf-gutter) 28px;font-family:Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",Meiryo,sans-serif}
.yf :where(p,ul){margin:0;padding:0}
.yf a{color:inherit;text-decoration:none}
.yf a:focus-visible{outline:2px solid var(--yf-lime);outline-offset:4px}
.yf-main{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px clamp(40px,6vw,96px);align-items:start}
.yf-brand{display:inline-block;font-weight:400;font-size:clamp(34px,3.6vw,56px);line-height:1;letter-spacing:-.055em;white-space:nowrap}
.yf-brand span{font-size:.48em;letter-spacing:-.02em}
.yf-caption{margin-top:18px!important;font-size:13px;line-height:1.9;color:var(--yf-muted)}
.yf-nav{display:grid;grid-template-columns:repeat(2,auto);gap:14px 48px;list-style:none}
.yf-nav a{display:inline-flex;align-items:baseline;gap:12px;font-size:17px;line-height:1.3;padding:4px 0}
.yf-nav small{font-size:10px;color:var(--yf-muted)}
.yf-nav a span{position:relative}
.yf-nav a span::after{content:"";position:absolute;left:0;bottom:-4px;width:0;height:1px;background:var(--yf-lime);transition:width .2s}
@media(hover:hover){.yf-nav a:hover span::after{width:100%}}
.yf-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:clamp(56px,7vw,88px);padding-top:20px;border-top:1px solid var(--yf-line);font-size:11px;color:var(--yf-muted);letter-spacing:.04em}
.yf-top{font-size:12px;color:var(--yf-paper);padding:8px 0;border-bottom:1px solid var(--yf-muted)}
@media(max-width:760px){
 .yf{--yf-gutter:24px;padding-top:56px}
 .yf-main{grid-template-columns:1fr;gap:40px}
 .yf-brand{font-size:36px}
 .yf-nav{gap:10px 32px}
 .yf-nav a{font-size:16px}
 .yf-bottom{margin-top:48px}
}
@media(prefers-reduced-motion:reduce){.yf-nav a span::after{transition:none}}
@media print{.yf{display:none}}

/* 2026-10-04 フッターの前の「戻る」リンク */
.yf-back{--yf-gutter:clamp(28px,5.8vw,96px);display:flex;align-items:center;justify-content:space-between;gap:28px;padding:clamp(40px,5vw,56px) var(--yf-gutter);background:#f7f7f2;color:#30332f;border-top:1px solid rgba(48,51,47,.12);font-family:Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",Meiryo,sans-serif;text-decoration:none}
.yf-back-copy{display:grid;gap:12px}
.yf-back small{font-size:13px;letter-spacing:.05em;color:#61655e}
.yf-back b{font-size:clamp(22px,2.3vw,32px);font-weight:600;line-height:1.5;letter-spacing:.01em}
.yf-back-arrow{display:grid;place-items:center;flex:0 0 56px;width:56px;height:56px;border-radius:50%;background:#30332f;color:#e2ff72}
.yf-back-arrow svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s ease}
.yf-back:focus-visible{outline:3px solid #30332f;outline-offset:-7px}
@media(hover:hover){.yf-back:hover .yf-back-arrow svg{transform:translateX(-4px)}}
@media(max-width:760px){.yf-back{--yf-gutter:24px;padding-block:37px;gap:18px}.yf-back-arrow{flex-basis:48px;width:48px;height:48px}.yf-back-arrow svg{width:24px;height:24px}.yf-back b{font-size:20px}}
@media(prefers-reduced-motion:reduce){.yf-back-arrow svg{transition:none}}
@media print{.yf-back{display:none}}

/* 2026-10-09d スマホで MENU を押して開くメニューの面：Worksと同じチャコールグレーのベタ。文字と線は生成り */
@media(max-width:760px){
  .yb-nav,.ya-nav{background:#46464b;color:#f7f7f2;border-bottom:0}
  .yb-nav a,.ya-nav a,.yb-nav small,.ya-nav small{color:#f7f7f2}
  .yb-nav a span:after,.ya-nav a span:after,
  .yb-nav a.is-active span:after,.ya-nav a.is-active span:after{background:#f7f7f2}
  .yb-nav a:focus-visible,.ya-nav a:focus-visible{outline:2px solid #f7f7f2;outline-offset:4px}
}