/* ── 120点のブラッシュアップ（2026-09-22）。support.css のあとに読み込む ── */
/* サポートへの連絡の帯 */
.sp-contact{background:#1D2D50;color:#fff;padding:40px 0}
.sp-contact h2{font-size:24px;font-weight:900;color:#fff;margin-bottom:24px}
.sp-contact-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:24px}
.sp-contact-grid>div{padding:24px;border:3px solid #fff;border-radius:24px;min-width:0}
.sp-contact .cap{background:#F48B21;color:#1D2D50}
.sp-contact p{margin-top:16px;font-size:17px;line-height:1.75;color:#fff;max-width:none}
.sp-contact p b{color:#fff}
.sp-tel{display:inline-flex;align-items:baseline;gap:12px;min-height:56px;margin-top:8px;font-size:36px;font-weight:900;line-height:1.3;color:#fff;text-decoration:none;font-variant-numeric:tabular-nums;white-space:nowrap;box-shadow:inset 0 -8px 0 #F48B21}
.sp-tel small{font-size:15px;font-weight:700;color:#C9D6EC}
.sp-hours{margin:16px 0 0}
.sp-hours>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 24px;padding:16px 0;border-top:1px solid #3B5488;align-items:center}
.sp-hours>div:first-child{border-top:0;padding-top:0}
.sp-hours dt{font-size:16px;font-weight:700;line-height:1.6;color:#fff}
.sp-hours dd{margin:0;font-size:28px;font-weight:900;line-height:1.3;color:#fff}
.sp-hours dd small{display:block;margin-top:4px;font-size:14px;font-weight:400;line-height:1.6;color:#C9D6EC}
.sp-site .sp-contact .text-link{color:#fff;margin-top:8px}

/* 症状から探す */
.sp-sym{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.sp-sym>li{margin:0;padding:24px;border:3px solid #1D2D50;border-radius:24px;background:#fff;min-width:0}
.sp-sym>li:nth-child(3n+1){box-shadow:8px 8px 0 #3B5488}
.sp-sym>li:nth-child(3n+2){background:#E9EEF6}
.sp-sym h3{font-size:22px;font-weight:900;line-height:1.5;color:#1D2D50;padding-bottom:12px;border-bottom:2px dashed #1D2D50}
.sp-sym ul{list-style:none;margin:8px 0 0;padding:0}
.sp-sym ul li{margin:0}
.sp-sym ul a{position:relative;display:flex;align-items:center;min-height:48px;padding:8px 24px 8px 0;font-size:17px;font-weight:700;line-height:1.5;color:#1D2D50;text-decoration:none}
.sp-sym ul a::after{content:"";position:absolute;right:4px;top:50%;width:8px;height:8px;border-top:2px solid #1D2D50;border-right:2px solid #1D2D50;transform:translateY(-50%) rotate(45deg)}
.sp-sym ul a:hover{text-decoration:underline;text-decoration-color:#F48B21;text-decoration-thickness:3px}
.sp-site .band .note a{color:#1D2D50;font-weight:700;text-decoration:underline;text-decoration-color:#F48B21;text-decoration-thickness:3px}

/* リモートサポートの3つの手順 */
.sp-remote-head{display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:40px;align-items:end;margin-bottom:48px}
.sp-remote-head .sec-lead{margin-top:24px}
.sp-remote-robo{display:block;width:150px;height:auto;margin-bottom:-72px;position:relative;z-index:1}
.sp-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;counter-reset:sps}
.sp-steps li{position:relative;margin:0;padding:48px 24px 24px;border:3px solid #1D2D50;border-radius:24px;background:#fff;counter-increment:sps;min-width:0}
.sp-steps li::before{content:counter(sps);position:absolute;top:-28px;left:24px;display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:#F48B21;border:3px solid #1D2D50;color:#1D2D50;font-size:26px;font-weight:900}
.sp-steps li+li::after{content:"";position:absolute;left:-24px;top:50%;width:12px;height:12px;border-top:3px solid #1D2D50;border-right:3px solid #1D2D50;transform:translateY(-50%) rotate(45deg)}
.sp-steps b{display:block;font-size:22px;font-weight:900;line-height:1.5;color:#1D2D50}
.sp-steps p{margin-top:8px;font-size:17px;line-height:1.75;max-width:none}
.sp-site #sp-remote .button-group{margin-top:40px;align-items:center;gap:16px 32px}

/* よく使うもの: 大と小の2段 */
.sp-quick.big{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:16px}
.sp-cap2{margin-top:48px}
.sp-quick.small{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
.sp-quick.small a{padding:16px 24px;border-width:2px;border-radius:16px}
.sp-quick.small h3{margin-top:0;font-size:18px}
.sp-quick.small p{margin:4px 0 0;font-size:15px}

/* 電話に出る人たち */
.sp-people{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:32px 24px}
.sp-people li{margin:0;flex:none;width:calc((100% - 72px)/4);min-width:0}
.sp-people figure{margin:0;border:3px solid #1D2D50;border-radius:24px;background:#fff;overflow:hidden;aspect-ratio:1}
.sp-people img{display:block;width:100%;height:100%;object-fit:contain}
.sp-people p{margin-top:12px;font-size:16px;line-height:1.75;max-width:none}

/* サポートの範囲と時間 */
.sr-plans{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:stretch}
.sr-plans>li{margin:0;padding:32px 24px;border:3px solid #1D2D50;border-radius:24px;background:#fff;min-width:0}
.sr-plans>li.pick{box-shadow:8px 8px 0 #F48B21}
.sr-time{margin:0;padding-bottom:16px;border-bottom:2px dashed #1D2D50;max-width:none}
.sr-time small{display:inline-block;font-size:14px;font-weight:900;color:#fff;background:#1D2D50;border-radius:999px;padding:2px 16px}
.sr-time b{display:block;margin-top:8px;font-size:40px;font-weight:900;line-height:1.2;color:#1D2D50;font-variant-numeric:tabular-nums;white-space:nowrap}
.sr-plans h3{margin-top:16px;font-size:21px;font-weight:900;line-height:1.5;color:#1D2D50}
.sr-plans>li>p{margin-top:8px;font-size:17px;line-height:1.75;max-width:none}
.sr-plans .check-list li{font-size:16px;line-height:1.7;padding:6px 0 6px 36px}
.sr-plans .check-list li::before{top:14px}
.sr-plans .note{margin-top:8px;font-size:15px}
.sr-toc{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:40px}
.sr-toc a{display:inline-flex;align-items:center;min-height:44px;padding:4px 20px;border:2px solid #1D2D50;border-radius:999px;background:#fff;color:#1D2D50;font-size:16px;font-weight:700;text-decoration:none}
.sr-toc a:hover{background:#1D2D50;color:#fff}
.sr-ranges{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
.sr-range{padding:32px;border:3px solid #1D2D50;border-radius:24px;background:#fff;min-width:0;scroll-margin-top:24px}
.sr-range h3{font-size:24px;font-weight:900;line-height:1.5;color:#1D2D50}
.sr-range h4{margin-top:24px;font-size:16px;font-weight:900;color:#fff;background:#1D2D50;border-radius:999px;padding:2px 16px;display:inline-block}
.sr-cond{margin-top:8px;font-size:16px;line-height:1.75;color:#000;max-width:none}
.sr-range .check-list{margin-top:8px}
.sr-range .check-list li{font-size:17px;line-height:1.7;padding:6px 0 6px 36px}
.sr-range .check-list li::before{top:15px}
.sr-range .note{margin-top:16px;font-size:15px;line-height:1.75}
.sp-site #sr-out .panel p+p{margin-top:16px}

/* 記事の最後の出口／見つからない時の案内 */
.sp-handoff{margin-top:64px;padding:32px;border:3px solid #1D2D50;border-radius:24px;background:#E9EEF6}
.sp-site .prose .sp-handoff h2{margin:0;padding:0;border:0;font-size:22px;font-weight:900;color:#1D2D50;background:none}
.sp-handoff p{margin-top:12px;font-size:17px;line-height:1.75}
.sp-handoff .sp-say{padding:16px 24px;border:2px solid #1D2D50;border-radius:16px;background:#fff;font-weight:700;color:#1D2D50}
.sp-lost{display:grid;grid-template-columns:120px minmax(0,1fr);gap:32px;align-items:center;padding:32px;border:3px solid #1D2D50;border-radius:24px;background:#fff;box-shadow:8px 8px 0 #3B5488}
.sp-lost img{display:block;width:100%;height:auto}
.sp-lost h2{font-size:24px;font-weight:900;line-height:1.5;color:#1D2D50}
.sp-lost p{margin-top:8px;font-size:17px;line-height:1.75;max-width:none}

/* フッター: 下の余白を詰める（追従ボタンが無いので、会社サイトほどの余白は要らない） */
.sp-site .site-footer{padding-bottom:40px}

@media (max-width:1024px){
.sp-contact-grid{grid-template-columns:minmax(0,1fr)}
.sp-sym{grid-template-columns:repeat(2,minmax(0,1fr))}
.sp-steps{grid-template-columns:minmax(0,1fr);gap:48px}
.sp-steps li+li::after{left:50%;top:-36px;transform:translateX(-50%) rotate(135deg)}
.sp-quick.big,.sp-quick.small{grid-template-columns:minmax(0,1fr)}
.sp-people li{width:calc((100% - 48px)/3)}
.sr-plans{grid-template-columns:minmax(0,1fr)}
.sr-ranges{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:767px){
/* 分類のメニュー: 横に流さず、折り返してすべて見せる */
.sp-nav-inner{flex-wrap:wrap;overflow-x:visible;gap:4px}
.sp-nav a{min-height:44px;padding:4px 10px;font-size:14px}
.sp-contact{padding:32px 0}
.sp-contact-grid>div{padding:20px}
.sp-tel{font-size:30px}
.sp-hours>div{grid-template-columns:minmax(0,1fr)}
.sp-hours dd{font-size:24px}
.sp-sym{grid-template-columns:minmax(0,1fr);gap:16px}
.sp-sym>li{padding:20px}
.sp-sym h3{font-size:20px}
.sp-remote-head{grid-template-columns:minmax(0,1fr) 88px;gap:16px;margin-bottom:40px}
.sp-remote-robo{width:88px;margin-bottom:-56px}
.sp-steps b{font-size:20px}
.sp-people{gap:24px 16px}
.sp-people li{width:calc((100% - 16px)/2)}
.sp-people p{font-size:15px}
.sr-time b{font-size:34px}
.sr-range{padding:24px 20px}
.sr-range h3{font-size:21px}
.sp-handoff{padding:24px 20px;margin-top:48px}
.sp-lost{grid-template-columns:72px minmax(0,1fr);gap:16px;padding:24px 20px}
.sp-lost h2{font-size:20px}
}

/* ── 目視検証（2026-09-22）の指摘の直し ── */
/* 記事の本文: 番号つきの手順の番号を戻す。前のテーマの部品（関連記事の囲み・吹き出し）を今の見た目に寄せる */
.sp-site .prose ol{list-style:decimal;padding-left:1.6em;margin-bottom:24px}
.sp-site .prose ul:not([class*="blocks-gallery"]){list-style:disc;padding-left:1.4em;margin-bottom:24px}
.sp-site .prose ol li,.sp-site .prose ul li{list-style:inherit}
.sp-site .prose .wp-block-emanon-blocks-block-speech-bubble{margin-top:24px}
.sp-site .prose .eb-block-showcase-box,.sp-site .prose .wp-block-emanon-blocks-showcase-box>div{border:3px solid #1D2D50;border-radius:24px;overflow:hidden}
.sp-site .prose .showcase-box-btn-content a,.sp-site .prose a.block-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:8px 32px;border:3px solid #1D2D50;border-radius:999px;background:#fff;color:#1D2D50;font-size:16px;font-weight:700;text-decoration:none}
.sp-site .prose .showcase-box-btn-content a:hover,.sp-site .prose a.block-btn:hover{background:#F48B21}
.sp-site .prose figure.wp-block-embed.is-type-video iframe{border:3px solid #1D2D50;border-radius:24px;box-sizing:border-box}
/* リンクの色を紺にそろえる（紺の地の上は白） */
.sp-site .text-link{color:#1D2D50}
.sp-site .sp-contact .text-link,.sp-site .band-navy>.container>.sec-head .text-link{color:#fff}
/* 白いカードのリンクを下端にそろえる */
.sp-site .cards-3 .panel{display:flex;flex-direction:column}
.sp-site .cards-3 .panel .text-link{margin-top:auto;align-self:flex-start}
.sp-site .cards-3 .panel p{margin-bottom:16px}
/* 大切なお知らせの帯と、2列の新着 */
.sp-notice{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px 24px;align-items:center;margin-bottom:24px;padding:20px 32px;border:3px solid #1D2D50;border-radius:24px;background:#fff;box-shadow:8px 8px 0 #F48B21;text-decoration:none;color:#1D2D50}
.sp-notice b{font-size:20px;font-weight:900;line-height:1.5;color:#1D2D50}
.sp-notice time{font-size:15px;font-weight:700;color:#666;font-variant-numeric:tabular-nums}
.sp-notice:hover b{text-decoration:underline;text-decoration-color:#F48B21;text-decoration-thickness:3px}
.sp-cols.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.sp-more{margin-top:24px;max-width:none}
/* 手続きと資料の小さいカードにも、押せる印を付ける */
.sp-quick.small a{position:relative;padding-right:48px}
.sp-quick.small a::after{content:"";position:absolute;right:24px;top:50%;width:10px;height:10px;border-top:3px solid #1D2D50;border-right:3px solid #1D2D50;transform:translateY(-50%) rotate(45deg)}
/* サポートの範囲: カードを2段組みで詰める。絵の無い一覧の面は低くする */
.sr-ranges{display:block;columns:2;column-gap:24px}
.sr-range{break-inside:avoid;margin-bottom:24px}
.post-list figure.no-thumb{aspect-ratio:3/1}
@media (max-width:1024px){
.sr-ranges{columns:1}
.sp-cols.two{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:767px){
.sp-notice{grid-template-columns:minmax(0,1fr);padding:20px;box-shadow:6px 6px 0 #F48B21}
.sp-notice .cap{justify-self:start}
.sp-notice b{font-size:18px}
.sp-lost{grid-template-columns:minmax(0,1fr)}
.sp-lost img{width:72px}
.sp-footer .footer-nav div{display:block}
.sp-people p{text-wrap:pretty}
}