/* feature_ref.css v3 — 機能リファレンス専用の補完スタイル（コンパクト版）。
   共通部分（faq-top-tags / faq-top-cats / faq-filter / faq-list / faq-empty）はfaq.cssに乗る。
   v3: h2はタカオ調整版を正とし、p/ul/sectionの余白を圧縮。重複定義を統合。 */

/* トップ: 機能カード */
.fr-lead { color: #666; margin-bottom: 24px; }
ul.fr-card-list {
  list-style: none; padding: 0; margin: 0 0 30px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 24px;
}
@media (max-width: 767px) { ul.fr-card-list { grid-template-columns: 1fr; } }
.fr-card { border: 1px solid #e3e8ee; border-radius: 4px; overflow: hidden; background: #fff; }
.fr-card > a { display: block; color: inherit; text-decoration: none; }
.fr-card img {
  width: 100%; height: 170px; object-fit: cover; object-position: top;
  display: block; border-bottom: 1px solid #eef1f4;
}
.fr-card h3 { font-size: 16px; font-weight: 600; margin: 14px 16px 6px; }
.fr-card p { font-size: 13.5px; color: #666; margin: 0 16px 16px; line-height: 1.7; }
.fr-cross-link { margin: 10px 0 40px; }

/* 詳細: 8枠（コンパクト） */
.fr-detail { font-size: 14px; line-height: 1.8; }
.fr-detail h1 { font-size: 24px; margin: 0 0 12px; }

/* セクションの外余白は最小に。節の区切りはh2のmargin-topが担う */
.fr-detail section { margin: 0 0 8px; }

/* h2はタカオ調整版そのまま */
.fr-detail section h2 {
  font-size: 14px;
  font-weight: 600;
  color: #111;
  margin: 1.4em 0 .4em;
  padding-left: 12px;
  border-left: 3px solid var(--ww-accent);
  line-height: 1.5;
}
.fr-detail section:first-of-type h2 { margin-top: .4em; }  /* ≒5.6px、合計で約18px */

/* 本文。sectionを挟んで特異度を上げ、テーマ側のpルールに勝たせる */
.fr-detail section p {
  font-size: 14px;
  line-height: 1.8;
  color: #555;
  margin: 0 0 .7em;
}
.fr-detail section p:last-child { margin-bottom: 0; }

/* 箇条書き。行間・上下余白を圧縮 */
.fr-detail section ul {
  padding-left: 1.3em;
  margin: .2em 0 .7em;
}
.fr-detail section li {
  font-size: 14px;
  line-height: 1.7;
  color: #555;
  margin: 0 0 2px;
}

/* 管理画面のキャプチャ */
.fr-screens img { border: 1px solid #dde2e8; border-radius: 4px; box-shadow: 0 2px 8px rgba(0,0,0,.05); }
.fr-screens p { margin: 0 0 10px; }

/* デモ動画 */
.fr-video-frame { position: relative; padding-top: 56.25%; }
.fr-video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* 関連 */
ul.fr-rel-list { list-style: none; padding: 0; margin: 0; }
ul.fr-rel-list li { padding: 4px 0; margin: 0; border-bottom: 1px solid #eef1f4; }
.fr-rel-shikumi a { color: inherit; }

/* 業務タグ */
.fr-tags { margin: 18px 0 8px; }
.fr-tags a {
  display: inline-block; font-size: 13px; color: #556;
  background: #f2f4f7; border: 1px solid #dde2e8; border-radius: 16px;
  padding: 3px 12px; margin: 0 6px 6px 0; text-decoration: none;
}

.fr-intro p { margin-bottom: .4em; }