/* お支払い方法・送料専用。共通ガイドのデザインを維持。 */
.payment-page .sheet-breadcrumb { flex-wrap: wrap; }
.payment-page .sheet-hero h1 { font-size: clamp(32px,4vw,52px); }
.payment-page .data-toc { flex-wrap: wrap; }
.payment-summary { display:grid; grid-template-columns:1fr 1fr 1.4fr; gap:16px; padding:0; margin:28px 0; list-style:none; }
.payment-summary li { min-width:0; }
.payment-summary a { display:block; height:100%; padding:20px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.payment-summary li:last-child a { background:var(--blue-soft); border-color:var(--blue); }
.payment-summary strong { display:block; color:var(--blue-deep); font-size:18px; line-height:1.65; }
.payment-summary span { display:block; margin-top:8px; color:var(--muted); font-size:14px; line-height:1.8; }
.payment-summary small { font-size:13px; color:var(--blue-deep); }
.payment-summary a:hover { border-color:var(--blue); }
.payment-bank-notice { margin:0 0 24px; padding:20px 24px; border-left:4px solid var(--blue); border-radius:8px; background:var(--blue-soft); }
.payment-bank-notice strong { color:var(--blue-deep); font-size:17px; line-height:1.8; }
.payment-bank-notice p { margin-top:6px; font-size:15px; }
.payment-fee-total { margin-top:12px; color:var(--muted); font-size:14px; line-height:1.9; }
.payment-account dd.payment-account-number { white-space:nowrap; }
@media(max-width:800px) { .payment-summary { grid-template-columns:repeat(2,minmax(0,1fr)); } .payment-summary li:last-child { grid-column:1 / -1; } }
@media(max-width:600px) { .payment-summary { grid-template-columns:1fr; gap:10px; } .payment-summary a { padding:16px; } .payment-bank-notice { padding:18px; } .payment-page .payment-fee-card .legal-fees th,.payment-page .payment-fee-card .legal-fees td { padding:10px 7px; font-size:13px; } }
.payment-page .payment-methods article { display: flex; flex-direction: column; align-items: flex-start; }
.payment-page .payment-methods .payment-emphasis { color: var(--blue-deep); }
.payment-inline-link { display: inline-flex; align-items: center; gap: 10px; color: var(--blue); font-size: 14px; font-weight: 700; margin-top: 20px; text-decoration: underline; text-underline-offset: 4px; line-height: 1.8; }
.payment-inline-link:focus-visible { outline: 3px solid var(--yellow); outline-offset: 4px; }
.payment-bank-section { padding-top: 0; }
.payment-bank-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.payment-bank-card { min-width: 0; padding: 30px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.payment-card-kicker { display: inline-block; margin-bottom: 16px; padding: 5px 10px; border-radius: 5px; color: var(--blue); background: var(--blue-soft); font-size: 12px; font-weight: 700; }
.payment-bank-card h3 { font-size: 21px; line-height: 1.7; }
.payment-bank-break { display: none; }
.payment-account { margin-top: 22px; }
.payment-account > div { display: grid; grid-template-columns: 100px minmax(0,1fr); align-items: baseline; gap: 14px; padding: 15px 0; border-bottom: 1px solid var(--line); }
.payment-account > div:last-child { border-bottom: 0; }
.payment-account dt { color: var(--muted); font-size: 14px; }
.payment-account dd { margin: 0; color: var(--ink); font-size: 18px; font-weight: 700; overflow-wrap: anywhere; }
.payment-account dd.payment-account-number { font: 700 24px/1.5 'DM Sans',sans-serif; font-variant-numeric: tabular-nums; letter-spacing: .04em; user-select: all; }
.payment-account-reading { display: block; color: var(--muted); font-size: 13px; font-weight: 500; margin-top: 2px; }
.payment-section-heading { display: flex; align-items: center; gap: 20px; margin-bottom: 22px; }
.payment-page .payment-section-heading h2 { margin-top: 5px; }
.payment-shipping-layout { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(0,.75fr); gap: 40px; align-items: center; }
.payment-copy { color: var(--muted); font-size: 15px; line-height: 1.95; }
.payment-small-note { color: var(--muted); font-size: 14px; line-height: 1.9; margin-top: 18px; }
.payment-large-card { display: flex; align-items: flex-start; gap: 18px; margin-top: 26px; padding: 24px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.payment-large-card h3 { font-size: 18px; margin-bottom: 10px; }
.payment-large-card p { color: var(--muted); font-size: 14px; line-height: 1.9; }
.payment-page .payment-mii { margin: 0; justify-content: center; align-items: center; }
.payment-page .payment-mii img { width: 108px; height: 162px; }
.payment-page .payment-mii p { font-size: 14px; }
.payment-free-card { padding: 42px; border: 1px solid #e6dfd1; border-radius: 12px; background: var(--cream); }
.payment-page .payment-free-card h2 { margin: 14px 0 18px; }
.payment-free-card h2 > strong { display: block; color: var(--blue); font: 800 clamp(42px,6vw,68px)/1.3 'DM Sans',sans-serif; letter-spacing: -.025em; }
.payment-free-card h2 > strong > span { margin-left: 8px; font-family: 'Noto Sans JP',sans-serif; font-size: .48em; }
.payment-free-title-rest { display: block; margin-top: 6px; color: var(--blue-deep); font-size: clamp(23px,3vw,34px); line-height: 1.6; }
.payment-free-exception { color: var(--ink); font-size: 15px; font-weight: 700; line-height: 1.9; }
.payment-shipping-supplement { margin-top:16px; color:var(--muted); font-size:14px; font-weight:400; line-height:1.9; }
.payment-free-details { margin-top: 26px; padding-top: 24px; border-top: 1px solid #e6dfd1; }
.payment-free-details h3 { font-size: 17px; }
.payment-free-details ul { margin: 14px 0; padding-left: 22px; color: var(--ink); font-size: 15px; line-height: 1.9; }
.payment-free-details li + li { margin-top: 8px; }
.payment-free-details p { color: var(--muted); font-size: 14px; line-height: 1.9; }
@media(max-width:900px) { .payment-shipping-layout { grid-template-columns: 1fr; gap: 28px; } .payment-page .payment-mii { justify-content: flex-start; } }
@media(max-width:700px) { .payment-bank-grid { grid-template-columns: 1fr; } }
@media(max-width:600px) { .payment-bank-card { padding: 22px; } .payment-bank-card h3 { font-size: 20px; } .payment-bank-break { display: inline; } .payment-account > div { grid-template-columns: 70px minmax(0,1fr); gap: 10px; } .payment-account dd { font-size: 16px; } .payment-account dd.payment-account-number { font-size: 23px; } .payment-section-heading { gap: 14px; align-items: flex-start; } .payment-large-card { padding: 20px; gap: 12px; } .payment-large-card .guide-icon { width: 36px; height: 36px; } .payment-large-card .guide-icon svg { width: 24px; height: 24px; } .payment-page .payment-mii img { width: 82px; height: 123px; } .payment-free-card { padding: 24px; } .payment-free-title-rest { font-size: 23px; } .payment-free-details ul { font-size: 14px; } .payment-page .payment-cta .data-send-actions { flex-direction: column; align-items: stretch; } .payment-page .payment-cta .button,.payment-page .payment-cta .data-secondary-button { width: 100%; justify-content: center; } }

.payment-delivery-note { margin-top: 24px; padding: 20px 22px; border-left: 4px solid var(--blue); background: #fff; border-radius: 8px; }
.payment-delivery-note h3 { font-size: 17px; margin-bottom: 8px; }
.payment-delivery-note p { color: var(--muted); font-size: 14px; line-height: 1.9; }
.payment-delivery-note strong { color: var(--blue-deep); }

/* 確定した代引条件を独立カードで案内 */
.payment-fee-card {margin-top:28px;padding:28px;border:1px solid var(--line);border-radius:12px;background:var(--cream);scroll-margin-top:110px}
.payment-fee-card .legal-fees {margin-top:12px;background:#fff}
.payment-cod-notes {padding-left:1.4em;margin:16px 0 0;color:var(--muted);font-size:14px;line-height:1.9}
.payment-cod-notes li+li {margin-top:8px}
.payment-cod-notes strong {color:var(--blue-deep)}
.payment-page .payment-methods h3 {font-size:clamp(18px,2vw,23px);line-height:1.6}
.payment-guide-mii {margin:24px 0 0;max-width:620px}
.payment-page .payment-guide-mii img {width:90px;height:135px;object-fit:contain}
.payment-page .payment-faq-mii {margin-bottom:24px}
@media(max-width:600px){.payment-fee-card{padding:20px}.payment-page .payment-guide-mii img{width:72px;height:108px}.payment-cod-notes{font-size:13px}}
