@charset "UTF-8";
/* ==========================================================================
   page-senior.css ── シニア・持病・ワクチン相談
   値は Figma の senior_PC（544:28749）／senior_SP（544:28154）のもの
   ========================================================================== */

/* ---- 1. Who We Welcome ---- */
.pw-swho { position: relative; background: var(--pw-color-bg); overflow: hidden; }
.pw-swho__hero { position: relative; aspect-ratio: 1440 / 516; overflow: hidden; background: var(--pw-color-placeholder); }
.pw-swho__hero img { position: absolute; left: -.35%; top: -25.4%; width: 102.2%; height: 190%; max-width: none; object-fit: cover; }   /* Figma の画像枠 1472×980（x-5 y-131） */
.pw-swho__inner { position: relative; width: min(920px, 100% - var(--pw-gutter) * 2); margin-inline: auto; padding: 56px 0; }
.pw-swho__heading { width: min(364px, 100%); margin-inline: auto; }
.pw-swho__cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 32px; margin-top: 56px; }
.pw-swho__card { display: flex; align-items: flex-start; gap: 8px; padding: 16px; background: rgba(255, 255, 255, .5); border-radius: 20px; }
.pw-swho__card img { flex: none; width: 32px; height: 32px; object-fit: contain; }
.pw-swho__ttl { font-size: 18px; font-weight: 500; line-height: 32px; color: var(--pw-color-primary); }
.pw-swho__desc { margin-top: 4px; font-size: 16px; line-height: 29px; }
.pw-swho__arrow { display: block; width: auto; height: 32px; margin: 24px auto 0; }
.pw-swho__message { position: relative; width: min(500px, 100%); margin: 24px auto 0; text-align: center; font-size: 20px; line-height: 36px; }
.pw-swho__line2 { display: flex; justify-content: center; margin-top: 12px; white-space: nowrap; }
.pw-swho__line2 > span:first-child { width: 220px; }
.pw-swho__line2 > span:last-child { width: 140px; }
.pw-swho__line3 { margin-top: 24px; color: var(--pw-color-primary); }
.pw-swho__illust { position: absolute; left: calc(792px - (1440px - 500px) / 2); top: -119px; width: 719.7px; height: 345.2px; max-width: none; z-index: -1; pointer-events: none; }
.pw-swho__message { isolation: isolate; }

/* ---- 2. We accept ---- */
.pw-saccept { padding: 56px var(--pw-gutter); background: var(--pw-color-bg); }
.pw-saccept__heading { width: min(420px, 100%); margin-inline: auto; }
.pw-saccept__box { width: min(920px, 100%); margin: 43px auto 0; }
.pw-saccept__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto auto auto; row-gap: 27px; }
/* Figma の並び：左列＝ハイシニア／ワクチン／皮膚、右列＝怖がり／持病（右列の間隔だけ 21） */
.pw-saccept__item--3 { grid-area: 1 / 1; }
.pw-saccept__item--4 { grid-area: 2 / 1; }
.pw-saccept__item--5 { grid-area: 3 / 1; }
.pw-saccept__item--1 { grid-area: 1 / 2; }
.pw-saccept__item--2 { grid-area: 2 / 2 / span 2; margin-top: -6px; }
.pw-saccept__note { margin-top: 44px; }

/* ---- 3. Medical Background ---- */
.pw-smed { padding: 56px var(--pw-gutter); background: var(--pw-color-bg); }
.pw-smed__heading { width: min(494px, 100%); margin-inline: auto; }
.pw-smed__body { width: min(920px, 100%); margin: 32px auto 0; }
.pw-smed__main { display: flex; gap: 40px; }
.pw-smed__photo { position: relative; flex: none; width: 420px; aspect-ratio: 420 / 268; overflow: hidden; background: var(--pw-color-placeholder); }
.pw-smed__photo img { position: absolute; left: 0; top: -8.96%; width: 100%; height: 208.96%; max-width: none; object-fit: cover; }   /* 画像枠 420×560（y-24） */
.pw-smed__list { flex: 1 1 0; min-width: 0; }
/* 項目の色は本文（黒）。緑にする語は HTML の <strong>（Figma の文中の色替え。全文が緑の 2 項目は全体を strong）＝2026-10-02 */
.pw-smed__main { align-items: flex-start; }
.pw-smed__note { margin-top: 24px; }

/* ---- 4. Safety Measures ---- */
.pw-ssafe { padding: 56px var(--pw-gutter); background: var(--pw-color-bg-green10); }
.pw-ssafe__heading { width: min(543px, 100%); margin-inline: auto; }
.pw-ssafe__lead { align-self: stretch; text-align: left; }
.pw-ssafe__cards { grid-template-columns: repeat(3, minmax(0, 1fr)); width: min(1056px, 100%); margin: 40px auto 0; }
.pw-ssafe__foot { width: min(460px, 100%); margin: 32px auto 0; font-size: 20px; line-height: 36px; text-align: center; color: var(--pw-color-primary); }

/* ---- 5. Home Trimming ---- */
.pw-shome { padding: 67px var(--pw-gutter); background: var(--pw-color-bg); }
.pw-shome__heading { width: min(583px, 100%); margin-inline: auto; }
.pw-shome__box { width: min(920px, 100%); margin: 25px auto 0; padding: 24px 40px; }
.pw-shome__ttl { font-size: 20px; font-weight: 500; line-height: 36px; text-align: center; color: var(--pw-color-primary); }
.pw-shome__arrow { display: block; width: auto; height: 32px; margin: 16px auto 0; }
.pw-shome__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; margin-top: 16px; }
.pw-shome__price { margin-top: 24px; padding: 16px 32px; background: var(--pw-color-bg-yellowgreen); border-radius: 8px; }
.pw-shome__price-head { display: flex; justify-content: center; align-items: center; gap: 8px; font-size: 18px; line-height: 32px; color: var(--pw-color-primary); }
.pw-shome__price-head img { width: 40px; height: 40px; }
.pw-shome__price-main { margin-top: 8px; font-size: 18px; line-height: 32px; text-align: center; }
.pw-shome__price-note { margin-top: 8px; font-size: 12px; line-height: 22px; text-align: center; }

/* ---- 6. Case Studies ---- */
.pw-scase { padding: 88px var(--pw-gutter); background: var(--pw-color-bg-green50); }
.pw-scase__heading { width: min(534px, 100%); margin-inline: auto; }
.pw-scase__list { display: flex; flex-direction: column; gap: 24px; width: min(1104px, 100%); margin: 32px auto 0; }
.pw-scase__card { display: flex; align-items: flex-start; gap: 24px; padding: 32px; background: var(--pw-color-white); }
.pw-scase__photo { position: relative; flex: none; width: 487px; aspect-ratio: 487 / 381; overflow: hidden; background: var(--pw-color-placeholder); }
.pw-scase__photo img { position: absolute; left: -12.1%; top: -3.3%; width: 115.6%; height: 196.9%; max-width: none; object-fit: cover; }   /* 画像枠 563×750（x-59 y-12.5） */
.pw-scase__body { flex: 1 1 0; min-width: 0; padding: 0 16px 16px; }
.pw-scase__tag { display: flex; line-height: 20px; }
.pw-scase__tag span { padding: 2px 8px; font-size: 14px; line-height: 20px; color: var(--pw-color-white); background: var(--pw-color-primary); }
.pw-scase__name { margin-top: 8px; font-size: 18px; font-weight: 500; line-height: 32px; color: var(--pw-color-primary); }
.pw-scase__text { margin-top: 4px; font-size: 16px; line-height: 29px; }
.pw-scase__btn { margin: 32px auto 0; }
.pw-scase .pw-btn { display: flex; width: fit-content; min-width: 238px; }   /* Figma 238。文字を中央に置くと矢印に重なるので文字に合わせて広げる（284・2026-10-02） */

/* ==========================================================================
   タブレット（768〜1024px）
   ========================================================================== */
@media (min-width: 768px) and (max-width: 1024px) {
	.pw-swho__illust { left: auto; right: -80px; }
	.pw-smed__photo { width: 40%; }
	.pw-ssafe__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pw-scase__photo { width: 45%; }
}

/* ==========================================================================
   SP（767px 以下）
   ========================================================================== */
@media (max-width: 767px) {
	/* 1 */
	.pw-swho__hero { aspect-ratio: 375 / 420; }
	.pw-swho__hero img { left: -43.5%; top: -7.1%; width: 183.7%; height: 109.3%; }   /* 画像枠 689×459（x-163 y-30） */
	.pw-swho__inner { width: 100%; padding: 40px 0 88px; }
	.pw-swho__cards { grid-template-columns: minmax(0, 1fr); gap: 16px; width: min(343px, 100% - 32px); margin: 40px auto 0; }
	.pw-swho__card { padding: 8px 16px; }
	.pw-swho__arrow { margin-top: 24px; }
	.pw-swho__message { width: min(335px, 100% - 40px); margin-top: 40px; font-size: 16px; line-height: 29px; }
	.pw-swho__line2 { align-items: flex-start; height: 51px; margin-top: 0; }   /* SP は1行（16px）。マーカーの下の余白ぶんで 51 */
	.pw-swho__line2 > span { width: auto; }   /* Figma SP は PC の箱幅（220）のままで文字の後ろに 60px 空く。SP は文字幅に合わせる（2026-10-01 指摘「変な空白」） */
	.pw-swho__line3 { margin-top: 0; }
	.pw-swho__illust { left: calc(78px - (100vw - min(335px, 100vw - 40px)) / 2); top: 0; width: 375px; height: 194px; }

	/* 2 */
	.pw-saccept { padding: 56px 12px; }
	.pw-saccept__heading { width: min(343px, 100%); }
	.pw-saccept__box { margin-top: 32px; padding: 32px 16px; }
	.pw-saccept__list { display: flex; flex-direction: column; gap: 8px; }
	.pw-saccept__list li { grid-area: auto; margin-top: 0; }
	.pw-saccept__item--1 { order: 1; } .pw-saccept__item--2 { order: 2; } .pw-saccept__item--3 { order: 3; } .pw-saccept__item--4 { order: 4; } .pw-saccept__item--5 { order: 5; }
	.pw-saccept__note { margin-top: 44px; }
	.pw-saccept__note .pw-note__head { gap: 24px; }

	/* 3 */
	.pw-smed { padding: 56px 20px; }
	.pw-smed__heading { width: 100%; }
	.pw-smed__main { flex-direction: column; gap: 16px; }
	.pw-smed__photo { width: 100%; aspect-ratio: 335 / 268; }
	.pw-smed__list { gap: 8px; }
	.pw-smed__note .pw-note__head { gap: 24px; }

	/* 4 */
	.pw-ssafe { padding: 56px 20px; }
	.pw-ssafe__heading { width: 100%; }
	.pw-ssafe__cards { grid-template-columns: minmax(0, 1fr); gap: 20px; margin-top: 54px; }
	.pw-ssafe__foot { margin-top: 24px; font-size: 16px; line-height: 29px; }

	/* 5 */
	.pw-shome { padding: 56px 12px; }
	.pw-shome__heading { width: min(335px, 100%); }
	.pw-shome__box { margin-top: 32px; padding: 24px 16px; }
	.pw-shome__list { grid-template-columns: minmax(0, 1fr); gap: 8px; }
	.pw-shome__price { padding: 16px; }
	.pw-shome__price-head { justify-content: flex-start; }   /* SP は本文と同じ左揃え（Figma SP は見出しだけ中央だが、揃って見えない＝2026-10-02 大浦さん指摘・A 案） */
	.pw-shome__price-main { text-align: left; }
	.pw-shome__price-note { text-align: left; }

	/* 6 */
	.pw-scase { padding: 56px 12px; }
	.pw-scase__heading { width: min(335px, 100%); }
	.pw-scase__lead { align-self: stretch; text-align: left; }
	.pw-scase__card { flex-direction: column; gap: 24px; padding: 32px 16px; }
	.pw-scase__photo { width: calc(100% - 8px); margin-inline: 4px; }
	.pw-scase__photo { width: 100%; aspect-ratio: 311 / 381; }
	.pw-scase__photo img { left: -17.9%; top: -3.3%; width: 183.4%; height: 196.9%; }   /* 画像枠 570×750（x-55.7 y-12.5） */
	.pw-scase__body { padding: 0 16px 0; }
}