/* =========================================================
   プロポーズ・ウェディング特集ページ（/feature-p, /feature-w）
   クラス名はすべて xf- で始まり、既存テーマ（xing16）と衝突しません。
   テーマの外部CSSとして読み込んでください（本文中に<style>で書かない）。
   ========================================================= */
.xf-feature { color: #505050; font-size: 13px; line-height: 2; letter-spacing: 0.05em; }
.xf-feature p { margin: 0 0 1em; }
.xf-feature a { color: #b10a0a; }
.xf-feature a:hover { color: #000; }
.xf-feature img { max-width: 100%; height: auto; display: block; }

.xf-h1 { margin: 0 0 16px; text-align: center; font-family: '游明朝', 'Yu Mincho', 'Hiragino Mincho ProN', 'Noto Serif JP', serif; font-size: 23px; font-weight: 400; color: #c1a278; line-height: 1.6; }
.xf-catch { font-family: '游明朝', 'Yu Mincho', 'Hiragino Mincho ProN', 'Noto Serif JP', serif; font-size: 16px; color: #323232; line-height: 1.8; }
.xf-en { margin: 0 !important; text-align: center; font-family: '游明朝', 'Yu Mincho', 'Hiragino Mincho ProN', 'Noto Serif JP', serif; font-size: 27px; color: #c1a278; line-height: 1.5; }
.xf-h2 { margin: 4px 0 24px; text-align: center; font-size: 13px; font-weight: 400; color: #505050; }
.xf-h3 { margin: 0 0 8px; font-size: 13px; font-weight: 700; color: #323232; }
.xf-sec { margin-top: 64px; }
.xf-center { text-align: center; margin-top: 20px; }
.xf-right { text-align: right; font-size: 12px; margin-top: 12px; }
.xf-note { font-size: 11px; margin-top: 6px; }
.xf-tag { display: inline-block; margin: 0 0 8px !important; padding: 0 10px; background: #c1a278; color: #fff; font-size: 11px; line-height: 1.8; }

/* 会社の信頼情報 */
.xf-trust { margin-top: 40px; padding: 28px 24px; background: #f9f3f3; }
.xf-trust__lead { text-align: center; font-family: '游明朝', 'Yu Mincho', serif; font-size: 15px; color: #aa8657; }
.xf-trust__list { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; text-align: center; line-height: 1.6; }
.xf-trust__list p { margin: 0; font-size: 11px; }
.xf-trust__num { font-family: Lusitana, serif; font-size: 30px !important; color: #aa8657; }
.xf-trust__num span { font-size: 12px; }
.xf-trust__word { font-family: '游明朝', 'Yu Mincho', serif; font-size: 17px !important; color: #aa8657; margin: 6px 0 10px !important; }

/* 残し方 */
.xf-how { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.xf-how__item { background: #f3f3f3; padding: 24px; }
.xf-how__meta { margin: 0 !important; padding-top: 8px; border-top: 1px solid #dfdfdf; font-size: 12px; color: #323232; }
.xf-how__tip { margin-top: 20px; padding: 16px 20px; border: 1px solid #dcb7b7; }
.xf-how__tip strong { color: #b10a0a; }

/* ページ内ジャンプボタン（現行の本数ボタンと同じ見た目） */
.xf-jump { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.xf-jump a { display: inline-flex; align-items: center; height: 37px; padding: 0 20px; border: 1px solid #b10a0a; border-radius: 3px; background: #fff; color: #b10a0a; font-size: 13px; text-decoration: none; }
.xf-jump a:hover { background: #b10a0a; color: #fff; }

/* 早見表 */
.xf-table-wrap { margin-top: 28px; overflow-x: auto; }
.xf-table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 12px; line-height: 1.6; }
.xf-table caption { caption-side: top; text-align: left; padding-bottom: 8px; font-size: 13px; font-weight: 700; color: #323232; }
.xf-table th, .xf-table td { padding: 8px 10px; border: 1px solid #dfdfdf; text-align: left; vertical-align: top; }
.xf-table thead th { background: #f9f3f3; color: #323232; }
.xf-table tbody th { color: #b10a0a; white-space: nowrap; }
.xf-table strong { color: #323232; white-space: nowrap; }

/* 本数・形の見出し帯（現行と同じ赤帯） */
.xf-bar { display: flex; align-items: baseline; gap: 14px; margin: 0; padding: 14px 40px; background: #b10a0a; border-radius: 3px; color: #fff; font-family: '游明朝', 'Yu Mincho', 'Hiragino Mincho ProN', serif; font-weight: 400; line-height: 1.4; scroll-margin-top: 16px; }
.xf-bar__num { font-size: 23px; }
.xf-bar__sub { font-size: 13px; }
.xf-count__lead { margin: 16px 20px 28px !important; }

/* PICK UPカード */
.xf-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 16px; }
.xf-card { display: flex; flex-direction: column; }
.xf-card__photo { position: relative; border: 1px solid #c1a278; padding: 22px 14px 14px; }
.xf-card__photo img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.xf-card__pickup, .xf-card__pickup * { font-family: Lusitana, serif; }
.xf-card__pickup { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); margin: 0 !important; padding: 0 8px; background: #fff; white-space: nowrap; font-size: 11px; color: #c1a278; line-height: 24px; }
.xf-card__pickup span { font-size: 17px; }
.xf-card__body { flex: 1 1 auto; display: flex; flex-direction: column; margin: 0 10px; padding: 14px; background: #f3f3f3; }
.xf-card__name { margin: 0; font-size: 17px; font-weight: 400; color: #000; line-height: 1.5; }
.xf-card__method { align-self: flex-start; margin: 4px 0 0 !important; padding: 0 8px; background: #c1a278; color: #fff; font-size: 10px; line-height: 1.8; }
.xf-card__desc { margin: 8px 0 0 !important; font-size: 11px; line-height: 1.7; }
.xf-card__spec { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 2px 6px; margin: 8px 0 0; padding-top: 8px; border-top: 1px solid #ddd; font-size: 11px; line-height: 1.6; }
.xf-card__spec dt { color: #999; }
.xf-card__spec dd { margin: 0; }
.xf-card__spec strong { color: #323232; }
.xf-card__opts { margin: 8px 0 12px; padding-top: 8px; border-top: 1px solid #ddd; }
.xf-card__opts p { margin: 0 0 2px !important; font-size: 11px; color: #999; }
.xf-card__opts ul { margin: 0; padding: 0; list-style: none; font-size: 10px; line-height: 1.6; }

/* ボタン */
.xf-btn { display: flex; align-items: center; justify-content: center; margin-top: auto; min-height: 38px; padding: 0 16px; background: #b10a0a; color: #fff !important; font-size: 12px; text-decoration: none; }
.xf-btn:hover { opacity: 0.8; }
.xf-btn--wide { min-height: 52px; margin-top: 24px; background: #8c0f0f; font-size: 14px; font-weight: 700; }
.xf-btn-line { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 28px; border: 2px solid #a33f3f; border-radius: 3px; color: #a33f3f !important; font-weight: 700; text-decoration: none; }
.xf-btn-line:hover { background: #a33f3f; color: #fff !important; }

/* 口コミ */
.xf-voice { margin-bottom: 14px; padding: 18px 22px; background: #fafafa; border: 1px solid #e6e6e6; }
.xf-voice h3 { margin: 0 0 6px; font-family: '游明朝', 'Yu Mincho', serif; font-size: 16px; font-weight: 400; color: #323232; line-height: 1.6; }
.xf-voice__meta { margin: 0 !important; font-size: 11px; color: #aa8657; }

/* FAQ（details/summary。閉じていても回答はHTMLに残る） */
.xf-faq { border-top: 1px dotted #dcb7b7; }
.xf-faq__item { border-bottom: 1px dotted #dcb7b7; }
.xf-faq__item summary { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 6px 4px; list-style: none; cursor: pointer; font-size: 14px; font-weight: 700; color: #323232; line-height: 1.6; }
.xf-faq__item summary::-webkit-details-marker { display: none; }
.xf-q { font-family: Lusitana, serif; font-size: 20px; color: #8c0f0f; }
.xf-faq__a { display: flex; gap: 12px; margin-bottom: 16px; padding: 12px 16px; background: #f9f3f3; line-height: 1.9; }
.xf-faq__a p { margin: 0 !important; }
.xf-a { font-family: Lusitana, serif; font-size: 20px; color: #aa8657; line-height: 1.2; }

/* サロン */
.xf-salon { margin-top: 72px; padding: 32px; background: #f9f3f3; }
.xf-salon .xf-en { font-size: 12px; letter-spacing: 0.2em; color: #aa8657; }
.xf-salon .xf-h2 { font-family: '游明朝', 'Yu Mincho', serif; font-size: 20px; color: #323232; }
.xf-salon__info { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 4px 10px; margin: 0; font-size: 12px; line-height: 1.7; }
.xf-salon__info dt { color: #aa8657; }
.xf-salon__info dd { margin: 0; }

/* 関連リンク・CTA */
.xf-links { margin: 0; padding: 0; list-style: none; border-top: 1px dotted #dcb7b7; }
.xf-links li { border-bottom: 1px dotted #dcb7b7; }
.xf-links a { display: block; padding: 8px 4px; font-size: 12px; }
.xf-cta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 56px; }
.xf-cta .xf-btn, .xf-cta .xf-btn-line { min-height: 58px; font-size: 14px; font-weight: 700; }
.xf-cta--box { padding: 24px; border: 1px solid #dcb7b7; text-align: center; }
.xf-cta--box p { grid-column: 1 / -1; font-family: '游明朝', 'Yu Mincho', serif; font-size: 17px; color: #323232; }

/* スマホ（スマホ用テンプレートで本文幅が狭いとき） */
@media (max-width: 767px) {
  .xf-trust__list { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 20px; }
  .xf-how, .xf-cards, .xf-cta { grid-template-columns: minmax(0, 1fr); }
  .xf-cards { gap: 28px; }
  .xf-bar { padding: 12px 16px; flex-wrap: wrap; gap: 4px 10px; }
  .xf-count__lead { margin: 12px 0 20px !important; }
  .xf-salon { padding: 24px 16px; }
  .xf-jump a { min-height: 44px; }
}
