/* Responsive: yes */

/* =========================================================
   スマホ記事ページ調整
   - 本文フォントサイズは変更しない
   - 本文行間を26pxに調整
   - 記事上の為替情報パネルを非表示
   - カテゴリタグを小さく・上下を詰める
   - スマホ上部のMarket NEXTアプリ誘導を非表示
   ========================================================= */

@media screen and (max-width: 767px) {
  /* スマホ記事本文：フォントサイズは維持し、行間だけ調整 */
  body.page-entry,
  body.page-entry * {
    line-height: 26px !important;
  }

  body.page-entry p {
    margin-top: 0 !important;
    margin-bottom: 0.9em !important;
  }

  /* 記事上「読む前にチェック！最新FX為替情報」を非表示 */
  .p-entry-chart {
    display: none !important;
  }

  /* スマホ上部のMarket NEXTアプリ誘導を非表示 */
  .c-marketnext,
  .c-marketnext-layout,
  .c-marketnext-pic,
  .c-marketnext-body,
  .c-marketnext-badges {
    display: none !important;
  }

  /*
    Market NEXTの外側セクションも非表示。
    :has() が効く環境では余白ごと消えます。
  */
  .c-section:has(.c-marketnext),
  .c-section:has(img[src*="logo-marketnext"]),
  .c-section:has(img[src*="top-app"]) {
    display: none !important;
  }

  /* スマホ記事ページ：カテゴリタグを小さく・上下を詰める */
  body.page-entry .entry-categories,
  body.page-entry .entry-category,
  body.page-entry .categories,
  body.page-entry .entry-tags,
  body.page-entry .entry-tag {
    gap: 4px !important;
    margin-top: 6px !important;
    margin-bottom: 6px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1.1 !important;
  }

  body.page-entry .entry-categories a,
  body.page-entry .entry-category a,
  body.page-entry .categories a,
  body.page-entry .entry-tags a,
  body.page-entry .entry-tag a,
  body.page-entry a[rel="tag"] {
    display: inline-block !important;
    font-size: 12px !important;
    line-height: 1.05 !important;
    padding: 5px 12px !important;
    margin: 0 4px 5px 0 !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
  }
}
