@charset "utf-8";
/* =============================================================
   呼びかけ（CTA）・お問い合わせ窓口・スマホ下部の固定ボタン（2026-10-08）
   ・header.php で全ページ読込（site-nav.css の後）。この1ファイルが本番用
   ・色・書体は site-nav.css の :root トークン（--sumi/--ink/--kin/--line/--serif/--sans）を使う
   ・数字（電話番号）は --sans の太字。Cormorant（--latin）は「TEL」の欧文ラベルだけ
   ・クラスは .wkcta / .wkf / .wksticky で始まり、既存の部品とぶつからない
   ============================================================= */

/* 色（2026-10 デザイン監査）：金地×白字 #a8844a は 3.46:1 で読みにくいため、ボタンの地は #8f6e39（白字4.71:1）。
   白・生成り地の金の小さい文字は #7d6232、灰色の補足は #6e6457。金の線・枠（文字でないもの）は従来の --kin のまま */
:root{--wk-btn:#8f6e39;--wk-kin-text:#7d6232;--wk-muted:#6e6457}

/* ---------- 共通 ---------- */
.wkcta,.wkcta *{box-sizing:border-box}
.wkcta p{margin:0;padding:0}
.wkcta a{text-decoration:none}
.wkcta .wkcta-aud{font-family:var(--sans);font-size:12.5px;font-weight:500;letter-spacing:.14em;color:var(--wk-kin-text);margin:0 0 10px;line-height:1.6}
.wkcta .wkcta-h{font-family:var(--serif);font-size:19px;font-weight:600;line-height:1.65;color:var(--sumi);letter-spacing:.02em;margin:0 0 12px}
.wkcta .wkcta-p{font-family:var(--sans);font-size:14.5px;line-height:1.95;color:var(--ink);margin:0 0 22px;text-align:left}
.wkcta .wkcta-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:14px 28px;background:var(--wk-btn);border:1px solid var(--wk-btn);color:#fff;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.06em;line-height:1.5;text-align:center;transition:background .25s ease,border-color .25s ease}
.wkcta .wkcta-btn:hover{background:var(--sumi);border-color:var(--sumi);color:#fff;opacity:1}
.wkcta .wkcta-ar{font-family:var(--sans);transition:transform .25s ease}
.wkcta .wkcta-btn:hover .wkcta-ar{transform:translateX(4px)}
.wkcta .wkcta-tel{display:inline-flex;align-items:baseline;gap:8px;font-family:var(--sans);font-weight:700;font-size:20px;letter-spacing:.03em;color:var(--sumi);line-height:1.3}
.wkcta .wkcta-tel b{font-family:var(--latin);font-size:12px;font-weight:600;letter-spacing:.18em;color:var(--wk-kin-text)}
.wkcta .wkcta-tel:hover{color:var(--wk-kin-text);opacity:1}

/* ---------- 末尾の呼びかけ（読者ごとに1〜2箱） ---------- */
.wkcta--end{display:block;width:100%;max-width:1080px;margin:72px auto;padding:0 20px;clear:both}
.wkcta--end .wkcta-in{background:#f7f3ea;border:1px solid var(--line);padding:44px 40px 36px}
.wkcta--end .wkcta-eyebrow{display:flex;align-items:center;gap:14px;font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:.24em;color:var(--wk-kin-text);margin:0 0 22px}
.wkcta--end .wkcta-eyebrow::before{content:"";display:block;width:32px;height:1px;background:var(--wk-btn)}
.wkcta--end .wkcta-panels{display:grid;grid-template-columns:1fr;gap:20px}
.wkcta--end .wkcta-panels--2{grid-template-columns:1fr 1fr}
.wkcta--end .wkcta-panel{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-top:2px solid var(--kin);padding:28px 26px 26px}
.wkcta--end .wkcta-panel .wkcta-p{flex:1 1 auto}
.wkcta--end .wkcta-panels--2 .wkcta-btn{width:100%}
.wkcta--end .wkcta-panels--1 .wkcta-btn{align-self:flex-start;padding:14px 40px}
.wkcta--end .wkcta-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 28px;margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
.wkcta--end .wkcta-telwrap{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px}
.wkcta--end .wkcta-telwrap > .wkcta-tellabel{font-family:var(--sans);font-size:13px;letter-spacing:.08em;color:var(--wk-muted)}
.wkcta--end .wkcta-sub{display:inline-flex;align-items:center;gap:10px;font-family:var(--sans);font-size:14px;color:var(--ink);border-bottom:1px solid var(--kin);padding-bottom:3px;line-height:1.6}
.wkcta--end .wkcta-sub:hover{color:var(--wk-kin-text);opacity:1}

/* ---------- 途中の呼びかけ（小さな1箱） ---------- */
.wkcta--mid{display:block;clear:both;margin:44px 0;background:#f7f3ea;border:1px solid var(--line);border-left:3px solid var(--kin);padding:24px 26px}
.wkcta--mid .wkcta-h{font-size:17.5px;margin-bottom:8px}
.wkcta--mid .wkcta-p{font-size:14px;margin-bottom:16px}
.wkcta--mid .wkcta-act{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px}
.wkcta--mid .wkcta-btn{min-height:48px;padding:12px 24px;font-size:14.5px}
.wkcta--mid .wkcta-tel{font-size:18px}
/* 期間限定の差し込み（末尾の呼びかけの直前。inc/cta-map.php の promos） */
.wkcta--promo{max-width:1040px;margin:56px auto -32px;background:#fffaf0;border-color:rgba(168,132,74,.45)}
.kb .wkcta--promo{margin:56px 20px -24px}
.wkcta .wkcta-badge{display:inline-block;margin-right:10px;font-size:11px;font-weight:700;letter-spacing:.1em;color:#fff;background:var(--wk-btn);padding:2px 8px;vertical-align:1px}
/* 工種ページ（.repairBox の中）では左右の余白を本文に合わせる */
.repairBox > .wkcta--mid{margin:48px auto;max-width:1000px;width:auto}

@media screen and (max-width:767px){
  .wkcta--end{margin:52px auto;padding:0 16px}
  .wkcta--end .wkcta-in{padding:28px 18px 24px}
  .wkcta--end .wkcta-panels--2{grid-template-columns:1fr}
  .wkcta--end .wkcta-panel{padding:22px 18px 20px}
  .wkcta .wkcta-h{font-size:17.5px}
  .wkcta .wkcta-p{font-size:14px;line-height:1.9}
  .wkcta .wkcta-btn,
  .wkcta--end .wkcta-panels--1 .wkcta-btn{width:100%;align-self:stretch;padding:14px 16px}
  .wkcta--end .wkcta-foot{flex-direction:column;align-items:flex-start}
  .wkcta--mid{margin:36px 0;padding:20px 18px}
  .repairBox > .wkcta--mid{margin:36px 0}
  .wkcta--promo{margin:40px 16px -20px}
  .kb .wkcta--promo{margin:40px 16px -16px}
  .wkcta--mid .wkcta-act{flex-direction:column;align-items:stretch}
  .wkcta--mid .wkcta-tel{justify-content:center}
}

/* =============================================================
   お問い合わせ：ご相談の窓口（page-contact.php）とフォーム（CF7 の中の部品）
   ============================================================= */
.wkf-guide{margin:0 0 36px}
.wkf-guide-t{display:flex;align-items:center;gap:14px;font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:.24em;color:var(--wk-kin-text);margin:0 0 16px}
.wkf-guide-t::before{content:"";display:block;width:32px;height:1px;background:var(--wk-btn)}
.wkf-guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.wkf-guide-item{position:relative;display:block;box-sizing:border-box;background:#fff;border:1px solid var(--line);border-top:2px solid var(--kin);padding:18px 16px 16px;color:var(--ink);text-decoration:none;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.wkf-guide-item b{display:block;font-family:var(--serif);font-size:16px;font-weight:600;color:var(--sumi);line-height:1.5;margin-bottom:8px}
.wkf-guide-item span{display:block;font-family:var(--sans);font-size:13px;line-height:1.85;color:var(--ink)}
.wkf-guide-item strong{color:var(--sumi);font-weight:700;background:linear-gradient(transparent 62%,rgba(196,164,104,.35) 62%)}
.wkf-guide-item:hover{border-color:var(--wk-kin-text);opacity:1}
.wkf-guide-item.is-on{border-color:var(--wk-kin-text);background:#fffdf8;box-shadow:0 0 0 2px rgba(168,132,74,.35)}
.wkf-guide-item.is-on b::after{content:"選択中";display:inline-block;margin-left:8px;font-family:var(--sans);font-size:10.5px;font-weight:500;letter-spacing:.08em;color:#fff;background:var(--wk-btn);padding:2px 7px;vertical-align:2px}

/* フォーム上部の注意書き */
.site2026 .contact_inner .wkf-note{font-family:var(--sans);font-size:13.5px;line-height:1.9;color:var(--ink);background:#faf7f1;border:1px solid var(--line);padding:14px 16px;margin:0 0 26px}
/* 種別を選んだときに出る案内 */
.site2026 .contact_inner .wkf-hint{font-family:var(--sans);font-size:13.5px;line-height:1.9;color:var(--ink);background:#fffdf8;border:1px solid var(--line);border-left:3px solid var(--kin);padding:14px 16px;margin:-8px 0 26px}
.site2026 .contact_inner .wkf-hint b{color:var(--sumi);font-weight:700}
/* ラベルの下の小さな説明 */
.site2026 .contact_inner .wkf-sub{display:block;font-size:12.5px;font-weight:400;color:var(--wk-muted);letter-spacing:.02em;margin-top:4px;line-height:1.7}
/* ご相談の種類：押しやすい箱（PC2列・スマホ1列） */
.site2026 .contact_inner [data-name="industry"] .wpcf7-radio{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.site2026 .contact_inner [data-name="industry"] .wpcf7-list-item label{display:flex;width:100%;box-sizing:border-box;border:1px solid var(--line);background:#fff;padding:12px 14px;line-height:1.5;min-height:48px}
.site2026 .contact_inner [data-name="industry"] .wpcf7-list-item label:has(input:checked){border-color:var(--wk-kin-text);background:#fffdf8;box-shadow:0 0 0 1px var(--kin)}
/* 写真の添付：目立たせる */
.site2026 .contact_inner .wkf-photo{background:#faf7f1;border:1px dashed var(--kin);padding:20px 18px 6px;margin:0 0 26px}
.site2026 .contact_inner .wkf-photo-t{font-family:var(--serif);font-size:16.5px;font-weight:600;color:var(--sumi);margin:0 0 6px}
.site2026 .contact_inner .wkf-photo-d{font-family:var(--sans);font-size:13px;line-height:1.85;color:var(--ink);margin:0 0 16px}
.site2026 .contact_inner .wkf-photo p{margin:0 0 14px}
.site2026 .contact_inner .wkf-photo input[type=file]{background:#fff}

@media screen and (max-width:767px){
  .wkf-guide-grid{grid-template-columns:1fr}
  .site2026 .contact_inner [data-name="industry"] .wpcf7-radio{grid-template-columns:1fr}
}

/* =============================================================
   スマホ下部の固定ボタン（footer.php・767px以下だけ）
   ・本文やフッターが隠れないよう body に下余白を足す
   ・メニュー（ドロワー）を開いている間は隠す
   ============================================================= */
.wksticky{display:none}
@media screen and (max-width:767px){
  .wksticky{display:flex;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:990;background:var(--sumi);padding:8px 8px calc(8px + env(safe-area-inset-bottom));box-shadow:0 -4px 18px rgba(0,0,0,.2);box-sizing:border-box}
  .wksticky a{flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:52px;text-decoration:none;font-family:var(--sans);line-height:1.3;box-sizing:border-box}
  .wksticky-tel{background:#fff;color:var(--sumi)}
  .wksticky-form{background:var(--wk-btn);color:#fff}
  .wksticky-l{font-size:15px;font-weight:700;letter-spacing:.06em}
  .wksticky-n{font-size:12px;font-weight:700;letter-spacing:.04em;margin-top:2px}
  .wksticky-tel .wksticky-n{color:var(--wk-kin-text)}
  .wksticky-form .wksticky-n{font-weight:500}
  body.site2026,body.home2026{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
  body.t26-noscroll .wksticky{display:none}
  /* 採用ページは固定ボタンを出さないので余白も足さない（header.php で wk-nosticky を付ける） */
  body.wk-nosticky{padding-bottom:0}
  /* reCAPTCHA v3 のバッジが下部ボタンに重ならないように */
  .grecaptcha-badge{bottom:84px!important}
}

/* =============================================================
   既存部品の手直し（2026-10 デザイン監査）
   ============================================================= */
/* 記事の「ご相談・お見積もり」の囲み：文字リンク（高さ21px）をボタンに。本文（校閲済み）の文字は変えず見た目だけ */
.kb-body .kb-callout a[href*="/contact/"]{display:inline-flex;align-items:center;justify-content:center;min-height:48px;margin:6px 14px 6px 0;padding:12px 24px;background:var(--wk-btn);border:1px solid var(--wk-btn);color:#fff;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.06em;line-height:1.4;text-decoration:none;box-sizing:border-box;vertical-align:middle;transition:background .25s ease}
.kb-body .kb-callout a[href*="/contact/"]:hover{background:var(--sumi);border-color:var(--sumi);opacity:1}
.kb-body .kb-callout a[href^="tel:"]{display:inline-block;padding:10px 0;font-family:var(--sans);font-weight:700;font-size:18px;letter-spacing:.03em;color:var(--sumi);text-decoration:none;vertical-align:middle}
@media screen and (max-width:767px){
  .kb-body .kb-callout a[href*="/contact/"]{display:flex;width:100%;margin:6px 0 4px;padding:12px 14px;font-size:14.5px;letter-spacing:.03em}
}
/* 工種ページの「施工実績」の箇条書き：事例へのリンク */
.repairBoxBtmInner p a[href*="/works/"]{color:var(--wk-kin-text);text-decoration:underline;text-underline-offset:3px}
.repairBoxBtmInner p a[href*="/works/"]:hover{color:var(--sumi)}
/* お問い合わせの送信ボタン・必須バッジ：白字が読める濃さに（site-nav.css の金地を上書き） */
.site2026 .contact_inner .wpcf7-submit{background:var(--wk-btn);border-color:var(--wk-btn)}
.site2026 .contact_inner .wpcf7-submit:hover{background:transparent;color:var(--wk-kin-text);border-color:var(--wk-kin-text)}
.cf7req{background:var(--wk-btn)}
/* トップのヒーロー：寺社・所有者の入口（index.php の .hero-temple。骨格は変えず、ボタンの下に小さな文字リンク） */
.t26 .hero .hero-temple{margin:22px 0 0;font-family:var(--sans);font-size:14.5px;letter-spacing:.04em;line-height:1.7}
.t26 .hero .hero-temple a{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:#fff;text-decoration:none;border-bottom:1px solid rgba(196,164,104,.85);padding:6px 0 4px}
.t26 .hero .hero-temple a:hover{color:var(--kin-2)}
.t26 .hero .hero-temple .ar{font-family:var(--sans);font-size:15px}
@media screen and (max-width:767px){
  .t26 .hero .hero-temple{margin-top:16px;font-size:13px;letter-spacing:0;text-align:center}
  .t26 .hero .hero-temple a{gap:6px}
}
/* 無料の一言（現地調査・概算見積りだけ。inc/cta-map.php の free_note） */
.wkcta .wkcta-free{margin:14px 0 0;font-family:var(--sans);font-size:13.5px;font-weight:500;line-height:1.8;color:var(--sumi)}
.wkcta .wkcta-free::before{content:"";display:inline-block;width:7px;height:7px;margin-right:8px;background:var(--wk-btn);transform:rotate(45deg) translateY(-2px)}
.wkcta--end .wkcta-free--end{margin:22px 0 0;text-align:center}
.wkf-free{margin:-4px 0 14px;font-family:var(--sans);font-size:14px;font-weight:500;color:var(--sumi);line-height:1.8}
/* フォーム：CF7 がラベルの後に入れる改行（<br>）で、ラベルと入力欄の間が1行分空くのを詰める */
.site2026 .contact_inner .wpcf7-form p > label + br{display:none}
/* 公式Instagram（フッターの会社案内の列・スマホのメニュー）。控えめな文字リンク＋線のアイコン */
.t26ft .t26ft-sns{margin:18px 0 0}
.t26ft .t26ft-sns a{display:inline-flex;align-items:center;gap:8px;min-height:40px;font-size:13.5px;letter-spacing:.06em;color:rgba(255,255,255,.82);text-decoration:none}
.t26ft .t26ft-sns a:hover{color:#fff}
.wk-ig-ico{flex:0 0 auto;display:block}
.t26hd-drawer .t26drawer-sns{display:inline-flex;align-items:center;gap:8px;font-size:15px;letter-spacing:.06em}
/* 電話の受付時間・返信の目安（2026-10-08 オーナー回答） */
.wkcta .wkcta-telbox{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px}
.wkcta .wkcta-hours{font-family:var(--sans);font-size:12px;letter-spacing:.04em;color:var(--wk-muted);line-height:1.5}
.wksticky-h{display:block;font-size:10.5px;font-weight:500;letter-spacing:.02em;color:var(--wk-muted);margin-top:1px;line-height:1.2}
.wk-tel-hours{display:block;margin:8px 0 0;font-family:var(--sans);font-size:13px;font-weight:400;letter-spacing:.04em;color:var(--wk-muted);text-align:center;line-height:1.6}
.wkf-reply{margin:-8px 0 14px;font-family:var(--sans);font-size:14px;font-weight:500;color:var(--sumi);line-height:1.8}
.wkf-done{margin:28px 0 36px;padding:20px 22px;background:#faf7f1;border:1px solid var(--line);border-left:3px solid var(--kin);font-family:var(--sans);font-size:14px;line-height:1.9;color:var(--ink)}
.wkf-done p{margin:0}
.wkf-done .wkf-done-t{font-weight:700;color:var(--sumi);margin-bottom:4px}
.wkf-done a{color:var(--sumi);font-weight:700;text-decoration:none}
@media screen and (max-width:767px){
  .wkcta--mid .wkcta-telbox{align-items:center;align-self:center}
  .wksticky a{min-height:58px}
  body.site2026,body.home2026{padding-bottom:calc(74px + env(safe-area-inset-bottom))}
  body.wk-nosticky{padding-bottom:0}
  .grecaptcha-badge{bottom:90px!important}
}
