/* サービス一覧：ヒーローの経路図・お悩みボタン・選ぶとカードに線がつながる */
.svhero .routebox{width:min(100%,560px);margin:0 auto;position:relative;transform:translateY(var(--py,0))}
.route{width:100%;height:auto;overflow:visible}
.route .rbase{fill:none;stroke:#c9ccd2;stroke-width:4;stroke-dasharray:4 12;stroke-linecap:round}
.route .rfill{fill:none;stroke:var(--red);stroke-width:5;stroke-linecap:round;stroke-dasharray:var(--len,2000);stroke-dashoffset:var(--len,2000);animation:rdraw 9s linear infinite}
@keyframes rdraw{0%{stroke-dashoffset:var(--len,2000)}85%,100%{stroke-dashoffset:0}}
.route .rc{fill:#fff;stroke:#c9ccd2;stroke-width:4;animation:rlit 9s linear infinite;animation-delay:calc(var(--a,0)*9s - 0.2s)}
.route .rd{fill:#c9ccd2;animation:rlit2 9s linear infinite;animation-delay:calc(var(--a,0)*9s - 0.2s)}
@keyframes rlit{0%{stroke:#c9ccd2;fill:#fff}3%,92%{stroke:var(--red);fill:#fff}100%{stroke:#c9ccd2}}
@keyframes rlit2{0%{fill:#c9ccd2}3%,92%{fill:var(--red)}100%{fill:#c9ccd2}}
.route text{font:900 21px var(--disp);fill:var(--ink)}
/* 動くピン（SVG の中で animateMotion） */
.rpin circle{fill:var(--red)}.rpin .halo{fill:rgba(217,20,51,.22)}.rpin .core{fill:#fff}
/* お悩み */
.wgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:40px}
.wbtn{display:flex;flex-direction:column;gap:10px;text-align:left;padding:26px 28px;background:#fff;border:2px solid var(--ink);border-radius:30px;cursor:pointer;color:inherit;transition:transform .35s var(--ease),box-shadow .35s,background .3s,color .3s;position:relative;overflow:hidden}
.wbtn:nth-child(even){margin-top:28px}
.wbtn .q{font:900 clamp(19px,1.9vw,26px)/1.45 var(--disp)}
.wbtn .to{font-weight:700;color:var(--red);transition:transform .3s var(--ease)}
.wbtn:hover{transform:translateY(-6px);box-shadow:8px 10px 0 var(--ink)}
.wbtn:hover .to{transform:translateX(8px)}
.wbtn.on{background:var(--red);color:#fff;border-color:var(--red);box-shadow:8px 10px 0 var(--ink)}.wbtn.on .to{color:#fff}
/* 選んだサービスのカード */
.sg.picked .sc{opacity:.32;transform:scale(.97)}
.sg.picked .sc.hit{opacity:1;transform:translateY(-10px);box-shadow:12px 14px 0 var(--red);border-color:var(--red)}
.sg.picked .sc.main.hit{box-shadow:12px 14px 0 var(--ink)}
@media(max-width:1024px){.wgrid{grid-template-columns:minmax(0,1fr)}.wbtn:nth-child(even){margin-top:0}.svhero .routebox{margin-top:10px}}
@media(max-width:820px){.route text{font-size:24px}}
