/* 瞬カー 導入効果シミュレーター */
.sroi{--sroi-navy:#0B1F33;--sroi-blue:#0E5AD6;--sroi-mist:#F2F5F9;--sroi-line:#DCE3EC;--sroi-text:#334155;--sroi-sub:#5B6B7F;--sroi-green:#1B8A5A;margin:8px 0 40px;color:var(--sroi-text);width:min(1080px,calc(100vw - 32px));margin-left:calc(50% - min(540px,50vw - 16px))}
.sroi *{box-sizing:border-box}
.sroi__layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:28px;align-items:start}
.sroi__form{background:#fff;border:1px solid var(--sroi-line);border-radius:14px;padding:24px;position:sticky;top:96px}
.sroi__h2{font-size:1.15rem;line-height:1.5;margin:0 0 4px;color:var(--sroi-navy)}
.sroi__lead{font-size:.88rem;color:var(--sroi-sub);margin:0 0 18px}
.sroi__field{margin:0 0 16px}
.sroi__row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.sroi__row .sroi__field{margin-bottom:6px}
.sroi__label{display:block;font-weight:700;font-size:.92rem;color:var(--sroi-navy);margin:0 0 6px}
.sroi__opt{font-weight:400;font-size:.75rem;color:var(--sroi-sub);border:1px solid var(--sroi-line);border-radius:4px;padding:1px 6px;margin-left:4px}
.sroi__inputwrap{position:relative;display:flex;align-items:center}
.sroi__input,.sroi__select{width:100%;min-height:48px;border:1px solid #C8D2DE;border-radius:10px;padding:10px 44px 10px 14px;font-size:1.05rem;font-variant-numeric:tabular-nums;color:var(--sroi-navy);background:#fff;transition:border-color .15s,box-shadow .15s}
.sroi__select{padding-right:14px;font-size:1rem}
.sroi__input:focus,.sroi__select:focus{outline:none;border-color:var(--sroi-blue);box-shadow:0 0 0 3px rgba(14,90,214,.15)}
.sroi__unit{position:absolute;right:14px;color:var(--sroi-sub);font-size:.9rem;pointer-events:none}
.sroi__hint{font-size:.8rem;line-height:1.7;color:var(--sroi-sub);margin:6px 0 0}
.sroi__error{background:#FFF3F3;border:1px solid #F3C2C2;color:#A3262A;border-radius:10px;padding:10px 12px;font-size:.88rem;margin:4px 0 14px}
.sroi__submit{width:100%;justify-content:center;min-height:52px;font-size:1rem;margin-top:6px}
.sroi__empty{border:1px dashed #C8D2DE;border-radius:14px;padding:32px 24px;background:var(--sroi-mist);color:var(--sroi-sub);font-size:.9rem;line-height:1.8}
.sroi__empty-h{font-weight:700;color:var(--sroi-navy);margin:0 0 6px}
.sroi__out{background:#fff;border:1px solid var(--sroi-line);border-radius:14px;padding:24px;box-shadow:0 14px 36px rgba(11,31,51,.06)}
.sroi__out.is-in{animation:sroiIn .4s cubic-bezier(.2,.7,.2,1) both}
@keyframes sroiIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.sroi__headline{font-size:1.12rem;line-height:1.7;font-weight:700;color:var(--sroi-navy);margin:0 0 18px;word-break:auto-phrase;text-wrap:pretty}
.sroi__conditions{font-size:.78rem;line-height:1.7;color:var(--sroi-sub);margin:-10px 0 16px}
.sroi__print{justify-content:center;min-height:44px;font-size:.9rem}
.sroi__compare{background:var(--sroi-mist);border-radius:12px;padding:14px 16px 10px;margin:0 0 18px}
.sroi__bar{display:grid;grid-template-columns:4.2em 1fr 3.6em;align-items:center;gap:10px;margin:0 0 8px;font-size:.88rem}
.sroi__bar-label{color:var(--sroi-navy);font-weight:700}
.sroi__bar-track{height:12px;background:#E3E9F1;border-radius:99px;overflow:hidden}
.sroi__bar-fill{display:block;height:100%;width:0;border-radius:99px;transition:width .7s cubic-bezier(.2,.7,.2,1)}
.sroi__bar-fill--before{background:#9AA9BC}
.sroi__bar-fill--after{background:linear-gradient(90deg,var(--sroi-blue),#4F9BFF)}
.sroi__bar-val{text-align:right;font-variant-numeric:tabular-nums;color:var(--sroi-navy);font-weight:700}
.sroi__caption{font-size:.75rem;color:var(--sroi-sub);margin:2px 0 0}
.sroi__metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 18px}
.sroi__metric{border:1px solid var(--sroi-line);border-radius:12px;padding:12px 14px;margin:0}
.sroi__metric dt{font-size:.78rem;color:var(--sroi-sub);margin:0 0 2px}
.sroi__metric dd{margin:0;font-size:1.45rem;font-weight:700;color:var(--sroi-blue);font-variant-numeric:tabular-nums;line-height:1.3}
.sroi__metric dd small{font-size:.78rem;color:var(--sroi-sub);font-weight:400;margin-left:3px}
.sroi__metric--strong{background:var(--sroi-navy);border-color:var(--sroi-navy)}
.sroi__metric--strong dt,.sroi__metric--strong dd small{color:#C9D6E6}
.sroi__metric--strong dd{color:#fff}
.sroi__plan{border-left:3px solid var(--sroi-blue);background:#F7FAFE;border-radius:0 12px 12px 0;padding:12px 16px;margin:0 0 14px}
.sroi__plan p{margin:0}
.sroi__plan-h{font-size:.78rem;color:var(--sroi-sub)}
.sroi__plan-name{font-size:1.08rem;font-weight:700;color:var(--sroi-navy);margin:2px 0 0!important}
.sroi__plan-note{font-size:.8rem;font-weight:400;color:var(--sroi-sub);margin-left:8px}
.sroi__plan-price{font-size:.92rem;margin-top:2px!important}
.sroi__tax{font-size:.78rem;color:var(--sroi-sub)}
.sroi__plan-ratio{margin-top:6px!important;font-size:.95rem;color:var(--sroi-navy)}
.sroi__plan-ratio strong{color:var(--sroi-green);font-size:1.1rem}
.sroi__message{font-size:.9rem;line-height:1.85;margin:0 0 10px}
.sroi__breakeven{font-size:.84rem;line-height:1.8;color:var(--sroi-sub);margin:0 0 14px}
.sroi__cta{display:flex;flex-direction:column;gap:10px;margin:18px 0 12px}
.sroi__cta .jp-btn{justify-content:center;text-align:center;min-height:50px}
.sroi__cta-note{font-size:.78rem;line-height:1.7;color:var(--sroi-sub);margin:2px 0 0}
.sroi__disclaimer{font-size:.75rem;line-height:1.7;color:var(--sroi-sub);border-top:1px solid var(--sroi-line);padding-top:10px;margin:8px 0 0}
.sroi__recs{margin:16px 0 6px}
.sroi__recs-h{font-size:1rem;color:var(--sroi-navy);margin:0 0 10px;line-height:1.5}
.sroi__recs-h span{display:inline-block;font-size:.75rem;font-weight:700;color:#fff;background:var(--sroi-blue);border-radius:99px;padding:2px 10px;margin-left:6px;vertical-align:2px}
.sroi__recs-list{list-style:none;margin:0;padding:0;counter-reset:sroirec;display:grid;gap:10px}
.sroi__rec{position:relative;border:1px solid var(--sroi-line);border-radius:12px;padding:12px 14px 12px 46px;counter-increment:sroirec;background:#fff}
.sroi__rec::before{content:counter(sroirec);position:absolute;left:14px;top:12px;width:22px;height:22px;border-radius:50%;background:var(--sroi-navy);color:#fff;font-size:.78rem;font-weight:700;display:grid;place-items:center}
.sroi__rec p{margin:0}
.sroi__rec-title{font-weight:700;color:var(--sroi-navy);font-size:.95rem;line-height:1.6;word-break:auto-phrase}
.sroi__rec-why{font-size:.84rem;line-height:1.8;color:var(--sroi-sub);margin-top:4px!important}
.sroi__rec-how{font-size:.88rem;line-height:1.8;color:var(--sroi-text);margin-top:6px!important;background:#F2F7FF;border-radius:8px;padding:8px 10px}
.sroi__rec-tag{display:inline-block;font-size:.72rem;font-weight:700;color:var(--sroi-blue);border:1px solid var(--sroi-blue);border-radius:4px;padding:0 6px;margin-right:6px;vertical-align:1px}
@media (max-width:900px){
.sroi{width:auto;margin-left:0}
.sroi__layout{grid-template-columns:1fr;gap:18px}
.sroi__form{position:static}
.sroi__form,.sroi__out{padding:18px}
}
@media (max-width:420px){
.sroi__row{grid-template-columns:1fr;gap:0}
.sroi__metrics{grid-template-columns:1fr 1fr;gap:8px}
.sroi__metric dd{font-size:1.2rem}
}
@media (prefers-reduced-motion:reduce){.sroi__out.is-in{animation:none}.sroi__bar-fill{transition:none}}
/* 印刷・PDF保存：試算結果だけを出す（フォーム・ボタン・サイトのヘッダー等は出さない） */
@media print{
body *{visibility:hidden!important}
#sroi-out,#sroi-out *{visibility:visible!important}
#sroi-out{position:absolute;left:0;top:0;width:100%;border:0;box-shadow:none;padding:0;animation:none!important}
#sroi-out .sroi__cta{display:none!important}
.sroi__bar-fill,.sroi__metric--strong,.sroi__rec::before,.sroi__recs-h span{-webkit-print-color-adjust:exact;print-color-adjust:exact}
.sroi__rec{break-inside:avoid}
}