/* 2026-10-17公開レビュー：説明を隠さず、仕事の変化と関係を見せる。 */
.sv-stories { margin: 36px 0; }
.sv-story { padding: 34px 0 40px; border-top: 1px solid #c9d8e5; }
.sv-story .sv-story-header { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 36px; }
.sv-story .sv-problem-title { grid-column: 1 / -1; margin: 0 0 10px; color: #536c80; font-size: 14px; line-height: 1.8; }
.sv-story .sv-story-header h3 { margin: 0 0 22px; font-size: clamp(22px, 2.1vw, 28px); line-height: 1.6; color: #173751; }
.sv-story .sv-story-header h3:last-child { grid-column: 1 / -1; max-width: 38em; }
.sv-story .sv-story-header > p:last-child:not(.sv-problem-title) { margin: 0 0 22px; color: #495564; font-size: 16px; line-height: 1.9; }
.sv-change { display: grid; grid-template-columns: .85fr 1.15fr; }
.sv-change > div { padding: 24px 28px; }
.sv-before { background: #f1f4f7; }
.sv-after { background: #e9f4f2; border-left: 3px solid #167a72; }
.sv-story .sv-change h4 { margin: 0 0 12px; color: #536c80; font-size: 14px; line-height: 1.6; }
.sv-story .sv-after h4 { color: #12645e; }
.sv-story .sv-change p { margin: 0; color: #495564; font-size: 16px; line-height: 1.9; }
.sv-story .sv-method { margin: 18px 0 0; font-size: 14px; line-height: 1.9; color: #495564; }
.sv-method > strong { margin-right: 14px; color: #173751; }
.sv-intro { display: grid; grid-template-columns: 1.05fr .95fr; gap: 40px; align-items: start; margin: 30px 0; }
.sv-intro .sv-intro-copy p, .sv-intro .rn-section-lead { max-width: none; }
.sv-intro .rn-section-header { margin-bottom: 0; }
.sv-intro .sv-flow { margin: 0; padding: 24px; background: #edf4fc; min-width: 0; }
.sv-flow .sv-flow-stage { display: flex; align-items: center; gap: 16px; background: #fff; padding: 15px; }
.sv-flow-stage > svg { width: 32px; height: 42px; flex: 0 0 32px; fill: none; stroke: #5885b0; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.sv-flow-stage:nth-last-of-type(1) > svg { stroke: #167a72; }
.sv-flow-stage > div { min-width: 0; }
.sv-flow-stage strong { display: block; color: #173751; font-size: 16px; line-height: 1.6; }
.sv-flow-stage div > span { display: block; margin-top: 5px; color: #536c80; font-size: 13px; line-height: 1.6; }
.sv-flow .sv-flow-arrow { display: block; text-align: center; color: #5885b0; font-size: 22px; line-height: 1.5; }
.sv-flow figcaption { margin-top: 16px; color: #536c80; font-size: 12px; line-height: 1.7; text-align: center; }
.sv-costs { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 30px; margin: 28px 0; }
.sv-costs > div { padding: 24px; border-top: 3px solid #9cbad3; background: #f5f8fc; }
.sv-costs > div > h3 { margin-top: 0; }
.sv-costs > div > p { margin-bottom: 0; }
@media (max-width: 800px) {
 .sv-intro { grid-template-columns: 1fr; gap: 22px; }
 .sv-intro .sv-flow { padding: 18px; }
 .sv-flow .sv-flow-stage { padding: 14px; gap: 12px; }
 .sv-story .sv-story-header, .sv-change, .sv-costs { grid-template-columns: 1fr; }
 .sv-story { padding: 28px 0 34px; }
 .sv-story .sv-story-header h3 { margin-bottom: 16px; }
 .sv-change > div { padding: 20px; }
 .sv-after { border-left: 0; border-top: 3px solid #167a72; }
}
