@charset "shift_jis";
/* ==========================================================================
 業界別：不動産・建設業界向け 法人研修パッケージ
 ※他ページへ影響しないよう、セレクタはすべて article.mainBox 内に限定
 ※クラスはすべて .re- プレフィックス
 ========================================================================== */

article.mainBox .re-lp {
  --re-navy: #012961;      /* 既_背景（タグ）_濃青 */
  --re-red: #c8000b;       /* 既_背景_青 */
  --re-gold: #c7a76c;      /* 文字_アクセント */
  --re-brown: #8c6239;     /* 文字_アクセント-2 */
  --re-blue: #4775b7;      /* 既_文字_青 */
  --re-line: #e0e6ef;      /* 枠線_薄青 */
  --re-line-white: #f7f7f4;/* 枠線_薄白 */
  --re-h2-line: #c1d0e6;
  --re-bg-table: #f1f3f6;  /* 表_背景 */
  --re-bg-light: #f9fafb;  /* 色-3 */
  --re-text: #4b5563;      /* 色-2 */
  --re-navy-pale: #e6ebf0;
  --re-red-pale: #e9d5d6;
  --re-brown-pale: #eaddc6;
  --re-sans: Meiryo, "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", sans-serif;
  --re-serif: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
}

article.mainBox .re-lp { width: 100%; font-family: var(--re-sans); font-size: 14px; line-height: 22px; color: var(--re-navy); -webkit-text-size-adjust: 100%; }
article.mainBox .re-lp *, article.mainBox .re-lp *::before, article.mainBox .re-lp *::after { box-sizing: border-box; }
article.mainBox .re-lp :where(h1, h2, h3, h4, h5, p, ul, ol, dl, dd, figure) { margin: 0; padding: 0; }
article.mainBox .re-lp :where(ul, ol) { list-style: none; }
article.mainBox .re-lp :where(h1, h2, h3, h4, h5, h6) { position: static; border: 0; padding: 0; font-size: inherit; font-weight: inherit; text-align: inherit; }
article.mainBox .re-lp h1::after, article.mainBox .re-lp h2::after, article.mainBox .re-lp h3::after, article.mainBox .re-lp h4::after, article.mainBox .re-lp h5::after, article.mainBox .re-lp h6::after { content: none; }
article.mainBox .re-lp a:hover { text-decoration: none; }
article.mainBox .re-lp img { max-width: 100%; vertical-align: middle; }
article.mainBox .re-lp :where(a) { color: inherit; }
article.mainBox .re-lp summary { list-style: none; cursor: pointer; }
article.mainBox .re-lp summary::-webkit-details-marker { display: none; }

/* ---------- 共通：セクション ---------- */
article.mainBox .re-sec { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; padding: 50px 30px; }
article.mainBox .re-sec > * { max-width: 100%; }
article.mainBox .re-sec--white { background: #fff; }
article.mainBox .re-sec--gray { background: var(--re-bg-table); }
article.mainBox .re-sec--light { background: var(--re-bg-light); }
article.mainBox .re-block { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; width: 100%; padding-bottom: 20px; }
article.mainBox .re-block > * { max-width: 100%; }

/* タイトル上テキスト */
article.mainBox .re-eyebrow { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; line-height: 20px; letter-spacing: .08em; color: var(--re-brown); }
article.mainBox .re-eyebrow::before { content: ""; flex: none; width: 40px; height: 1.5px; background: currentColor; }
article.mainBox .re-eyebrow--gold { color: var(--re-gold); }
article.mainBox .re-eyebrow--plain::before { content: none; }

/* h2 */
article.mainBox .re-h2 { width: 100%; border-bottom: 1px solid var(--re-h2-line); }
article.mainBox .re-h2__inner { display: inline-block; max-width: 100%; padding: 0 100px 5px 10px; border-left: 4px solid var(--re-navy); border-bottom: 1px solid var(--re-navy); margin-bottom: -1px; font-family: var(--re-serif); font-size: 28px; font-weight: 700; line-height: 40px; color: var(--re-navy); }
article.mainBox .re-h2--white { border-bottom-color: var(--re-blue); }
article.mainBox .re-h2--white .re-h2__inner { border-color: #fff; color: #fff; }

/* h3 / lead */
article.mainBox .re-h3 { font-family: var(--re-serif); font-size: 22px; font-weight: 700; line-height: 28px; color: var(--re-navy); }
article.mainBox .re-lead { font-size: 14px; line-height: 22px; color: var(--re-text); }
article.mainBox .re-note { font-size: 12px; line-height: 18px; color: var(--re-text); }
article.mainBox .re-sp { display: none; }

/* ボタン */
article.mainBox .re-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 15px; border: 1px solid transparent; border-radius: 2px; font-size: 14px; font-weight: 700; line-height: 18px; color: #fff; text-decoration: none; transition: opacity .2s; }
article.mainBox .re-btn:hover { opacity: .85; }
article.mainBox .re-btn::after { content: ""; flex: none; width: 16px; height: 16px; background: url("/biz/training/images/industry-realestate/re-icon-arrow-right.svg") center / 16px no-repeat; }
article.mainBox .re-btn--red { background: var(--re-red); }
article.mainBox .re-btn--navy { background: var(--re-navy); }
article.mainBox .re-btn--brown { background: var(--re-brown); }
article.mainBox .re-btn--ghost { background: rgba(224, 230, 239, .54); border-color: var(--re-navy); color: var(--re-navy); }
article.mainBox .re-btn--ghost-white { border-color: var(--re-line-white); }
article.mainBox .re-btn--ghost::after, article.mainBox .re-btn--ghost-white::after { content: none; }
article.mainBox .re-btn-wrap { display: flex; justify-content: center; width: 100%; padding-bottom: 10px; }

/* セクション内ミニ目次 */
article.mainBox .re-subnav { display: flex; flex-direction: column; gap: 8px; width: 100%; padding: 15px; background: #fff; border: 1px solid var(--re-line); border-radius: 2px; }
article.mainBox .re-subnav a { display: flex; align-items: flex-start; gap: 6px; padding-left: 5px; font-size: 12px; line-height: 17px; color: var(--re-navy); text-decoration: none; }
article.mainBox .re-subnav a::before { content: ""; flex: none; width: 3px; height: 3px; margin-top: 7px; border-radius: 50%; background: var(--re-blue); }
article.mainBox .re-subnav a:hover { text-decoration: underline; }


/* ---------- ヒーロー ---------- */
article.mainBox .re-hero__main { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 20px; padding: 30px; background: url("/biz/training/images/industry-realestate/re-hero-bg.jpg") 0 59% / 104.5% auto no-repeat; }
article.mainBox .re-hero__main::before { content: ""; position: absolute; inset: 0; background: rgba(224, 230, 239, .6); }
article.mainBox .re-hero__main > * { position: relative; }
article.mainBox .re-hero__title { font-family: var(--re-serif); font-size: 28px; font-weight: 700; line-height: 40px; color: var(--re-navy); }
article.mainBox .re-hero__lead { font-size: 14px; line-height: 22px; color: var(--re-navy); }
article.mainBox .re-hero__btns { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; padding: 15px 0; }
article.mainBox .re-hero__sub { display: flex; flex-direction: column; gap: 20px; padding: 30px; background: var(--re-navy); }
article.mainBox .re-stats { display: flex; width: 100%; }
article.mainBox .re-stats__item { flex: 1 1 0; display: flex; flex-direction: column; gap: 16px; padding: 15px; border: .5px solid var(--re-line-white); }
article.mainBox .re-stats__item + .re-stats__item { border-left: 0; }
article.mainBox .re-stats__num { font-family: var(--re-serif); font-size: 22px; font-weight: 700; line-height: 28px; color: var(--re-gold); }
article.mainBox .re-stats__label { font-size: 12px; line-height: 17px; color: #fff; }
article.mainBox .re-hl { display: flex; padding: 0 15px; background: rgba(71, 117, 183, .3); border: .5px solid var(--re-line-white); border-radius: 2px; }
article.mainBox .re-hl__item { flex: 1 1 0; display: flex; flex-direction: column; gap: 10px; padding: 15px 0; }
article.mainBox .re-hl__item + .re-hl__item { margin-left: 15px; padding-left: 15px; border-left: .5px solid var(--re-line-white); }
article.mainBox .re-hl__icon { width: 32px; height: 32px; }
article.mainBox .re-hl__title { font-size: 14px; font-weight: 700; line-height: 22px; color: var(--re-gold); }
article.mainBox .re-hl__text { font-size: 12px; line-height: 17px; color: #fff; }

/* ---------- 目次 ---------- */
article.mainBox .re-toc { display: flex; flex-direction: column; gap: 8px; width: 100%; padding: 15px; background: #fff; border: 1px solid var(--re-line); border-radius: 2px; }
article.mainBox .re-toc__item { display: flex; flex-direction: column; gap: 4px; }
article.mainBox .re-toc__link { display: flex; align-items: center; gap: 6px; font-size: 14px; line-height: 22px; color: var(--re-blue); text-decoration: none; }
article.mainBox .re-toc__link::before { content: ""; flex: none; width: 14px; height: 14px; background: url("/biz/training/images/industry-realestate/re-icon-toc-next.svg") center / 14px no-repeat; }
article.mainBox .re-toc__sub { display: flex; flex-direction: column; gap: 5px; padding-left: 25px; }
article.mainBox .re-toc__sub a { display: flex; align-items: flex-start; gap: 6px; font-size: 12px; line-height: 17px; color: var(--re-navy); text-decoration: none; }
article.mainBox .re-toc__sub a::before { content: ""; flex: none; width: 3px; height: 3px; margin-top: 7px; border-radius: 50%; background: var(--re-blue); }
article.mainBox .re-toc a:hover { text-decoration: underline; }

/* ---------- 課題（アコーディオン2列） ---------- */
article.mainBox .re-pain { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; width: 100%; align-items: stretch; }
article.mainBox .re-pain__item:not([open]) > summary { height: 100%; }
article.mainBox .re-pain__item { background: #fff; border: 1px solid var(--re-line); border-radius: 2px; }
article.mainBox .re-pain__item summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 15px; font-size: 14px; line-height: 22px; color: var(--re-navy); }
article.mainBox .re-pain__item p { padding: 0 15px 12px; font-size: 12px; line-height: 17px; color: var(--re-text); }

/* 共通：開閉矢印 */
article.mainBox .re-arrow { flex: none; width: 20px; height: 20px; background: url("/biz/training/images/industry-realestate/re-icon-arrow-down.svg") center / 20px no-repeat; transition: transform .2s; }
article.mainBox details[open] > summary .re-arrow { transform: rotate(180deg); }

/* ---------- 選ばれる理由 ---------- */
article.mainBox .re-why { position: relative; background: var(--re-navy); overflow: hidden; }
article.mainBox .re-why::before { content: ""; position: absolute; inset: 0; background: url("/biz/training/images/industry-realestate/re-why-bg.jpg") center / cover no-repeat; opacity: .3; }
article.mainBox .re-why > * { position: relative; }
article.mainBox .re-why .re-lead { color: #fff; }
article.mainBox .re-why-grid { display: grid; grid-template-columns: repeat(3, 1fr); width: 100%; border-top: .5px solid var(--re-line-white); border-left: .5px solid var(--re-line-white); border-radius: 2px; }
article.mainBox .re-why-card { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 15px; background: rgba(71, 117, 183, .5); border-right: .5px solid var(--re-line-white); border-bottom: .5px solid var(--re-line-white); }
article.mainBox .re-why-card__num { font-family: var(--re-serif); font-size: 22px; font-weight: 700; line-height: 28px; color: var(--re-gold); }
article.mainBox .re-why-card__title { width: 100%; padding: 0 0 8px; border-bottom: 2px solid var(--re-gold); font-size: 17px; font-weight: 700; line-height: 26px; color: #fff; }
article.mainBox .re-why-card__text { flex: 1; font-size: 12px; line-height: 17px; color: #fff; }
article.mainBox .re-why-card__tags { display: flex; flex-wrap: wrap; gap: 6px; width: 100%; padding-top: 10px; border-top: .5px solid var(--re-line-white); }
article.mainBox .re-tag { display: inline-flex; align-items: center; padding: 4px 12px 2px; border: .5px solid var(--re-gold); border-radius: 12px; font-size: 8px; font-weight: 700; line-height: 10px; color: var(--re-gold); white-space: nowrap; }

/* ---------- 階層別：役割と成長テーマ ---------- */
article.mainBox .re-tier-wrap { position: relative; width: 100%; }
article.mainBox .re-tier { display: flex; gap: 10px; width: 100%; }
article.mainBox .re-tier__col { flex: 1 1 0; display: flex; flex-direction: column; gap: 10px; padding: 15px; border: 1px solid var(--re-navy); border-radius: 4px; background: var(--re-navy-pale); }
article.mainBox .re-tier__col--red { border-color: var(--re-red); background: var(--re-red-pale); }
article.mainBox .re-tier__col--brown { border-color: var(--re-brown); background: var(--re-brown-pale); }
article.mainBox .re-tier__head { display: flex; flex-direction: column; gap: 4px; }
article.mainBox .re-tier__title { font-size: 14px; font-weight: 700; line-height: 22px; color: var(--re-navy); }
article.mainBox .re-tier__col--red .re-tier__title { color: var(--re-red); }
article.mainBox .re-tier__col--brown .re-tier__title { color: var(--re-brown); }
article.mainBox .re-tier__sub { font-size: 12px; line-height: 17px; color: var(--re-text); }
article.mainBox .re-tier__card { display: flex; flex-direction: column; gap: 4px; padding: 8px 10px; background: #fff; border-radius: 4px; }
article.mainBox .re-tier__card-head { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; line-height: 18px; color: #333; }
article.mainBox .re-num { flex: none; padding: 4px; border-radius: 5px; background: var(--re-navy); font-family: var(--re-serif); font-size: 12px; font-weight: 700; line-height: 14px; color: #fff; }
article.mainBox .re-tier__col--red .re-num { background: var(--re-red); }
article.mainBox .re-tier__col--brown .re-num { background: var(--re-brown); }
article.mainBox .re-tier__card p { font-size: 10px; line-height: 16px; color: var(--re-text); }

/* スライダー矢印（SPのみ表示） */
article.mainBox .re-slide-btn { display: none; position: absolute; top: 50%; z-index: 2; width: 40px; height: 40px; margin-top: -20px; padding: 0; border: 0; border-radius: 50%; background: url("/biz/training/images/industry-realestate/re-icon-slider-next.svg") center / 40px no-repeat; cursor: pointer; }
article.mainBox .re-slide-btn--prev { left: -12px; background-image: url("/biz/training/images/industry-realestate/re-icon-slider-prev.svg"); }
article.mainBox .re-slide-btn--next { right: -12px; }
article.mainBox .re-slide-btn[disabled] { opacity: 0; pointer-events: none; }

/* ---------- テーブル（役割期待・スキルマップ） ---------- */
article.mainBox .re-table-box { position: relative; width: 100%; }
article.mainBox .re-scroll { width: 100%; overflow: auto; border: .5px solid var(--re-line); background: #fff; -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: rgba(75, 85, 99, .7) rgba(224, 230, 239, .5); }
article.mainBox .re-scroll::-webkit-scrollbar { width: 12px; height: 12px; }
article.mainBox .re-scroll::-webkit-scrollbar-track { background: rgba(224, 230, 239, .5); border-radius: 10px; }
article.mainBox .re-scroll::-webkit-scrollbar-thumb { background: rgba(75, 85, 99, .7); border: 2px solid transparent; border-radius: 10px; background-clip: content-box; }
article.mainBox .re-scroll--matrix { max-height: 312px; }
article.mainBox .re-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 10px; line-height: 16px; color: var(--re-text); }
article.mainBox .re-table th, article.mainBox .re-table td { padding: 6px 10px; border-right: .5px solid var(--re-line); border-bottom: .5px solid var(--re-line); text-align: left; vertical-align: top; }
article.mainBox .re-table thead th { position: sticky; top: 0; z-index: 2; padding: 8px 10px; font-size: 12px; font-weight: 700; line-height: 18px; color: #fff; text-align: center; vertical-align: middle; background: #7c8db0; }
article.mainBox .re-table thead th:first-child { left: 0; z-index: 3; text-align: left; background: var(--re-navy); }
article.mainBox .re-table tbody th { position: sticky; left: 0; z-index: 1; width: 200px; min-width: 200px; background: var(--re-bg-table); font-size: 12px; font-weight: 700; line-height: 18px; color: var(--re-navy); vertical-align: middle; }
article.mainBox .re-table tr > :last-child { border-right: 0; }
article.mainBox .re-table tbody tr:last-child > * { border-bottom: 0; }
article.mainBox .re-table--matrix td { min-width: 213px; background: #fff; }
article.mainBox .re-table--matrix thead th:nth-child(2) { background: #7c8db0; }
article.mainBox .re-table--matrix thead th:nth-child(3) { background: #6a7ea3; }
article.mainBox .re-table--matrix thead th:nth-child(4) { background: #586f97; }
article.mainBox .re-table--matrix thead th:nth-child(5) { background: #46608a; }
article.mainBox .re-table--matrix thead th:nth-child(6) { background: #34517e; }
article.mainBox .re-table--matrix thead th:nth-child(7) { background: #274573; }
article.mainBox .re-table--matrix thead th:nth-child(8) { background: #1e3b67; }
article.mainBox .re-table--matrix thead th:nth-child(9) { background: #17325c; }
article.mainBox .re-table--matrix thead th:nth-child(10) { background: #12213a; }
article.mainBox .re-table--matrix thead th { min-width: 213px; }
article.mainBox .re-mx__cat { display: block; font-size: 10px; font-weight: 400; line-height: 14px; opacity: .85; }
article.mainBox .re-mx__item { display: block; }
article.mainBox .re-mx__item.is-note { padding-left: 1em; font-size: 9px; line-height: 14px; color: #6b7280; }
article.mainBox .re-lp a.re-mx__item { color: var(--re-blue); text-decoration: underline; }
article.mainBox .re-scroll-hint { position: absolute; left: 50%; top: 50%; z-index: 4; display: flex; align-items: center; gap: 4px; padding: 10px 26px; border-radius: 27px; background: rgba(224, 230, 239, .85); font-size: 14px; line-height: 22px; color: var(--re-text); white-space: nowrap; transform: translate(-50%, -50%); pointer-events: none; transition: opacity .3s; }
article.mainBox .re-scroll-hint::after { content: ""; width: 20px; height: 20px; background: url("/biz/training/images/industry-realestate/re-icon-scroll-hand.svg") center / 20px no-repeat; }
article.mainBox .re-table-box.is-scrolled .re-scroll-hint { opacity: 0; }
article.mainBox .re-legend { margin-top: 8px; font-size: 12px; line-height: 18px; color: var(--re-text); }

/* ---------- 研修検索アコーディオン ---------- */
article.mainBox .re-acc { display: flex; flex-direction: column; gap: 6px; width: 100%; }
article.mainBox .re-acc__item { background: #fff; border: 1px solid var(--re-line); border-radius: 2px; }
article.mainBox .re-acc__item > summary { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 10px 15px; }
article.mainBox .re-acc__title { flex: 1; font-size: 14px; font-weight: 700; line-height: 22px; color: var(--re-navy); }
article.mainBox .re-stars { flex: none; display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 12px; background: var(--re-bg-table); font-size: 9px; letter-spacing: .1em; color: var(--re-brown); }
article.mainBox .re-acc__body { display: flex; flex-direction: column; gap: 12px; padding: 5px 15px 15px; }
article.mainBox .re-acc__body .re-table td { background: #fff; }
article.mainBox .re-acc__body .re-table thead th { position: static; text-align: center; background: var(--re-navy); }
article.mainBox .re-acc__body .re-table thead th:nth-child(n) { background: var(--re-navy); }
article.mainBox .re-acc__body .re-table td { min-width: 150px; }
article.mainBox .re-pkgrow { display: flex; gap: 10px; align-items: flex-start; }
article.mainBox .re-pkgrow__label { flex: none; width: 84px; padding: 3px 0; border-radius: 2px; background: var(--re-navy); font-size: 10px; font-weight: 700; line-height: 16px; color: #fff; text-align: center; }
article.mainBox .re-pkgrow--elearning .re-pkgrow__label { background: var(--re-blue); }
article.mainBox .re-pkgrow--cert .re-pkgrow__label { background: var(--re-brown); }
article.mainBox .re-pkgrow--cert-req .re-pkgrow__label { background: var(--re-red); }
article.mainBox .re-chips { display: flex; flex-wrap: wrap; gap: 6px; }
article.mainBox .re-chip { display: inline-block; padding: 3px 10px; border-radius: 12px; background: var(--re-bg-table); font-size: 11px; line-height: 16px; color: var(--re-navy); text-decoration: none; }
article.mainBox .re-lp a.re-chip { color: var(--re-blue); text-decoration: underline; }
article.mainBox .re-chip.is-note { background: none; padding: 3px 0; font-size: 10px; color: var(--re-text); }
article.mainBox .re-acc__note { padding: 10px 15px; border-radius: 2px; background: var(--re-bg-light); font-size: 12px; line-height: 18px; color: var(--re-text); }
article.mainBox .re-cat-tag { flex: none; }

/* ---------- 資料DL帯 ---------- */
article.mainBox .re-cta { display: flex; flex-direction: column; align-items: center; gap: 20px; padding: 30px; background: var(--re-navy); text-align: center; }
article.mainBox .re-cta__title { font-family: var(--re-serif); font-size: 22px; font-weight: 700; line-height: 28px; color: #fff; }

/* ---------- 職種別：役割と専門性 ---------- */
article.mainBox .re-roles-ov { display: flex; flex-direction: column; gap: 10px; width: 100%; }
article.mainBox .re-roles-ov__group { display: flex; flex-direction: column; gap: 10px; padding: 15px; border: 1px solid var(--re-line); border-radius: 4px; }
article.mainBox .re-roles-ov__head { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 700; line-height: 22px; color: var(--re-navy); }
article.mainBox .re-roles-ov__head .re-num { padding: 1px 5px 4px; font-size: 22px; line-height: 28px; }
article.mainBox .re-roles-ov__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
article.mainBox .re-roles-ov__card { display: flex; flex-direction: column; gap: 4px; padding: 8px 10px; background: #fff; border-left: 2px solid var(--re-gold); border-radius: 4px; }
article.mainBox .re-roles-ov__card strong { font-size: 12px; line-height: 18px; color: #333; }
article.mainBox .re-roles-ov__card p { font-size: 10px; line-height: 16px; color: var(--re-text); }

/* ---------- パッケージ（MUST/BETTER/BEST） ---------- */
article.mainBox .re-pack { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; width: 100%; align-items: stretch; }
article.mainBox .re-pack__col { display: flex; flex-direction: column; }
article.mainBox .re-pack__tier { padding: 8px 15px; border-radius: 4px 4px 0 0; background: var(--re-brown); font-size: 14px; font-weight: 700; line-height: 22px; color: #fff; text-align: center; }
article.mainBox .re-pack__list { flex: 1; display: flex; flex-direction: column; gap: 8px; padding: 15px 10px; border: 1px solid var(--re-brown); border-top: 0; border-radius: 0 0 4px 4px; background: var(--re-brown-pale); }
article.mainBox .re-pack__col--best .re-pack__tier { background: var(--re-navy); }
article.mainBox .re-pack__col--best .re-pack__list { border-color: var(--re-navy); background: var(--re-navy-pale); }
article.mainBox .re-pack__col--must .re-pack__tier { background: var(--re-red); }
article.mainBox .re-pack__col--must .re-pack__list { border-color: var(--re-red); background: var(--re-red-pale); }
article.mainBox .re-pack__item { background: #fff; border-radius: 2px; }
article.mainBox .re-pack__item > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; }
article.mainBox .re-pack__name { display: block; font-family: var(--re-serif); font-size: 16px; font-weight: 700; line-height: 24px; color: var(--re-text); }
article.mainBox .re-pack__target { display: block; margin-top: 2px; font-size: 10px; font-weight: 700; line-height: 16px; color: var(--re-brown); }
article.mainBox .re-pack__col--best .re-pack__target { color: var(--re-navy); }
article.mainBox .re-pack__col--must .re-pack__target { color: var(--re-red); }
article.mainBox .re-plus { flex: none; position: relative; width: 20px; height: 20px; background: url("/biz/training/images/industry-realestate/re-icon-add-better.svg") center / 20px no-repeat; transition: transform .2s; }
article.mainBox .re-pack__col--best .re-plus { background-image: url("/biz/training/images/industry-realestate/re-icon-add-best.svg"); }
article.mainBox .re-pack__col--must .re-plus { background-image: url("/biz/training/images/industry-realestate/re-icon-add-must.svg"); }
article.mainBox details[open] > summary .re-plus { transform: rotate(45deg); }
article.mainBox .re-pack__body { display: flex; flex-direction: column; gap: 10px; padding: 0 10px 12px; }
article.mainBox .re-pack__body h5 { margin-bottom: 4px; font-size: 11px; font-weight: 700; line-height: 16px; color: var(--re-navy); }
article.mainBox .re-pack__body li { position: relative; padding-left: 10px; font-size: 11px; line-height: 17px; color: var(--re-text); }
article.mainBox .re-pack__body li::before { content: ""; position: absolute; left: 2px; top: 7px; width: 3px; height: 3px; border-radius: 50%; background: currentColor; }
article.mainBox .re-pack__body li a { color: var(--re-blue); }
article.mainBox .re-pack__body .is-empty { color: #9ca3af; }
article.mainBox .re-pack__fee { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border-radius: 2px; background: var(--re-bg-light); font-size: 10px; line-height: 16px; color: var(--re-text); }

/* ---------- 研修カリキュラム実施例 ---------- */
article.mainBox .re-cc { display: flex; flex-direction: column; gap: 10px; width: 100%; padding: 10px 15px; background: #fff; border: 1px solid var(--re-line); border-radius: 2px; }
article.mainBox .re-cc__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 4px 10px; padding-bottom: 10px; border-bottom: .5px solid var(--re-navy); }
article.mainBox .re-cc__title { font-family: var(--re-serif); font-size: 22px; font-weight: 700; line-height: 28px; color: var(--re-navy); }
article.mainBox .re-cc__meta { font-size: 10px; line-height: 16px; color: var(--re-text); }
article.mainBox .re-cc__cols { display: flex; gap: 10px; padding: 5px; }
article.mainBox .re-cc__col { flex: 1 1 0; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
article.mainBox .re-badge { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 6px; background: var(--re-navy); font-size: 10px; font-weight: 700; line-height: 16px; color: #fff; }
article.mainBox .re-badge--red { background: var(--re-red); }
article.mainBox .re-badge--brown { background: var(--re-brown); }
article.mainBox .re-cc__col h4 { font-size: 14px; font-weight: 700; line-height: 22px; color: var(--re-navy); }
article.mainBox .re-dots { display: flex; flex-direction: column; gap: 4px; }
article.mainBox .re-dots li { position: relative; padding-left: 14px; font-size: 10px; line-height: 16px; color: var(--re-text); }
article.mainBox .re-dots li::before { content: ""; position: absolute; left: 5px; top: 7px; width: 3px; height: 3px; border-radius: 50%; background: var(--re-navy); }
article.mainBox .re-dots--red li::before { background: var(--re-red); }
article.mainBox .re-dots--brown li::before { background: var(--re-brown); }
article.mainBox .re-case { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; width: 100%; }
article.mainBox .re-case__card { display: flex; flex-direction: column; gap: 10px; padding: 10px 15px 15px; background: #fff; border: 1px solid var(--re-line); border-radius: 2px; }
article.mainBox .re-case__head { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 14px; font-weight: 700; line-height: 22px; color: var(--re-navy); }
article.mainBox .re-pill { display: inline-flex; align-items: center; padding: 6px 10px 5px; border-radius: 18px; background: var(--re-bg-table); font-size: 8px; font-weight: 700; line-height: 10px; color: var(--re-navy); white-space: nowrap; }
article.mainBox .re-case__sub { padding-bottom: 10px; border-bottom: 1px dotted var(--re-line); font-size: 12px; line-height: 17px; color: var(--re-text); }
article.mainBox .re-case__label { margin-bottom: 5px; font-size: 12px; font-weight: 700; line-height: 18px; color: var(--re-navy); }

/* ---------- 料金 ---------- */
article.mainBox .re-price-panel { width: 100%; }
article.mainBox .re-price-panel[hidden] { display: none; }
article.mainBox #pricing-model .re-price-panel { display: flex; flex-direction: column; gap: 20px; }
article.mainBox #pricing-model .re-price-panel[hidden] { display: none; }
article.mainBox .re-price-badges { display: flex; gap: 10px; width: 100%; }
article.mainBox .re-price-badge { flex: 1 1 0; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 10px 15px 15px; background: var(--re-bg-table); border: 1px solid var(--re-line); border-radius: 2px; }
article.mainBox .re-price-badge__main { font-family: var(--re-serif); font-size: 22px; font-weight: 700; line-height: 28px; color: var(--re-navy); }
article.mainBox .re-price-badge__sub { font-size: 12px; line-height: 17px; color: var(--re-text); }
article.mainBox .re-plans-wrap { position: relative; width: 100%; }
article.mainBox .re-plans { display: flex; gap: 10px; width: 100%; padding-top: 15px; }
article.mainBox .re-plan { --c: var(--re-brown); --pale: var(--re-brown-pale); position: relative; flex: 1 1 0; display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 15px; background: #fff; border: 1px solid var(--c); border-radius: 8px; }
article.mainBox .re-plan--navy { --c: var(--re-navy); --pale: var(--re-bg-table); }
article.mainBox .re-plan--red { --c: var(--re-red); --pale: var(--re-red-pale); }
article.mainBox .re-plan__reco { position: absolute; top: -15px; left: 50%; padding: 5px 10px 3px; border-radius: 6px; background: var(--re-navy); font-size: 14px; font-weight: 700; line-height: 22px; color: #fff; white-space: nowrap; transform: translateX(-50%); }
article.mainBox .re-plan__name { padding: 10px 0; font-family: var(--re-serif); font-size: 22px; font-weight: 700; line-height: 28px; color: var(--c); }
article.mainBox .re-plan__price { display: flex; flex-direction: column; align-items: center; gap: 5px; }
article.mainBox .re-plan__price-row { display: flex; align-items: center; gap: 10px; }
article.mainBox .re-plan__people { padding: 4px 4px 2px; border: .5px solid var(--c); border-radius: 2px; font-size: 8px; font-weight: 700; line-height: 10px; color: var(--c); white-space: nowrap; }
article.mainBox .re-plan__yen { font-family: var(--re-serif); font-size: 28px; font-weight: 700; line-height: 40px; color: var(--re-text); white-space: nowrap; }
article.mainBox .re-plan__tax { font-size: 10px; line-height: 16px; color: var(--re-text); }
article.mainBox .re-plan__spec { display: flex; gap: 10px; width: 100%; padding: 5px 0; }
article.mainBox .re-plan__spec > div { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; gap: 7px; font-size: 10px; line-height: 16px; color: var(--re-text); text-align: center; }
article.mainBox .re-plan__spec dt { width: 100%; padding: 6px 10px 5px; border-radius: 18px; background: var(--pale); font-weight: 700; color: var(--c); }
article.mainBox .re-plan__btn { width: 100%; padding: 10px 0; }
article.mainBox .re-plan__btn .re-btn { width: 100%; background: var(--c); }
article.mainBox .re-plan__note { width: 100%; padding-top: 10px; border-top: 1px dotted var(--re-line); font-size: 8px; line-height: 12px; color: var(--re-text); }
article.mainBox .re-price-notes { display: flex; gap: 10px; width: 100%; }
article.mainBox .re-price-notes > div { flex: 1 1 0; display: flex; flex-direction: column; gap: 5px; padding: 10px 15px; background: var(--re-bg-table); border: 1px solid var(--re-line); border-radius: 2px; font-size: 12px; line-height: 17px; color: var(--re-text); }
article.mainBox .re-price-notes strong { font-size: 12px; line-height: 18px; color: var(--re-navy); }

/* ---------- お客様の声（スライダー） ---------- */
article.mainBox .re-voice { position: relative; width: 100%; }
article.mainBox .re-voice__track { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
article.mainBox .re-voice__track::-webkit-scrollbar { display: none; }
article.mainBox .re-voice-card { flex: 0 0 calc((100% - 20px) / 3); display: flex; flex-direction: column; scroll-snap-align: start; background: #fff; border: 1px solid var(--re-navy); border-radius: 8px; overflow: hidden; }
article.mainBox .re-voice-card__img { aspect-ratio: 2 / 1; width: 100%; height: auto; object-fit: cover; }
article.mainBox .re-voice-card__img[src*="voice_canon"] { object-position: center top; }
article.mainBox .re-voice-card__body { display: flex; flex: 1; flex-direction: column; gap: 10px; padding: 15px; }
article.mainBox .re-voice-card__course { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 12px; font-weight: 700; line-height: 18px; color: var(--re-navy); }
article.mainBox .re-voice-card__course .re-pill { font-size: 12px; line-height: 18px; padding: 5px 10px 4px; }
article.mainBox .re-voice-card__who { display: flex; flex-direction: column; gap: 5px; padding: 5px; }
article.mainBox .re-voice-card__who strong { font-size: 18px; line-height: 22px; color: var(--re-navy); }
article.mainBox .re-voice-card__who span { font-size: 10px; line-height: 16px; color: var(--re-text); }
article.mainBox .re-voice-card__more { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-top: auto; padding: 10px 0; font-size: 14px; font-weight: 700; line-height: 18px; color: var(--re-blue); text-decoration: none; }
article.mainBox .re-voice-card__more::after { content: ""; width: 16px; height: 16px; background: url("/biz/training/images/industry-realestate/re-icon-arrow-right-blue.svg") center / 16px no-repeat; }
article.mainBox .re-voice .re-slide-btn { display: block; }
article.mainBox .re-voice .re-slide-btn--prev { left: -18px; }
article.mainBox .re-voice .re-slide-btn--next { right: -18px; }

/* ---------- お問い合わせ ---------- */
article.mainBox .re-contact { display: flex; flex-direction: column; align-items: center; gap: 20px; padding: 30px; background: var(--re-navy); text-align: center; }
article.mainBox .re-contact__title { font-family: var(--re-serif); font-size: 28px; font-weight: 700; line-height: 40px; color: #fff; }
article.mainBox .re-contact__text { font-size: 14px; line-height: 22px; color: #fff; }
article.mainBox .re-contact__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; padding: 15px 0; }

/* ---------- FAQ ---------- */
article.mainBox .re-faq { display: flex; flex-direction: column; gap: 6px; width: 100%; }
article.mainBox .re-faq__item { background: #fff; border: 1px solid var(--re-line); border-radius: 2px; }
article.mainBox .re-faq__item > summary { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 7px 15px; }
article.mainBox .re-faq__q { flex: 1; display: flex; align-items: baseline; gap: 10px; font-size: 14px; font-weight: 700; line-height: 22px; color: var(--re-navy); }
article.mainBox .re-faq__q::before { content: "Q"; flex: none; font-family: var(--re-serif); font-size: 20px; font-weight: 700; line-height: 30px; color: var(--re-blue); }
article.mainBox .re-faq__a { display: flex; align-items: baseline; gap: 10px; padding: 0 15px 12px; font-size: 14px; line-height: 22px; color: var(--re-text); }
article.mainBox .re-faq__a::before { content: "A"; flex: none; font-family: var(--re-serif); font-size: 20px; font-weight: 700; line-height: 30px; color: var(--re-red); }

/* ---------- コラムリンク ---------- */
article.mainBox .re-column { display: flex; justify-content: center; padding: 50px 30px; background: var(--re-bg-table); }

/* ---------- 導入の流れ ---------- */
article.mainBox .re-flow { display: flex; flex-direction: column; gap: 6px; width: 100%; }
article.mainBox .re-flow__step { display: flex; }
article.mainBox .re-flow__no { flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 15px; border-radius: 4px 0 0 4px; background: var(--re-navy); color: #fff; }
article.mainBox .re-flow__no span { font-size: 14px; font-weight: 700; line-height: 22px; }
article.mainBox .re-flow__no b { font-family: var(--re-serif); font-size: 28px; line-height: 40px; }
article.mainBox .re-flow__body { flex: 1; display: flex; gap: 24px; padding: 10px 15px; background: #fff; border: 1px solid var(--re-navy); border-left: 0; border-radius: 0 4px 4px 0; }
article.mainBox .re-flow__title { flex: none; display: flex; align-items: center; gap: 10px; width: auto; font-size: 14px; font-weight: 700; line-height: 22px; color: var(--re-navy); }
article.mainBox .re-flow__title img { width: 48px; height: 48px; }
article.mainBox .re-flow__text { flex: 1; display: flex; align-items: center; font-size: 14px; line-height: 22px; color: var(--re-navy); }
/* PC：説明文の開始位置を全ステップで揃える（見出し列＝一番長い見出しの幅） */
@media (min-width: 768px) {
  @supports (grid-template-columns: subgrid) {
    article.mainBox .re-flow { display: grid; grid-template-columns: auto max-content 1fr; row-gap: 6px; column-gap: 0; }
    article.mainBox .re-flow__step { display: grid; grid-column: 1 / -1; grid-template-columns: subgrid; }
    article.mainBox .re-flow__body { grid-column: 2 / -1; display: grid; grid-template-columns: subgrid; column-gap: 24px; }
  }
}

/* ==========================================================================
   SP（〜767px）
   ========================================================================== */
@media (max-width: 767px) {
  article.mainBox .re-pc { display: none; }
  article.mainBox .re-sp { display: inline; }
  article.mainBox .re-sec { gap: 15px; padding: 50px 15px; }
  article.mainBox .re-block { gap: 15px; }
  article.mainBox .re-h2__inner { padding-right: 30px; font-size: 20px; line-height: 28px; }
  article.mainBox .re-h3 { font-size: 20px; line-height: 28px; }
  article.mainBox .re-lead { font-size: 13px; line-height: 19px; }


  article.mainBox .re-hero__main { gap: 15px; padding: 30px 15px; background-size: 294.77% auto; background-position: 62% 98%; }
  article.mainBox .re-hero__title { font-size: 24px; line-height: 36px; }
  article.mainBox .re-hero__lead { font-size: 13px; line-height: 19px; }
  article.mainBox .re-hero__btns { flex-direction: column; align-items: flex-start; padding: 10px 0; }
  article.mainBox .re-hero__sub { gap: 15px; padding: 30px 15px; }
  article.mainBox .re-hl { flex-direction: column; padding: 0; }
  article.mainBox .re-hl__item { padding: 15px; }
  article.mainBox .re-hl__item + .re-hl__item { margin: 0; padding-left: 15px; border-left: 0; border-top: .5px solid var(--re-line-white); }

  article.mainBox .re-pain { grid-template-columns: 1fr; }
  article.mainBox .re-pain__item summary { font-size: 13px; line-height: 19px; }

  article.mainBox .re-why-grid { grid-template-columns: 1fr; }

  /* 階層別：横スライド */
  article.mainBox .re-tier { overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  article.mainBox .re-tier::-webkit-scrollbar { display: none; }
  article.mainBox .re-tier__col { flex: 0 0 272px; scroll-snap-align: start; }
  article.mainBox .re-tier-wrap .re-slide-btn { display: block; }
  article.mainBox .re-tier-wrap .re-slide-btn--prev { left: -8px; }
  article.mainBox .re-tier-wrap .re-slide-btn--next { right: -8px; }

  article.mainBox .re-scroll-hint { padding: 8px 18px; font-size: 12px; line-height: 17px; white-space: normal; width: 200px; justify-content: center; text-align: center; }
  article.mainBox .re-table tbody th { width: 120px; min-width: 120px; }
  article.mainBox .re-table--matrix td, article.mainBox .re-table--matrix thead th { min-width: 180px; }

  article.mainBox .re-pkgrow { flex-direction: column; gap: 6px; }

  article.mainBox .re-cta__title { font-size: 18px; line-height: 26px; }

  article.mainBox .re-roles-ov__grid { grid-template-columns: 1fr; }

  article.mainBox .re-pack-wrap { position: relative; width: 100%; }
  article.mainBox .re-pack { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin: 0 -15px; padding: 0 35px; width: calc(100% + 30px); scroll-padding: 0 35px; }
  article.mainBox .re-pack::-webkit-scrollbar { display: none; }
  article.mainBox .re-pack__col { flex: 0 0 272px; scroll-snap-align: center; }
  article.mainBox .re-pack-wrap .re-slide-btn { display: block; top: 150px; margin-top: 0; }
  article.mainBox .re-pack-wrap .re-slide-btn--prev { left: -15px; }
  article.mainBox .re-pack-wrap .re-slide-btn--next { right: -15px; }

  article.mainBox .re-cc__head { flex-direction: column; align-items: flex-start; }
  article.mainBox .re-cc__cols { padding: 5px 0; }
  article.mainBox .re-case { grid-template-columns: 1fr; }

  article.mainBox .re-price-badges { flex-direction: column; }
  article.mainBox .re-plans { overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-left: 35px; padding-right: 35px; margin: 0 -15px; width: calc(100% + 30px); scroll-padding: 0 35px; }
  article.mainBox .re-plans::-webkit-scrollbar { display: none; }
  article.mainBox .re-plan { flex: 0 0 272px; scroll-snap-align: center; }
  article.mainBox .re-plans-wrap .re-slide-btn { display: block; }
  article.mainBox .re-plans-wrap .re-slide-btn--prev { left: -15px; top: 55%; }
  article.mainBox .re-plans-wrap .re-slide-btn--next { right: -15px; top: 55%; }
  article.mainBox .re-price-notes { flex-direction: column; }
  article.mainBox #pricing-model .re-price-panel { gap: 15px; }

  article.mainBox .re-voice__track { margin: 0 -15px; padding: 0 35px; scroll-padding: 0 35px; }
  article.mainBox .re-voice-card { flex: 0 0 272px; scroll-snap-align: center; }
  article.mainBox .re-voice .re-slide-btn--prev { left: -15px; }
  article.mainBox .re-voice .re-slide-btn--next { right: -15px; }

  article.mainBox .re-contact { padding: 30px 15px; }
  article.mainBox .re-contact__title { font-size: 22px; line-height: 32px; }
  article.mainBox .re-contact__text { font-size: 13px; line-height: 19px; text-align: left; }
  article.mainBox .re-contact__btns { flex-direction: column; align-items: center; gap: 15px; }

  article.mainBox .re-faq__q, article.mainBox .re-faq__a { font-size: 13px; line-height: 19px; }

  article.mainBox .re-column { padding: 50px 15px; }

  article.mainBox .re-flow__no { width: 54px; padding: 10px 0; }
  article.mainBox .re-flow__no span { font-size: 12px; line-height: 18px; }
  article.mainBox .re-flow__no b { font-size: 24px; line-height: 32px; }
  article.mainBox .re-flow__body { flex-direction: column; gap: 6px; }
  article.mainBox .re-flow__title { width: auto; font-size: 13px; }
  article.mainBox .re-flow__title img { width: 40px; height: 40px; }
  article.mainBox .re-flow__text { font-size: 12px; line-height: 18px; }
}
/* SPのスライダー（階層別・マスト／ベター／ベスト・モデル料金・お客様の声）：カード幅をコンテンツ幅の90%に */
/* ---------- 選ばれる理由：タグを塗りで強調 ---------- */
article.mainBox .re-why-card .re-tag { padding: 5px 12px 4px; background: var(--re-gold); border-color: var(--re-gold); font-size: 11px; line-height: 14px; color: var(--re-navy); }

/* ---------- 資料ダウンロード（CTR） ---------- */
article.mainBox .re-dl { display: grid; grid-template-columns: 1fr 1fr; grid-template-areas: "body img" "btn img"; align-items: center; gap: 15px 30px; width: 100%; padding: 30px; background: var(--re-bg-table); border: 1px solid var(--re-line); border-radius: 4px; }
article.mainBox .re-dl__body { grid-area: body; display: flex; flex-direction: column; gap: 12px; align-self: end; }
article.mainBox .re-dl__title { font-family: var(--re-serif); font-size: 20px; font-weight: 700; line-height: 30px; color: var(--re-navy); }
article.mainBox .re-dl__text { display: flex; flex-direction: column; gap: 6px; font-size: 14px; line-height: 22px; color: var(--re-text); }
article.mainBox .re-dl__img { grid-area: img; }
article.mainBox .re-dl__img img { display: block; width: 100%; height: auto; }
article.mainBox .re-dl__btn { grid-area: btn; align-self: start; }
article.mainBox .re-dl__btn .re-btn { width: 100%; }
article.mainBox .re-sec > .re-dl { margin-top: 0; }
article.mainBox .re-dl-band { padding: 50px 30px; background: var(--re-bg-light); }

/* ---------- スキルマップ（画像・クリックで拡大） ---------- */
article.mainBox .re-zoom { position: relative; display: block; width: 100%; max-width: 640px; margin: 0 auto; border: 1px solid var(--re-line); border-radius: 4px; background: #fff; overflow: hidden; cursor: zoom-in; }
article.mainBox .re-zoom img { display: block; width: 100%; height: auto; }
article.mainBox .re-zoom__label { position: absolute; right: 10px; bottom: 10px; display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 20px; background: rgba(0, 33, 87, .85); font-size: 12px; font-weight: 700; line-height: 16px; color: #fff; }
article.mainBox .re-zoom__label::before { content: "+"; font-size: 16px; line-height: 16px; }
article.mainBox .re-lightbox { position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center; padding: 50px 20px 20px; background: rgba(0, 0, 0, .8); }
article.mainBox .re-lightbox[hidden] { display: none; }
article.mainBox .re-lightbox__inner { max-width: 100%; max-height: 100%; overflow: auto; }
article.mainBox .re-lightbox__inner img { display: block; max-width: none; width: 1600px; height: auto; background: #fff; }
article.mainBox .re-lightbox__close { position: absolute; top: 10px; right: 10px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: #fff; font-size: 22px; line-height: 36px; color: var(--re-navy); cursor: pointer; }

/* ---------- 関連コラム ---------- */
article.mainBox .re-column { flex-direction: column; align-items: center; gap: 30px; }
article.mainBox .re-column__title { width: 100%; font-family: var(--re-serif); font-size: 22px; font-weight: 700; line-height: 30px; color: var(--re-navy); }
article.mainBox .re-column__list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; width: 100%; }
article.mainBox .re-column-card { display: flex; flex-direction: column; background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 6px rgba(0, 0, 0, .08); }
article.mainBox .re-column-card a { display: flex; flex: 1; flex-direction: column; color: inherit; text-decoration: none; }
article.mainBox .re-column-card img { display: block; aspect-ratio: 16 / 9; width: 100%; height: auto; object-fit: cover; }
article.mainBox .re-column-card__body { display: flex; flex: 1; flex-direction: column; gap: 8px; padding: 12px 15px 15px; }
article.mainBox .re-column-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 11px; line-height: 16px; color: var(--re-text); }
article.mainBox .re-column-card__tag { padding: 2px 8px; border-radius: 2px; background: var(--re-blue); font-weight: 700; color: #fff; }
article.mainBox .re-column-card__title { padding-left: 8px; border-left: 3px solid var(--re-blue); font-size: 14px; font-weight: 700; line-height: 21px; color: var(--re-navy); }
article.mainBox .re-column-card__text { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; font-size: 12px; line-height: 19px; color: var(--re-text); }

/* ---------- FAQ（回答内のリスト・リンク） ---------- */
article.mainBox .re-faq__body { display: flex; flex-direction: column; gap: 10px; flex: 1; }
article.mainBox .re-faq__body ul { display: flex; flex-direction: column; gap: 4px; }
article.mainBox .re-faq__body li { position: relative; padding-left: 1em; }
article.mainBox .re-faq__body li::before { content: "・"; position: absolute; left: 0; }
article.mainBox .re-faq__body .re-faq__links { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
article.mainBox .re-faq__body .re-faq__links ul { padding: 10px 15px; background: var(--re-bg-light); border-radius: 2px; }
article.mainBox .re-faq__body .re-faq__links li:first-child { padding-left: 0; font-weight: 700; color: var(--re-navy); }
article.mainBox .re-faq__body .re-faq__links li:first-child::before { content: none; }
article.mainBox .re-faq__body a { color: var(--re-blue); text-decoration: underline; }
article.mainBox .re-faq__em { font-weight: 700; color: var(--re-red); }

@media (max-width: 767px) {
  article.mainBox .re-tier, article.mainBox .re-pack, article.mainBox .re-plans, article.mainBox .re-voice__track { width: 100%; margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; scroll-padding: 0; }
  article.mainBox .re-tier__col, article.mainBox .re-pack__col, article.mainBox .re-plan, article.mainBox .re-voice-card { flex: 0 0 90%; scroll-snap-align: start; }
  article.mainBox .re-tier-wrap .re-slide-btn--prev, article.mainBox .re-pack-wrap .re-slide-btn--prev, article.mainBox .re-plans-wrap .re-slide-btn--prev, article.mainBox .re-voice .re-slide-btn--prev { left: -10px; }
  article.mainBox .re-tier-wrap .re-slide-btn--next, article.mainBox .re-pack-wrap .re-slide-btn--next, article.mainBox .re-plans-wrap .re-slide-btn--next, article.mainBox .re-voice .re-slide-btn--next { right: -10px; }
  article.mainBox .re-why-card__title { font-size: 16px; line-height: 24px; }
  article.mainBox .re-dl { grid-template-columns: 1fr; grid-template-areas: "body" "img" "btn"; padding: 20px 15px; }
  article.mainBox .re-dl__title { font-size: 17px; line-height: 26px; }
  article.mainBox .re-dl__text { font-size: 13px; line-height: 20px; }
  article.mainBox .re-dl-band { padding: 40px 15px; }
  article.mainBox .re-dl__btn .re-btn { padding: 15px 10px; font-size: 13px; }
  article.mainBox .re-column__title { font-size: 18px; line-height: 26px; }
  article.mainBox .re-column__list { grid-template-columns: 1fr 1fr; gap: 10px; }
  article.mainBox .re-column-card__body { padding: 10px; }
  article.mainBox .re-column-card__title { font-size: 13px; line-height: 19px; }
  article.mainBox .re-column-card__text { -webkit-line-clamp: 3; }
  article.mainBox .re-faq__body .re-faq__links { grid-template-columns: 1fr; }
  article.mainBox .re-lightbox__inner img { width: 1200px; }
}
article.mainBox .re-lp [data-slider-track] { position: relative; }