/*
Theme Name: TT5 Child
Template: twentytwentyfive
Version: 1.6-clean (compact gallery & cards) — de-duplicated
*/

/* =============== トークン =============== */
:root{
  --km-green:#004a1c;
  --km-green-hover:#016d38;
  --km-green-2:#228b22;
  --km-accent:#e85c0d;
  --km-bg-outer:#cfdde1;
  --km-bg:#f4faf6;
  --km-bg-section:#e6f4ec;
  --km-text:#222;
  --km-radius-lg:16px;
  --km-gap:24px;
}

/* =============== リセット / ベース =============== */
*,*::before,*::after{box-sizing:border-box}
img,svg,video{max-width:100%;height:auto;display:block}
figure{margin:0}
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
body{background:var(--km-bg-outer)!important;color:var(--km-text)}
a{color:var(--km-green);text-decoration-thickness:.08em}
a:hover,a:focus{color:var(--km-green-hover)}

/* =============== 汎用 =============== */
.km-container{max-width:1160px;margin:0 auto;padding:0 16px}
.km-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:700;padding:.7em 1.2em;border-radius:9999px;background:var(--km-green);color:#fff;transition:filter .15s ease}
.km-btn:hover{background:var(--km-green-hover);color:#fff}

/* =============== ヘッダー / フッター =============== */
.km-header{padding:10px 16px}
.km-header-inner{max-width:1160px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px}
.km-header:not(.km-header--hero-nav),.km-footer{background:var(--km-green);color:#fff}
.km-header.km-header--hero-nav{background:transparent!important;color:#fff;box-shadow:none;position:relative;z-index:10}
.km-brand{display:flex;align-items:center;gap:12px}
.km-logo img,.km-brand__logo img{display:block;max-height:48px;height:48px;width:auto}
.km-tagline{margin:0;font-size:.95rem;color:#fff;opacity:.9}

/* ナビ */
.km-actions,.km-footer-nav{display:flex;align-items:center;gap:24px}
.km-actions a,.km-dd-btn{position:relative;color:#fff;text-decoration:none;padding:6px 0}
.km-actions a::before,.km-dd-btn::before{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:rgba(255,255,255,.35)}
.km-actions a::after,.km-dd-btn::after{content:"";position:absolute;left:0;bottom:-2px;height:2px;width:0;background:#fff;transition:width .25s ease}
.km-actions a:hover::after,.km-dd-btn:hover::after,.km-dd[open] .km-dd-btn::after{width:100%}
.km-actions a:focus-visible,.km-dd-btn:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* 探す：ドロップダウン */
.km-dd{position:relative}
.km-dd-btn{background:none;border:none;cursor:pointer;color:#fff}
.km-dd-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:220px;padding:8px;margin:0;list-style:none;background:var(--km-accent);color:#fff;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.15);z-index:1000;font-size:.9rem}
.km-dd-menu li a{display:block;padding:8px 12px;border-radius:8px;color:#fff;text-decoration:none;font-size:.9rem}
.km-dd-menu li a:hover{background:rgba(255,255,255,.15)}

/* =============== 2カラム骨組み =============== */
.km-layout{display:grid;grid-template-columns:1fr 320px;gap:var(--km-gap);align-items:start}
.km-main,.km-sidebar{min-width:0}
.km-layout.wp-block-group{padding-inline:16px}
@media (max-width:768px){
  .km-layout{grid-template-columns:1fr}
  .km-sidebar{margin-top:24px;position:static}
  .km-actions{gap:16px}
  .km-footer-nav{flex-wrap:wrap;gap:16px}
}

/* =============== ユーティリティ =============== */
.km-section{background:var(--km-bg-section);padding:24px;border-radius:var(--km-radius-lg)}

/* =============== メイン / サイド =============== */
.km-main{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:16px;box-shadow:0 10px 24px rgba(0,0,0,.08);padding:20px;margin-block:8px}
.km-main > * + *{margin-top:16px}
.km-sidebar{background:var(--km-green);border:none;border-radius:16px;padding:14px;box-shadow:0 12px 26px rgba(0,0,0,.12);outline:1px solid rgba(255,255,255,.06);position:sticky;top:88px;align-self:start;height:max-content}
body.admin-bar .km-sidebar{top:120px}

/* PRカード */
.km-sidebar .km-ad-box{background:#fff;border:0;border-radius:12px;padding:10px;box-shadow:0 6px 16px rgba(0,0,0,.06);margin:0 0 12px}
.km-sidebar .km-ad-box a{position:relative;display:block}
.km-sidebar .km-ad-box a::after{content:"PR";position:absolute;top:12px;left:12px;background:var(--km-accent);color:#fff;font-size:11px;font-weight:700;padding:2px 6px;border-radius:999px}

/* 「人気ページ」 */
.km-sidebar h4{color:#fff;margin:6px 0 8px;font-size:.98rem}
.km-sidebar h4 + ul{list-style:none;margin:6px 0 12px;padding:10px 12px;background:var(--km-accent);color:#fff;border-radius:14px;display:grid;gap:6px}
.km-sidebar h4 + ul li{margin:0}
.km-sidebar h4 + ul li a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.25);padding-bottom:2px;font-size:.86rem;line-height:1.42}
.km-sidebar h4 + ul li:last-child a{border-bottom-color:transparent;padding-bottom:0}
.km-sidebar h4 + ul li a::before{content:"";width:5px;height:5px;border-radius:50%;background:#fff;display:inline-block;margin-right:8px;transform:translateY(1px)}

/* =============== フッター =============== */
.km-footer__links{list-style:none;padding-left:0;margin:0}
.km-footer__links li+li{margin-top:6px}
.km-footer__links a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.25)}
.km-footer__links a:hover{border-bottom-color:#fff}

/* フッター内ナビ（シンプル版に統一） */
.km-footer-nav{display:flex;flex-wrap:wrap;gap:16px}
.km-footer-nav a{position:static;color:#fff;text-decoration:none;border:0;font-size:.9rem;opacity:.95;padding:4px 0}
.km-footer-nav a:hover{opacity:1}

/* 旧：強調付きフッター用（用途が別なので残す） */
.km-footer__nav{font-size:16px!important}
.km-footer__nav a{position:relative;color:#fff;text-decoration:none;padding:6px 0}
.km-footer__nav a::before{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:rgba(255,255,255,.35)}
.km-footer__nav a::after{content:"";position:absolute;left:0;bottom:-2px;height:2px;width:0;background:#fff;transition:width .25s ease}
.km-footer__nav a:hover::after{width:100%}

/* フッター下部 */
.km-footer__legal{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:24px}
.km-footer__logo-img{max-width:120px;height:auto;display:block}
.km-footer__copywrap{display:flex;align-items:center;gap:12px}
.km-footer__sep{margin:24px 0!important}
@media (max-width:768px){
  .km-footer__legal{grid-template-columns:1fr;justify-items:center;text-align:center;gap:16px}
  .km-footer-nav{justify-content:center}
  .km-footer__copywrap{justify-content:center}
}

/* =============== ヒーロー（コンパクト） =============== */
.wp-site-blocks .km-hero.-compact{min-height:60vh;padding-top:4vh;padding-bottom:6vh;display:flex;align-items:flex-start;justify-content:center;background:var(--hero-bg) center top/cover no-repeat;position:relative}
.wp-site-blocks .km-hero__inner{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;max-width:960px;margin:0 auto;padding:0 16px}
.wp-site-blocks .km-hero__logo img{display:block;margin:0 auto;width:clamp(200px,28vw,360px);height:auto}
.wp-site-blocks .km-hero__tagline.-singleline{color:#fff!important;font-size:1.1rem;line-height:1.6;margin:1rem 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wp-site-blocks .km-hero__search{display:flex;justify-content:center;align-items:center;margin:1.5rem auto;max-width:640px;background:#fff;border-radius:999px;box-shadow:0 6px 20px rgba(0,0,0,.15);padding:6px 10px}
.wp-site-blocks .km-hero__search .search-field{border:none;flex:1;padding:10px 12px;font-size:1rem;outline:none}
.wp-site-blocks .km-hero__search .search-submit{background:#004a1c;color:#fff;border:none;border-radius:999px;padding:10px 18px;font-weight:700;cursor:pointer}
.wp-site-blocks .km-hero__search .search-submit:hover{background:#016d38}
.wp-site-blocks .km-hero__cta{margin-top:1.5rem;display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.wp-site-blocks .km-hero__btn{display:inline-block;padding:12px 20px;border-radius:999px;font-weight:700;text-decoration:none;background:#fff;color:#004a1c}
.wp-site-blocks .km-hero__btn:hover{background:#e6f4ec}
.wp-site-blocks .km-hero__btn--primary{background:#e85c0d;color:#fff}
.wp-site-blocks .km-hero__btn--primary:hover{filter:brightness(1.1)}

/* =============== 株情報カードなど =============== */
.wp-site-blocks .km-stock-card{background:#fff;border-radius:20px;padding:22px;margin:24px 0;box-shadow:0 10px 24px rgba(0,0,0,.10)}
.wp-site-blocks .km-stock-card.-spec{border-radius:16px;box-shadow:0 2px 10px rgba(0,0,0,.04);padding:16px}
.wp-site-blocks .km-stock-card__company{font-size:clamp(20px,2.2vw,28px);margin:0 0 12px;line-height:1.3;color:#004a1c;font-weight:700}
.wp-site-blocks .km-spec-grid{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:12px}
@media (max-width:1024px){.wp-site-blocks .km-spec-grid{grid-template-columns:repeat(2,minmax(200px,1fr))}}
@media (max-width:600px){.wp-site-blocks .km-spec-grid{grid-template-columns:1fr}}
.wp-site-blocks .km-spec-box{background:#f7faf8;border:1px solid #e6f0ea;border-radius:12px;padding:12px;box-shadow:0 1px 2px rgba(0,0,0,.03)}
.wp-site-blocks .km-spec-label{font-size:.85rem;color:#166534;margin-bottom:4px;font-weight:700}
.wp-site-blocks .km-spec-value{font-weight:600;font-size:1.05rem;line-height:1.7}
.wp-site-blocks .km-yutai{margin-top:16px}
.wp-site-blocks details.km-acc{width:100%;border:1px solid #eee;border-radius:12px;background:#fff;padding:8px 12px}
.wp-site-blocks .km-acc__summary{cursor:pointer;list-style:none;user-select:none;font-weight:600;color:#166534;display:inline-flex;gap:8px;align-items:center;border:1.5px solid #ccc;border-radius:999px;padding:6px 12px;background:#fff}
.wp-site-blocks .km-acc__summary::-webkit-details-marker{display:none}
.wp-site-blocks details.km-acc[open] .km-acc__summary .label-open{display:none}
.wp-site-blocks details.km-acc:not([open]) .km-acc__summary .label-close{display:none}
.wp-site-blocks .km-acc__panel{margin-top:12px}
.wp-site-blocks .km-yutai-table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border-radius:10px;border:1px solid #e5e7eb;background:#fff}
.wp-site-blocks .km-yutai-table thead th{background:#f7faf8;color:#0f5132;text-align:left;padding:10px 12px;border-bottom:1px solid #e5e7eb;font-weight:700}
.wp-site-blocks .km-yutai-table td{padding:10px 12px;border-bottom:1px solid #f0f2f4;vertical-align:top}
.wp-site-blocks .km-yutai-table tr:last-child td{border-bottom:none}
.wp-site-blocks .km-chipset{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}

/* ボタン（ベースから拡張） */
.km-btn.-outline{color:#166534;border:2px solid #166534;background:#fff}
.km-btn.-outline:hover{filter:brightness(.95)}
.km-btn.-accent{color:#fff;background:#e85c0d}
.km-btn.-accent:hover{filter:brightness(.98)}

/* バー */
.wp-site-blocks .km-stock-card__bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:16px}
.wp-site-blocks .km-stock-card__actions{display:flex;flex-wrap:wrap;gap:12px}
.wp-site-blocks .km-stock-card__note{margin-left:auto;white-space:nowrap;color:#555;font-size:.95rem}
@media (max-width:640px){
  .wp-site-blocks .km-stock-card__bar{flex-wrap:wrap}
  .wp-site-blocks .km-stock-card__note{width:100%;text-align:right}
}

/* 旧UIのdl2列 */
.wp-site-blocks .km-spec-list{display:grid;grid-template-columns:9.5em 1fr;column-gap:16px;row-gap:10px;margin:0}
.wp-site-blocks .km-spec-list dt{font-weight:700;color:#004a1c;align-self:center}
.wp-site-blocks .km-spec-list dd{margin:0;border-bottom:1px dashed #e6f4ec;padding:4px 0 8px}
@media (max-width:680px){
  .wp-site-blocks .km-spec-list{grid-template-columns:1fr}
  .wp-site-blocks .km-spec-list dt{margin-top:4px}
  .wp-site-blocks .km-spec-list dd{padding-bottom:10px}
}

/* =============== スーパー見出し =============== */
.km-super{display:inline-block;padding:.55em 1em;border-radius:8px;font-size:1.2rem;font-weight:700;line-height:1.3;letter-spacing:.01em;color:#222;background:linear-gradient(90deg,#f6fdf6,#f0faf2);border-left:7px solid var(--km-green-2);box-shadow:0 1px 3px rgba(0,0,0,.05)}
.km-super.is-orange{border-left-color:transparent;border-image:linear-gradient(180deg,#ff7a1a,#e85c0d) 1;background:linear-gradient(90deg,#fff9f6,#fff3ec)}
.km-super.is-gray{border-left-color:#cfdad3;background:linear-gradient(90deg,#fafdfb,#f4f7f5);color:#4d5a54;border:1px solid #e1ebe5}
.km-super::before,.km-super::after{content:none!important}

/* ========================================================
   口コミ（Single Review）
======================================================== */
.km-single .km-head-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.km-single .km-title{margin:0;font-weight:800;letter-spacing:.02em;line-height:1.15;font-size:clamp(22px,3.6vw,36px);position:relative;padding-left:.7em}
.km-single .km-title::before{content:"";position:absolute;left:0;top:.15em;bottom:.15em;width:6px;border-radius:6px;background:linear-gradient(180deg,#0b6b39,#32a66a)}
.km-single .km-title::after{content:"";position:absolute;left:0;right:0;bottom:-10px;height:3px;border-radius:2px;background:linear-gradient(90deg,#e6f4ec,#bfe9d5 40%,#e6f4ec)}
.km-head-row .km-btn.-google{height:40px;padding:10px 16px;border-radius:999px;line-height:1;background:var(--km-accent);color:#fff;white-space:nowrap;box-shadow:0 8px 20px rgba(232,92,13,.25);transform:translateY(1px)}
.km-head-row .km-btn.-google:hover{filter:brightness(1.06);color:#fff}

/* バッジ・タグ（ベースを単一化） */
.km-badges{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.km-badge.-tag{display:inline-block;text-decoration:none;color:#0a3f23;background:#f2fbf6;border:1px solid #d6efe3;padding:.45em .9em;border-radius:999px;font-weight:700;line-height:1}
.km-badge.-tag:hover{background:#e8f6ef}
.km-badge.-tag.-pref{font-size:.88rem;padding:.35em .7em}
.km-chip.-brand{display:inline-block;padding:.55em 1em;border-radius:999px;background:#f4fbf6;border:1px solid #cfe3d9;color:#004a1c;font-weight:700}
.km-chip.-brand.-accent{background:#e85c0d!important;border-color:#e85c0d!important;color:#fff!important;box-shadow:0 8px 20px rgba(232,92,13,.18)}

/* メタ行 */
.km-meta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:.6rem;color:#33463f;font-size:.95rem}
.km-meta-row>span+span{position:relative;padding-left:.9em}
.km-meta-row>span+span::before{content:"・";position:absolute;left:.2em;top:0;color:#9aa6a9}

/* ギャラリー枠（余白コンパクト & 見出し） */
.km-section.-gallery{background:#fff6f0;border:1px solid #ffe3d1;border-radius:12px;box-shadow:0 6px 18px rgba(0,0,0,.05);padding:12px}
.single-review .km-section.-gallery h2{display:inline-block!important;margin:0 0 14px;padding:6px 12px;font-size:1.05rem;font-weight:700;color:#0b6b39;border-left:6px solid #0b6b39;background:linear-gradient(90deg,#f6fdf6,#f0faf2);border-radius:6px}

/* ギャラリー：クラス不要版（PC3→2→1） */
.single-review .km-section.-gallery .km-gallery{display:flex!important;flex-wrap:wrap!important;margin:-8px!important;gap:0!important}
.single-review .km-section.-gallery .km-gallery > .km-gallery__item,
.single-review .km-section.-gallery .km-gallery > a,
.single-review .km-section.-gallery .km-gallery > figure{width:calc(33.333333% - 16px)!important;margin:8px!important;box-sizing:border-box!important;display:block!important;overflow:hidden!important;aspect-ratio:4/3!important;min-width:0!important;position:relative!important;line-height:0;border-radius:10px;background:#e6f4ec;box-shadow:0 1px 4px rgba(0,0,0,.06)}
.single-review .km-section.-gallery .km-gallery > .km-gallery__item img,
.single-review .km-section.-gallery .km-gallery > a img,
.single-review .km-section.-gallery .km-gallery > figure img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:top center!important;display:block!important;transform:none!important;will-change:transform;transition:transform .25s ease}
.single-review .km-section.-gallery .km-gallery > *:hover img{transform:scale(1.03)!important}
@media (max-width:1000px){
  .single-review .km-section.-gallery .km-gallery > .km-gallery__item,
  .single-review .km-section.-gallery .km-gallery > a,
  .single-review .km-section.-gallery .km-gallery > figure{width:calc(50% - 16px)!important}
}
@media (max-width:560px){
  .single-review .km-section.-gallery .km-gallery > .km-gallery__item,
  .single-review .km-section.-gallery .km-gallery > a,
  .single-review .km-section.-gallery .km-gallery > figure{width:calc(100% - 16px)!important}
}

/* ライトボックス */
.km-lb{position:fixed;inset:0;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;z-index:9999}
.km-lb img{max-width:90vw;max-height:90vh;border-radius:10px;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.km-lb__close{position:fixed;top:16px;right:16px;width:40px;height:40px;border-radius:999px;background:rgba(0,0,0,.6);color:#fff;border:1px solid rgba(255,255,255,.35);font-size:20px;line-height:38px;text-align:center;font-weight:700;cursor:pointer;appearance:none;box-shadow:0 2px 8px rgba(0,0,0,.3)}
.km-lb__close:hover{background:rgba(0,0,0,.8)}
.km-lb__close:focus{outline:2px solid #fff;outline-offset:2px}

/* 本文（single-review） */
.single-review .km-content{font-size:1.02rem;line-height:1.9;color:#222}
.single-review .km-content p{margin:.8rem 0 1.1rem}
.single-review .km-content ul,.single-review .km-content ol{margin:.6rem 0 1.2rem 1.4rem}
.single-review .km-content strong{color:#0f5132}
.single-review .km-stock-card__bar{padding-top:6px}
.single-review .km-stock-card__actions{gap:10px}
.single-review .km-stock-card__note{color:#64748b;font-size:.93rem}
@media (max-width:640px){.single-review .km-lr-grid{grid-template-columns:1fr!important}}

/* =======================================================
   トップ「みんなの口コミ」カード（カード化＆コンパクト）
======================================================= */
.wp-site-blocks .km-lr-grid{display:grid;gap:12px;margin-block:1rem 1.5rem;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
@media (max-width:782px){.wp-site-blocks .km-lr-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.wp-site-blocks .km-lr-grid{grid-template-columns:1fr}}
.wp-site-blocks .km-review-card{background:#fff;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.08);padding:12px;display:flex;flex-direction:column;gap:.5rem}
.wp-site-blocks .km-lr-media{display:block;border-radius:10px;overflow:hidden;background:#e6f4ec;aspect-ratio:4/3}
.wp-site-blocks .km-lr-media img{width:100%;height:100%;object-fit:cover;display:block}
.wp-site-blocks .km-lr-title{font-size:1rem;line-height:1.25;margin:0}
.wp-site-blocks .km-lr-title a{color:#222;text-decoration:none;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wp-site-blocks .km-lr-title a:hover{text-decoration:underline}
.wp-site-blocks .km-lr-company{font-size:.88rem;color:#4b5563}
.wp-site-blocks .km-rr-excerpt{font-size:.95rem;line-height:1.7;color:#222;margin:.25rem 0 .25rem}
.wp-site-blocks .km-review-invest{display:grid;grid-template-columns:1fr;gap:.45rem;align-items:start;margin-top:.25rem}
.wp-site-blocks .km-review-invest .km-pill{width:100%;display:grid;grid-template-columns:18px 1fr;grid-template-rows:auto auto;grid-template-areas:"ic label" ". val";column-gap:.4rem;row-gap:.15rem;padding:.45rem .7rem;border-radius:12px;background:#f4faf6;border:1px solid #e6f4ec;color:#004a1c;box-shadow:inset 0 0 0 1px rgba(255,255,255,.5);font-size:.88rem}
.wp-site-blocks .km-review-invest .km-pill .km-ic{grid-area:ic;line-height:1}
.wp-site-blocks .km-review-invest .km-pill .km-label{grid-area:label;font-size:.8rem;opacity:.85}
.wp-site-blocks .km-review-invest .km-pill .km-val{grid-area:val;font-size:1.02rem;font-weight:700}
.wp-site-blocks .km-subnote{grid-column:1 / -1;display:inline-flex;align-items:center;gap:.35rem;width:100%;background:#eef7f1;border:1px solid #e0f0e6;color:#1f5f3b;border-radius:999px;padding:.28rem .7rem;font-size:.8rem;line-height:1;margin-top:0}
.wp-site-blocks .km-cta{margin-top:auto;text-align:right}
.wp-site-blocks .km-btn-read{background:#004a1c;color:#fff!important;padding:.45em .8em;border-radius:.5em;font-size:.9rem;text-decoration:none}
.wp-site-blocks .km-btn-read:hover{filter:brightness(1.05)}

/* バッジ+投資ピル バー */
.km-badgesbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:.6rem 0 0}
/* 左：チップ/タグ（余白はバー内で付与） */
.km-badgesbar .km-badges{margin:.6rem 0 0}
/* チップ基準（サイズ調整） */
.km-badges .km-chip,.km-badges .km-badge{-webkit-font-smoothing:antialiased;display:inline-flex;align-items:center;justify-content:center;line-height:1;font-weight:700;border-radius:999px;padding:.45em .9em}
/* その他の小さめチップ */
.km-badge.-pref,.km-badge.-genre,.km-badges .km-chip.-pref,.km-badges .km-chip.-genre,.km-badges .km-chip:not(.-brand):not(.-tag){font-size:.85rem!important;padding:.35em .75em!important;border-radius:999px!important}
/* 右：投資ピル */
.km-badgesbar__pills{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
.km-badgesbar__pills .km-pill{display:grid;grid-template-columns:16px 1fr;grid-template-rows:auto auto;grid-template-areas:"ic label" ". val";column-gap:.35rem;row-gap:.1rem;padding:.35rem .6rem;border-radius:12px;background:#f4faf6;border:1px solid #e6f4ec;color:#004a1c;font-size:.86rem;box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)}
.km-badgesbar__pills .km-ic{grid-area:ic;line-height:1}
.km-badgesbar__pills .km-label{grid-area:label;font-size:.76rem;opacity:.85}
.km-badgesbar__pills .km-val{grid-area:val;font-weight:700}

/* --- KM Review Archive: フィルタバー最小スタイル --- */
.km-chipbar{
  display:flex; flex-wrap:wrap; gap:10px 12px;
  background:#fff; border:1px solid #dfece5; border-radius:14px;
  padding:12px; box-shadow:0 6px 18px rgba(0,0,0,.04);
}
.km-chip{display:flex; align-items:center; gap:8px;
  background:#f6fbf8; border:1px solid #cfe3d9;
  border-radius:12px; padding:8px 10px; white-space:nowrap;
}
.km-chip.-keyword input[type="search"]{
  border:1px solid #cfe3d9; border-radius:10px; padding:.5em .7em; min-height:38px; background:#fff;
}
.km-chip.-mode .seg{display:inline-grid; grid-template-columns:1fr 1fr;
  border:1px solid #cfe3d9; border-radius:999px; overflow:hidden;
}
.km-chip.-mode input{display:none}
.km-chip.-mode input:not(:checked)+.seg label:first-child span{background:#0b6b39; color:#fff}
.km-chip.-mode input:checked+.seg label:last-child span{background:#0b6b39; color:#fff}
.kmc-search{appearance:none; border:1px solid #e85c0d; background:#e85c0d; color:#fff;
  border-radius:999px; padding:.6em 1.2em; font-weight:800;
}
.kmc-reset{display:inline-block; border:1px solid #cfe3d9; background:#fff; color:#0b6b39;
  border-radius:999px; padding:.55em 1em; text-decoration:none;
}
.km-chip.-count{margin-left:auto; background:#fff}

/* === 口コミ一覧カード内のメトリクス ====================== */
.km-review-card .km-card-metrics{
  display: grid;
  gap: 12px;
  margin-top: 10px;
}
.km-review-card .km-metric{
  display:flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 12px 14px;
  border: 1px solid #d8eee0;
  background: #f3fbf6;
  border-radius: 16px;
  box-shadow: 0 1px 0 rgba(0,0,0,0.02) inset;
}
.km-review-card .km-metric .l{
  font-size: 13px;
  color: #2e7d5b;
  font-weight: 700;
  letter-spacing: .02em;
  display:flex; gap: .5em; align-items: center;
}
.km-review-card .km-metric .v{
  font-weight: 800;
  color: #0a5c2b;
  font-size: 20px;
  letter-spacing: .02em;
}
.km-review-card .km-metric.m-total{
  background: #eefaf5;
  border-color: #cfe9dd;
}
.km-review-card .km-metric.m-total .v{
  color:#095a29;
}
.km-review-card .km-metric.m-shares{
  background: #f2fbf6;
}
.km-review-card .km-metric.m-shares .v{
  font-size: 14px;
  font-weight: 700;
  color:#1c6b45;
  background: #e8f6ee;
  border: 1px solid #cfe9dd;
  border-radius: 999px;
  padding: 4px 10px;
}
.km-review-card .km-rr-excerpt{ margin-top: 12px; }
@media (max-width: 480px){
  .km-review-card .km-metric .v{ font-size: 18px; }
}

/* 優待一覧カードのサムネ（口コミ写真優先） */
.wp-site-blocks .km-ka-card{display:flex;gap:14px;align-items:flex-start}
.wp-site-blocks .km-ka-thumb{flex:0 0 80px;height:80px;border-radius:12px;overflow:hidden;background:#f3f4f6}
.wp-site-blocks .km-ka-thumb img{width:100%;height:100%;object-fit:cover;display:block}
@media (min-width:782px){ .wp-site-blocks .km-ka-card{align-items:center} }

/* === Search page layout === */
.wp-site-blocks .km-search .km-sec{ margin:6px 0 10px; border-left:6px solid #0b6b39; padding-left:.5em; }
.wp-site-blocks .km-querytitle{ color:#555; margin-bottom:10px; }
.wp-site-blocks .km-searchform{ margin:8px 0 16px; }
.wp-site-blocks .km-search-list .km-card{
  display:grid; grid-template-columns:120px 1fr; gap:12px;
  background:#fff; border:1px solid #e6f4ec; border-radius:16px; padding:12px; margin:10px 0;
}
.wp-site-blocks .km-search-list .km-card .km-thumb img{ border-radius:12px; aspect-ratio:4/3; object-fit:cover; }
@media (max-width: 640px){
  .wp-site-blocks .km-search-list .km-card{ grid-template-columns:1fr; }
}
.wp-site-blocks .km-search-list .km-title{ margin:0 0 6px; }
.wp-site-blocks .km-search-list .km-excerpt{ color:#333; }
.wp-site-blocks .km-search-list .km-meta{ gap:10px; color:#6b7280; font-size:.9rem; }

/* ハイライト（既出） */
.wp-site-blocks .km-hi{ background:#FFF6A6; padding:0 .1em; border-radius:2px; }

/* ===== 権利月ボックスだけブランド配色にする ===== */
/* 親 .km-box を id=rights-months でスコープ */
#rights-months { color: #fff; }
#rights-months + .km-month-grid,
#rights-months + .km-month-list { /* no-op */ }

/* ボックス全体（権利月セクション）が .km-box の中にある想定 */
.km-box:has(#rights-months) {
  background: #004a1c;
  border-color: #003716;
  color: #fff;
}

/* ===== ボタン版のグリッド ===== */
.km-month-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(72px, 1fr));
  gap: 10px;
  margin-top: 8px;
}

/* 四角ボタン（正方形寄せ） */
.km-month-btn{
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 1 / 1;
  border-radius: 12px;
  text-decoration: none;
  background: rgba(255,255,255,.06);
  border: 2px solid #e85c0d;
  color: #fff;
  font-weight: 800;
  transition: transform .06s ease, background .15s ease, color .15s ease, box-shadow .15s ease;
  box-shadow: 0 1px 0 rgba(0,0,0,.08) inset, 0 1px 2px rgba(0,0,0,.06);
}
.km-month-btn .m{ font-size: 24px; line-height: 1; }
.km-month-btn .jp{ font-size: 13px; margin-left: 2px; opacity: .9; }

/* ホバー/フォーカス */
.km-month-btn:hover,
.km-month-btn:focus{
  background: #e85c0d;
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 2px 10px rgba(232,92,13,.25), 0 0 0 3px rgba(232,92,13,.25);
  outline: none;
}

/* キーボードアクセシビリティ */
.km-month-btn:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px rgba(255,255,255,.85), 0 0 0 6px rgba(232,92,13,.6);
}

/* モバイルの見やすさ微調整 */
@media (max-width: 480px){
  .km-month-grid{ gap: 8px; }
  .km-month-btn .m{ font-size: 22px; }
  .km-month-btn .jp{ font-size: 12px; }
}

/* 万一、従来の縦書きスタイルが残っていても非表示に */
.km-month-list{ list-style:none; padding:0; margin:.4rem 0 0; }
.km-month-list li{ display:inline-block; margin:0 .3rem .3rem 0; }
.km-month-list a{
  display:inline-block; padding:.5em .8em; border-radius:10px;
  border:2px solid #e85c0d; color:#fff; text-decoration:none;
}
.km-month-list a:hover{ background:#e85c0d; color:#fff; }
/* ===== 優待ページ専用：モバイル1カラム強制 & サイド非sticky ===== */
@media (max-width: 960px){
  /* km-layout を使っていないテンプレでも確実に縦積みする */
  body.single-kabuyutai .km-layout { grid-template-columns: 1fr !important; }
  body.single-kabuyutai .km-sidebar { position: static !important; margin-top: 24px !important; }

  /* Gutenberg Columnsで構成されている場合の保険 */
  body.single-kabuyutai .wp-block-columns{ flex-wrap: wrap !important; }
  body.single-kabuyutai .wp-block-column{ flex-basis: 100% !important; max-width: 100% !important; }

  /* カード内の横並びを折り返す */
  body.single-kabuyutai .km-stock-card__bar{ flex-wrap: wrap !important; }
  body.single-kabuyutai .km-stock-card__note{ width: 100%; text-align: right; }

  /* スペックグリッドが狭幅で2列を維持して食み出す場合の保険 */
  body.single-kabuyutai .km-spec-grid{ grid-template-columns: 1fr !important; }
}

/* 表・表組みの横はみ出し保護 */
body.single-kabuyutai .km-yutai-table{
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* 万一の横スクロール原因を局所で握りつぶす（全体hiddenはしない） */
@media (max-width: 960px){
  body.single-kabuyutai .km-main{ overflow-x: clip; }
}
/* ===== ヒーローの横はみ出し抑止（トップ限定） ===== */
body.home .km-header,
body.home .km-hero.-compact{ overflow-x: clip; }

/* 内側は常にビューポート内に収める */
.wp-site-blocks .km-hero__inner{
  max-width: min(960px, 100%);
  width: 100%;
  box-sizing: border-box;
}

/* 検索バーは端末幅に追従（パディング込み） */
.wp-site-blocks .km-hero__search{
  width: 100%;
  max-width: 640px;
  box-sizing: border-box;
}
.wp-site-blocks .km-hero__search .search-field{ min-width: 0; } /* はみ出し防止 */

/* CTAボタン列：強制折り返し＋縮む */
.wp-site-blocks .km-hero__cta{
  flex-wrap: wrap;
  gap: 10px 12px;
  width: 100%;
  justify-content: center;
}
.wp-site-blocks .km-hero__btn{ min-width: 0; }

/* タブレット以下で要素を少しコンパクトに */
@media (max-width: 960px){
  .wp-site-blocks .km-hero__logo img{ width: clamp(180px, 40vw, 300px); }
  .wp-site-blocks .km-hero__search .search-field{ font-size: .95rem; padding: 10px; }
  .wp-site-blocks .km-hero__search .search-submit{ padding: 10px 14px; }
  .wp-site-blocks .km-hero__btn{ padding: 10px 16px; }
}

/* ヘッダーのアクションが横に溢れる保険 */
@media (max-width: 782px){
  .km-header-inner{ flex-wrap: wrap; }
  .km-actions{ flex-wrap: wrap; gap: 12px; }
}
/* ===== 権利月一覧：列数と形状を端末幅で最適化 ===== */

/* デフォルト（PC）：4列以上 */
.km-month-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-top: 8px;
}

/* タブレット未満：3列 */
@media (max-width: 640px){
  .km-month-grid{ grid-template-columns: repeat(3, 1fr); }
}

/* 極小端末：2列 */
@media (max-width: 380px){
  .km-month-grid{ grid-template-columns: repeat(2, 1fr); }
}

/* モバイルでは“正方形”をやめて統一高のピル型に */
@media (max-width: 640px){
  .km-month-btn{
    aspect-ratio: auto;
    height: 56px;
    border-radius: 14px;
    display:flex; align-items:center; justify-content:center;
  }
  .km-month-btn .m{ font-size: 20px; }
  .km-month-btn .jp{ font-size: 12px; }
}

/* PC/タブレットは従来の正方形でOK（必要ならこのまま維持） */
@media (min-width: 641px){
  .km-month-btn{ aspect-ratio: 1 / 1; }
}
/* ====== トップのヒーローはみ出し完全停止（強制上書き） ====== */
body.home .km-header--hero-nav .km-header-inner{
  max-width: calc(100vw - 32px) !important;  /* 左右16pxぶん余裕を確保 */
  width: 100% !important;
  padding-inline: 16px !important;
  box-sizing: border-box !important;
}

body.home .km-hero.-compact{ 
  overflow-x: clip !important;                /* ヒーロー自身で横を断つ */
}

body.home .km-hero__inner{
  max-width: min(960px, calc(100vw - 32px)) !important;
  width: 100% !important;
  margin-inline: auto !important;
  padding-inline: 16px !important;
  box-sizing: border-box !important;
}

body.home .km-hero__search{
  width: 100% !important;
  max-width: min(640px, 100%) !important;
  box-sizing: border-box !important;
}
body.home .km-hero__search .search-field{ min-width: 0 !important; }

body.home .km-hero__cta{
  flex-wrap: wrap !important;
  gap: 10px 12px !important;
  width: 100% !important;
  justify-content: center !important;
}
body.home .km-hero__btn{ min-width: 0 !important; }

/* （余計な要素があればみなしカット） */
@supports(padding: max(0px)){
  body.home .km-hero__inner{ padding-left:max(16px, env(safe-area-inset-left));
    padding-right:max(16px, env(safe-area-inset-right)); }
}
/* PC: 4列 */
.km-month-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:8px; }
/* タブレット未満: 3列 */
@media (max-width:640px){ .km-month-grid{ grid-template-columns:repeat(3,1fr); } }
/* 極小: 2列 */
@media (max-width:380px){ .km-month-grid{ grid-template-columns:repeat(2,1fr); } }

/* スマホはピル型（高さ統一） */
@media (max-width:640px){
  .km-month-btn{
    aspect-ratio:auto; height:56px; border-radius:14px;
    display:flex; align-items:center; justify-content:center;
  }
  .km-month-btn .m{ font-size:20px; }
  .km-month-btn .jp{ font-size:12px; }
}
/* PC/タブレットは正方形 */
@media (min-width:641px){ .km-month-btn{ aspect-ratio:1/1; } }
/* ヒーロー内側は横を絶対に出さない（保険） */
body.home .km-hero__inner{ overflow-x:hidden !important; }

/* 犯人：km-hero__tagline（1行化時に幅を押し広げるのを抑止） */
body.home .km-hero__tagline.-singleline{
  display:block;
  width:100% !important;
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  margin:0.6rem 0 0.2rem;
  /* 小幅端末で少しだけ縮める */
  font-size:clamp(0.95rem, 3.6vw, 1.1rem);
}
/* = PC: 4列（通常/compact両対応） */
.km-month-grid,
.km-month-grid.-compact{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin-top:8px;
}

/* = タブレット未満: 3列 */
@media (max-width:640px){
  .km-month-grid,
  .km-month-grid.-compact{
    grid-template-columns:repeat(3,1fr);
  }
}

/* = 極小: 2列 */
@media (max-width:380px){
  .km-month-grid,
  .km-month-grid.-compact{
    grid-template-columns:repeat(2,1fr);
  }
}

/* = スマホは正方形をやめて高さ56pxピルで統一（上下も揃う） */
@media (max-width:640px){
  .km-month-grid .km-month-btn,
  .km-month-grid.-compact .km-month-btn{
    aspect-ratio:auto;
    height:56px;
    border-radius:14px;
    display:flex; align-items:center; justify-content:center;
  }
  .km-month-grid .km-month-btn .m,
  .km-month-grid.-compact .km-month-btn .m{ font-size:20px; }
  .km-month-grid .km-month-btn .jp,
  .km-month-grid.-compact .km-month-btn .jp{ font-size:12px; }
}

/* = PC/タブレットは従来の正方形 */
@media (min-width:641px){
  .km-month-grid .km-month-btn,
  .km-month-grid.-compact .km-month-btn{ aspect-ratio:1/1; }
}
/* ============================================
   モバイル時：ヒーローのキャッチコピーを2行表示にする
   （1行トリミング解除＋可読性調整）
============================================ */
@media (max-width:640px){
  .km-hero__tagline.-singleline{
    white-space:normal !important;
    text-overflow:unset !important;
    overflow:visible !important;
    display:block;
    line-height:1.5;
    font-size:clamp(0.9rem, 3.4vw, 1rem);
    max-width:90%;
    margin:0.6rem auto 0.4rem;
  }
}
/* ピルの共通（未選択の見た目） */
#kmAllModal .section a,
#kmAllModal .section button,
#kmAllModal .tag-cloud-link,
#kmAllModal .km-chip {
  font-size: 13px;
  line-height: 1.35;
  padding: 6px 10px;
  border-radius: 18px;
  margin: 4px 6px;
  background: #f5f7f6;       /* ← ここは !important を付けない */
  color: #222;
  white-space: nowrap;
  border: 1px solid #e5e7eb;
}

/* 選択中（JSが付ける可能性のあるクラス/属性を広くカバー） */
#kmAllModal .section a.is-active,
#kmAllModal .section a.active,
#kmAllModal .section a.selected,
#kmAllModal .section a.-active,
#kmAllModal .section a.-on,
#kmAllModal .section button.is-active,
#kmAllModal .section button.active,
#kmAllModal .section button.selected,
#kmAllModal .section button.-active,
#kmAllModal .section button.-on,
#kmAllModal .section [aria-pressed="true"] {
  background: #066e34 !important;  /* 緑 */
  color: #fff !important;
  border-color: #066e34 !important;
}

/* ホバー/フォーカスのアクセント（任意） */
#kmAllModal .section a:hover,
#kmAllModal .section button:hover,
#kmAllModal .section a:focus,
#kmAllModal .section button:focus {
  box-shadow: 0 0 0 2px rgba(6,110,52,.15);
}
#kmAllModal .close{ position:absolute; right:10px; top:8px; z-index:1002; pointer-events:auto; }
#kmAllModal .box{ position:relative; z-index:1001; }
#kmAllModal .ov{ z-index:1000; }
/**** 0) 基本土台（どこでも効くやつ） *************************/
*,
*::before,
*::after { box-sizing: border-box; }

html { font-size: 16px; } /* ベース16px */
body { margin: 0; }

/* レイアウト共通：左右に安全パディング・最大幅センター */
.km-layout,
.km-container { 
  max-width: 1200px; 
  margin-inline: auto; 
  padding-inline: 14px;  /* ← モバイルの左右余白 */
}

/* モバイル基準の文字スケール（軽く小さめ） */
.km-layout .km-main,
.single-review .km-content { 
  font-size: 0.98rem; 
  line-height: 1.8; 
}

/**** 1) ヘッダー/ナビがはみ出さない ********************************/
/* ヘッダーの行は折り返し許可・隙間を詰める */
.km-header,
.site-header,
header .wp-block-group { 
  display: flex; 
  align-items: center; 
  gap: 10px; 
  flex-wrap: wrap;         /* ← これで収まる */
  padding: 8px 14px;
}

/* ロゴが大きすぎる場合の上限 */
.km-header img, .site-header img { 
  max-height: 42px; 
  height: auto; 
}

/* メニューが横に長い時は横スクロール許可（最小の逃げ） */
.km-nav, .primary-navigation { 
  overflow-x: auto; 
  -webkit-overflow-scrolling: touch; 
  white-space: nowrap; 
}

/**** 2) カードのグリッド（トップ「最新口コミ」など） ***************/
/* グリッド：モバイル1〜PC3列まで自動可変 */
.km-lr-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

/* カードの内側タイポ・余白を少し圧縮 */
.km-review-card { padding: 10px; border-radius: 12px; background:#fff; }
.km-review-card .km-lr-title { font-size: 1rem; line-height:1.4; margin:.4rem 0; }
.km-review-card .km-lr-company { font-size:.95rem; opacity:.9; }
.km-review-card .km-rr-excerpt { font-size:.95rem; }

/**** 3) ピル/バッジのサイズ調整 ***********************************/
.km-pill { 
  font-size: .92rem; 
  padding: .3em .58em; 
}
.km-badge.-tag,
.km-chip.-brand { 
  font-size: .94rem; 
}

/**** 4) 画像は枠からはみ出さない・崩れない ************************/
/* 口コミカードのサムネは既に absolute+cover になっているが保険で */
.km-lr-media { position:relative; display:block; border-radius:.75rem; overflow:hidden; }
.km-lr-thumb { width:100%; height:100%; object-fit: cover; display:block; }

/* ギャラリー（single-review）も破綻防止 */
.km-gallery__item { aspect-ratio: 4 / 3; }
.km-gallery__item img { width:100%; height:100%; object-fit:cover; }

/**** 5) フッター：カラムを縦積み → 幅が広い時だけ横並び ***********/
.site-footer .wp-block-columns,
.km-footer .wp-block-columns {
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr;     /* モバイルは1列 */
}
@media (min-width: 768px){
  .site-footer .wp-block-columns,
  .km-footer .wp-block-columns {
    grid-template-columns: repeat(3, 1fr); /* 例：3列 */
  }
}

/**** 6) PCでだけ ほんの少し広げる（任意） ***************************/
@media (min-width: 1024px){
  .km-layout .km-main,
  .single-review .km-content { font-size: .94rem; }
  .km-lr-grid { gap: 18px; }
}
/* === 口コミ一覧（/reviews/）スマホ最適化 ========================= */
@media (max-width: 430px){

  /* カード全体：余白を少し圧縮 */
  .km-review-card{ padding:10px; }

  /* 口コミタイトルを少し小さく */
  .km-review-card .km-lr-title{
    font-size: .96rem;
    line-height: 1.35;
    margin:.35rem 0 .25rem;
    text-wrap: balance;              /* 日本語でもバランスよく折返し */
  }

  /* 銘柄チップ（緑の丸角・社名＋コード）
     → フォント小さく、最大2行でトリミング（はみ出し防止） */
  .km-review-card .km-chip.-brand{
    font-size: .88rem;
    padding: .40em .70em;
    line-height: 1.2;
    display: -webkit-box;
    -webkit-line-clamp: 2;           /* 2行まで */
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-height: calc(1.2em * 2 + 4px);
    word-break: break-word;          /* 長い英字にも耐性 */
  }

  /* バッジ（ジャンル等）もちょい小さくして段崩れを抑える */
  .km-review-card .km-badge.-tag{
    font-size: .82rem;
    padding: .32em .62em;
  }

  /* 投資ピル（優待取得目安/総合利回り）も一段階だけ縮小 */
  .km-review-card .km-pill{
    font-size: .88rem;
    padding: .3em .56em;
  }

  /* 「続きを読む」ボタンの幅詰め（折返し回避） */
  .km-review-card .km-btn-read{
    font-size: .9rem;
    padding: .48em .8em;
    white-space: nowrap;
  }
}

/* グリッド列幅の下限を少しだけ狭めて、2列→1列落ちを防止（任意） */
@media (max-width: 390px){
  .km-lr-grid{ grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
}