@charset "UTF-8";


html {
  scroll-behavior: smooth;
}

/* 余白・サイズ計算を整える */
*,
*::before,
*::after {box-sizing: border-box;}

/* ブラウザ初期余白を消す */
body {margin: 0;font-family: "M PLUS 1p", sans-serif;color: #231815;background: #fff;line-height: 1.7;}

/* 画像がはみ出さないようにする */
img {max-width: 100%;height: auto;display: block;}

/* リンクの下線・色を扱いやすくする */
a {color: inherit;text-decoration: none;}

/* 見出し・本文の余白リセット */
/* ブラウザ初期余白を消す */
body {
  margin: 0;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 500;
  color: #231815;
  background: #fff;
  line-height: 1.7;
}



/* ここからヘッダー */
.page-header {padding: 16px 24px;}

.header-logo {margin: 0;width: fit-content;}

.page-header a {display: inline-block;}

.logo {display: block;width: 180px;height: auto;}

/* メインビジュアル */
.hero {background: #ff3300;padding: 40px 20px 60px;}

.hero-card {width: min(100%, 900px);margin: 0 auto;padding: 56px 40px 64px;background: #fff;border-radius: 56px;text-align: center;box-shadow: 0 10px 24px rgba(35, 24, 21, 0.15);}

.hero-logo {  display: block;width: min(100%, 700px);height: auto;margin: 0 auto 36px;}

.hero-date {display: flex;align-items: center;justify-content: center;gap: 18px;margin-bottom: 32px;font-weight: 900;color: #000;}

.hero-year {font-size: 38px;}

.hero-main-date {font-size: 68px;line-height: 1;letter-spacing: 0.04em;}

.hero-day {display: inline-flex;align-items: center;justify-content: center;width: 42px;height: 42px;border-radius: 50%;background: #15b9d1;color: #fff;font-size: 24px;line-height: 1;
}

.hero-lead {font-size: 24px;font-weight: 800;line-height: 2;color: #000;}

.hero-lead strong {color: #ff3300;font-weight: 900;}

/* 特別展示車 */
.special-car {background: #fff;padding: 0 20px 64px;}

.section-divider {display: block;width: 100vw;max-width: none;height: auto;margin-left: calc(50% - 50vw);}

.section-title-img {display: block;width: min(80%, 500px);height: auto;margin: 40px auto 24px;}

.special-car-lead {text-align: center;font-weight: 900;font-size: 30px;margin-bottom: 40px;}

.fj-content {display: flex;align-items: center;justify-content: center;gap: 20px;width: min(100%, 1700px);margin: 0 auto;}

.fj-visual {flex: 1.15;}

.fj-visual img {width: 100%;height: auto;}

.fj-text {flex: 0.85;text-align: center;}

.fj-text h3 {font-size: 36px;font-weight: 900;margin-bottom: 18px;}

.fj-text p {font-size: 26px;font-weight: 700;line-height: 1.9;}

.nowrap {white-space: nowrap;}

.sp-only {display: none;}

.kinto-recommend-img {display: block;width: min(100%, 900px);height: auto;margin: 48px auto 0;}

.benefits {background: #ff3300;padding: 0;overflow: hidden;}

.benefits-divider{display: block;width: 120vw;max-width: none;height: auto;margin-left: 50%;transform: translateX(-50%);}

.event-benefits-img {display: block;width: min(100%, 500px);height: auto;margin: 40px auto 0;}

/* 特典紹介ブロック */
.benefit-item {display: flex;align-items: flex-start;justify-content: center;gap: 32px;width: min(100%, 1100px);margin: 40px auto 0;}

.benefit-visual {flex: 0 0 38%;}

.benefit-visual img {display: block;width: 100%;height: auto;}

.benefit-body {flex: 1 1 0;}

.benefit-title-img {display: block;width: min(100%, 520px);height: auto;margin: 0 0 20px;}

.benefit-text {font-size: 36px;font-weight: 900;line-height: 1.6;color: #ffffff;margin-bottom: 16px;}

.benefit-note {font-size: 18px;font-weight: 700;line-height: 1.7;color: #ffffff;}

.benefit-item-reverse {margin-top: 72px;gap: 24px;width: min(100%, 980px);}

.noah-voxy-banner {display: block;width: min(100%, 1000px);height: auto;margin: 56px auto 0;}

.benefit-caution {color: #fff;text-align: center;font-size: 20px;font-weight: 700;margin-top: 56px;}

.event-venues {background: #fff;overflow: hidden;padding: 0 20px 0;}

.event-venues-divider {display: block;width: 120vw;max-width: none;height: auto;margin-left: 50%;transform: translateX(-50%);}

.event-venues-title {display: block;width: min(80%, 420px);height: auto;margin: 48px auto 40px;}

/* イベント会場一覧 */
.venue-list {display: grid;grid-template-columns: repeat(4, 1fr);gap: 20px;width: min(100%, 1100px);margin: 0 auto;}

.venue-card {display: block;}

.venue-card img {display: block;width: 100%;height: auto;transition: transform 0.2s ease;}

.venue-card:hover img {transform: scale(1.05);}

.venue-guide {text-align: center;font-size: 20px;font-weight: 800;margin-top: 32px;}

.venue-note {text-align: center;font-size: 14px;font-weight: 500;margin-top: 12px;}

.venue-zigzag-divider {display: block;width: 100vw;max-width: none;height: auto;margin: 48px 0 0;margin-left: calc(50% - 50vw);}

.venue-details {background: #ff3300;padding: 64px 20px 80px;}

.venue-detail-card {width: min(100%, 1000px);margin: 0 auto 48px;padding: 48px 32px;background: #fff;border-radius: 32px;}

.venue-detail-card:last-child {margin-bottom: 0;}

.venue-name-img {display: block;width: min(80%, 420px);height: auto;margin: 0 auto 40px;}

.venue-subtitle {
  display: block;
  width: fit-content;
  margin: 0 auto 28px;
  padding: 10px 42px;
  background: #2f9699;
  border-radius: 999px;
  color: #fff;
  font-size: 24px;
  font-weight: 900;
  line-height: 1.4;
  text-align: center;
}

.venue-cars-img {
  display: block;
  width: min(100%, 760px);
  height: auto;
  margin: 0 auto 48px;
}

.venue-info-img {
  display: block;
  width: min(100%, 760px);
  height: auto;
  margin: 40px auto 48px;
}

.venue-contents-img {
  display: block;
  width: min(100%, 640px);
  height: auto;
  margin: 48px auto 0;
}

.venue-subtitle-wide {
  margin-top: 48px;
}

.venue-foodtrucks-img {
  display: block;
  width: min(100%, 640px);
  height: auto;
  margin: 32px auto 0;
}




/* スマホ対応 */


@media screen and (max-width: 768px) {.page-header {padding: 12px 16px;}

  .logo { width: 140px;}

.hero { padding: 32px 16px 48px; }

  .hero-card {width: 100%;padding: 32px 18px 40px;border-radius: 32px;}

  .hero-year {font-size: 20px;}

.hero-main-date {font-size: 42px;}

.hero-day {width: 30px;height: 30px;font-size: 17px;}

.hero-date {gap: 8px;margin-bottom: 24px;}

.hero-lead {font-size: 17px;line-height: 2;letter-spacing: 0.02em;}

  .section-title-img {width: min(80%, 300px);margin: 32px auto 20px;}

  .sp-only {display: block;}

  .special-car {padding: 0 16px 24px;}

  .special-car-lead { font-size: 14px; margin-bottom: 24px;}

  .fj-content {flex-direction: column; gap: 28px; width: 100%;}

  .fj-visual {width: 100%;margin-bottom: 24px;}

  .fj-text h3 {font-size: 24px;}

  .fj-text p {font-size: 13px;}

  .kinto-recommend-img {width: 100%; margin-top: 36px;}

  .benefits {padding: 0 12px 56px;}

  .benefits-divider {width: calc(100vw + 4px); max-width: none;margin-left: 50%;transform: translateX(-50%);  }

  .event-benefits-img {width: 100%;margin-top: 28px;}

  .benefit-item {flex-direction: column;align-items: center;gap: 12px;width: 100%;margin: 32px auto 0;}

  .benefit-visual {flex: none;width: 88%;}

  .benefit-body {width: 100%;padding: 0 24px;text-align: left;}

  .benefit-title-img {width: 100%;max-width: 420px;margin: 0 auto 16px;}

  .benefit-text {font-size: 24px;line-height: 1.65;margin-bottom: 14px;}

  .benefit-note {font-size: 15px; line-height: 1.7;}

  .benefit-item-reverse { flex-direction: column-reverse; margin-top: 56px;}

  .noah-voxy-banner {width: 100%;margin-top: 40px;}

.noah-voxy-banner-link {display: block;width: min(100%, 1000px);margin: 56px auto 0;}

.noah-voxy-banner-link {width: 100%;margin-top: 40px;}

  .benefit-caution {font-size: 14px;line-height: 1.7; margin-top: 40px; padding: 0 20px;}

  .event-venues { padding: 0 16px 0;}

  .event-venues-divider {width: 140vw;max-width: none;margin-left: 50%;transform: translateX(-50%);}

  .event-venues-title { width: min(80%, 300px); margin: 36px auto 28px; }

  .venue-list {grid-template-columns: 1fr;gap: 20px;width: min(100%, 280px);}

  .venue-guide {font-size: 16px; margin-top: 24px;}

  .venue-note {font-size: 12px; line-height: 1.6;}

  .venue-details {padding: 0 16px 56px;}

.venue-detail-card {margin-bottom: 32px;padding: 32px 18px;border-radius: 24px;}

.venue-name-img {width: min(90%, 300px);margin-bottom: 28px;}

  .venue-subtitle {padding: 8px 32px;font-size: 18px;margin-bottom: 24px;}

  .venue-cars-img {
  width: 100%;
  margin-bottom: 40px;}
}

.venue-contents-img {
  width: 100%;
  margin-top: 40px;
}

.venue-info-img {
  width: 100%;
  margin: 32px auto 40px;
}

.venue-subtitle-wide {
  margin-top: 40px;
}

.venue-foodtrucks-img {
  width: 100%;
  margin-top: 24px;
}