/* ============ Nコレ2024 詳細ページ固有スタイル(ロードマップ下層) ============ */
/* ヒーローは共通の .wp-hero(assets/css/style.css)を使用。
   サブタイトルは .page-hero__sub */

/* ---- セクション共通 ---- */
.nk-sec { padding: 76px 0; scroll-margin-top: calc(var(--header-h) + 16px); }
.nk-sec--soft { background: var(--c-bg-warm); }
.nk-sec--gray { background: var(--c-bg-soft); }
.nk-sec--tight { padding: 56px 0; }
.nk-label {
  display: block;
  color: var(--c-primary);
  font-family: var(--ff-en);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .14em;
}
.nk-title { margin-top: 6px; font-size: 32px; font-weight: 700; line-height: 1.5; letter-spacing: .04em; }
.nk-title--sm { font-size: 24px; }
.nk-txt { margin-top: 22px; font-size: 15px; line-height: 2.1; color: #33383c; }
.nk-txt + .nk-txt { margin-top: 1.4em; }
.nk-txt a { color: var(--c-primary); text-decoration: underline; text-underline-offset: 3px; }
.nk-head-c { text-align: center; margin-bottom: 40px; }
.nk-center { max-width: 900px; margin: 0 auto; text-align: center; }

/* ---- 画像+テキストの2カラム ---- */
.nk-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
/* --rev: 画像を右に置く(HTMLの並びは常に「画像 → テキスト」) */
.nk-cols--rev .nk-fig { order: 2; }
.nk-cols--narrow { grid-template-columns: minmax(0, 42%) minmax(0, 1fr); }
.nk-fig { margin: 0; }
.nk-fig img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--r-md);
  background: #fff;
}
.nk-fig--frame img { border: 1px solid var(--c-border); }
.nk-fig figcaption { margin-top: 10px; font-size: 12px; line-height: 1.8; color: var(--c-muted); }

/* ---- アンバサダー ---- */
.nk-amb { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.nk-amb__name { margin-top: 22px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.nk-amb__tag {
  display: inline-flex; align-items: center; height: 26px; padding: 0 12px;
  border-radius: 999px; background: #ff0000; color: #fff;
  font-size: 11px; font-weight: 700; letter-spacing: .06em;
}
.nk-amb__name strong { font-size: 26px; font-weight: 700; letter-spacing: .06em; }
.nk-amb__links { margin-top: 20px; display: grid; gap: 10px; }
.nk-amb__links li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; font-size: 13px; }
.nk-amb__links .lbl { font-weight: 700; color: var(--c-text); white-space: nowrap; }
.nk-amb__links .url { color: var(--c-primary); text-decoration: underline; text-underline-offset: 3px; word-break: break-all; }

/* ---- 会場 ---- */
.nk-venue {
  display: grid; grid-template-columns: 420px 1fr;
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  overflow: hidden;
  background: #fff;
  box-shadow: var(--shadow-card);
}
.nk-venue__info { padding: 36px 40px 40px; }
.nk-venue__name { font-size: 24px; font-weight: 700; letter-spacing: .06em; }
.nk-venue__addr { margin-top: 14px; font-size: 14px; line-height: 2; color: var(--c-text-2); }
.nk-venue__btn { position: relative; width: 100%; margin-top: 28px; }
.nk-venue__btn .arw { position: absolute; right: 22px; top: 50%; transform: translateY(-50%); }
/* 写真は左カラム(情報)の高さに合わせて切り抜く。
   img を絶対配置しないと元画像の縦横比ぶんだけ行が伸びてしまう */
.nk-venue__photo { position: relative; margin: 0; min-height: 340px; background: var(--c-bg-soft); }
.nk-venue__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.nk-map { margin-top: 28px; height: 340px; border-radius: var(--r-md); overflow: hidden; background: #e9edf0; }
.nk-map iframe { width: 100%; height: 100%; border: 0; display: block; }

/* ---- 開催概要 ---- */
.nk-outline .def-table th { width: 260px; }
.nk-outline .def-table td { line-height: 2; }
.nk-outline .def-table a { color: var(--c-primary); text-decoration: underline; text-underline-offset: 3px; }

/* ---- 参考リンク ---- */
.nk-ref-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; align-items: start; }
.nk-ref-card { background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-md); padding: 30px 32px; }
.nk-ref-card h3 { font-size: 15px; font-weight: 700; letter-spacing: .06em; color: var(--c-primary); }
.nk-ref-card ul { margin-top: 18px; display: grid; gap: 14px; }
.nk-ref-card a { display: flex; gap: 10px; font-size: 13.5px; line-height: 1.8; color: var(--c-text-2); }
.nk-ref-card a::before {
  content: "";
  flex-shrink: 0;
  margin-top: .55em;
  width: 7px; height: 7px;
  border-top: 1.5px solid var(--c-primary);
  border-right: 1.5px solid var(--c-primary);
  transform: rotate(45deg);
}
.nk-ref-card .cur { display: flex; gap: 10px; font-size: 13.5px; line-height: 1.8; color: var(--c-muted); }
.nk-ref-card .cur::before { content: ""; flex-shrink: 0; margin-top: .8em; width: 7px; height: 1.5px; background: var(--c-muted); }

/* ---- その他の会場 ---- */
.nk-venues { display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px; }
.nk-vcard {
  background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-md);
  padding: 30px 32px; scroll-margin-top: calc(var(--header-h) + 16px);
}
.nk-vcard__area { font-family: var(--ff-en); font-size: 13px; font-weight: 700; letter-spacing: .12em; color: var(--c-primary); }
.nk-vcard__name { margin-top: 4px; font-size: 20px; font-weight: 700; letter-spacing: .04em; }
.nk-vcard dl { margin: 18px 0 0; display: grid; grid-template-columns: 92px 1fr; gap: 10px 12px; font-size: 13.5px; line-height: 1.9; }
.nk-vcard dt { font-weight: 700; color: var(--c-text); }
.nk-vcard dd { margin: 0; color: var(--c-text-2); }
.nk-vcard dd a { color: var(--c-primary); text-decoration: underline; text-underline-offset: 3px; word-break: break-all; }

/* ---- ページ下部のロードマップ導線 ---- */
.nk-back { padding: 0 0 110px; text-align: center; }
.nk-back a {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 14px 34px; border-radius: 999px;
  border: 1px solid var(--c-primary); color: var(--c-primary);
  font-size: 14px; font-weight: 700;
}
.nk-back a:hover { background: var(--c-primary); color: #fff; opacity: 1; }
.nk-back .arw { font-family: var(--ff-en); }

/* ---- responsive ---- */
@media (max-width: 1024px) {
  .nk-cols, .nk-cols--narrow, .nk-amb { grid-template-columns: 1fr; gap: 32px; }
  .nk-cols--rev .nk-fig { order: 0; }
  .nk-venue { grid-template-columns: 1fr; }
  .nk-ref-grid { grid-template-columns: 1fr; }
  .nk-venues { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .nk-sec { padding: 56px 0; }
  .nk-title { font-size: 24px; }
  .nk-title--sm { font-size: 20px; }
  .nk-venue__info { padding: 26px 24px 30px; }
  .nk-venue__photo { min-height: 220px; }
  .nk-map { height: 260px; }
  .nk-outline .def-table th { width: 130px; }
  .nk-ref-card, .nk-vcard { padding: 24px; }
  .nk-vcard dl { grid-template-columns: 78px 1fr; }
  .nk-back { padding-bottom: 72px; }
  /* SPでは見出しのみ中央、本文は読みやすさ優先で左揃え */
  .nk-head-c .nk-txt, .nk-center .nk-txt { text-align: left; }
}
