/* 届いた相談 jido-nejishime-gaichu の見た目。見本＝endsupp-seo の plan/事例見本_20261101/jido-nejishime-gaichu.html・作り＝tools/case_pages/port_case.py（2026-11-04） */
.cu-preview{background:#fff4c2;border-bottom:1px solid #b38a00;color:#5c4700;font-size:13.5px;line-height:1.6;padding:8px 40px;text-align:center;margin:0}
.c{--deep:#0a2340;--steel:#0d2a4a;--steel-2:#17406a;--ice:#eaf1f7;--ice-2:#d7e3ee;--ink:#17202c;--mute:#55657a;--copper:#b4693a;--copper-hi:#f0a66a;--cold:rgba(240,245,250,.94);background:var(--ice);color:var(--ink);overflow:hidden}
.c-wrap{max-width:1280px;margin:0 auto;padding-left:40px;padding-right:40px;width:100%}
.c h1,.c h2{font-family:var(--f-display);font-feature-settings:"palt"}
.c-tag span:first-child{background:#f08a1d;color:#fff;font-weight:700;padding:3px 11px;border-radius:999px}
.c-go__btn{display:flex;align-items:center;flex-wrap:wrap;gap:12px 22px}
.c-flow{background:#f3f6fb;padding:44px 0 40px;color:var(--ink)}
.c-flow__h{font-family:var(--f-display);font-weight:900;font-size:28px;line-height:1.4;color:var(--ink);margin:2px 0 20px}
.c-flow .c-go__btn{margin-top:24px}
.c-sublink2{font-size:15px;color:var(--ink);text-underline-offset:3px}
.c-sec__n{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--ink);color:#fff;font-family:var(--f-code);font-weight:500;font-size:17px;line-height:1;margin-right:12px;vertical-align:4px;flex:none}
.c-flow .c-sec__n,.c-others .c-sec__n{vertical-align:3px}
.c-flow .c-flow__h{margin-top:0}
.c-flow__h{font-size:26px}
.c-flow__lead{font-size:15px;line-height:1.7;color:var(--ink);margin:-8px 0 18px;max-width:900px}
.c-flow__lead a{color:var(--blue);text-underline-offset:3px}
.c-how{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 28px;list-style:none;margin:0;padding:0}
.c-how li{position:relative;background:#fff;border:1px solid #dde3ee;border-radius:10px;padding:22px 18px 20px;text-align:center}
.c-how li+li::before{content:"";position:absolute;left:-22px;top:62px;width:10px;height:10px;border-top:2px solid #8ea3b8;border-right:2px solid #8ea3b8;transform:rotate(45deg)}
.c-how svg{display:block;width:72px;height:72px;margin:0 auto}
.c-how i{display:inline-flex;width:28px;height:28px;border-radius:50%;border:2px solid var(--ink);align-items:center;justify-content:center;font-style:normal;font-weight:700;font-size:14px;margin-top:12px}
.c-how b{display:block;font-family:var(--f-display);font-weight:900;font-size:19px;line-height:1.4;margin-top:8px;color:var(--ink)}
.c-how span{display:block;font-size:13.5px;line-height:1.6;color:#4b5a6e;margin-top:6px}
.c-chips{display:flex;flex-wrap:wrap;gap:8px 10px;list-style:none;margin:18px 0 0;padding:0}
.c-chips li{font-size:13.5px;line-height:1.4;font-weight:700;color:#22397a;background:#fff;border:1px solid #c5d1e0;border-radius:999px;padding:7px 14px}
.c-more{background:#eef3fa;padding:44px 0 40px}
.c-more__h{font-family:var(--f-display);font-weight:900;font-size:26px;line-height:1.4;color:var(--ink);margin:0 0 22px}
.c-more__grid{display:grid;grid-template-columns:1.05fr 1.25fr .9fr;gap:0 28px}
.c-more__col h3{font-size:13.5px;font-weight:700;color:#4b5a6e;letter-spacing:.06em;margin:0 0 10px}
.c-more__card{display:grid;grid-template-columns:56px 1fr;gap:2px 14px;align-items:center;background:#fff;border:1px solid #dde3ee;border-radius:10px;padding:14px 16px;margin-top:10px;color:var(--ink);text-decoration:none;transition:border-color .15s,box-shadow .15s}
.c-more__card:hover{border-color:#f08a1d;box-shadow:0 2px 10px rgba(23,64,106,.12);color:var(--ink)}
.c-more__card svg{width:56px;height:56px;grid-row:span 2}
.c-more__card b{font-family:var(--f-display);font-weight:900;font-size:18px;line-height:1.4}
.c-more__card span{font-size:13px;line-height:1.55;color:#4b5a6e}
.c-more__card--s{grid-template-columns:44px 1fr}
.c-more__card--s svg{width:44px;height:44px}
.c-more__card--s b{font-size:16px}
.c-more__row{display:grid;grid-template-columns:36px 1fr;gap:0 12px;align-items:center;padding:10px 0;border-top:1px solid #d6dde8;color:var(--ink);text-decoration:none}
.c-more__row:first-of-type{border-top:0;padding-top:4px}
.c-more__row:hover b{color:#b36a0f}
.c-more__row svg{width:36px;height:36px;grid-row:span 2}
.c-more__row b{display:block;font-family:var(--f-display);font-weight:900;font-size:15.5px;line-height:1.45;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#c5d1e0}
.c-more__row span{display:block;font-size:12.5px;line-height:1.5;color:#4b5a6e;margin-top:2px}
.c-chips--links{margin-top:12px}
.c-chips--links a{color:#22397a;text-decoration:none}
.c-chips--links li:hover{border-color:#f08a1d}
.c-more__note{font-size:12.5px;line-height:1.6;color:var(--mute);margin-top:14px}
.c-sec__n{flex:none}
.c-small{font-size:12.5px;line-height:1.7;color:var(--mute)}
@media (max-width:899px){
  html,body{overflow-x:hidden}
  .cu-preview{padding:8px 16px}
  .c-wrap{box-sizing:border-box;max-width:100%;padding-left:16px;padding-right:16px}
  .c-sec__n{width:28px;height:28px;font-size:14px;margin-right:8px;vertical-align:3px}
  .c-flow__h{font-size:22px}
  .c-go__btn .btn{width:100%}
  .c-how{grid-template-columns:1fr;gap:14px}
  .c-how li{display:grid;grid-template-columns:56px 1fr;gap:0 14px;align-items:center;text-align:left;padding:16px}
  .c-how svg{width:56px;height:56px;grid-row:span 3}
  .c-how i{margin-top:0}
  .c-how li+li::before{display:none}
  .c-more{padding:36px 0 34px}
  .c-more__h{font-size:22px}
  .c-more__grid{grid-template-columns:1fr;gap:26px}
}
/* この相談だけの見た目。平らな青の上に、白い依頼の札が積もる。1人と、たくさんの対比で見せる */
.n{--blue:#14478a;--blue2:#0f3768;--sky:#cfe0f2;--pale:#eaf1f9;--ink:#14233a;--mute:#51627a;--or:#5f86b3;--or-d:#2f5d92}
.n{background:#fff;color:var(--ink)}
.n h1,.n h2,.n h3{font-family:var(--f-display);font-feature-settings:"palt"}
.n-hero{background:var(--blue);color:#fff;overflow:hidden}
.n-hero__in{display:grid;grid-template-columns:minmax(0,1fr) 520px;gap:0 36px;align-items:center;height:620px;max-width:1280px;margin:0 auto;padding:0 40px 0 24px}
.n-hero__fig svg{display:block;width:100%;height:auto;max-height:620px}
/* 共通の CSS の橙（CTA と同じ色）を、この版だけ上書き */
.n-hero .c-tag span:first-child{background:#fff;color:#14478a}
.c-chips--links li:hover{border-color:#14478a}
.n-hero .c-tag{display:flex;gap:16px;align-items:center;font-size:15px;font-weight:500;color:var(--sky)}
.n-hero h1{font-weight:900;font-size:43px;line-height:1.28;margin-top:14px}
.n-hero h1 em{font-style:normal;color:#ffc070}
.n-lead{font-size:18px;font-weight:700;line-height:1.6;margin-top:16px}
.n-go{margin-top:20px}
.n-promise{font-size:14.5px;line-height:1.6;margin-top:12px;color:var(--sky)}
.n-tk{animation:n-fall .42s calc(var(--d)*.2s + .2s) cubic-bezier(.3,.7,.5,1) both}
@keyframes n-fall{from{transform:translateY(-460px);opacity:0}15%{opacity:1}to{transform:none;opacity:1}}
.n-stop{animation:n-in .4s 4.4s both}
@keyframes n-in{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.n-tk,.n-stop{animation:none}}

.n-h{font-weight:900;font-size:26px;line-height:1.4;display:flex;align-items:center;color:var(--ink)}
.n .c-sec__n{background:var(--blue);color:#fff}

.n-s1{padding:46px 0 44px}
.n-s1__top{display:grid;grid-template-columns:minmax(0,1fr) 430px;gap:0 40px;align-items:end;margin-top:22px}
.n-k{font-size:13.5px;font-weight:700;color:var(--mute);display:block}
.n-s1__top b{display:block;font-family:var(--f-display);font-weight:900;font-size:28px;line-height:1.35;margin-top:2px}
.n-s1__top p{font-size:15px;line-height:1.7}
.n-cal{--h:36px;display:grid;grid-template-columns:minmax(0,1fr) 220px;margin-top:18px;background:#fff;border:1px solid #dadce0;border-radius:10px;overflow:hidden;box-shadow:0 2px 10px rgba(20,35,58,.08)}
.n-cal__bar{grid-column:1/-1;display:flex;align-items:center;gap:14px;height:52px;padding:0 16px;border-bottom:1px solid #dadce0;font-size:15px;color:#3c4043}
.n-cal__bar b{font-size:18px;font-weight:500}
.n-cal__bar svg{display:block;width:26px;height:26px}
.n-cal__today{border:1px solid #dadce0;border-radius:6px;padding:3px 12px;font-size:14px}
.n-cal__wk{margin-left:auto;border:1px solid #dadce0;border-radius:6px;padding:3px 12px;font-size:14px}
.n-cal__hd,.n-cal__bd{display:grid;grid-template-columns:52px repeat(5,minmax(0,1fr))}
.n-cal__hd{border-bottom:1px solid #dadce0}
.n-cal__hd div{text-align:center;padding:6px 0 8px;font-size:12.5px;color:#5f6368;line-height:1.2}
.n-cal__hd i{display:block;font-style:normal;font-size:21px;line-height:34px;width:34px;margin:2px auto 0;color:#3c4043}
.n-cal__hd .on{color:#1a73e8;font-weight:700}
.n-cal__hd .on i{background:#1a73e8;color:#fff;border-radius:50%}
.n-cal__t{position:relative;height:calc(var(--h)*12)}
.n-cal__t span{position:absolute;right:8px;top:calc(var(--h)*var(--s) - 8px);font-size:11.5px;color:#70757a}
.n-cal__d{position:relative;height:calc(var(--h)*12);border-left:1px solid #e3e6ea;background:linear-gradient(#f4f5f7,#f4f5f7) 0 calc(var(--h)*10)/100% calc(var(--h)*2) no-repeat,repeating-linear-gradient(#fff 0,#fff calc(var(--h) - 1px),#e8eaed calc(var(--h) - 1px),#e8eaed var(--h))}
.ev{position:absolute;left:2px;right:3px;top:calc(var(--h)*var(--s));height:calc(var(--h)*var(--l) - 2px);border-radius:4px;padding:3px 6px;font-size:12.5px;line-height:1.3;overflow:hidden;box-shadow:0 0 0 1px #fff}
.ev b{display:block;font-weight:700}
.ev span{display:block;font-size:11.5px;opacity:.9}
.ev.l{right:42%}
.ev.r{left:42%;z-index:1}
.e1{background:#14478a;color:#fff}
.e2{background:#cfe2f8;color:#123a66}
.e3{background:#8d99a8;color:#fff}
.e4{background:#dfe5ec;color:#22303f}
.e5{background:#fbdde3;color:#7a1d33}
.n-cal__now{position:absolute;left:0;right:0;top:calc(var(--h)*7.4);border-top:2px solid #ea4335;z-index:2}
.n-cal__now::before{content:"";position:absolute;left:-5px;top:-6px;width:10px;height:10px;border-radius:50%;background:#ea4335}
.n-cal__todo{grid-column:2;grid-row:2/4;border-left:1px solid #dadce0;padding:14px 16px;background:#fafbfc}
.n-cal__todo h3{font-size:15px;font-weight:700;color:#3c4043;font-family:var(--f-body)}
.n-cal__todo ul{list-style:none;margin:10px 0 0;padding:0}
.n-cal__todo li{position:relative;padding:0 0 12px 24px;font-size:14px;font-weight:500;line-height:1.45;color:#3c4043}
.n-cal__todo li::before{content:"";position:absolute;left:0;top:3px;width:13px;height:13px;border:2px solid #80868b;border-radius:50%}
.n-cal__todo li.o::before{border-color:var(--or)}
.n-cal__main{grid-column:1;min-width:0}
.n-s1__main{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 48px;align-items:center;margin-top:24px}
.n-cal{--h:22px;grid-template-columns:minmax(0,1fr);margin-top:0}
.n-cal__bar{height:42px;gap:10px;font-size:13px}
.n-cal__bar b{font-size:15px}
.n-cal__bar svg{width:20px;height:20px}
.n-cal__today,.n-cal__wk{font-size:12px;padding:1px 9px}
.n-cal__hd,.n-cal__bd{grid-template-columns:38px repeat(5,minmax(0,1fr))}
.n-cal__hd div{padding:4px 0;font-size:11px}
.n-cal__hd i{font-size:15px;line-height:24px;width:24px}
.n-cal__t span{right:5px;font-size:10px}
.ev{padding:1px 4px;font-size:10.5px;line-height:1.25;border-radius:3px}
.ev span{display:none}
.n-s1__txt b{display:block;font-family:var(--f-display);font-weight:900;font-size:38px;line-height:1.3;margin-top:4px}
.n-s1__txt p{font-size:20px;font-weight:700;line-height:1.75;margin-top:14px}
.n-s1__two{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;margin-top:30px}
.n-s1__c{display:grid;grid-template-columns:190px 1fr;gap:0 22px;align-items:center;background:var(--pale);border-radius:12px;padding:24px 26px}
.n-s1__c svg{display:block;width:100%;height:auto}
.n-s1__c b{display:block;font-family:var(--f-display);font-weight:900;font-size:28px;line-height:1.35;margin-top:4px}
.n-s1__c .n-k{font-size:15px}
.n-s1__c p{font-size:17px;font-weight:500;line-height:1.7;margin-top:8px}
.n-req{display:grid;grid-template-columns:220px minmax(0,1fr);gap:0 34px;align-items:center;margin-top:30px;background:var(--pale);border-radius:12px;padding:28px 36px}
.n-req svg{display:block;width:100%;height:auto}
.n-req .n-k{font-size:16px;color:var(--blue)}
.n-req b{display:block;font-family:var(--f-display);font-weight:900;font-size:34px;line-height:1.4;margin-top:4px}
.n-req p{font-size:18px;font-weight:700;margin-top:8px;color:var(--mute)}

.n-s2{background:var(--pale);padding:46px 0 46px}
.n-brk{display:grid;grid-template-columns:1fr 3fr;gap:0 18px;margin-top:24px;position:relative}
.n-brk__l{font-family:var(--f-display);font-weight:900;font-size:20px;line-height:1.3;padding-bottom:6px;border-bottom:4px solid var(--blue);color:var(--blue)}
.n-brk__l.out{border-bottom-color:var(--or);color:var(--or-d)}
.n-pro{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:18px;margin-top:10px;list-style:none;padding:0}
.n-pro li{position:relative;background:var(--blue);color:#fff;border-radius:6px;font-family:var(--f-display);font-weight:900;font-size:24px;line-height:1.3;text-align:center;padding:24px 8px}
.n-pro li.out{background:var(--or)}
.n-pro li+li::before{content:"";position:absolute;left:-14px;top:50%;width:9px;height:9px;margin-top:-5px;border-top:2.5px solid #6b7c92;border-right:2.5px solid #6b7c92;transform:rotate(45deg)}
.n-fix{font-size:15.5px;font-weight:700;line-height:1.6;margin-top:12px}
.n-fix small{font-size:13px;font-weight:500;color:var(--mute);margin-right:10px}
.n-open{margin-top:22px;border:3px dashed #8ea3bb;border-radius:10px;padding:14px 22px 16px}
.n-open small{display:block;font-size:13.5px;font-weight:700;color:var(--mute)}
.n-open ul{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;list-style:none;padding:0;margin:6px 0 0}
.n-open li{font-family:var(--f-display);font-weight:900;font-size:20px;line-height:1.45}
.n-open li::before{content:"?";color:var(--or);margin-right:8px;font-size:24px}
.n-why{margin-top:34px;font-family:var(--f-display);font-weight:900;line-height:1.5}
.n-why s{display:block;font-size:24px;color:#566579;text-decoration-thickness:2px;text-decoration-color:#566579}
.n-why span{display:block;font-size:36px;color:var(--ink)}
.n-why i{display:block;font-style:normal;font-size:24px;color:var(--or-d)}
.n-so{font-family:var(--f-display);font-weight:900;font-size:30px;line-height:1.45;color:var(--blue);margin-top:34px;background:#fff;border-left:8px solid var(--blue);border-radius:10px;padding:18px 26px}

.n-s3{background:var(--blue);color:#fff;padding:50px 0 46px}
.n-s3 .n-h{color:#fff}
.n-s3 .c-sec__n{background:#fff;color:var(--blue)}
.n-s3__big{font-family:var(--f-display);font-weight:900;font-size:50px;line-height:1.25;margin-top:20px}
.n-s3__big em{font-style:normal;color:#ffc070}
.n-crowd{display:grid;grid-template-columns:170px 44px 180px 44px minmax(0,1fr);align-items:center;margin-top:26px}
.n-one{text-align:center;font-size:15px;font-weight:700;line-height:1.4}
.n-one svg{display:block;height:130px;width:auto;margin:0 auto 6px}
.n-ar{font-size:24px;text-align:center;color:var(--sky)}
.n-logo{background:#fff;border-radius:8px;padding:12px;text-align:center}
.n-logo img{display:block;width:100%;height:auto}
.n-logo+span{display:block}
.n-dots{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px}
.n-dots i{display:block;aspect-ratio:1;border-radius:50%;background:rgba(255,255,255,.2);border:2px solid rgba(255,255,255,.55)}
.n-dots i.on{background:var(--or);border-color:var(--or)}
/* 段3の動き（11/2）。JS が .pre を付けた時だけ隠し、画面に入ったら .go で動かす。JS が無い・動きを止める設定なら最後の絵のまま */
.n-hands .n-arm{transform-box:view-box}
.n-hands.pre .n-hf{opacity:0}
.n-hands.pre .n-arm{transform:rotate(150deg)}
.n-hands.pre .n-bub{opacity:0}
.n-hands.pre .n-hf.on,.n-hands.pre .n-hf.on path{fill:#9db9dc}
.n-hands.pre .n-hf.on .n-arm path{stroke:#9db9dc}
.n-hands.go .n-hf{animation:n-hf-in .3s calc(var(--i)*.09s) ease-out forwards}
.n-hands.go .n-arm{animation:n-arm-up .45s calc(var(--i)*.09s + .15s) cubic-bezier(.3,1.5,.5,1) forwards}
.n-hands.go .n-bub{animation:n-hf-in .35s calc(1.7s + var(--k)*.25s) ease-out forwards}
.n-hands.go .n-hf.on,.n-hands.go .n-hf.on path{animation:n-pick-f .5s 2.5s forwards}
.n-hands.go .n-hf.on .n-arm path{animation:n-pick-s .5s 2.5s forwards}
.n-hands.go .n-hf.on{animation:n-hf-in .3s calc(var(--i)*.09s) ease-out forwards,n-pick-f .5s 2.5s forwards}
@keyframes n-hf-in{from{opacity:0}to{opacity:1}}
@keyframes n-arm-up{from{transform:rotate(150deg)}to{transform:none}}
@keyframes n-pick-f{from{fill:#9db9dc}to{fill:#ffd27a}}
@keyframes n-pick-s{from{stroke:#9db9dc}to{stroke:#ffd27a}}
.n-hands{display:block;width:100%;height:auto}
.n-hands+p{font-size:16px;font-weight:700;margin-top:6px}
.n-hands+p b{color:#ffd27a}
.n-steps{margin:28px 0 0;padding:0;list-style:none}
.n-steps li{font-size:18px;font-weight:500;line-height:1.7;margin-top:8px}
.n-steps li:first-child{margin-top:0}
.n-end{margin-top:28px;background:#fff;color:var(--blue);border-left:8px solid #ffd27a;border-radius:10px;padding:18px 26px;font-family:var(--f-display);font-weight:900;font-size:28px;line-height:1.45}
.n-end span{display:block;font-size:20px;color:var(--mute)}
.n-s3 .c-small{color:var(--sky);margin-top:18px}

.n-s4{padding:46px 0 42px}
.n-duo{display:grid;grid-template-columns:1fr 120px 1fr;margin-top:22px;align-items:start}
.n-duo__c svg{display:block;width:100%;height:auto;border-radius:8px}
.n-m{position:relative;background:#fff;border:2px solid #b6c3d3;border-radius:12px;padding:12px 16px;font-family:var(--f-display);font-weight:700;font-size:17px;line-height:1.55;min-height:82px;margin-bottom:16px}
.n-m::after{content:"";position:absolute;left:44px;bottom:-9px;width:14px;height:14px;background:#fff;border-right:2px solid #b6c3d3;border-bottom:2px solid #b6c3d3;transform:rotate(45deg)}
.n-m.b{border-color:#f2b33d}
.n-m.b::after{border-color:#f2b33d}
.n-mid{align-self:center;text-align:center;font-family:var(--f-display);font-weight:900;font-size:14px;line-height:1.4;color:var(--blue);padding:0 8px}
.n-mid::after{content:"→";display:block;font-size:36px;line-height:1.1;color:var(--or)}
.n-after{font-size:15px;line-height:1.6;margin-top:10px;font-weight:700}
.n-note{font-size:13px;line-height:1.7;color:var(--mute);margin-top:18px}

@media (max-width:1180px) and (min-width:900px){.n-hero__in{grid-template-columns:minmax(0,1fr) 440px}.n-hero h1{font-size:36px}}
@media (max-width:899px){
  .n-hero__in{grid-template-columns:1fr;height:auto;padding:0 16px 8px;gap:0}
  .n-hero__t{order:1;padding-top:18px}
  .n-hero__fig{order:2;margin-top:6px}
  .n-hero h1{font-size:30px;margin-top:10px}
  .n-lead{font-size:16px;margin-top:10px}
  .n-go .btn{width:100%}
  .n-promise{font-size:13.5px}
  .n-h{font-size:22px;align-items:flex-start}
  .n-s1,.n-s2,.n-s4{padding:34px 0}
  .n-s1__top{grid-template-columns:1fr;gap:8px}
  .n-s1__top b{font-size:23px}
  .n-s1__main{grid-template-columns:minmax(0,1fr);gap:16px;margin-top:16px}
  .n-s1__txt{order:-1}
  .n-s1__txt b{font-size:25px}
  .n-s1__txt p{font-size:16px;margin-top:8px}
  .n-cal{--h:24px;grid-template-columns:1fr}
  .n-cal__bar{gap:8px;padding:0 10px;font-size:13px}
  .n-cal__bar b{font-size:15px}
  .n-cal__hd,.n-cal__bd{grid-template-columns:30px repeat(5,minmax(0,1fr))}
  .n-cal__hd i{font-size:16px;line-height:26px;width:26px}
  .n-cal__t span{right:3px;font-size:9.5px}
  .ev{left:1px;right:1px;padding:2px;font-size:9.5px;line-height:1.2}
  .ev.l{right:45%}
  .ev.r{left:45%}
  .ev span{display:none}
  .n-cal__main{grid-column:1}
  .n-cal__todo{grid-column:1;grid-row:auto;border-left:0;border-top:1px solid #dadce0}
  .n-req{grid-template-columns:80px minmax(0,1fr);gap:0 14px;padding:16px;margin-top:20px}
  .n-req b{font-size:21px}
  .n-req b br{display:none}
  .n-req p{font-size:15px}
  .n-s1__c{grid-template-columns:90px 1fr;gap:0 14px;padding:16px}
  .n-s1__c b{font-size:20px}
  .n-s1__c p{font-size:15px}
  .n-brk{grid-template-columns:1fr 3fr;gap:0 6px}
  .n-brk__l{font-size:13px}
  .n-pro{gap:6px}
  .n-pro li{font-size:14px;padding:16px 2px}
  .n-pro li+li::before{display:none}
  .n-open ul{grid-template-columns:1fr;gap:6px}
  .n-open li{font-size:17px}
  .n-open{padding:12px 14px}
  .n-why s{font-size:18px}
  .n-why span{font-size:25px}
  .n-why i{font-size:18px}
  .n-so{font-size:21px;padding:14px 16px;border-left-width:6px}
  .n-s3{padding:34px 0}
  .n-s3__big{font-size:32px}
  .n-crowd{grid-template-columns:96px 24px minmax(0,1fr);gap:8px 4px}
  .n-one svg{height:84px}
  .n-one{font-size:13px}
  .n-ar2{display:none}
  .n-crowd__dots{grid-column:1/-1;margin-top:12px}
  .n-steps{margin-top:20px}
  .n-steps li{font-size:15.5px}
  .n-end{font-size:20px;padding:14px 16px;border-left-width:6px}
  .n-end span{font-size:16px}
  .n-duo{grid-template-columns:1fr;gap:14px}
  .n-mid::after{content:"↓"}
  .n-m{min-height:0;font-size:15px}
}
.n-ans{background:var(--pale);border-bottom:1px solid #d6e1ee;padding:26px 0}
.n-ans__in{display:flex;align-items:center;justify-content:center;gap:16px 34px;flex-wrap:wrap}
.n-ans__k{font-family:var(--f-display);font-weight:900;font-size:20px;color:var(--blue);margin:0;padding-right:30px;border-right:2px solid #c5d3e4}
.n-ans__n span{display:block;font-size:15px;font-weight:700;color:var(--mute)}
.n-ans__n b{display:block;font-family:var(--f-display);font-weight:900;font-size:60px;line-height:1.05;color:var(--blue)}
.n-ans__n b small{font-size:24px;margin-left:4px}
.n-ans__n.on b{background:linear-gradient(transparent 68%,#ffd27a 68%)}
.n-ans__ar{font-size:40px;color:#8d99a8}
.n-ans__go{font-size:15px;font-weight:700;color:var(--blue);text-underline-offset:3px}
.n-fact{display:inline-block;margin-top:14px;background:rgba(255,255,255,.12);border-left:4px solid #ffc070;padding:6px 14px;font-size:18px;font-weight:700;line-height:1.5}
.n-fact b{color:#ffc070}
.e2,.e4,.e5{background:#e4e9f0;color:#3c4a5c}
@media (max-width:899px){
  .n-ans{padding:18px 0}
  .n-ans__in{gap:6px 14px}
  .n-ans__k{flex-basis:100%;text-align:center;border:0;padding:0;font-size:17px}
  .n-ans__n span{font-size:12.5px}
  .n-ans__n b{font-size:40px}
  .n-ans__n b small{font-size:17px}
  .n-ans__ar{font-size:26px}
  .n-ans__go{flex-basis:100%;text-align:center}

}
.n-h small{display:block;font-family:var(--f-body);font-size:16px;font-weight:700;line-height:1.5;margin-top:2px;opacity:.72}
@media (max-width:899px){.n-h small{font-size:13.5px}}
/* 段5の試し：不安を取り除いて相談へ。絵を先に、文は太字1行と小さい1行 */
.f2{--blue:#14478a;--pale:#eaf1f9;--sky:#cfe0f2;--ink:#14233a;--mute:#51627a;--or-d:#2f5d92;color:var(--ink)}
.f2 h2,.f2 h3{font-family:var(--f-display);font-feature-settings:"palt"}
.f2-q{display:flex;align-items:center;gap:12px;font-weight:900;font-size:28px;line-height:1.35;color:var(--ink);margin:0}
.f2-q::before{content:"Q";flex:none;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:#5f86b3;color:#fff;font-size:21px}
.f2-sec{padding:44px 0 46px}
.f2-what{background:#f3f6fb}
.f2-what__top{display:grid;grid-template-columns:220px minmax(0,1fr);gap:0 30px;align-items:center;margin:0 0 26px}
.f2-what__logo{background:#fff;border:1px solid #dde3ee;border-radius:10px;padding:18px 22px}
.f2-what__logo img{display:block;width:100%;height:auto}
.f2-what__top b{display:block;font-family:var(--f-display);font-weight:900;font-size:27px;line-height:1.4}
.f2-what__top p{font-size:15px;line-height:1.7;margin:6px 0 0}
.f2-what__top a{color:var(--blue);text-underline-offset:3px}

.f2-mk{background:#fff}
.f2-mk__g{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,5fr) minmax(0,4fr);gap:18px;margin-top:20px}
.f2-box{background:#f3f6fb;border-radius:10px;padding:18px 22px 20px;display:flex;flex-direction:column}
.f2-box small{display:block;font-size:14px;font-weight:700;color:var(--mute)}
.f2-box p.f2-num{font-family:var(--f-display);font-weight:900;font-size:26px;line-height:1.1;margin-top:auto;padding-top:14px}
.f2-num em{font-style:normal;font-size:76px;color:var(--blue);margin:0 4px}
.f2-box p{font-size:14px;line-height:1.6;margin:8px 0 0}
.f2-seg{display:flex;gap:2px;height:60px;margin-top:auto}
.f2-seg i{display:flex;align-items:center;justify-content:center;font-style:normal;font-weight:700;font-size:18px;width:calc(var(--v)*1%)}
.f2-seg i:first-child{border-radius:4px 0 0 4px}
.f2-seg i:last-child{border-radius:0 4px 4px 0}
.f2-seg__l{display:flex;gap:2px;margin-top:6px;font-size:13.5px;font-weight:700;line-height:1.35}
.f2-seg__l span{width:calc(var(--v)*1%);text-align:center}
.f2-size{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-top:auto;padding-top:10px}
.f2-size svg{display:block;width:100%;height:auto}
.f2-mk__t{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 12px;margin:20px 0 0;padding:0;list-style:none}
.f2-mk__t li{font-family:var(--f-display);font-weight:700;font-size:16.5px;color:#fff;background:var(--blue);border-radius:4px;padding:6px 16px}
.f2-mk__t li.x{background:none;color:var(--ink);padding:0;font-size:18px}
.f2-mk__e{font-family:var(--f-display);font-weight:900;font-size:19px;text-align:center;margin:12px 0 0}

.f2-ex{background:#f3f6fb}
.f2-ex__lead{font-size:16px;line-height:1.7;margin:10px 0 0 52px}
.f2-ex__lead a{color:var(--blue);text-underline-offset:3px}
.f2-ex__more{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:18px}
.f2-ex__more p{font-family:var(--f-display);font-weight:900;font-size:17px;margin:0}
.f2-ex__more .c-chips{margin:0}
.f2-rows{list-style:none;margin:20px 0 0;padding:0;background:#fff;border:1px solid #cfd8e4;border-radius:10px}
.f2-rows>li{display:grid;grid-template-columns:230px minmax(0,1fr) 250px;gap:0 30px;padding:20px 26px}
.f2-rows>li+li{border-top:1px solid #dfe5ee}
.f2-r__who small{display:block;font-size:14.5px;font-weight:700;color:var(--ink)}
.f2-r__body b em{font-style:normal;color:#e86a00}
.f2-r__body b{display:block;font-family:var(--f-display);font-weight:900;font-size:20px;line-height:1.45}
.f2-r__body p{font-size:15px;line-height:1.75;margin:6px 0 0}
.f2-r__st small{display:block;font-size:12.5px;font-weight:700;color:var(--mute)}
.f2-r__st span{display:block;font-size:15px;font-weight:700;line-height:1.5;margin-top:2px}
.f2-r__st a{display:block;font-size:13px;font-weight:700;line-height:1.5;color:var(--or-d);margin-top:8px;text-underline-offset:3px}
.f2-tags{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0;padding:0;list-style:none}
.f2-tags li{font-size:12.5px;font-weight:700;line-height:1.3;color:var(--blue);border:1px solid #9db4cf;border-radius:4px;padding:3px 7px}

.f2-free{background:#fff}
.f2-sum{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px 24px;margin:22px 0 0;background:#eaf1f9;border-radius:10px;padding:20px 24px}
.f2-sum figure{margin:0;display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #c5d6ea;border-radius:8px;padding:12px 22px;font-family:var(--f-display);font-size:19px;font-weight:900}
.f2-sum figure svg{display:block;width:44px;height:44px;flex:none}
.f2-sum figure b{font-weight:900;color:var(--or-d);margin-left:8px}
.f2-sum span{font-size:32px;font-weight:700;color:#7b8796}
.f2-sum strong{font-family:var(--f-display);font-weight:900;font-size:60px;line-height:1;color:var(--or-d)}
.f2-sum strong small{font-size:26px}
.f2-why{font-family:var(--f-display);font-weight:700;font-size:18px;line-height:1.6;text-align:center;margin:14px 0 0}
.f2-fears{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 40px;list-style:none;margin:28px 0 0;padding:0}
.f2-fears li{display:grid;grid-template-columns:60px minmax(0,1fr);gap:0 16px;align-items:start}
.f2-fears svg{display:block;width:60px;height:60px}
.f2-fears b{display:block;font-family:var(--f-display);font-weight:900;font-size:19px;line-height:1.45}
.f2-fears p{font-size:14.5px;line-height:1.7;margin:3px 0 0}

.f2-go{background:var(--blue);color:#fff;padding:44px 0 46px}
.f2-go__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,560px);gap:0 48px;align-items:center}
.f2-go h2{font-weight:900;font-size:29px;line-height:1.45;margin:0;color:#fff}
.f2-go .c-go__btn{margin-top:20px}
.f2-go p.f2-pr{font-size:14.5px;line-height:1.6;color:var(--sky);margin:12px 0 0}
/* まず話を聞きたい人の入口：電話とメール。メールは聞きたい事を選ぶと、お問い合わせの窓が開く */
.f2-talk{background:#fff;color:var(--ink);border-radius:12px;padding:22px 26px 20px;box-shadow:0 6px 24px rgba(5,20,45,.25)}
.f2-talk h3{font-weight:900;font-size:22px;line-height:1.4;margin:0}
.f2-talk__tel{display:flex;align-items:center;gap:12px;margin:12px 0 0;padding:10px 0 14px;border-bottom:1px solid #dfe5ee;color:var(--ink);text-decoration:none}
.f2-talk__tel svg{flex:none;width:44px;height:44px}
.f2-talk__tel small{display:block;font-size:13px;font-weight:700;color:var(--mute)}
.f2-talk__tel b{display:block;font-family:var(--f-display);font-weight:900;font-size:36px;line-height:1.1;letter-spacing:.02em;color:var(--blue)}
.f2-talk__mail{display:flex;align-items:center;gap:12px;margin-top:14px}
.f2-talk__mail svg{flex:none;width:44px;height:44px}
.f2-talk__mail b{display:block;font-family:var(--f-display);font-weight:900;font-size:19px;line-height:1.4}
.f2-talk__mail small{display:block;font-size:13px;font-weight:700;color:var(--mute)}
.f2-pick{display:grid;grid-template-columns:1fr 1fr;gap:8px;list-style:none;margin:12px 0 0;padding:0}
.f2-pick button{display:block;width:100%;height:100%;text-align:left;font:inherit;font-size:14.5px;font-weight:700;line-height:1.45;color:var(--blue);background:#f3f6fb;border:1.5px solid #9db4cf;border-radius:8px;padding:10px 12px;cursor:pointer}
.f2-pick button:hover,.f2-pick button:focus-visible{border-color:#5f86b3;background:#eaf1f9}
.f2-talk__s{font-size:13px;line-height:1.6;color:var(--mute);margin:10px 0 0}
.f2-talk__s a{color:var(--blue);text-underline-offset:3px}
.ask-d textarea{width:100%;min-height:130px;font:inherit;font-size:15px;line-height:1.6;border:1px solid #c5d1e0;border-radius:6px;padding:8px 10px;box-sizing:border-box}
.ask-d input{width:100%;font:inherit;font-size:15px;border:1px solid #c5d1e0;border-radius:6px;padding:8px 10px;box-sizing:border-box}
.f2-note{font-size:12.5px;line-height:1.6;color:var(--mute);text-align:right;margin:8px 0 0}

@media (max-width:899px){
  .f2-sec,.f2-go{padding:34px 0}
  .f2-q{font-size:22px;gap:10px;align-items:flex-start}
  .f2-q::before{width:32px;height:32px;font-size:17px}
  .f2-what__top{grid-template-columns:minmax(0,1fr);gap:14px 0}
  .f2-what__logo{max-width:200px;padding:12px 16px}
  .f2-what__top b{font-size:21px}
        .f2-mk__g{grid-template-columns:minmax(0,1fr);gap:10px}
  .f2-num em{font-size:60px}
  .f2-box .f2-seg{margin-top:12px}
  .f2-seg{height:48px}
  .f2-seg i{font-size:14.5px}
  .f2-seg__l{font-size:12.5px}
  .f2-mk__t li{font-size:14px;padding:5px 10px}
  .f2-mk__t li.x{font-size:15px}
  .f2-mk__e{font-size:16.5px}
  .f2-sum{padding:14px 12px;gap:6px 10px;flex-direction:column}
  .f2-sum figure{font-size:16px;padding:8px 14px;gap:8px;width:100%;box-sizing:border-box;justify-content:center}
  .f2-sum figure svg{width:32px;height:32px}
  .f2-sum span{font-size:22px;line-height:1}
  .f2-sum strong{font-size:40px}
  .f2-sum strong small{font-size:18px}
  .f2-why{font-size:15.5px}
  .f2-fears{grid-template-columns:minmax(0,1fr);gap:16px}
  .f2-fears li{grid-template-columns:48px minmax(0,1fr);gap:0 12px}
  .f2-fears svg{width:48px;height:48px}
  .f2-fears b{font-size:17px}
  .f2-go h2{font-size:22px}
  .f2-go .c-go__btn{flex-direction:column}
  .f2-ex__lead{margin-left:0;font-size:15px}
  .f2-rows>li{grid-template-columns:minmax(0,1fr);gap:8px 0;padding:16px}
  .f2-r__body b{font-size:17px}
  .f2-r__body p{font-size:14px}
  .f2-go__in{grid-template-columns:minmax(0,1fr);gap:26px 0}
  .f2-talk{padding:18px 16px 16px}
  .f2-talk h3{font-size:19px}
  .f2-talk__tel b{font-size:30px}
  .f2-talk__tel svg,.f2-talk__mail svg{width:38px;height:38px}
  .f2-pick{grid-template-columns:minmax(0,1fr)}
}
/* 出すと何が届くか：トップの「サービスの流れ」6段と同じ。絵は模式図。件ごとの2行は元の <!--HERE5:…--> <!--HERE6:…--> から入る */
.n3-get{background:#fff;padding:50px 0 52px}
.n3-get h2{font-weight:900;font-size:30px;line-height:1.4;color:var(--ink)}
.n3-get .n3-lead{font-size:16px;line-height:1.7;margin-top:6px}
.n3-get .n3-lead a{color:var(--blue);text-underline-offset:3px}
.n3-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 30px;list-style:none;margin:26px 0 0;padding:0}
.n3-steps>li{display:flex;flex-direction:column}
.n3-t{display:flex;align-items:flex-start;gap:10px;font-family:var(--f-display);font-weight:900;font-size:18px;line-height:1.45}
.n3-t i{flex:none;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--blue);color:#fff;font-style:normal;font-size:16px;margin-top:-2px}
.n3-who{display:inline-block;font-size:12px;font-weight:700;line-height:1.3;color:var(--mute);border:1px solid #c5cfdb;border-radius:3px;padding:2px 7px;margin:4px 0 0 40px;align-self:flex-start}
.n3-who.u{color:#fff;background:var(--blue);border-color:var(--blue)}
.n3-scr{display:block;position:relative;height:260px;filter:grayscale(1);margin-top:10px;border:1px solid #c5cfdb;border-radius:8px;overflow:hidden;background:#fff;box-shadow:0 4px 14px rgba(20,35,58,.10)}
.n3-scr:hover{border-color:var(--blue)}
.n3-scr span{display:block;overflow:hidden;position:relative}
.n3-scr span+span{border-top:1px solid #dbe2ea}
.n3-scr img{display:block;position:absolute;left:var(--x,0);top:var(--y,0);width:var(--w);height:auto;max-width:none}
.n3-ill{height:auto;aspect-ratio:600/260;filter:none;background:#f3f6fb}
.n3-ill svg{display:block;width:100%;height:100%}
.n3-cap{font-size:14px;font-weight:700;line-height:1.6;margin-top:10px}
.n3-cap span{display:block;font-weight:400;font-size:13px;color:var(--mute);margin-top:2px}
.n3-here{display:block;margin-top:8px;background:var(--pale);border-left:4px solid var(--blue);padding:8px 12px;font-size:15px;font-weight:700;line-height:1.5;color:var(--blue)}
.n3-note{font-size:12.5px;color:var(--mute);margin-top:22px}
@media (max-width:899px){
  .n3-get{padding:34px 0}
  .n3-get h2{font-size:23px}
  .n3-steps{grid-template-columns:minmax(0,1fr);gap:26px}
  .n3-t{font-size:17px}
}
.c-bc{background:#fff;border-bottom:1px solid #e3e6ea}
.c-bc ol{display:flex;flex-wrap:wrap;gap:2px 0;list-style:none;margin:0 auto;padding:8px 24px;max-width:1280px;box-sizing:border-box;font-size:13px;line-height:1.5;color:#5b6068}
.c-bc li+li::before{content:"›";margin:0 8px;color:#9aa1a8}
.c-bc a{color:#14478a;text-decoration:none}
.c-bc a:hover{text-decoration:underline}
@media (max-width:899px){.c-bc ol{padding:6px 16px;font-size:12px}}
.m2{background:#eef3fa;padding:44px 0 42px}
.m2 h2{font-family:var(--f-display);font-weight:900;font-size:26px;line-height:1.4;color:var(--ink);margin:0;display:flex;align-items:center}
.m2-g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 20px;list-style:none;margin:22px 0 0;padding:0}
.m2-g a{display:flex;flex-direction:column;height:100%;background:#fff;border:1px solid #dde3ee;border-radius:10px;overflow:hidden;color:var(--ink);text-decoration:none;transition:border-color .15s,box-shadow .15s,transform .15s}
.m2-g a:hover{border-color:#14478a;box-shadow:0 6px 18px rgba(23,64,106,.16);transform:translateY(-2px)}
.m2-pic{display:block;aspect-ratio:1200/630;background:#14478a;overflow:hidden}
.m2-pic img,.m2-pic svg{display:block;width:100%;height:100%;object-fit:cover;object-position:left center}
.m2-t{display:flex;flex-direction:column;gap:5px;padding:12px 14px 16px}
.m2-t small{align-self:flex-start;font-size:12px;font-weight:700;line-height:1.3;color:#fff;background:#14478a;border-radius:3px;padding:3px 8px}
.m2-t small.c{background:#3d6fa8}
.m2-t small.r{background:#51627a}
.m2-t b{font-family:var(--f-display);font-weight:900;font-size:16.5px;line-height:1.45}
.m2-t span{font-size:13px;line-height:1.55;color:#4b5a6e}
.m2-foot{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:24px}
.m2-foot b{font-size:14px;font-weight:700}
.m2-foot .c-chips{margin:0}
.m2-foot p{font-size:12.5px;color:var(--mute);margin:0}
.m2-sw{display:none}
@media (max-width:899px){
  .m2{padding:34px 0 30px}
  .m2 h2{font-size:22px}
  .m2-g{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:76%;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;padding-bottom:10px}
  .m2-g li{scroll-snap-align:start}
  .m2-sw{display:block;font-size:12.5px;color:var(--mute);margin:6px 0 0}
}