/* ========================================================= equip-common.css 設備トラブル系ページ（equip-page）専用の共通デザイン影響範囲：のみ ========================================================= */ /* 全体 */ body.works.equip-page { font-feature-settings: "palt"; line-height: 1.8; color: #fff; /* box の中は白文字が前提 */ } /* 各 page-faucet, page-water-leak など個別ページの外側枠 */ .works.equip-page .equip-frame { /* .box の濃色背景の中で使う前提 */ color: inherit; } /* FVリード */ .works.equip-page .ichikan-fv-lead { color: #fff; line-height: 1.8; max-width: 760px; margin: 10px auto 18px; text-align: left; } /* CTA */ .works.equip-page .ichikan-fv-cta { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:10px; } .works.equip-page .ichikan-btn{ display:inline-flex; align-items:center; justify-content:center; padding:14px 18px; min-width:220px; border-radius:10px; font-weight:700; text-decoration:none; transition:.2s; } .works.equip-page .ichikan-btn-line{ background:#17b75e; color:#fff; } .works.equip-page .ichikan-btn-tel { background:#1a73e8; color:#fff; } /* grid */ .works.equip-page .ichikan-grid{ display:grid; gap:12px; } .works.equip-page .ichikan-grid-2{ grid-template-columns:repeat(2,1fr); } .works.equip-page .ichikan-grid-3{ grid-template-columns:repeat(3,1fr); } /* 白いカード（最重要） */ .works.equip-page .ichikan-card, .works.equip-page .ichikan-section, .works.equip-page .ichikan-price-box, .works.equip-page .ichikan-final-cta, .works.equip-page .ichikan-case-meta { background:#fff; color:#333; border:1px solid #e6e6e6; border-radius:12px; padding:14px; box-shadow:0 4px 12px rgba(0,0,0,.06); } /* 料金表 */ .works.equip-page .ichikan-price-table{ width:100%; border-collapse:collapse; background:#fff; border:1px solid #e6e6e6; border-radius:12px; overflow:hidden; color:#333; } .works.equip-page .ichikan-price-table th, .works.equip-page .ichikan-price-table td { padding:12px; border-bottom:1px solid #eee; text-align:left; color:#333; } /* flow */ .works.equip-page .ichikan-flow-list{ list-style:none; padding:0; margin:0; display:grid; gap:8px; } .works.equip-page .ichikan-flow-list li{ background:#fff; border:1px solid #e6e6e6; border-radius:10px; padding:12px; display:flex; gap:10px; align-items:center; color:#333; } .works.equip-page .ichikan-flow-list .step{ display:inline-flex; width:28px; height:28px; border-radius:50%; align-items:center; justify-content:center; font-weight:800; background:#1a73e8; color:#fff; flex-shrink:0; } /* FAQ */ .works.equip-page .ichikan-faq-list .faq-item{ background:#fff; border:1px solid #e6e6e6; border-radius:10px; margin-bottom:8px; overflow:hidden; color:#333; } .works.equip-page .ichikan-faq-list .faq-q{ cursor:pointer; padding:12px 14px; font-weight:700; position:relative; color:#333; } .works.equip-page .ichikan-faq-list .faq-a{ display:none; padding:0 14px 12px; line-height:1.8; color:#333; } .works.equip-page .ichikan-faq-list .faq-item.is-open .faq-a{ display:block; } /* fixed CTA */ .works.equip-page .ichikan-fixed-cta{ position:fixed; left:0; right:0; bottom:0; z-index:9999; display:none; grid-template-columns:1fr 1fr; } .works.equip-page .ichikan-fixed-cta a{ display:flex; align-items:center; justify-content:center; padding:14px 0; font-weight:800; color:#fff; text-decoration:none; } .works.equip-page .ichikan-fixed-cta .fixed-line{ background:#17b75e; } .works.equip-page .ichikan-fixed-cta .fixed-tel { background:#1a73e8; } @media (max-width:900px){ .works.equip-page .ichikan-grid-3{ grid-template-columns:repeat(2,1fr); } } @media (max-width:600px){ .works.equip-page .ichikan-grid-2, .works.equip-page .ichikan-grid-3{ grid-template-columns:1fr; } .works.equip-page .ichikan-fixed-cta{ display:grid; } body.works.equip-page{ padding-bottom:60px; } } /* ===== Theme C: Friendly Teal ===== */ body.works.equip-page{ font-family: "M PLUS 1p","Noto Sans JP",sans-serif; } .works.equip-page .ichikan-h3{ border-left: 5px solid #0E8A8A; background:#F7FAF9; color:#0E8A8A; } .works.equip-page .ichikan-btn-tel{ background:#0E8A8A; } .works.equip-page .ichikan-btn-line{ background:#17B75E; } /* ========================================================= 下層ブロック（カード）背景色を共通でfloralwhitoに変更 ========================================================= */ .works.equip-page .ichikan-card, .works.equip-page .ichikan-price-box, .works.equip-page .ichikan-case-meta, .works.equip-page .ichikan-final-cta { background:#FFFAF0 !important; border-color: #DCE7F8; /* 薄いブルーの枠線（好みに応じて） */ } /* フォームページのボタン文字を大きくする */ .company.works.equip-page .ichikan-btn { font-size: 1.1rem; font-weight: 700; }