@charset "UTF-8";
/* ==========================================================================
   SIIS 下層ページ共通CSS（2026-11-10 新デザイン）
   読み込み元：inc/siis-sub.php（header.php から）。top.css の後に読み込みます。
   色・文字・ボタンなどは top.css の :root と部品をそのまま使い、下層ページだけの部品をここに足しています。
   ========================================================================== */

/* 今いるページのメニューに印 */
.tp-nav a.is-current { color: var(--tp-blue-deep); }
.tp-nav a.is-current::after { content: ""; display: block; height: 2px; margin-top: 4px; border-radius: 2px; background: linear-gradient(90deg, var(--tp-mint) 50%, var(--tp-blue) 50%); }

/* ページの見出し帯 */
.sb-hero { position: relative; overflow: hidden; background: linear-gradient(180deg, var(--tp-paper) 0%, var(--tp-white) 100%); border-bottom: 1px solid var(--tp-hair); }
.sb-hero::after { content: ""; position: absolute; right: -120px; top: -160px; width: 460px; height: 460px; border-radius: 50%; background: radial-gradient(circle, rgba(20,184,166,.14) 0%, rgba(29,78,216,.06) 55%, transparent 70%); pointer-events: none; }
.sb-hero__inner { position: relative; z-index: 1; padding-top: clamp(28px, 3vw, 40px); padding-bottom: clamp(48px, 6vw, 80px); }
.sb-crumb { display: flex; flex-wrap: wrap; gap: 6px 10px; font-size: 12.5px; color: var(--tp-ink-2); }
.sb-crumb a { color: var(--tp-blue-deep); font-weight: 700; text-decoration: none; }
.sb-crumb a:hover { text-decoration: underline; text-underline-offset: 3px; }
.sb-crumb span[aria-hidden] { color: var(--tp-gray); }
.sb-hero .tp-eyebrow { margin-top: clamp(28px, 4vw, 48px); }
.sb-hero__title { margin-top: 18px; font-family: var(--tp-font-head); font-size: clamp(30px, 3.6vw, 48px); font-weight: 900; line-height: 1.35; letter-spacing: .04em; color: var(--tp-ink); font-feature-settings: "palt"; }
.sb-hero__lead > * + * { margin-top: .8em; }
.sb-hero__lead { max-width: 720px; margin-top: 18px; font-size: 15.5px; line-height: 2; letter-spacing: .03em; color: var(--tp-ink-2); text-wrap: pretty; }

/* ページ最後の相談帯の上の余白 */
.sb-cta-wrap { padding-top: 0; }
.sb-section-tight { padding-top: 48px; }

/* ページ内の目次（サービス） */
.sb-tabs { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 10px; }
.sb-tabs a { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 18px; border-radius: 999px; background: var(--tp-white); border: 1px solid var(--tp-hair-2); font-size: 14px; font-weight: 700; color: var(--tp-ink); text-decoration: none; box-shadow: 0 1px 3px rgba(15,26,60,.04); }
.sb-tabs a::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--tp-mint); }
.sb-tabs a.is-clean::before { background: var(--tp-blue); }

/* サービスの1ブロック */
.sb-block { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px 64px; align-items: start; }
.sb-block + .sb-block { margin-top: 96px; padding-top: 96px; border-top: 1px solid var(--tp-hair); }
.sb-block__tag { display: inline-flex; align-items: center; gap: 8px; height: 30px; padding: 0 12px; border-radius: 999px; background: var(--tp-green-tint); color: var(--tp-green); font-size: 12.5px; font-weight: 700; letter-spacing: .06em; }
.sb-block--clean .sb-block__tag { background: var(--tp-blue-tint); color: var(--tp-blue-deep); }
.sb-block__title { margin-top: 18px; font-family: var(--tp-font-head); font-size: clamp(24px, 2.4vw, 32px); font-weight: 900; line-height: 1.5; color: var(--tp-ink); font-feature-settings: "palt"; }
.sb-block__lead { margin-top: 16px; font-size: 15px; line-height: 2; letter-spacing: .03em; color: var(--tp-ink-2); }
.sb-block__photo { margin-top: 28px; overflow: hidden; border-radius: 22px; aspect-ratio: 4 / 3; background: var(--tp-photo-bg); box-shadow: 0 20px 40px -15px rgba(15,26,60,.12); }
.sb-block__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sb-check { padding: 28px 30px; border-radius: 22px; background: var(--tp-paper); }
.sb-check__title { font-size: 14px; font-weight: 700; letter-spacing: .06em; color: var(--tp-ink); }
.sb-check ul { margin-top: 14px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 20px; }
.sb-check li { display: flex; gap: 10px; font-size: 14.5px; line-height: 1.7; color: var(--tp-ink); }
.sb-check li::before { content: ""; flex: none; width: 18px; height: 18px; margin-top: 3px; border-radius: 5px; border: 1.5px solid var(--tp-green); background: var(--tp-white); }
.sb-block--clean .sb-check li::before { border-color: var(--tp-blue); }
.sb-points { margin-top: 20px; display: grid; gap: 14px; }
.sb-point { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 4px 16px; padding: 22px 24px; border-radius: 18px; background: var(--tp-white); border: 1px solid rgba(15,26,60,.08); box-shadow: 0 20px 40px -15px rgba(15,26,60,.05), 0 1px 3px rgba(15,26,60,.02); }
.sb-point__num { grid-row: span 2; font-family: var(--tp-font-en); font-size: 15px; font-weight: 700; letter-spacing: .08em; color: var(--tp-green); }
.sb-block--clean .sb-point__num { color: var(--tp-blue-deep); }
.sb-point h3 { font-family: var(--tp-font-head); font-size: 17px; font-weight: 900; line-height: 1.5; color: var(--tp-ink); }
.sb-point p { font-size: 14.5px; line-height: 1.85; color: var(--tp-ink-2); }
.sb-chips { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 8px; }
.sb-chips span { height: 32px; display: inline-flex; align-items: center; padding: 0 14px; border-radius: 999px; background: var(--tp-white); border: 1px solid var(--tp-hair-2); font-size: 13.5px; font-weight: 700; color: var(--tp-ink); }
.sb-block__cta { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 12px; }

/* 清掃メニューのカード（写真つき） */
.sb-menu { margin-top: 40px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 24px; }
.sb-menu__item { overflow: hidden; border-radius: 22px; background: var(--tp-white); border: 1px solid rgba(15,26,60,.08); box-shadow: 0 20px 40px -15px rgba(15,26,60,.05), 0 1px 3px rgba(15,26,60,.02); display: flex; flex-direction: column; }
.sb-menu__pic { position: relative; aspect-ratio: 16 / 10; background: var(--tp-photo-bg); }
.sb-menu__pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sb-menu__pic span { position: absolute; left: 12px; top: 12px; height: 26px; padding: 0 10px; display: inline-flex; align-items: center; border-radius: 999px; background: rgba(255,255,255,.92); font-size: 12px; font-weight: 700; color: var(--tp-ink); }
.sb-menu__body { flex: 1 1 auto; display: flex; flex-direction: column; padding: 22px 24px 24px; }
.sb-menu__body h3 { font-family: var(--tp-font-head); font-size: 18px; font-weight: 900; line-height: 1.5; color: var(--tp-ink); }
.sb-menu__body p { margin-top: 8px; font-size: 14px; line-height: 1.85; color: var(--tp-ink-2); }
.sb-menu__price { margin-top: auto; padding-top: 16px; display: flex; align-items: baseline; justify-content: space-between; gap: 8px; border-top: 1px solid var(--tp-hair); }
.sb-menu__price strong { font-family: var(--tp-font-en); font-size: 26px; font-weight: 800; color: var(--tp-ink); }
.sb-menu__price small { font-size: 12px; color: var(--tp-ink-2); }

/* 全ページ共通の相談帯 */
.sb-cta { position: relative; overflow: hidden; border-radius: 28px; padding: clamp(32px, 4vw, 56px); background: linear-gradient(145deg, var(--tp-blue-deep) 0%, var(--tp-blue) 100%); color: var(--tp-white); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px 40px; box-shadow: 0 30px 60px -20px rgba(29,78,216,.35); }
.sb-cta::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--tp-mint) 50%, var(--tp-blue-light) 50%); }
.sb-cta__title { font-family: var(--tp-font-head); font-size: clamp(22px, 2.4vw, 30px); font-weight: 900; line-height: 1.5; }
.sb-cta__text { margin-top: 8px; font-size: 14.5px; line-height: 1.9; color: rgba(255,255,255,.9); }
.sb-cta__btns { display: flex; flex-wrap: wrap; gap: 12px; }
.sb-cta .tp-btn--tel { color: var(--tp-white); border-color: rgba(255,255,255,.5); }
.sb-cta .tp-btn--tel .tp-btn__tel-label { color: rgba(255,255,255,.85); }

/* 施工事例の絞り込み */
.sb-filter { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 8px; }
.sb-filter a { height: 38px; display: inline-flex; align-items: center; padding: 0 16px; border-radius: 999px; border: 1px solid var(--tp-hair-2); background: var(--tp-white); font-size: 13.5px; font-weight: 700; color: var(--tp-ink); text-decoration: none; }
.sb-filter a.is-on { background: var(--tp-ink); border-color: var(--tp-ink); color: var(--tp-white); }

/* ページ送り */
.sb-pager { margin-top: 56px; display: flex; justify-content: center; gap: 8px; }
.sb-pager .page-numbers { min-width: 44px; height: 44px; padding: 0 8px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; border: 1px solid var(--tp-hair-2); font-family: var(--tp-font-en); font-weight: 700; color: var(--tp-ink); text-decoration: none; background: var(--tp-white); }
.sb-pager .page-numbers.current { background: var(--tp-ink); color: var(--tp-white); border-color: var(--tp-ink); }
.sb-pager .page-numbers.dots { border: 0; background: none; }

/* 記事本文 */
.sb-article { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 56px; align-items: start; }
.sb-article__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 13px; color: var(--tp-ink-2); }
.sb-article__eye { margin-top: 24px; overflow: hidden; border-radius: 22px; aspect-ratio: 16 / 9; background: var(--tp-photo-bg); }
.sb-article__eye img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sb-prose { margin-top: 36px; font-size: 16px; line-height: 2.05; letter-spacing: .03em; color: var(--tp-ink); }
.sb-prose > * + * { margin-top: 1.2em; }
.sb-prose h2 { margin-top: 2.4em; padding: 14px 18px; border-left: 4px solid var(--tp-mint); border-radius: 0 12px 12px 0; background: var(--tp-paper); font-family: var(--tp-font-head); font-size: 22px; font-weight: 900; line-height: 1.55; }
.sb-prose h3 { margin-top: 2em; font-family: var(--tp-font-head); font-size: 18px; font-weight: 900; }
.sb-prose ul { padding: 20px 24px; border-radius: 16px; border: 1px solid var(--tp-hair-2); }
.sb-prose li { position: relative; padding-left: 20px; }
.sb-prose li::before { content: ""; position: absolute; left: 2px; top: .85em; width: 7px; height: 7px; border-radius: 50%; background: var(--tp-mint); }
.sb-prose a { color: var(--tp-blue); text-underline-offset: 3px; }
.sb-side { position: sticky; top: calc(var(--tp-header-h) + 24px); display: grid; gap: 20px; }
.sb-side__box { padding: 26px; border-radius: 22px; background: var(--tp-white); border: 1px solid rgba(15,26,60,.08); box-shadow: 0 20px 40px -15px rgba(15,26,60,.06); }
.sb-side__box h3 { font-family: var(--tp-font-head); font-size: 17px; font-weight: 900; line-height: 1.5; color: var(--tp-ink); }
.sb-side__box p { margin-top: 8px; font-size: 13.5px; line-height: 1.85; color: var(--tp-ink-2); }
.sb-side__box .tp-btn { margin-top: 16px; width: 100%; }
.sb-side__list { margin-top: 12px; display: grid; gap: 12px; }
.sb-side__list a { font-size: 14px; font-weight: 700; line-height: 1.6; color: var(--tp-ink); text-decoration: none; }

/* 本文の表・画像・ボタンなど（WordPressのブロック） */
.sb-prose img { max-width: 100%; height: auto; border-radius: 14px; }
.sb-prose figure { margin: 1.6em 0; }
.sb-prose figcaption { margin-top: 8px; font-size: 13px; color: var(--tp-ink-2); }
.sb-prose table { width: 100%; border-collapse: collapse; font-size: 15px; }
.sb-prose th, .sb-prose td { padding: 12px 14px; border: 1px solid var(--tp-hair-2); text-align: left; vertical-align: top; }
.sb-prose th { background: var(--tp-paper); font-weight: 700; }
.sb-prose ol { padding-left: 1.4em; list-style: decimal; }
.sb-prose ol li { padding-left: 4px; }
.sb-prose ol li::before { content: none; }
.sb-prose strong { font-weight: 700; }
.sb-prose blockquote { padding: 16px 20px; border-left: 4px solid var(--tp-blue); background: var(--tp-paper); border-radius: 0 12px 12px 0; }
.sb-prose .wp-block-button__link { display: inline-flex; align-items: center; min-height: 48px; padding: 0 22px; border-radius: 999px; background: var(--tp-blue); color: var(--tp-white); font-weight: 700; text-decoration: none; }
.sb-prose .alignwide, .sb-prose .alignfull { max-width: 100%; }
.sb-prose iframe { max-width: 100%; }
.sb-prose--page { max-width: 860px; margin-top: 0; }

/* 会社概要 */
.sb-note { margin-top: 12px; font-size: 13px; line-height: 1.8; color: var(--tp-ink-2); }
.sb-form-note { margin-top: 14px; text-align: center; font-size: 12.5px; line-height: 1.8; color: var(--tp-ink-2); }
.sb-form-note a { color: var(--tp-ink-2); }
.sb-greeting { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px 64px; align-items: center; }
.sb-greeting__photo { overflow: hidden; border-radius: 24px; aspect-ratio: 4 / 3; background: var(--tp-photo-bg); }
.sb-greeting__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sb-greeting__sign { margin-top: 20px; font-size: 14px; font-weight: 700; color: var(--tp-ink); }
.sb-map { flex: 1 1 420px; min-height: 360px; background: var(--tp-paper); }
.sb-map iframe { display: block; width: 100%; height: 100%; min-height: 360px; border: 0; }

/* お問い合わせ */
.sb-channels { margin-top: 40px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 20px; }
.sb-channel { padding: 28px; border-radius: 22px; background: var(--tp-white); border: 1px solid rgba(15,26,60,.08); box-shadow: 0 20px 40px -15px rgba(15,26,60,.05), 0 1px 3px rgba(15,26,60,.02); display: flex; flex-direction: column; gap: 10px; }
.sb-channel--line { border: 2px solid var(--tp-line); }
.sb-channel__label { font-size: 12.5px; font-weight: 700; letter-spacing: .08em; color: var(--tp-ink-2); }
.sb-channel__title { font-family: var(--tp-font-head); font-size: 20px; font-weight: 900; line-height: 1.5; color: var(--tp-ink); }
.sb-channel p:not([class]) { font-size: 14px; line-height: 1.85; color: var(--tp-ink-2); }
.sb-channel .tp-btn { margin-top: auto; }
.sb-contact { margin-top: 64px; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px 56px; align-items: start; }
.sb-contact .tp-form { box-shadow: 0 30px 60px -30px rgba(15,26,60,.25); border: 1px solid rgba(15,26,60,.08); }

/* 404 */
.sb-404 { text-align: center; padding: 40px 0 20px; }
.sb-404__num { font-family: var(--tp-font-en); font-size: clamp(80px, 12vw, 140px); font-weight: 800; line-height: 1; background: linear-gradient(90deg, var(--tp-mint), var(--tp-blue)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sb-404 p:not([class]) { margin-top: 18px; font-size: 15.5px; line-height: 2; color: var(--tp-ink-2); }
.sb-404__links { margin-top: 28px; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }

/* 文字だけのページ（プライバシーポリシーなど） */
.sb-doc { max-width: 820px; margin: 0 auto; }

@media (max-width: 960px) {
  .sb-block, .sb-greeting, .sb-contact, .sb-article { grid-template-columns: minmax(0, 1fr); }
  .sb-block + .sb-block { margin-top: 64px; padding-top: 64px; }
  .sb-side { position: static; }
}
@media (max-width: 600px) {
  .sb-check { padding: 22px 20px; }
  .sb-check ul { grid-template-columns: minmax(0, 1fr); }
  .sb-cta__btns, .sb-cta__btns .tp-btn { width: 100%; }
  .sb-tabs a { height: 40px; padding: 0 14px; font-size: 13px; }
}

/* 本番用の調整 */
.sb-tabs--float { margin-top: -22px; position: relative; z-index: 2; }
.sb-points--top { margin-top: 0; }
.sb-grid-top { margin-top: 0; }
.sb-empty { padding: 40px 0; font-size: 15.5px; line-height: 2; color: var(--tp-ink-2); }
.sb-faq { margin-top: 24px; }
.sb-area-title { margin-top: 48px; font-size: 22px; }
.sb-404__title { margin-top: 16px; }
.sb-side__title { font-family: var(--tp-font-head); font-size: 17px; font-weight: 900; line-height: 1.5; color: var(--tp-ink); }
.tp-price { margin-top: 64px; }

/* 文章の多いページ（空室クリーニング・管理会社様向け・足立区ネズミ防除） */
.sb-doc > * { max-width: 980px; }
.sb-doc__sec + .sb-doc__sec { margin-top: 64px; padding-top: 56px; border-top: 1px solid var(--tp-hair); }
.sb-doc__h2 { position: relative; padding-left: 18px; font-family: var(--tp-font-head); font-size: clamp(21px, 2.2vw, 26px); font-weight: 900; line-height: 1.5; color: var(--tp-ink); font-feature-settings: "palt"; text-wrap: balance; }
.sb-doc__h2::before { content: ""; position: absolute; left: 0; top: .2em; bottom: .2em; width: 5px; border-radius: 3px; background: linear-gradient(180deg, var(--tp-mint) 50%, var(--tp-blue) 50%); }
.sb-doc .sb-chips { margin-top: 20px; }
.sb-doc .sb-points { margin-top: 24px; }
.sb-text { margin-top: 18px; }
.sb-text p { font-size: 15.5px; line-height: 2; letter-spacing: .03em; color: var(--tp-ink-2); text-wrap: pretty; }
.sb-text p + p { margin-top: 12px; }
.sb-links { margin-top: 18px; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.sb-box { margin-top: 20px; padding: 24px 26px; border-radius: 20px; background: var(--tp-paper); border: 1px solid rgba(15,26,60,.06); }
.sb-box--pest { border-top: 4px solid var(--tp-mint); background: var(--tp-white); box-shadow: 0 20px 40px -15px rgba(15,26,60,.06); }
.sb-box--clean { border-top: 4px solid var(--tp-blue); background: var(--tp-white); box-shadow: 0 20px 40px -15px rgba(15,26,60,.06); --c-accent: var(--tp-blue); --c-text: var(--tp-ink); }
.sb-box--pest { --c-accent: var(--tp-green); --c-text: var(--tp-ink); }
.sb-box__title { font-family: var(--tp-font-head); font-size: 17px; font-weight: 900; line-height: 1.5; color: var(--tp-ink); }
.sb-box .tp-list { margin-top: 12px; }
.sb-box .sb-chips { margin-top: 12px; }
.sb-box__lead { font-size: 15.5px; font-weight: 700; line-height: 1.9; color: var(--tp-ink); }
.sb-box .sb-note { margin-top: 10px; }
.sb-two { margin-top: 20px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 16px; }
.sb-two .sb-box { margin-top: 0; }
.sb-ba { margin-top: 24px; max-width: 640px; border-radius: 18px; overflow: hidden; }
.sb-back { margin-top: 32px; }
.sb-card-desc { margin-top: 8px; font-size: 13.5px; line-height: 1.8; color: var(--tp-ink-2); }
.tp-mini--clean { background: var(--tp-blue-tint); color: var(--tp-blue-deep); }

/* 空室クリーニングの料金表 */
.sb-ptables { margin-top: 16px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 20px; }
.sb-ptable { overflow: hidden; border-radius: 20px; background: var(--tp-white); border: 1px solid rgba(15,26,60,.08); box-shadow: 0 20px 40px -15px rgba(15,26,60,.06); }
.sb-ptable__head { padding: 14px 20px; background: linear-gradient(145deg, var(--tp-blue-deep) 0%, var(--tp-blue) 100%); color: var(--tp-white); font-family: var(--tp-font-head); font-size: 17px; font-weight: 900; }
.sb-ptable table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.sb-ptable th { padding: 10px 16px; background: var(--tp-paper); font-size: 12.5px; font-weight: 700; color: var(--tp-ink-2); text-align: right; }
.sb-ptable th:first-child, .sb-ptable td:first-child { text-align: left; }
.sb-ptable td { padding: 12px 16px; border-top: 1px solid var(--tp-hair); text-align: right; color: var(--tp-ink-2); }
.sb-ptable td:first-child { font-weight: 700; color: var(--tp-ink); }
.sb-ptable td:last-child { font-family: var(--tp-font-en); font-weight: 800; color: var(--tp-blue-deep); white-space: nowrap; }
