/* 機材メモ 記事本文のスタイル
   ※ ダークモード（prefers-color-scheme）の指定は入れないこと。
      テーマの JIN が OS 連動のダークモードに対応していないため、
      ここだけ暗くすると「白いページに黒いパーツ」という状態になる。
      配色はテーマの明るい地に合わせる。
   gear-autopost の lib_gear.php が出力するマークアップに対応する。
   記事ごとに本文へ埋め込むと同じCSSが記事数だけ複製され、
   ブラウザのキャッシュも効かないため、外部ファイルにして読み込む。 */
.km-cl{display:inline-block}
/* 節ごとの余白。見出しの前に間を取り、本文の下にも抜けを作る。
   JINの見出しデザインは活かしたいので、余白だけを上書きする。 */
.km-article h2{margin-top:3.2em}
.km-article h2:first-of-type{margin-top:1.8em}
.km-article ul{margin-bottom:2.4em}
.km-article>p{margin-bottom:1.6em}
/* 見出しと本文の間。
   隣り合う margin は相殺して大きい方しか効かないため padding を使う。
   さらにクラスを二重に書いて詳細度を上げ、テーマ側の指定に負けないようにする。 */
.km-article.km-article h2+ul,
.km-article.km-article h2+p{margin-top:0;padding-top:3.1em}
.km-article.km-article h2+.km-secimg,
.km-article.km-article h2+.km-gallery{margin-top:0;padding-top:2.2em}
.km-article.km-article h2+.km-verdict{margin-top:2.2em}
.km-article.km-article ul li:first-child{margin-top:0}
.km-article h3{margin-top:1.6em}
.km-article mark{background:linear-gradient(transparent 62%,#ffe9a8 62%);color:inherit;
  padding:0 .08em;border-radius:2px}
.km-article strong{font-weight:700}
.km-pr{margin:0 0 1.6em;padding:0 0 .8em;font-size:.8rem;color:#8a93a3;line-height:1.7;
  border-bottom:1px solid #eceef3}
.km-verdict{position:relative;margin:2.6em 0 2.2em;padding:1.7em 1.5em 1.4em;
  background:linear-gradient(180deg,#f6f9fe 0%,#eaf1fa 100%);
  border:1px solid #cfdcef;border-radius:12px;box-shadow:0 3px 14px rgba(31,63,110,.08)}
.km-verdict .km-label{position:absolute;top:-.9em;left:1.3em;margin:0;padding:.4em 1.2em;
  background:#2f5d9e;color:#fff;border-radius:100px;font-size:.78rem;font-weight:700;
  letter-spacing:.12em;box-shadow:0 2px 6px rgba(47,93,158,.3)}
.km-verdict p{margin:0;font-size:1.06rem;line-height:1.95}
.km-fig{margin:2em 0;text-align:center}
.km-fig img{max-width:100%;height:auto;border-radius:8px}
.km-fig figcaption{margin-top:.6em;font-size:.85rem;color:#6b7280}
.km-ownerpic img{border:1px solid #e4e7ee}
.km-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1em;margin:1.4em 0 2em}
.km-gallery figure{margin:0}
.km-gallery img{width:100%;height:auto;display:block;border:1px solid #e4e7ee;border-radius:8px;
  background:#fff}
.km-gallery figcaption{margin-top:.5em;font-size:.8rem;color:#6b7280;line-height:1.6}
.km-secimg{margin:1.2em 0 2em}
.km-secimg img{border:1px solid #e4e7ee}
.km-faq{margin:1.2em 0;padding:.4em 1.4em 1.2em;border:1px solid #e4e7ee;border-radius:8px;
  background:#fafbfd}
.km-buy{margin:2.4em 0 1em}
.km-buy-inner{display:flex;gap:1.4em;align-items:center;padding:1.4em;
  background:#fff;border:1px solid #dde3ec;border-radius:12px;
  box-shadow:0 2px 12px rgba(31,63,110,.08)}
.km-buy-thumb{flex:0 0 148px;max-width:148px}
.km-buy-thumb img{width:100%;height:auto;border-radius:6px;display:block}
.km-buy-body{flex:1 1 auto;min-width:0}
.km-buy-name{margin:0 0 .35em;font-weight:700;font-size:1.05rem;line-height:1.5}
.km-buy-price{margin:0 0 .9em;font-size:1.5rem;font-weight:700;color:#c0392b;line-height:1.3}
.km-buy-price span{font-size:.95rem;font-weight:700;margin-left:.15em}
.km-buy-price .km-buy-shop{display:block;margin:.3em 0 0;font-size:.82rem;font-weight:400;color:#6b7280}
.km-buy-cta{margin:0 0 .7em}
.km-buy-cta a{display:block;padding:.9em 1.2em;text-align:center;
  background:#bf0000;color:#fff;font-weight:700;font-size:1.02rem;
  border-radius:8px;text-decoration:none}
.km-buy-cta a:hover{background:#a00000;color:#fff}
.km-meta{margin:.6em 0 0;font-size:.82rem;color:#6b7280;line-height:1.7}
@media(max-width:600px){
  .km-buy-inner{flex-direction:column;align-items:stretch}
  .km-buy-thumb{flex:none;max-width:none;text-align:center}
  .km-buy-thumb img{max-width:200px;margin:0 auto}
  .km-gallery{grid-template-columns:repeat(2,1fr);gap:.8em}
}

/* モデルの違い */
.km-var-note{margin:1.6em 0 -.6em;padding:.55em .9em;background:#f4f7fc;border-left:4px solid #2f5d9e;
  border-radius:4px;font-size:.92rem;font-weight:700;line-height:1.7}

/* 比較表。狭い画面では表だけ横に流す（本文は横スクロールさせない） */
.km-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:1.4em 0 .6em}
.km-table{border-collapse:collapse;width:100%;min-width:520px;font-size:.93rem;line-height:1.7}
.km-table th,.km-table td{border:1px solid #dde3ec;padding:.7em .9em;text-align:left;vertical-align:top}
.km-table thead th{background:#eef3fb;font-weight:700;white-space:nowrap}
.km-table tbody th{background:#f7f9fc;font-weight:700;white-space:nowrap}
.km-table .km-hi{background:#fff6e5}
.km-table thead th.km-hi{background:#ffe9c2}

/* セールページ */
.km-sale{display:grid;gap:1em;margin:1.4em 0 2em}
.km-sale-item{display:flex;gap:1.2em;align-items:center;padding:1em;border:1px solid #dde3ec;
  border-radius:10px;background:#fff;box-shadow:0 2px 8px rgba(31,63,110,.06)}
.km-sale-thumb{flex:0 0 110px;max-width:110px}
.km-sale-thumb img{width:100%;height:auto;display:block;border-radius:6px}
.km-sale-body{flex:1 1 auto;min-width:0}
.km-sale-name{margin:0 0 .4em;font-weight:700;font-size:1rem;line-height:1.5}
.km-sale-price{margin:0 0 .2em;font-size:1.45rem;font-weight:700;color:#c0392b;line-height:1.35}
.km-sale-price .km-yen{font-size:.9rem;margin-left:.1em}
.km-sale-off{display:inline-block;margin-right:.6em;padding:.15em .6em;background:#c0392b;color:#fff;
  border-radius:100px;font-size:.82rem;vertical-align:.15em}
.km-sale-was{display:block;margin-top:.25em;font-size:.8rem;font-weight:400;color:#6b7280;
  text-decoration:line-through}
@media(max-width:600px){
  .km-sale-item{flex-direction:column;align-items:stretch;text-align:center}
  .km-sale-thumb{flex:none;max-width:none}
  .km-sale-thumb img{max-width:180px;margin:0 auto}
}

/* あわせて使うもの */
.km-acc{display:grid;grid-template-columns:repeat(2,1fr);gap:.9em;margin:1.4em 0 .6em}
.km-acc-item{display:flex;gap:.9em;align-items:center;padding:.8em;border:1px solid #e4e7ee;
  border-radius:8px;background:#fff}
.km-acc-thumb{flex:0 0 72px;max-width:72px}
.km-acc-thumb img{width:100%;height:auto;display:block;border-radius:5px}
.km-acc-body{flex:1 1 auto;min-width:0}
.km-acc-name{margin:0 0 .25em;font-size:.9rem;font-weight:700;line-height:1.5}
.km-acc-note{margin:0 0 .3em;font-size:.82rem;color:#5b6472;line-height:1.6}
.km-acc-price{margin:0;font-size:.86rem;font-weight:700;color:#c0392b}
.km-acc-price span{display:block;font-size:.76rem;font-weight:400;color:#6b7280}
@media(max-width:600px){.km-acc{grid-template-columns:1fr}}

/* 関連記事 */
.km-related{display:grid;grid-template-columns:repeat(2,1fr);gap:1em;margin:1.4em 0 2em}
.km-rel{display:flex;gap:.9em;align-items:center;padding:.8em;border:1px solid #e4e7ee;
  border-radius:8px;background:#fafbfd;text-decoration:none;color:inherit}
.km-rel:hover{background:#f2f5fa;color:inherit}
.km-rel-thumb{flex:0 0 84px;max-width:84px}
.km-rel-thumb img{width:100%;height:auto;display:block;border-radius:5px}
.km-rel-title{flex:1 1 auto;font-size:.92rem;font-weight:700;line-height:1.55}
@media(max-width:600px){.km-related{grid-template-columns:1fr}}

/* 未確認の「筆者の感想」に出す警告帯。公開前に外すこと。 */
.km-unverified{margin:0 0 1.2em;padding:.9em 1.1em;background:#fdecea;border:2px solid #d64545;
  border-radius:6px;color:#8a1f1f;font-weight:700;font-size:.92rem;line-height:1.7}