/* kw-pages.css — 検索語別の専用ページ（/sekou-taisei-daicho/ /greenfile-daiko/ /kensetsu-shorui-daiko/）共通（2026-10-21）
   greensite-spot.css を .lp-kw スコープに複製したもの。/greensite-spot/ 側の変更に引きずられないよう独立させている。
   読み込みは各テンプレート先頭の wp_head フック（header-2.php は触っていない）。 */
.lp-kw { margin-bottom: 72px; }
.lp-kw {--green: #14b39b; --green-dark: #0e8f7c; --green-pale: #e6f7f4; --hl: #a7ecdd; --ink: #21403b; --muted: #5a6a67; --line: #dde5e3; --gold-pale: #fdf6e3; --gold-line: #e8d9a0;}
.lp-kw * {box-sizing: border-box; margin: 0; padding: 0;}
.lp-kw {font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif; background: #f4f8f7; color: var(--ink); line-height: 1.8; -webkit-font-smoothing: antialiased;}
.lp-kw img {max-width: 100%; height: auto; display: block;}
.lp-kw .wrap {max-width: 980px; margin: 0 auto; padding: 0 20px;}
.lp-kw .rounded {font-family: "M PLUS Rounded 1c", sans-serif;}
.lp-kw .hero {background: linear-gradient(155deg, #17bda3 0%, var(--green-dark) 100%); color: #fff; overflow: hidden;}
.lp-kw .hero .inner {max-width: 980px; margin: 0 auto; padding: 48px 20px 44px; display: grid; grid-template-columns: 1.1fr .9fr; gap: 20px; align-items: center;}
.lp-kw .hero .eyebrow {display: inline-block; background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.55); font-size: 13px; font-weight: 700; border-radius: 999px; padding: 5px 16px; margin-bottom: 18px;}
.lp-kw .hero h1 {font-size: 36px; font-weight: 800; line-height: 1.5; letter-spacing: .5px;}
.lp-kw .hero h1 .mark {background: #fff; color: var(--green-dark); border-radius: 10px; padding: 2px 14px; margin: 0 3px; box-shadow: 0 6px 16px rgba(0,0,0,.14); box-decoration-break: clone; -webkit-box-decoration-break: clone;}
.lp-kw .hero .lead {font-size: 14.5px; margin-top: 16px; opacity: .96;}
.lp-kw .hero .art {text-align: center;}
.lp-kw .hero .art img {margin: 0 auto; filter: drop-shadow(0 12px 20px rgba(0,0,0,.15));}
.lp-kw .price-badge {background: #fff; color: var(--green-dark); border-radius: 16px; padding: 16px 22px; margin-top: 24px; display: inline-block; box-shadow: 0 10px 26px rgba(0,0,0,.16);}
.lp-kw .price-badge .cap {font-size: 13px; font-weight: 700; color: var(--muted);}
.lp-kw .price-badge .amt {font-size: 42px; font-weight: 800; line-height: 1.05;}
.lp-kw .price-badge .amt small {font-size: 16px; font-weight: 500;}
.lp-kw .price-badge .note {font-size: 12px; color: var(--muted); margin-top: 2px;}
.lp-kw .cta-row {margin-top: 22px; display: flex; gap: 12px; flex-wrap: wrap;}
.lp-kw .btn {display: inline-block; text-decoration: none; font-weight: 700; font-size: 15px; border-radius: 999px; padding: 13px 28px; transition: transform .08s;}
.lp-kw .btn:active {transform: translateY(1px);}
.lp-kw .btn-line {background: #06c755; color: #fff; box-shadow: 0 6px 16px rgba(6,199,85,.3);}
.lp-kw .btn-ghost {background: transparent; color: #fff; border: 1.5px solid #fff;}
.lp-kw .btn-green {background: var(--green); color:#fff; box-shadow:0 6px 16px rgba(20,179,155,.3);}
.lp-kw section {padding: 52px 0;}
.lp-kw section.alt {background: #fff;}
.lp-kw .eyebrow-c {text-align:center; color: var(--green); font-weight:800; letter-spacing:3px; font-size:13px; margin-bottom:6px;}
.lp-kw h2.sec {font-size: 28px; text-align: center; margin-bottom: 8px; font-weight: 800; color: var(--ink); line-height:1.55; letter-spacing:.5px;}
.lp-kw h2.sec .mark {background: linear-gradient(transparent 58%, var(--hl) 58%); color: var(--ink); padding: 0 4px; white-space: nowrap; box-decoration-break: clone; -webkit-box-decoration-break: clone;}
.lp-kw h1 .nb, .lp-kw h2.sec .nb {display: inline-block;}
.lp-kw .sec-lead {text-align: center; color: var(--muted); font-size: 14.5px; margin-bottom: 34px;}
.lp-kw .cards {display: grid; grid-template-columns: repeat(3,1fr); gap: 16px;}
.lp-kw .cards.two {grid-template-columns: repeat(2,1fr);}
.lp-kw .mini {background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 24px 20px; text-align: center; box-shadow: 0 4px 14px rgba(20,60,55,.05);}
.lp-kw section.alt .mini {background: #f7fbfa;}
.lp-kw .mini .ic {font-size: 32px;}
.lp-kw .mini h3 {font-size: 15px; color: var(--green-dark); margin: 12px 0 6px; font-weight: 700;}
.lp-kw .mini p {font-size: 13px; color: var(--muted); line-height:1.75;}
.lp-kw .price-main {background: #fff; border: 2px solid var(--green); border-radius: 20px; padding: 32px 26px; text-align: center; box-shadow: 0 8px 24px rgba(20,179,155,.14);}
.lp-kw .price-main .tag {display: inline-block; background: var(--green); color: #fff; font-size: 14px; font-weight: 700; border-radius: 999px; padding: 5px 20px; margin-bottom: 14px;}
.lp-kw .price-main .amt {font-size: 50px; font-weight: 800; color: var(--green-dark); line-height: 1.05;}
.lp-kw .price-main .amt small {font-size: 18px; font-weight: 500;}
.lp-kw .price-main .incl {font-size: 13px; color: var(--muted); margin-top: 4px;}
.lp-kw .price-main ul {list-style: none; margin: 22px auto 0; max-width: 480px; text-align: left;}
.lp-kw .price-main ul li {position: relative; padding: 9px 0 9px 30px; font-size: 14.5px; border-bottom: 1px dashed var(--line);}
.lp-kw .price-main ul li:last-child {border-bottom: none;}
.lp-kw .price-main ul li::before {content: "✓"; position: absolute; left: 4px; color: var(--green); font-weight: 800;}
.lp-kw .addon {background: #f7fbfa; border: 1px solid var(--line); border-radius: 16px; padding: 24px; margin-top: 18px; text-align: center;}
.lp-kw .addon h3 {font-size: 16px; color: var(--green-dark); margin-bottom: 10px; font-weight: 700;}
.lp-kw .addon p.t {font-size: 14px; color: var(--ink); margin-bottom: 16px;}
.lp-kw .steps {display: grid; gap: 14px;}
.lp-kw .step {background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 18px 22px; display: flex; align-items: center; gap: 18px; box-shadow: 0 4px 14px rgba(20,60,55,.05);}
.lp-kw section.alt .step {background: #f7fbfa;}
.lp-kw .step .num {flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%; background: var(--green); color: #fff; font-weight: 800; font-size: 17px; display: flex; align-items: center; justify-content: center;}
.lp-kw .step .art {flex: 0 0 96px; width: 96px;}
.lp-kw .step .art img {width: 96px;}
.lp-kw .step .tx h3 {font-size: 16px; color: var(--green-dark); margin-bottom: 3px; font-weight: 700;}
.lp-kw .step .tx p {font-size: 13.5px; color: var(--muted);}
.lp-kw .note-box {background: var(--gold-pale); border: 1px solid var(--gold-line); border-radius: 16px; padding: 24px 26px; color: #6b5310; font-size: 14px;}
.lp-kw .note-box h3 {font-size: 16px; margin-bottom: 10px; color: #6b5310; font-weight: 700;}
.lp-kw .note-box ul {margin-left: 1.2em;}
.lp-kw .note-box li {margin: 5px 0;}
.lp-kw .note-box .em {background:#fff6da; padding:1px 5px; border-radius:4px; font-weight:700;}
.lp-kw .yari {display: grid; grid-template-columns: .8fr 1.2fr; gap: 28px; align-items: center;}
.lp-kw .yari .art img {max-width: 300px; margin: 0 auto;}
.lp-kw .cat {margin-bottom: 18px;}
.lp-kw .cat h3 {font-size: 15px; color: var(--green-dark); font-weight: 700; margin-bottom: 10px; display:flex; align-items:center; gap:8px;}
.lp-kw .cat h3 .no {background: var(--green); color:#fff; font-size:11px; border-radius:6px; padding:2px 8px; font-weight:700;}
.lp-kw .pills {display: flex; flex-wrap: wrap; gap: 8px;}
.lp-kw .pills span {background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 6px 14px; font-size: 13px; color: var(--ink);}
.lp-kw section.alt .pills span {background:#f4f8f7;}
.lp-kw .yari-cta {background: var(--green-pale); border: 1px dashed var(--green); border-radius: 16px; padding: 22px; text-align: center; margin-top: 24px;}
.lp-kw .yari-cta .big {font-size: 20px; font-weight: 800; color: var(--green-dark); margin-bottom: 6px;}
.lp-kw .yari-cta p {font-size: 14px; color: var(--muted); margin-bottom: 16px;}
.lp-kw details.faq {background:#fff; border:1px solid var(--line); border-radius:14px; margin-bottom:10px;}
.lp-kw section.alt details.faq {background:#f7fbfa;}
.lp-kw details.faq summary {list-style:none; cursor:pointer; padding:16px 46px 16px 18px; font-size:15px; font-weight:700; color:var(--ink); position:relative;}
.lp-kw details.faq summary::-webkit-details-marker {display:none;}
.lp-kw details.faq summary::before {content:"Q"; color:var(--green); font-weight:800; margin-right:10px;}
.lp-kw details.faq summary::after {content:"＋"; position:absolute; right:18px; top:50%; transform:translateY(-50%); color:var(--green); font-size:18px;}
.lp-kw details.faq[open] summary::after {content:"−";}
.lp-kw details.faq .a {padding:0 18px 16px 46px; font-size:13.5px; color:var(--muted);}
.lp-kw .cta-final {background: linear-gradient(155deg, #17bda3 0%, var(--green-dark) 100%); color:#fff; text-align:center;}
.lp-kw .cta-final h2 {color:#fff;}
.lp-kw .cta-final p {font-size:14.5px; opacity:.95; margin-bottom: 24px;}
@media (max-width:760px) {
  .lp-kw .hero .inner {grid-template-columns: 1fr; text-align:center;}
  .lp-kw .hero .eyebrow, .lp-kw .price-badge {}
  .lp-kw .hero .art {order:-1;}
  .lp-kw .hero .art img {max-width: 320px;}
  .lp-kw .cta-row {justify-content:center;}
  .lp-kw .yari {grid-template-columns: 1fr;}
  .lp-kw .yari .art {order:-1;}
}
@media (max-width:640px) {
  .lp-kw .hero h1 {font-size: 23px; line-height: 1.55;}
  .lp-kw .hero h1 .mark {padding: 1px 10px;}
  .lp-kw h2.sec {font-size: 21px; line-height: 1.5;}
  .lp-kw .cards, .lp-kw .cards.two {grid-template-columns: 1fr;}
  .lp-kw .price-main .amt {font-size: 40px;}
  .lp-kw .step {flex-wrap: wrap;}
  .lp-kw .step .art {display:none;}
}

/* ---- ここから kw-pages 独自 ---- */
.lp-kw .hero .art img {max-width: 340px;}
.lp-kw .crumb-lead {font-size: 13px; opacity: .9; margin-top: 10px;}
.lp-kw .hero-points {list-style: none; margin-top: 16px; display: flex; flex-wrap: wrap; gap: 8px;}
.lp-kw .hero-points li {background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.5); border-radius: 999px; padding: 4px 14px; font-size: 13px; font-weight: 700;}
.lp-kw .prose {max-width: 760px; margin: 0 auto; font-size: 15px;}
.lp-kw .prose p {margin-bottom: 14px;}
.lp-kw .prose p:last-child {margin-bottom: 0;}
.lp-kw a.tl, .lp-kw .prose a, .lp-kw .note-box a, .lp-kw details.faq .a a {color: var(--green-dark); text-decoration: underline; text-underline-offset: 3px; font-weight: 700;}
.lp-kw .docs {display: grid; grid-template-columns: repeat(2,1fr); gap: 16px;}
.lp-kw .doc {background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 22px 22px 20px; box-shadow: 0 4px 14px rgba(20,60,55,.05);}
.lp-kw section.alt .doc {background: #f7fbfa;}
.lp-kw .doc .who {display: inline-block; font-size: 11.5px; font-weight: 700; color: var(--green-dark); background: var(--green-pale); border-radius: 6px; padding: 2px 10px; margin-bottom: 8px;}
.lp-kw .doc h3 {font-size: 16.5px; color: var(--ink); font-weight: 800; margin-bottom: 6px;}
.lp-kw .doc p {font-size: 13.5px; color: var(--muted); line-height: 1.8;}
.lp-kw .doc .rel {display: inline-block; margin-top: 10px; font-size: 13px; color: var(--green-dark); font-weight: 700; text-decoration: none;}
.lp-kw .relation {background: var(--green-pale); border: 1px dashed var(--green); border-radius: 16px; padding: 20px 22px; margin-top: 20px; font-size: 14px;}
.lp-kw .relation b {color: var(--green-dark);}
.lp-kw .tbl-wrap {overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 14px; border: 1px solid var(--line); background: #fff;}
.lp-kw table.cmp {width: 100%; min-width: 640px; border-collapse: collapse; font-size: 13.5px;}
.lp-kw table.cmp th, .lp-kw table.cmp td {border-bottom: 1px solid var(--line); padding: 12px 14px; text-align: left; vertical-align: top; line-height: 1.7;}
.lp-kw table.cmp thead th {background: var(--green); color: #fff; font-weight: 700; white-space: nowrap;}
.lp-kw table.cmp thead th.hl {background: var(--green-dark);}
.lp-kw table.cmp tbody th {background: #f4f8f7; color: var(--ink); font-weight: 700; white-space: nowrap; width: 1%;}
.lp-kw table.cmp td.hl {background: #f2fbf9;}
.lp-kw table.cmp tr:last-child th, .lp-kw table.cmp tr:last-child td {border-bottom: none;}
.lp-kw .tbl-note {font-size: 12px; color: var(--muted); margin-top: 10px;}
.lp-kw .plan2 {display: grid; grid-template-columns: repeat(2,1fr); gap: 16px;}
.lp-kw .plan2 .price-main {padding: 26px 22px;}
.lp-kw .plan2 .price-main .amt {font-size: 40px;}
.lp-kw .plan2 .price-main .amt.txt {font-size: 30px; padding: 6px 0;}
.lp-kw .routes {display: grid; grid-template-columns: repeat(2,1fr); gap: 16px;}
.lp-kw a.route {display: flex; gap: 16px; align-items: flex-start; background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 22px 20px; text-decoration: none; color: var(--ink); box-shadow: 0 4px 14px rgba(20,60,55,.05); transition: transform .2s, box-shadow .2s;}
.lp-kw section.alt a.route {background: #f7fbfa;}
.lp-kw a.route:hover {transform: translateY(-3px); box-shadow: 0 12px 26px rgba(20,60,55,.12);}
.lp-kw a.route .ic {font-size: 30px; line-height: 1; flex: 0 0 auto;}
.lp-kw a.route h3 {font-size: 16px; color: var(--green-dark); font-weight: 800; margin-bottom: 4px;}
.lp-kw a.route p {font-size: 13px; color: var(--muted); line-height: 1.75;}
.lp-kw a.route .go {display: inline-block; margin-top: 8px; font-size: 13px; font-weight: 700; color: var(--green-dark);}
.lp-kw .posts {max-width: 760px; margin: 0 auto; list-style: none;}
.lp-kw .posts li {border-bottom: 1px solid var(--line);}
.lp-kw .posts li:first-child {border-top: 1px solid var(--line);}
.lp-kw .posts a {display: block; padding: 14px 28px 14px 4px; font-size: 14.5px; color: var(--ink); text-decoration: none; position: relative; font-weight: 600;}
.lp-kw .posts a::after {content: "›"; position: absolute; right: 8px; top: 50%; transform: translateY(-50%); color: var(--green); font-size: 20px;}
.lp-kw .posts a:hover {color: var(--green-dark);}
@media (max-width:640px) {
  .lp-kw .docs, .lp-kw .plan2, .lp-kw .routes {grid-template-columns: 1fr;}
  .lp-kw .prose {font-size: 14.5px;}
  .lp-kw .hero-points {justify-content: center;}
  .lp-kw .hero .art img {max-width: 260px;}
}

/* top-add.css が .lp-spot に当てている共通調整を .lp-kw にも（パンくず下の余白・FVのバッジを白系に） */
main.main:has(> .lp-kw) {margin-top: 24px;}
@media (min-width:681px) { main.main:has(> .lp-kw) {margin-top: 40px;} .lp-kw .hero .speed-badge {justify-content: flex-start;} }
.lp-kw .hero .speed-badge {margin: 18px 0 0;}
.lp-kw .hero .speed-badge__main {background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.5); color: #fff;}
.lp-kw .hero .speed-badge__note {color: rgba(255,255,255,.9);}
.lp-kw .hero .speed-badge__note a {color: #fff;}
.lp-kw h1, .lp-kw h2, .lp-kw h3, .lp-kw summary {text-wrap: balance;}
.lp-kw p, .lp-kw li {text-wrap: pretty;}
/* 一覧の .cat がトップの .cat（枠つきカード）と衝突するので打ち消す */
.lp-kw .yari .cat {border: none; background: none; box-shadow: none; padding: 0; border-radius: 0; overflow: visible;}
.lp-kw .yari .cat + .cat {margin-top: 22px;}
