@charset "utf-8";
/* ========================================================
	numbers.css => 数字で見る家族葬のタクセル (/service/numbers.php)
	- すべて .numbers_page の中だけに効かせる
	- 数字の色：ヒーローの累計件数だけ主色オレンジ、ほかは茶色（CTAと競合させない）
======================================================== */
.numbers_page {
    --num-orange: #E55927;
    --num-gold: #F5B400;
    --num-green: #67A954;
    --num-teal: #4EACA4;
    --num-teal-dark: #36847E;
    --num-brown: #7B5643;
    --num-beige: #F6F1EA;
    --num-cream: #FBF8F5;
    --num-text: #333;
    --num-line: #D4D4D4;
    --num-line-light: #E5E5E5;
    --num-link: #2673c3; /* テキストリンク (本体共通 .sec_more_link と同じ青) */
    --num-shadow: 0 5px 18px rgba(51, 51, 51, .06);
    color: var(--num-text);
    font-size: 16px;
    line-height: 1.85;
    letter-spacing: .035em;
}
.numbers_page *,
.numbers_page *::before,
.numbers_page *::after { box-sizing: border-box; }
.numbers_page :focus-visible { outline: 3px solid var(--num-teal-dark); outline-offset: 3px; }
.numbers_wrap { width: min(1120px, calc(100% - 48px)); margin: 0 auto; }
.numbers_tnum { font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }

/* 色 */
.numbers_c_brown { background: var(--num-brown); }
.numbers_c_teal { background: var(--num-teal); }
.numbers_c_gold { background: var(--num-gold); }
.numbers_c_green { background: var(--num-green); }
.numbers_c_line { background: var(--num-line); }
.numbers_s_brown { stroke: var(--num-brown); }
.numbers_s_teal { stroke: var(--num-teal); }
.numbers_s_gold { stroke: var(--num-gold); }
.numbers_s_green { stroke: var(--num-green); }
.numbers_s_line { stroke: var(--num-line); }

/* ヒーロー
============================================================ */
.numbers_hero { position: relative; padding: 0 0 80px; background: var(--num-cream); overflow: hidden; }
.numbers_hero .numbers_wrap { position: relative; z-index: 1; }
.numbers_hero_grid { display: grid; grid-template-columns: minmax(0, .88fr) minmax(520px, 1.12fr); gap: 56px; align-items: center; padding-top: 46px; }
.numbers_hero_title { margin: 0 0 24px; font-size: clamp(34px, 4vw, 48px); font-weight: 700; line-height: 1.45; letter-spacing: .075em; }
.numbers_hero_lead { max-width: 32em; margin: 0; line-height: 2; }
.numbers_hero_fig { padding: 38px 42px; border: 1px solid var(--num-line-light); border-radius: 12px; background: #fff; box-shadow: 0 8px 26px rgba(51, 51, 51, .08); }
.numbers_hero_fig_cap { margin: 0 0 12px; font-size: 15px; font-weight: 500; }
.numbers_hero_fig_value { display: flex; align-items: flex-end; margin: 0; color: var(--num-orange); font-size: clamp(70px, 7vw, 96px); font-weight: 300; line-height: .95; letter-spacing: -.035em; white-space: nowrap; }
.numbers_hero_fig_value .numbers_unit { margin: 0 0 9px 10px; color: var(--num-text); font-size: 20px; font-weight: 500; letter-spacing: .03em; }

/* セクション共通
============================================================ */
.numbers_sec { padding: 92px 0; background: #fff; }
.numbers_sec_cream { background: var(--num-cream); }
.numbers_sec_beige { background: var(--num-beige); }
.numbers_sec_title { margin: 0 0 14px; font-size: clamp(25px, 3vw, 34px); font-weight: 700; line-height: 1.5; letter-spacing: .055em; }
.numbers_sec_intro { max-width: 42em; margin: 0 0 44px; line-height: 1.95; }
.numbers_note { margin: 22px 0 0; color: var(--num-brown); font-size: 12px; line-height: 1.8; }
/* テキストリンクは本体共通 (.sec_more_link) と同じ：青＋下線、ホバーで下線が消える */
.numbers_page .numbers_note a,
.numbers_page .numbers_more,
.numbers_page .numbers_mix_name a,
.numbers_page .numbers_quote cite a { color: var(--num-link); text-decoration: underline; text-underline-offset: 3px; transition: opacity .2s, text-decoration-color .2s; }
.numbers_page .numbers_note a:hover,
.numbers_page .numbers_more:hover,
.numbers_page .numbers_mix_name a:hover,
.numbers_page .numbers_quote cite a:hover { color: var(--num-link); opacity: .85; text-decoration-color: transparent; }
.numbers_more { position: relative; display: inline-flex; align-items: center; min-height: 44px; margin-top: 20px; padding-right: 25px; font-size: 14px; font-weight: 700; }
.numbers_more::after { position: absolute; right: 4px; width: 8px; height: 8px; border-top: 2px solid var(--num-link); border-right: 2px solid var(--num-link); content: ""; transform: rotate(45deg); }

/* カードと数値
============================================================ */
.numbers_facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.numbers_facts_two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.numbers_fact { min-width: 0; padding: 32px; border: 1px solid var(--num-line-light); border-radius: 12px; background: #fff; box-shadow: var(--num-shadow); }
.numbers_fact_title { margin: 0 0 14px; font-size: 15px; font-weight: 500; line-height: 1.65; }
.numbers_fact_value { display: flex; align-items: flex-end; margin: 0; color: var(--num-brown); font-size: clamp(46px, 5.2vw, 64px); font-weight: 300; line-height: 1; letter-spacing: -.025em; white-space: nowrap; }
.numbers_fact_value .numbers_unit { margin: 0 0 6px 6px; color: var(--num-text); font-size: 16px; font-weight: 500; letter-spacing: .03em; }
.numbers_fact_value .numbers_pre { margin: 0 5px 7px 0; color: var(--num-text); font-size: 17px; font-weight: 500; letter-spacing: .03em; }
.numbers_fact_desc { margin: 18px 0 0; font-size: 14px; line-height: 1.85; }
.numbers_fact_sub { margin-top: 28px; padding-top: 28px; border-top: 1px dashed var(--num-line); }

/* 葬儀の形の割合
============================================================ */
.numbers_mix { padding: 34px; border: 1px solid var(--num-line-light); border-radius: 12px; background: #fff; box-shadow: var(--num-shadow); }
.numbers_mix_bar { display: flex; height: 24px; margin: 0; border: 3px solid #fff; border-radius: 999px; background: var(--num-line-light); box-shadow: 0 0 0 1px var(--num-line-light); overflow: hidden; }
.numbers_mix_bar span { display: block; height: 100%; }
.numbers_mix_bar span + span { border-left: 3px solid #fff; }
.numbers_mix_list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 28px 0 0; padding: 0; list-style: none; }
.numbers_mix_list li { min-width: 0; padding: 0 26px; }
.numbers_mix_list li:first-child { padding-left: 0; }
.numbers_mix_list li:last-child { padding-right: 0; }
.numbers_mix_list li + li { border-left: 1px solid var(--num-line-light); }
.numbers_mix_name { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 16px; font-weight: 700; }
.numbers_swatch { display: inline-block; width: 12px; height: 12px; border-radius: 50%; flex: none; }
.numbers_mix_pct { margin: 10px 0 0; color: var(--num-brown); font-size: 56px; font-weight: 300; line-height: 1.1; letter-spacing: -.025em; }
.numbers_mix_pct small { margin-left: 4px; color: var(--num-text); font-size: 18px; font-weight: 500; }
.numbers_mix_desc { margin: 7px 0 0; font-size: 13px; line-height: 1.75; }

/* 棒グラフ
============================================================ */
.numbers_bars { margin: 0; padding: 0; list-style: none; }
.numbers_bars li { display: grid; grid-template-columns: 4.5em minmax(0, 1fr) 3em; gap: 12px; align-items: center; padding: 8px 0; }
.numbers_bars_label { font-size: 14px; font-weight: 500; }
.numbers_bars_track { height: 15px; border-radius: 999px; background: var(--num-cream); overflow: hidden; }
.numbers_bars_fill { display: block; height: 100%; min-width: 4px; border-radius: 999px; background: var(--num-brown); }
.numbers_bars_num { text-align: right; font-size: 14px; font-weight: 700; }
.numbers_bars_num_small { font-size: 12px; white-space: nowrap; }
.numbers_bars_stack { display: flex; background: none; }
.numbers_bars_seg { display: block; height: 100%; }
.numbers_bars_seg + .numbers_bars_seg { border-left: 2px solid #fff; }
.numbers_bars_rel { margin-top: 2px; }
.numbers_bars_rel li { grid-template-columns: 5.7em minmax(0, 1fr) 3em; padding: 6px 0; }
.numbers_bars_rel .numbers_bars_track { background: var(--num-line-light); }

/* 施設数
============================================================ */
.numbers_halls { display: grid; grid-template-columns: minmax(300px, .75fr) minmax(0, 1.25fr); gap: 24px; }
.numbers_halls > div { min-width: 0; padding: 36px; border: 1px solid var(--num-line-light); border-radius: 12px; background: #fff; box-shadow: var(--num-shadow); }
.numbers_halls_total { display: flex; align-items: flex-end; margin: 0; color: var(--num-brown); font-size: clamp(76px, 8vw, 104px); font-weight: 300; line-height: .95; letter-spacing: -.035em; white-space: nowrap; }
.numbers_halls_total .numbers_unit { margin: 0 0 9px 8px; color: var(--num-text); font-size: 19px; font-weight: 500; letter-spacing: .03em; }
.numbers_halls_kinds { display: flex; flex-wrap: wrap; gap: 10px 18px; margin: 24px 0 0; padding: 18px 0 0; border-top: 1px solid var(--num-line-light); font-size: 13px; list-style: none; }
.numbers_halls_kinds li { display: flex; align-items: center; gap: 7px; }
.numbers_halls_kinds b { font-size: 19px; font-weight: 700; }
.numbers_halls_kinds .numbers_swatch { width: 10px; height: 10px; }

/* 参列人数
============================================================ */
.numbers_people { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 20px; align-items: stretch; }
.numbers_people .numbers_fact { display: flex; flex-direction: column; justify-content: center; }
.numbers_donut { margin: 0; padding: 28px 32px; border: 1px solid var(--num-line-light); border-radius: 12px; background: #fff; box-shadow: var(--num-shadow); }
.numbers_donut figcaption { margin: 0 0 16px; font-size: 15px; font-weight: 500; }
.numbers_donut_row { display: flex; align-items: center; justify-content: center; gap: 34px; }
.numbers_donut_svg { width: 200px; height: 200px; flex: none; }
.numbers_donut_seg { fill: none; stroke-width: 30; stroke-dasharray: var(--d); }
.numbers_donut_key { fill: var(--num-brown); font-size: 12px; }
.numbers_donut_value { fill: var(--num-brown); font-size: 26px; font-weight: 700; }
.numbers_donut_legend { flex: 1; min-width: 180px; margin: 0; padding: 0; list-style: none; }
.numbers_donut_legend li { display: grid; grid-template-columns: 12px 1fr auto; gap: 10px; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--num-line-light); font-size: 13px; }
.numbers_donut_legend_pct { font-weight: 700; }

/* 事前相談
============================================================ */
.numbers_consult { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.numbers_ways { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; padding: 0; list-style: none; }
.numbers_ways li { padding: 5px 13px; border: 1px solid var(--num-line); border-radius: 999px; background: var(--num-cream); font-size: 12px; }

/* ご家族の声
============================================================ */
.numbers_voice { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .92fr); gap: 36px; align-items: center; }
.numbers_voice .numbers_facts { gap: 14px; }
.numbers_voice .numbers_fact { padding: 25px; }
.numbers_voice .numbers_fact_title { min-height: 3.5em; }
.numbers_voice .numbers_fact_value { font-size: clamp(34px, 3.4vw, 46px); }
.numbers_voice .numbers_sec_intro { margin-bottom: 0; }
.numbers_quote { position: relative; margin: 0; padding: 26px 28px 24px; border: 1px solid var(--num-line-light); border-radius: 12px; background: #fff; font-size: 14px; line-height: 1.95; box-shadow: var(--num-shadow); }
.numbers_quote::before { position: absolute; top: -4px; left: 16px; color: var(--num-beige); font-size: 64px; font-weight: 700; line-height: 1; content: "\201C"; }
.numbers_quote p { position: relative; margin: 0; }
.numbers_quote + .numbers_quote { margin-top: 14px; }
.numbers_quote cite { display: block; margin-top: 9px; color: var(--num-brown); font-size: 12px; font-style: normal; text-align: right; }

/* 集計について
============================================================ */
.numbers_method dl { display: grid; grid-template-columns: 11em minmax(0, 1fr); margin: 0; padding: 8px 34px; border: 1px solid var(--num-line-light); border-radius: 12px; background: #fff; font-size: 14px; box-shadow: 0 5px 18px rgba(51, 51, 51, .05); }
.numbers_method dt,
.numbers_method dd { margin: 0; padding: 17px 0; border-bottom: 1px solid var(--num-line-light); }
.numbers_method dt { font-weight: 700; }
.numbers_method dt:last-of-type,
.numbers_method dd:last-of-type { border-bottom: 0; }

/* スクロール演出（numbers.js が html に .numbers_anim を付けたときだけ）
============================================================ */
.numbers_anim .numbers_mix_bar { clip-path: inset(0 100% 0 0); transition: clip-path 1.2s cubic-bezier(.22, .8, .3, 1); }
.numbers_anim .is-in .numbers_mix_bar { clip-path: inset(0); }
.numbers_anim .numbers_bars_fill { transform: scaleX(0); transform-origin: left; transition: transform 1.05s cubic-bezier(.22, .8, .3, 1); }
.numbers_anim .is-in .numbers_bars_fill { transform: scaleX(1); }
.numbers_anim .numbers_donut_seg { stroke-dasharray: 0 440; transition: stroke-dasharray 1s cubic-bezier(.22, .8, .3, 1); }
.numbers_anim .is-in .numbers_donut_seg { stroke-dasharray: var(--d); }
.numbers_anim .is-in .numbers_donut_seg:nth-child(2) { transition-delay: .12s; }
.numbers_anim .is-in .numbers_donut_seg:nth-child(3) { transition-delay: .24s; }
.numbers_anim .is-in .numbers_donut_seg:nth-child(4) { transition-delay: .36s; }
.numbers_anim .is-in .numbers_donut_seg:nth-child(5) { transition-delay: .48s; }
.numbers_anim .numbers_bars li:nth-child(2) .numbers_bars_fill { transition-delay: .05s; }
.numbers_anim .numbers_bars li:nth-child(3) .numbers_bars_fill { transition-delay: .1s; }
.numbers_anim .numbers_bars li:nth-child(4) .numbers_bars_fill { transition-delay: .15s; }
.numbers_anim .numbers_bars li:nth-child(5) .numbers_bars_fill { transition-delay: .2s; }
.numbers_anim .numbers_bars li:nth-child(6) .numbers_bars_fill { transition-delay: .25s; }
.numbers_anim .numbers_bars li:nth-child(7) .numbers_bars_fill { transition-delay: .3s; }

/* SP
============================================================ */
@media (max-width: 820px) {
    .numbers_page { font-size: 15px; line-height: 1.8; }
    .numbers_wrap { width: min(100% - 32px, 1120px); }
    .numbers_hero { padding-bottom: 58px; }
    .numbers_hero_grid { grid-template-columns: 1fr; gap: 30px; padding-top: 25px; }
    .numbers_hero_title { margin-bottom: 17px; font-size: 30px; }
    .numbers_hero_lead { font-size: 14px; line-height: 1.9; }
    .numbers_hero_fig { padding: 25px 22px; border-radius: 10px; }
    .numbers_hero_fig_cap { font-size: 13px; }
    .numbers_hero_fig_value { font-size: clamp(53px, 18vw, 76px); }
    .numbers_hero_fig_value .numbers_unit { margin: 0 0 7px 7px; font-size: 15px; }
    .numbers_sec { padding: 62px 0; }
    .numbers_sec_title { margin-bottom: 10px; font-size: 25px; }
    .numbers_sec_intro { margin-bottom: 30px; font-size: 14px; }
    .numbers_facts,
    .numbers_facts_two,
    .numbers_consult { grid-template-columns: 1fr; gap: 14px; }
    .numbers_fact { padding: 25px 22px; border-radius: 10px; }
    .numbers_fact_value { font-size: 52px; }
    .numbers_fact_desc { font-size: 13px; }
    .numbers_fact_sub { margin-top: 24px; padding-top: 24px; }
    .numbers_mix { padding: 25px 22px; }
    .numbers_mix_bar { height: 21px; }
    .numbers_mix_list { grid-template-columns: 1fr; margin-top: 22px; }
    .numbers_mix_list li,
    .numbers_mix_list li:first-child,
    .numbers_mix_list li:last-child { padding: 18px 0; }
    .numbers_mix_list li + li { border-top: 1px solid var(--num-line-light); border-left: 0; }
    .numbers_mix_pct { font-size: 48px; }
    .numbers_halls { grid-template-columns: 1fr; gap: 14px; }
    .numbers_halls > div { padding: 26px 22px; }
    .numbers_halls_total { font-size: 80px; }
    .numbers_people { grid-template-columns: 1fr; gap: 14px; }
    .numbers_donut { padding: 24px 20px; }
    .numbers_donut_row { gap: 20px; }
    .numbers_donut_svg { width: 180px; height: 180px; }
    .numbers_voice { grid-template-columns: 1fr; gap: 26px; }
    .numbers_voice .numbers_facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .numbers_voice .numbers_fact { padding: 22px 18px; }
    .numbers_voice .numbers_fact_title { min-height: 0; }
    .numbers_quote { padding: 23px 20px; font-size: 13px; }
    .numbers_method dl { grid-template-columns: 1fr; padding: 8px 22px; }
    .numbers_method dt { padding: 14px 0 0; border-bottom: 0; }
    .numbers_method dd { padding: 4px 0 14px; }
}
@media (max-width: 520px) {
    .numbers_donut_row { flex-direction: column; }
    .numbers_donut_legend { width: 100%; min-width: 0; }
    .numbers_voice .numbers_facts { grid-template-columns: 1fr; }
    .numbers_bars li { grid-template-columns: 3.7em minmax(0, 1fr) 2.5em; gap: 8px; }
    .numbers_bars_rel li { grid-template-columns: 5em minmax(0, 1fr) 2.5em; }
}
@media (max-width: 360px) {
    .numbers_wrap { width: calc(100% - 24px); }
    .numbers_hero_fig { padding: 23px 17px; }
    .numbers_hero_fig_value { font-size: 51px; }
    .numbers_hero_fig_value .numbers_unit { font-size: 14px; }
    .numbers_fact { padding: 23px 17px; }
    .numbers_fact_value { font-size: 46px; }
    .numbers_mix,
    .numbers_halls > div { padding: 23px 17px; }
    .numbers_halls_total { font-size: 70px; }
}
@media (prefers-reduced-motion: reduce) {
    .numbers_anim .numbers_mix_bar { clip-path: none; }
    .numbers_anim .numbers_bars_fill { transform: none; }
    .numbers_anim .numbers_donut_seg { stroke-dasharray: var(--d); }
}

/* ========================================================
   2026-10 サイト全体のトンマナに合わせる（「初めての方へ」など本体ページと同じ見せ方）
   - 見出し：中央ぞろえ・PC 40px／SP 26px（本体の各セクション見出しと同じ）
   - 見出し下のリード：中央ぞろえ
   - セクションの境目：本体と同じ「波」の画像（bg_wave_top_*）を、前後の背景色の組み合わせで出し分け
   - お問い合わせの上の波：直前が薄いベージュ（#FBF8F5）なので、その色から始まる波（7番）に変更
======================================================== */
.numbers_sec_title {
    margin-bottom: 20px;
    font-size: 40px;
    line-height: 1.45;
    letter-spacing: .04em;
    text-align: center;
}
.numbers_sec_intro {
    max-width: 46em;
    margin-right: auto;
    margin-left: auto;
}

/* 「ご家族の声」は左に見出し・右に声の2列のため、見出しとリードは左ぞろえのまま（PC） */
.numbers_voice .numbers_sec_title,
.numbers_voice .numbers_sec_intro { text-align: left; }

/* 波（PC：高さ160px／SP：60px）。前のセクションの色 → このセクションの色 */
.numbers_sec { position: relative; padding-top: 170px; }
.numbers_sec::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 160px;
    background: var(--num-wave-pc) center top / 100% 100% no-repeat;
    content: "";
    pointer-events: none;
}
.numbers_sec > .numbers_wrap { position: relative; z-index: 1; }
/* 薄いベージュ（ヒーロー・cream）→ 白 */
.numbers_hero + .numbers_sec,
.numbers_sec_cream + .numbers_sec:not(.numbers_sec_cream):not(.numbers_sec_beige) {
    --num-wave-pc: url("../images/module/bg_wave_top_10_pc.webp");
    --num-wave-sp: url("../images/module/bg_wave_top_10_sp.webp");
}
/* 白 → 薄いベージュ（cream） */
.numbers_sec:not(.numbers_sec_cream):not(.numbers_sec_beige) + .numbers_sec_cream {
    --num-wave-pc: url("../images/module/bg_wave_top_3_pc.webp");
    --num-wave-sp: url("../images/module/bg_wave_top_3_sp.webp");
}
/* 白 → ベージュ（beige） */
.numbers_sec:not(.numbers_sec_cream):not(.numbers_sec_beige) + .numbers_sec_beige {
    --num-wave-pc: url("../images/module/bg_wave_top_12_pc.webp");
    --num-wave-sp: url("../images/module/bg_wave_top_12_sp.webp");
}
/* 薄いベージュ → ベージュ */
.numbers_sec_cream + .numbers_sec_beige {
    --num-wave-pc: url("../images/module/bg_wave_top_4_pc.webp");
    --num-wave-sp: url("../images/module/bg_wave_top_4_sp.webp");
}
/* ベージュ → 白 */
.numbers_sec_beige + .numbers_sec:not(.numbers_sec_cream):not(.numbers_sec_beige) {
    --num-wave-pc: url("../images/module/bg_wave_top_5_pc.webp");
    --num-wave-sp: url("../images/module/bg_wave_top_5_sp.webp");
}
/* ベージュ → 薄いベージュ */
.numbers_sec_beige + .numbers_sec_cream {
    --num-wave-pc: url("../images/module/bg_wave_top_9_pc.webp");
    --num-wave-sp: url("../images/module/bg_wave_top_9_sp.webp");
}
/* お問い合わせの上の波：薄いベージュ → ピンク */
.numbers_page [style*="--contact-wave-pc"] {
    --contact-wave-pc: url("../images/module/bg_wave_top_7_pc.webp") !important;
    --contact-wave-sp: url("../images/module/bg_wave_top_7_sp.webp") !important;
}

/* 大きな数字を少し太く（2026-10-27 オーナー指示で 500）。詰まりすぎないよう字間も調整 */
.numbers_hero_fig_value,
.numbers_fact_value,
.numbers_mix_pct,
.numbers_halls_total {
    font-weight: 500;
    letter-spacing: -.01em;
}

/* 「〜を見る」などのリンク（.numbers_more）をボタンに（2026-10-27）
   本体の「費用・プランはこちら」ボタン（service.css .features_sec_item_btn_link）と同じ形：角丸6px・影・太字
   基本は白いボタン。ベージュの帯（.numbers_more_wrap）の上に置いて目立たせる
   「費用・プランはこちら」（.numbers_more_main）だけオレンジの塗り・白文字（2026-10-27 案B） */
.numbers_page .numbers_more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    max-width: 380px;
    min-height: 0;
    margin-top: 24px;
    padding: 18px 24px;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .2), inset 0 1px 4px rgba(255, 255, 255, .15), inset 0 -2px 4px rgba(0, 0, 0, .1);
    color: var(--num-text);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;
    transition: opacity .2s;
}
.numbers_page .numbers_more:hover {
    color: var(--num-text);
    opacity: .7;
    text-decoration: none;
}
.numbers_page .numbers_more::after {
    position: static;
    flex: none;
    width: 8px;
    height: 8px;
    border-top: 2px solid var(--num-orange);
    border-right: 2px solid var(--num-orange);
    transform: rotate(45deg);
}
.numbers_page .numbers_more_main,
.numbers_page .numbers_more_main:hover { background: var(--num-orange); color: #fff; }
.numbers_page .numbers_more_main::after { border-color: #fff; }

/* ボタンの置き場。セクションに単独で置くもの（「費用・プランはこちら」）は帯なし・中央 */
.numbers_more_wrap {
    margin: 28px 0 0;
    text-align: center;
}
.numbers_more_wrap .numbers_more { margin-top: 0; }
/* カードの中では、カードの下端いっぱいのベージュの帯にする（本体の「アクセス情報を詳しく見る」と同じ見せ方。高さがそろったカードでも帯は下端に） */
.numbers_fact,
.numbers_halls > div { --card-py: 32px; --card-px: 32px; }
.numbers_halls > div { --card-py: 36px; --card-px: 36px; }
.numbers_fact:has(> .numbers_more_wrap),
.numbers_halls > div:has(> .numbers_more_wrap) { display: flex; flex-direction: column; }
.numbers_fact > .numbers_more_wrap,
.numbers_halls > div > .numbers_more_wrap {
    margin: 0 calc(var(--card-px) * -1) calc(var(--card-py) * -1); /* ボタンは本文のすぐ下（下端にはそろえない）2026-10-27 */
    padding: 0 var(--card-px) 24px; /* 帯の背景をなくしたため、ボタンの上の余白はなし（2026-10-27） */
    border-radius: 0 0 11px 11px;
}
.numbers_fact > :nth-last-child(2),
.numbers_halls > div > :nth-last-child(2) { margin-bottom: 28px; }
/* 「ご家族の声」は左ぞろえ（PC） */
.numbers_voice .numbers_more_wrap { text-align: left; }

@media (max-width: 820px) {
    .numbers_fact { --card-py: 25px; --card-px: 22px; }
    .numbers_halls > div { --card-py: 26px; --card-px: 22px; }
    .numbers_fact > .numbers_more_wrap,
    .numbers_halls > div > .numbers_more_wrap { padding-top: 0; padding-bottom: 20px; border-radius: 0 0 9px 9px; }
    .numbers_voice .numbers_more_wrap { text-align: center; }
    .numbers_page .numbers_more {
        max-width: none;
        padding: 16px 20px;
        font-size: 16px;
    }
    .numbers_sec { padding-top: 92px; }
    .numbers_sec::before {
        height: 60px;
        background-image: var(--num-wave-sp);
    }
    .numbers_sec_title {
        margin-bottom: 14px;
        font-size: 26px;
    }
    /* SPは1列になるので「ご家族の声」も中央ぞろえ */
    .numbers_voice .numbers_sec_title,
    .numbers_voice .numbers_sec_intro { text-align: center; }
}
@media (max-width: 360px) {
    .numbers_fact,
    .numbers_halls > div { --card-py: 23px; --card-px: 17px; }
}

/* 文字サイズ（2026-10-27。本体 /price/ichinichisou.php を参考に、注釈以外をひと回り大きく）
   リード PC20／SP17、カードの見出し PC24／SP20、本文・グラフの文字 PC18／SP16、注釈 PC16／SP15 */
.numbers_hero_lead,
.numbers_sec_intro { font-size: 20px; }
.numbers_hero_fig_cap,
.numbers_donut figcaption { font-size: 20px; }
.numbers_fact_title { font-size: 24px; line-height: 1.6; }
.numbers_fact_desc,
.numbers_quote,
.numbers_method dl { font-size: 18px; }
.numbers_mix_desc,
.numbers_bars_label,
.numbers_bars_num,
.numbers_halls_kinds,
.numbers_donut_legend li { font-size: 18px; }
.numbers_mix_desc { line-height: 1.8; }
/* グラフの行は文字に合わせて列幅（em）も広がるよう、行の文字サイズを指定（「キリスト教」「1%未満」が折り返さない幅） */
.numbers_bars li { font-size: 18px; }
.numbers_bars_rel li { grid-template-columns: 5.7em minmax(0, 1fr) 3.6em; }
.numbers_note { color: var(--num-text); font-size: 16px; } /* 注釈（※）は本文と同じ文字色に */
.numbers_ways li,
.numbers_quote cite,
.numbers_bars_num_small { font-size: 16px; }

@media (max-width: 820px) {
    .numbers_hero_lead,
    .numbers_sec_intro,
    .numbers_hero_fig_cap,
    .numbers_donut figcaption { font-size: 17px; }
    .numbers_fact_title { font-size: 20px; }
    .numbers_fact_desc,
    .numbers_quote,
    .numbers_method dl,
    .numbers_mix_desc { font-size: 16px; }
    .numbers_note { font-size: 15px; }
    .numbers_bars_label,
    .numbers_bars_num,
    .numbers_halls_kinds,
    .numbers_donut_legend li { font-size: 16px; }
    .numbers_bars li { font-size: 16px; }
    .numbers_bars_rel li { grid-template-columns: 5em minmax(0, 1fr) 3.4em; }
    .numbers_ways li,
    .numbers_quote cite,
    .numbers_bars_num_small { font-size: 14px; }
}

/* 構成比（どんなご葬儀が選ばれているか）：グラフは枠なしで太く、下にプランごとのカード（2026-10-27 案A2）
   カードはほかのセクションと同じ部品（.numbers_fact＋ボタン） */
.numbers_mix_graph .numbers_mix_bar { height: 44px; }
.numbers_mix_cards { margin-top: 24px; }
.numbers_mix_title { display: flex; align-items: center; gap: 10px; }

@media (max-width: 820px) {
    .numbers_mix_graph .numbers_mix_bar { height: 32px; }
}

/* ご相談の方法（ホールで対面など）：丸い枠のタグ → 小見出し＋チェック付きの一覧（2026-10-27 案1）
   タグだと押せるボタンに見えるため。見出しの「（累計）」は途中で改行しない */
.numbers_nowrap { white-space: nowrap; }
.numbers_ways_box { margin: 22px 0 0; } /* 旧 .numbers_ways（タグの見た目）は使わない */
.numbers_ways_head { margin: 0 0 10px; font-size: 16px; font-weight: 700; }
.numbers_ways_list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; margin: 0; padding: 0; list-style: none; }
.numbers_ways_list li { position: relative; padding-left: 26px; font-size: 18px; }
.numbers_ways_list li::before { position: absolute; top: .45em; left: 4px; width: 12px; height: 7px; border-bottom: 2px solid var(--num-orange); border-left: 2px solid var(--num-orange); content: ""; transform: rotate(-45deg); }

@media (max-width: 820px) {
    .numbers_ways_list li { font-size: 16px; }
}
