/* ==========================================================================
   O&M事例 共通CSS  v1.2   (mainte-case.css)   ※v1.1: CTA見出し可視化修正／※v1.2: 2026-08-30 ヒーロー見出しを縮小（48px→33px上限・スマホ30px上限）
   --------------------------------------------------------------------------
   用途：/mainte/case/ 配下のO&M作業実績ページ（点検・PCS修理・除草・洗浄・
         是正・通信・災害対応など）で共通利用するデザイン資産。
   設置：子テーマの /css/mainte-case.css に置き、mainte_case 個別ページのみ
         読み込む（functions.php に is_singular('mainte_case') で enqueue 追加済み。
         既存の md-column.css と同じ方式）。各記事の本文<style>は2600を最後に廃止。
   出典：2600（富士市コンビニ屋根上点検）の完成インラインCSSを掃除して昇格。
   互換：ラッパーは新 .mainte-case-wrap を正とし、:is() で旧 .mainte-roofcase-wrap
         も当面マッチさせる。全4ページが .mainte-case-wrap へ移行完了したら、
         各セレクタの :is(.mainte-case-wrap, .mainte-roofcase-wrap) を
         .mainte-case-wrap へ一括置換して旧エイリアスを削除してよい。
   変更点（2600インライン版からの掃除）：
     - #point 専用CSS → 用途ベースの .mrc-tech-points / .mrc-tech-card へ汎用化
     - #same 専用CSS → 削除（一般論ブロックは減量方針のため）。
       箱組みリストが必要な事例向けに .mrc-list.mrc-list-boxed を任意提供。
   ========================================================================== */

/* ===== WRAP / 基本 ===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) {
--mrc-text: #0b1220;
--mrc-sub: #1f2937;
--mrc-muted: #4b5563;
--mrc-line: #9ca3af;
--mrc-line-strong: #6b7280;
--mrc-soft: #eef2f5;
--mrc-soft-strong: #e5ebef;
--mrc-blue: #075f7a;
--mrc-blue2: #073b4c;
--mrc-yellow: #f2a900;
--mrc-white: #fff;
color: #0b1220 !important;
font-size: 17.5px !important;
line-height: 1.95 !important;
font-weight: 500 !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) * {
box-sizing: border-box !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) p,
:is(.mainte-case-wrap, .mainte-roofcase-wrap) li,
:is(.mainte-case-wrap, .mainte-roofcase-wrap) td,
:is(.mainte-case-wrap, .mainte-roofcase-wrap) figcaption {
color: #1f2937 !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) a {
color: #075f7a !important;
text-decoration: none !important;
font-weight: 800 !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) a:hover {
text-decoration: underline !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-container {
width: min(1120px, calc(100% - 32px)) !important;
margin: 0 auto !important;
}

/* ===== パンくず ===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-breadcrumb {
font-size: 15.5px !important;
color: #475569 !important;
margin: 14px 0 22px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-breadcrumb ol {
display: flex !important;
flex-wrap: wrap !important;
gap: 8px !important;
padding: 0 !important;
margin: 0 !important;
list-style: none !important;
}

/* ===== HERO：本文FVは画像なし。画像はWordPress側アイキャッチで表示 ===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-hero {
background: #f4f8fa !important;
border: 1.5px solid #9ca3af !important;
border-radius: 22px !important;
padding: 36px !important;
margin-bottom: 46px !important;
overflow: hidden !important;
box-shadow: 0 10px 28px rgba(15, 23, 42, .07) !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-eyebrow {
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
background: #dceff5 !important;
color: #073b4c !important;
border: 1.5px solid #86bdd0 !important;
border-radius: 999px !important;
padding: 7px 15px !important;
font-size: 14.5px !important;
font-weight: 900 !important;
margin: 0 0 18px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-hero-title {
max-width: 1040px !important;
font-size: clamp(24px, 2.6vw, 33px) !important; /* v1.2: ヒーロー見出しを縮小（旧 clamp(31px,4.1vw,48px) が大きすぎ） */
line-height: 1.4 !important;
font-weight: 950 !important;
letter-spacing: .02em !important;
margin: 0 !important;
color: #071923 !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-hero-body {
max-width: 920px !important;
margin-top: 24px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-hero-lead {
font-size: 18.5px !important;
line-height: 1.95 !important;
color: #1f2937 !important;
margin: 0 0 26px !important;
font-weight: 500 !important;
}

/* ===== BUTTON ===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-btns {
display: flex !important;
flex-wrap: wrap !important;
gap: 12px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-btn {
display: inline-flex !important;
min-height: 58px !important;
align-items: center !important;
justify-content: center !important;
padding: 14px 23px !important;
border-radius: 999px !important;
font-weight: 950 !important;
line-height: 1.35 !important;
text-align: center !important;
font-size: 16.5px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-btn-primary {
color: #fff !important;
background: #075f7a !important;
border: 2px solid #075f7a !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-btn-secondary {
color: #073b4c !important;
background: #fff !important;
border: 2px solid #86bdd0 !important;
}

/* ===== SECTION ===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-section {
margin: 58px 0 !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-section h2 {
font-size: clamp(25px, 3vw, 35px) !important;
line-height: 1.38 !important;
font-weight: 950 !important;
letter-spacing: .02em !important;
color: #071923 !important;
margin: 0 0 22px !important;
padding-bottom: 14px !important;
border-bottom: 4px solid #075f7a !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-section h3 {
font-size: 23px !important;
line-height: 1.45 !important;
font-weight: 950 !important;
color: #071923 !important;
margin: 32px 0 14px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-lead {
font-size: 18.5px !important;
color: #1f2937 !important;
margin: 0 0 24px !important;
font-weight: 500 !important;
}

/* ===== NOTE ===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-note {
background: #fff5d9 !important;
border: 1.5px solid #d8a600 !important;
border-left: 7px solid #f2a900 !important;
border-radius: 14px !important;
padding: 19px 21px !important;
margin: 26px 0 !important;
color: #1f2937 !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-note strong {
color: #4a3300 !important;
font-weight: 950 !important;
}

/* ===== CARD（汎用3カード。issues等で使用）===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-card-grid {
display: grid !important;
grid-template-columns: repeat(3, 1fr) !important;
gap: 18px !important;
margin-top: 24px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-card {
background: #fff !important;
border: 1.5px solid #9ca3af !important;
border-radius: 18px !important;
padding: 22px !important;
box-shadow: 0 8px 22px rgba(15, 23, 42, .07) !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-card strong {
display: block !important;
font-size: 18.5px !important;
color: #071923 !important;
margin-bottom: 8px !important;
font-weight: 950 !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-card p {
margin: 0 !important;
color: #1f2937 !important;
}

/* ===== 案件概要 TABLE ===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-overview-table {
width: 100% !important;
border-collapse: collapse !important;
background: #fff !important;
border: 1.5px solid #6b7280 !important;
border-radius: 18px !important;
overflow: hidden !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-overview-table th,
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-overview-table td {
border-bottom: 1.5px solid #9ca3af !important;
padding: 16px 18px !important;
vertical-align: top !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-overview-table th {
width: 30% !important;
background: #e5ebef !important;
color: #071923 !important;
font-weight: 950 !important;
text-align: left !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-overview-table td {
color: #1f2937 !important;
font-weight: 500 !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-overview-table tr:last-child th,
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-overview-table tr:last-child td {
border-bottom: none !important;
}

/* ===== PHOTO ===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-photo-grid {
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important;
gap: 22px !important;
margin-top: 26px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-photo {
background: #fff !important;
border: 1.5px solid #6b7280 !important;
border-radius: 18px !important;
overflow: hidden !important;
margin: 0 !important;
box-shadow: 0 8px 20px rgba(15, 23, 42, .08) !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-photo img {
width: 100% !important;
height: 310px !important;
object-fit: cover !important;
display: block !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-photo img.mrc-photo-contain {
object-fit: contain !important;
background: #f8fafc !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-photo figcaption {
padding: 15px 17px 17px !important;
font-size: 16px !important;
line-height: 1.8 !important;
color: #334155 !important;
border-top: 1.5px solid #9ca3af !important;
font-weight: 500 !important;
}

/* ===== FLOW（実施した確認内容など番号付き手順）===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-flow {
counter-reset: flow !important;
display: grid !important;
gap: 15px !important;
margin: 24px 0 0 !important;
padding: 0 !important;
list-style: none !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-flow li {
counter-increment: flow !important;
display: grid !important;
grid-template-columns: 54px 1fr !important;
gap: 15px !important;
align-items: start !important;
background: #fff !important;
border: 1.5px solid #9ca3af !important;
border-radius: 16px !important;
padding: 19px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-flow li::before {
content: counter(flow) !important;
width: 44px !important;
height: 44px !important;
border-radius: 999px !important;
background: #075f7a !important;
color: #fff !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
font-weight: 950 !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-flow strong {
color: #071923 !important;
font-weight: 950 !important;
}

/* ===== LIST（汎用）===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-list {
margin: 18px 0 0 !important;
padding-left: 1.3em !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-list li {
margin: 9px 0 !important;
color: #1f2937 !important;
font-weight: 500 !important;
}

/* 任意：箱組みリスト（旧#same相当。強調したいチェックリスト用の再利用クラス）*/
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-list.mrc-list-boxed {
background: #fff !important;
border: 1.5px solid #6b7280 !important;
border-radius: 18px !important;
padding: 22px 24px 22px 42px !important;
margin: 24px 0 26px !important;
box-shadow: 0 8px 20px rgba(15, 23, 42, .06) !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-list.mrc-list-boxed li {
margin: 10px 0 !important;
color: #111827 !important;
font-size: 17.5px !important;
line-height: 1.75 !important;
font-weight: 600 !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-list.mrc-list-boxed li::marker {
color: #075f7a !important;
font-size: 1.15em !important;
}

/* ===== SERVICE LINKS（関連サービス）===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-service-links {
display: grid !important;
grid-template-columns: repeat(4, 1fr) !important;
gap: 14px !important;
margin-top: 22px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-service-links a {
display: flex !important;
align-items: center !important;
min-height: 76px !important;
padding: 15px 16px !important;
border: 1.5px solid #86bdd0 !important;
border-radius: 16px !important;
background: #fff !important;
color: #073b4c !important;
font-weight: 950 !important;
}

/* ===== RELATED CASES（関連事例）===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-related {
display: grid !important;
grid-template-columns: repeat(3, 1fr) !important;
gap: 14px !important;
margin-top: 22px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-related a {
display: flex !important;
align-items: center !important;
min-height: 76px !important;
padding: 15px 16px !important;
border: 1.5px solid #9ca3af !important;
border-radius: 16px !important;
background: #fff !important;
color: #073b4c !important;
font-weight: 900 !important;
line-height: 1.5 !important;
box-shadow: 0 8px 20px rgba(15, 23, 42, .06) !important;
}

/* ===== FAQ（details）：点検依頼前の疑問に限定。FAQ本文のみ／FAQPage JSON-LDは付けない ===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-faq {
display: grid !important;
gap: 14px !important;
margin-top: 24px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-faq-item {
background: #fff !important;
border: 1.5px solid #9ca3af !important;
border-radius: 16px !important;
overflow: hidden !important;
box-shadow: 0 8px 20px rgba(15, 23, 42, .06) !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-faq-item summary {
list-style: none !important;
cursor: pointer !important;
padding: 20px 56px 20px 60px !important;
font-size: 18px !important;
font-weight: 950 !important;
color: #073b4c !important;
position: relative !important;
line-height: 1.6 !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-faq-item summary::-webkit-details-marker {
display: none !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-faq-item summary::before {
content: 'Q' !important;
position: absolute !important;
left: 20px !important;
top: 18px !important;
width: 28px !important;
height: 28px !important;
background: #075f7a !important;
color: #fff !important;
border-radius: 7px !important;
font-size: 15px !important;
font-weight: 950 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-faq-item summary::after {
content: '+' !important;
position: absolute !important;
right: 22px !important;
top: 50% !important;
transform: translateY(-50%) !important;
font-size: 26px !important;
font-weight: 950 !important;
color: #075f7a !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-faq-item[open] summary::after {
content: '−' !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-faq-item .mrc-faq-a {
padding: 0 24px 22px 60px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-faq-item .mrc-faq-a p {
margin: 0 !important;
font-size: 17px !important;
line-height: 1.9 !important;
color: #1f2937 !important;
font-weight: 500 !important;
}

/* ===== CTA ===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-cta {
background: #071923 !important;
color: #fff !important;
border-radius: 24px !important;
padding: 36px !important;
margin: 60px 0 30px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-cta h2 {
background: transparent !important; /* v1.1: テーマ標準h2の薄背景バーを打ち消し、濃紺CTA上の白見出しを可視化 */
color: #fff !important;
border-bottom: 4px solid #5ab3cf !important;
margin-bottom: 18px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-cta p {
color: #f3f7f9 !important;
margin: 0 0 24px !important;
font-weight: 500 !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-cta .mrc-btn-primary {
background: #fff !important;
color: #071923 !important;
border-color: #fff !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-back {
margin: 36px 0 0 !important;
font-weight: 900 !important;
}

/* ===== TECH POINTS（この事例のポイント）：用途ベース汎用カード
   点検・PCS修理・除草・洗浄・是正など全カテゴリで再利用可。
   HTML:
     <section class="mrc-section mrc-tech-points" id="point">
       <h2>この事例のポイント</h2>
       <div class="mrc-tech-card"><h3>見出し</h3><p>本文</p></div>
       ...
     </section>
   ===== */
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-tech-points {
display: block !important;
margin-top: 8px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-tech-card {
margin: 26px 0 18px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-tech-card > h3 {
background: #eef4f7 !important;
border: 1.5px solid #6b7280 !important;
border-bottom: none !important;
border-radius: 16px 16px 0 0 !important;
padding: 18px 20px 10px !important;
margin: 0 !important;
font-size: 23px !important;
line-height: 1.45 !important;
font-weight: 950 !important;
color: #071923 !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-tech-card > p {
background: #fff !important;
border: 1.5px solid #6b7280 !important;
border-top: none !important;
border-radius: 0 0 16px 16px !important;
padding: 8px 20px 20px !important;
margin: 0 !important;
color: #1f2937 !important;
font-size: 17.5px !important;
line-height: 1.95 !important;
font-weight: 500 !important;
box-shadow: 0 8px 20px rgba(15, 23, 42, .06) !important;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 900px) {
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-card-grid,
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-photo-grid,
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-service-links,
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-related {
grid-template-columns: 1fr !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-hero {
padding: 26px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-photo img {
height: auto !important;
max-height: 430px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-overview-table th,
:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-overview-table td {
display: block !important;
width: 100% !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-overview-table th {
border-bottom: none !important;
padding-bottom: 7px !important;
}
}

@media (max-width: 600px) {
:is(.mainte-case-wrap, .mainte-roofcase-wrap) {
font-size: 17px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-container {
width: min(100% - 22px, 1120px) !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-hero {
padding: 22px !important;
border-radius: 18px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-hero-title {
font-size: clamp(22px, 6vw, 30px) !important; /* v1.2: スマホ側もデスクトップ上限以下に */
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-hero-lead {
font-size: 17.5px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-btns {
display: grid !important;
grid-template-columns: 1fr !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-btn {
width: 100% !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-flow li {
grid-template-columns: 46px 1fr !important;
padding: 16px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-flow li::before {
width: 38px !important;
height: 38px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-tech-card > h3 {
font-size: 21px !important;
padding: 16px 17px 8px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-tech-card > p {
font-size: 17px !important;
padding: 8px 17px 18px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-list.mrc-list-boxed {
padding: 20px 18px 20px 34px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-list.mrc-list-boxed li {
font-size: 17px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-faq-item summary {
font-size: 17px !important;
padding: 18px 50px 18px 54px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-faq-item .mrc-faq-a {
padding: 0 20px 20px 54px !important;
}

:is(.mainte-case-wrap, .mainte-roofcase-wrap) .mrc-cta {
padding: 26px !important;
}
}