/* =========================================
   TOP PAGE — Main wrapper
   ========================================= */
.site-main {
  background: #fff;
  display: flex;
  flex-direction: column;
  flex: 1;
  width: 100%;
}

/* =========================================
   Hero Section — 全画面動画
   ========================================= */
.hero-section {
  display: block;
  width: 100%;
  height: 100vh;
  position: relative;
  overflow: hidden;
  background: #cccccc;
}

.hero-video-wrapper {
  width: 100%;
  height: 100%;
}

.hero-video {
  display: block;
  width: 100%;
  height: 100%;
  border: none;
  object-fit: cover;
}

/* =========================================
   Announcement Section — 開催決定
   ========================================= */
.announcement-section {
  padding: 0px 0px 120px 0px;
}

.announcement-inner {
  /* max-width: 900px; */
  margin: 0 auto;
}

.announcement-card {
  background-color: #e0e0e0;
  background-image: linear-gradient(rgba(255,255,255,0.65), rgba(255,255,255,0.65)), url("../image/2026-news.webp");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  padding: 70px 40px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

.announcement-eyebrow {
  font-family: var(--font-heading);
  font-size: 14px;
  letter-spacing: 0.1em;
  color: #555;
}

.announcement-title {
  font-family: var(--font-heading);
  font-size: 52px;
  font-weight: 700;
  letter-spacing: 0.15em;
  color: var(--color-text);
}

.announcement-detail {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 2;
  letter-spacing: 0.05em;
  color: var(--color-text);
}

.announcement-note {
  font-family: var(--font-body);
  font-size: 14px;
  letter-spacing: 0.05em;
  color: #666;
}

/* =========================================
   Section Heading — 縦書きタイトル（左列）
   ========================================= */
.section-heading {
  display: flex;
  align-items: flex-start;
  flex: 0 0 auto;
}

/* 縦書き section-title（お問い合わせ以外のすべて） */
.section-heading .section-title {
  writing-mode: vertical-rl;
  text-orientation: upright;
  border-right: 2px solid black;
  padding-right: 10px;
  font-size: 15px;
  font-weight: normal;
  letter-spacing: 0.15em;
  transform: none;
}

/* =========================================
   Section Body — タイトルの右側コンテンツ列
   ========================================= */
.section-body {
  /* flex: 1; */
  display: flex;
  flex-direction: column;
  gap: 40px;
  width: fit-content;
}

/* =========================================
   Block Images — 3枚重なり画像群（3:2比率）
   ========================================= */
.block-images {
  position: relative;
  width: 265px;
  height: 195px;
  flex: none;
}

.block-img {
  display: block;
  object-fit: cover;
  position: absolute;
}

/* 左寄せ配置（デフォルト）— 3:2比率、3枚目が最前面 */
.block-images .block-img:nth-child(1) {
  top: 0;
  left: 0;
  width: 198px;
  height: 132px;
  z-index: 1;
}

.block-images .block-img:nth-child(2) {
  top: 80px;
  left: 18px;
  width: 162px;
  height: 108px;
  z-index: 2;
}

.block-images .block-img:nth-child(3) {
  top: 36px;
  left: 80px;
  width: 180px;
  height: 120px;
  z-index: 3;
}

/* 右寄せ配置（ミラー） */
.block-images--right .block-img:nth-child(1) {
  left: auto;
  right: 0;
}

.block-images--right .block-img:nth-child(2) {
  left: auto;
  right: 18px;
}

.block-images--right .block-img:nth-child(3) {
  left: auto;
  right: 80px;
}

/* 縦積み配置（Message セクション用）— 左は < 形、右は > 形 */
.block-images--vertical {
  width: 265px;
  height: 405px;
}

/* 左（< 形）: 真ん中が左に飛び出す */
.block-images--vertical .block-img:nth-child(1) {
  top: 0;
  left: 25px;
  width: 240px;
  height: 160px;
  z-index: 1;
}

.block-images--vertical .block-img:nth-child(2) {
  top: 120px;
  left: 0;
  width: 240px;
  height: 160px;
  z-index: 3;
}

.block-images--vertical .block-img:nth-child(3) {
  top: 240px;
  left: 25px;
  width: 240px;
  height: 160px;
  z-index: 2;
}

/* 右（> 形）: 真ん中が右に飛び出す */
.block-images--vertical.block-images--right .block-img:nth-child(1) {
  left: auto;
  right: 25px;
}

.block-images--vertical.block-images--right .block-img:nth-child(2) {
  left: auto;
  right: 0;
}

.block-images--vertical.block-images--right .block-img:nth-child(3) {
  left: auto;
  right: 25px;
}

/* Works セクション用 — 斜めカスケード配置（px 固定） */
.block-images--lg {
  width: 360px;
  height: 300px;
}

/* カスケード 上（左寄せ） */
.block-images--lg .block-img:nth-child(1) { top: 0;     left: 0;    width: 210px; height: 140px; z-index: 1; }
/* カスケード 中（右端・最前面） */
.block-images--lg .block-img:nth-child(2) { top: 75px;  left: auto; right: 0;     width: 210px; height: 140px; z-index: 3; }
/* カスケード 下（少し左に戻る） */
.block-images--lg .block-img:nth-child(3) { top: 160px; left: 15px;               width: 210px; height: 140px; z-index: 2; }

/* 右変種（ミラー） */
.block-images--lg.block-images--right .block-img:nth-child(1) { left: auto; right: 0;     }
.block-images--lg.block-images--right .block-img:nth-child(2) { left: 0;    right: auto;  }
.block-images--lg.block-images--right .block-img:nth-child(3) { left: auto; right: 15px;  }

/* =========================================
   Message Section
   ========================================= */
.message-section {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 120px 60px;
  overflow: hidden;
}

.message-section__inner {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.message-images {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 410px;
  overflow: hidden;
}

/* message-content 内部: 縦書き見出し（左）+ 本文（右）の横並び */
.message-content {
  flex: 0 0 auto;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 24px;
  padding: 0 25px;
  max-width: 760px;
  margin: 0 25px;
}

.message-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.message-subtitle {
  color: var(--color-text);
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.message-text {
  color: var(--color-text);
  font-family: var(--font-body);
  font-feature-settings: 'palt' 1;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.9;
  text-align: justify;
  /* max-width: 480px; */
}

/* =========================================
   Notice Banner (現在非表示)
   ========================================= */
.notice-banner { background: #f0f0f0; padding: 30px 80px; width: 100%; }
.notice-banner__inner { display: flex; flex-direction: column; gap: 16px; }
.notice-banner__heading { color: var(--color-text); font-size: 16px; font-weight: 600; letter-spacing: 0.05em; }
.notice-banner__text    { color: var(--color-text); font-size: 13px; font-weight: 400; letter-spacing: 0.05em; line-height: 1.9; }
.notice-banner__org     { color: var(--color-text); font-size: 13px; font-weight: 600; letter-spacing: 0.05em; }

/* =========================================
   Banner Sections
   ========================================= */
.banner-section {
  width: 100%;
}

.banner-section--right {
  padding: 0 80px 12px 0;
}

.banner-section--left {
  padding: 0 0 12px 80px;
}

.banner-img {
  display: block;
  width: 100%;
  height: 400px;
  object-fit: cover;
  box-shadow: 10px 10px 0 rgba(0, 0, 0, 0.18);
}

.banner-img--top {
  object-position: top center;
}

/* =========================================
   Works Section
   ========================================= */
.works-section {
  display: flex;
  flex-direction: column;
  padding: 120px 80px;
  width: 100%;
}

.works-section__inner {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 40px;
  max-width: 1000px;
  margin: auto;
}

.works-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 60px;
  width: 100%;
}

.works-item__images {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.works-item__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.works-item__header {
  width: fit-content;
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: 0;
  margin: 0 auto;
}

.works-item__divider {
  background: var(--color-text);
  width: 36px;
  height: 1px;
  transform: rotate(-45deg);
}

.works-item__number-wrap {
  align-items: center;
  border-radius: 50%;
  aspect-ratio: 1;
}

.works-item__number {
  color: var(--color-text);
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 400;
}

.works-item__title {
  color: var(--color-text);
  font-family: var(--font-heading);
  font-feature-settings: 'palt' 1;
  font-size: 28px;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.4;
}

.works-item__text {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.9;
  text-align: justify;
}

.works-more {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin-top: 10px;
}

.works-more__link {
  align-items: center;
  background: transparent;
  border: 1px solid #000;
  border-radius: 24px;
  display: flex;
  flex-direction: column;
  height: 50px;
  justify-content: center;
  width: 200px;
}

.works-more__link:hover { border-color: var(--color-accent); }

.works-more__text {
  color: #000;
  font-family: var(--font-en);
  font-size: 16px;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.4;
}

.works-more__link:hover .works-more__text {
  color: var(--color-accent);
  letter-spacing: 0.12em;
}

/* =========================================
   Info / News Section
   ========================================= */
.info-section {
  display: flex;
  flex-direction: column;
  padding: 120px 80px;
  width: 100%;
  background-color: #F5F5F5;
}

.info-section__inner {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 40px;
  margin: 0 auto;
}

.info-list { display: flex; flex-direction: column; gap: 0; width: 100%; }

.info-item {
  max-width: 700px;
  align-items: center;
  background: transparent;
  display: flex;
  flex-direction: row;
  gap: 24px;
  padding: 20px 0;
  width: 100%;
}

.info-item:hover { opacity: 0.7; }

.info-item__img {
  border-radius: 4px;
  display: block;
  flex: none;
  height: 160px;
  width: 240px;
  max-width: 240px;
  object-fit: cover;
}

.info-item__body {
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  flex: 1;
  flex-direction: column;
  gap: 6px;
}

.info-item__tag-wrap {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 9px 0;
}

.info-item__tag {
  background: var(--color-accent);
  border-radius: 2px;
  color: #fff;
  font-family: var(--font-en);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.05em;
  padding: 3px 8px 2px 8px;
}

.info-item__date {
  color: #686868;
  font-family: var(--font-en);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.1em;
}

.info-item__title {
  color: #000;
  font-family: var(--font-heading);
  font-feature-settings: 'palt' 1;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.info-item__excerpt {
  color: #666;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.62;
  text-align: justify;
}

.info-more {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin: 22px 0 0 0;
  width: 100%;
}

.info-more__link {
  align-items: center;
  background: transparent;
  border: 1px solid #000;
  border-radius: 16px;
  color: #333;
  display: flex;
  flex-direction: row;
  height: 30px;
  justify-content: center;
  width: 122px;
}

.info-more__link:hover { border-color: var(--color-accent); }

.info-more__text {
  color: #000;
  font-family: var(--font-en);
  font-size: 14px;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0.05em;
  text-align: center;
}

/* =========================================
   Company Section
   ========================================= */
.company-section {
  display: flex;
  flex-direction: column;
  padding: 120px 80px;
  width: 100%;
}

.company-section__inner {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 40px;
  max-width: 900px;
  width: fit-content;
  margin: 0 auto;
}

.company-table {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 600px;
  width: 100%;
}

.company-row {
  padding: 10px 5px;
  width: 100%;
  border-bottom: 2px solid rgb(228, 228, 228);
}

.company-row__label {
  color: #333;
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 600;
  flex: none;
  line-height: 1.6;
  width: 120px;
}

.company-row__value {
  color: #333;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.6;
}

.company-row__values { display: flex; flex-direction: column; gap: 2px; }

/* =========================================
   Past Events Section
   ========================================= */
.past-section {
  display: flex;
  flex-direction: column;
  padding: 120px 80px;
  max-width: 800px;
  width: 100%;
  margin: 0 auto;
}

.past-section__inner {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 40px;
  max-width: 1000px;
}

.past-list { display: flex; flex-direction: column; gap: 12px; }

.past-btn {
  background: transparent;
  border: 1px solid var(--color-text);
  border-radius: 20px;
  color: var(--color-text);
  cursor: pointer;
  font-family: var(--font-heading);
  padding: 6px 20px;
}

.past-btn:hover { background: var(--color-text); color: #fff; }

.past-btn__text { font-size: 16px; font-weight: 500; letter-spacing: 0.05em; line-height: 1.4; }

/* =========================================
   Contact Section（お問い合わせ — タイトルは横書き）
   ========================================= */
.contact-section {
  display: flex;
  flex-direction: column;
  padding: 120px 80px;
  width: 100%;
  background-color: #F5F5F5;
}

.contact-section__inner { max-width: 700px; width: 100%; margin: auto; }

/* お問い合わせのタイトルは通常横書き */
.contact-section__inner .section-title {
  writing-mode: horizontal-tb;
  border: none;
  padding: 0;
  font-size: 22px;
  font-weight: 600;
  text-align: center;
  letter-spacing: 0.1em;
  transform: none;
}

.contact-lead {
  color: var(--color-text);
  font-family: var(--font-body);
  font-feature-settings: 'palt' 1;
  font-size: 14px;
  font-weight: 400;
  text-align: center;
  letter-spacing: 0.05em;
  line-height: 1.9;
  margin: 0 0 40px 0;
}

.contact-form { display: flex; flex-direction: column; gap: 24px; width: 100%; }

.contact-form__field { display: flex; flex-direction: column; gap: 8px; width: 100%; }

.contact-form__label-row { align-items: center; display: flex; flex-direction: row; gap: 8px; }

.contact-form__label-text {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
}

.contact-form__required {
  background: var(--color-accent);
  border-radius: 2px;
  color: #fff;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.05em;
  padding: 2px 6px;
}

.contact-form__input,
.contact-form__textarea {
  border: 1px solid #ccc;
  border-radius: 4px;
  font-family: var(--font-body);
  font-size: 14px;
  padding: 10px 14px;
  width: 100%;
}

.contact-form__textarea { height: 150px; resize: vertical; }

.contact-form__submit {
  align-items: center;
  background: #000;
  border: none;
  border-radius: 24px;
  color: #fff;
  cursor: pointer;
  display: flex;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  height: 48px;
  justify-content: center;
  letter-spacing: 0.1em;
  margin: auto;
  padding: 0 40px;
  width: 300px;
}

.contact-form__submit:hover { background: var(--color-accent); }

/* Forminator overrides */
.contact-section .forminator-custom-form {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
}
.contact-section .forminator-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  width: 100%;
}
.contact-section .forminator-col,
.contact-section .forminator-col-12 { padding: 0; width: 100%; }
.contact-section .forminator-field { display: flex; flex-direction: column; gap: 8px; margin: 0; }
.contact-section .forminator-label {
  align-items: center;
  color: var(--color-text);
  display: flex;
  flex-direction: row;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  gap: 4px;
  letter-spacing: 0.05em;
  margin: 0;
}
.contact-section .forminator-required {
  background: none;
  border-radius: 0;
  color: #e00;
  font-size: 14px;
  font-weight: 500;
  margin: 0;
  padding: 0;
}
.contact-section .forminator-input,
.contact-section .forminator-textarea {
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-shadow: none;
  font-family: var(--font-body);
  font-size: 14px;
  outline: none;
  padding: 10px 14px;
  width: 100%;
}
.contact-section .forminator-input:focus,
.contact-section .forminator-textarea:focus { border-color: #000; box-shadow: none; }
.contact-section .forminator-field-has_error .forminator-input,
.contact-section .forminator-field-has_error .forminator-textarea { border-color: #e00; }
.contact-section .forminator-textarea { height: 150px; min-height: unset !important; resize: vertical; }
.contact-section .forminator-error-message {
  color: #e00;
  font-size: 12px;
  font-family: var(--font-body);
  margin: 0;
}
.contact-section .forminator-description {
  color: #999;
  font-size: 12px;
  font-family: var(--font-body);
  text-align: right;
}
.contact-section .forminator-row-last { margin-top: 8px; }
.contact-section .forminator-button-submit {
  align-items: center;
  background: #000;
  border: none;
  border-radius: 24px;
  color: #fff;
  cursor: pointer;
  display: flex;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  height: 48px;
  justify-content: center;
  letter-spacing: 0.1em;
  margin: auto;
  padding: 0 40px;
  width: 300px;
}
.contact-section .forminator-button-submit:hover { background: var(--color-accent); }
.contact-section .forminator-response-message { display: none !important; }
.contact-section .forminator-edit-module { display: none; }

/* =========================================
   RESPONSIVE - MESSAGE FOLD (max 1280px)
   行レイアウトのままだと左右の block-images が overflow: hidden で
   トリミングされるため、早めに縦積みへ切り替える
   ========================================= */
@media screen and (max-width: 1280px) {
  .message-section        { padding: 80px 0; overflow: visible; }
  .message-section__inner { flex-direction: column; gap: 30px; }
  .message-images         { flex: none; width: 100%; min-height: 35vw; overflow: visible; justify-content: flex-start; align-items: flex-start; }
  .block-images--vertical { width: 0; height: 0; }
  .block-images--vertical .block-img:nth-child(1) { top: 12vw; left: 0;    width: 35vw; height: 23vw; z-index: 1; }
  .block-images--vertical .block-img:nth-child(2) { top: 0;    left: 33vw; width: 35vw; height: 23vw; z-index: 3; }
  .block-images--vertical .block-img:nth-child(3) { top: 12vw; left: 65vw; width: 35vw; height: 23vw; z-index: 1; }
  .block-images--vertical.block-images--right .block-img:nth-child(1) { top: 0;    left: 0;    right: auto; }
  .block-images--vertical.block-images--right .block-img:nth-child(2) { top: 12vw; left: 33vw; right: auto; }
  .block-images--vertical.block-images--right .block-img:nth-child(3) { top: 0;    left: 65vw; right: auto; }
  .message-content        { padding: 0 40px; max-width: 100%; }
}

/* =========================================
   RESPONSIVE - TABLET (max 840px)
   ========================================= */
@media screen and (max-width: 840px) {
  .banner-section--right  { padding: 0 40px 10px 0; }
  .banner-section--left   { padding: 0 0 10px 40px; }
  .banner-img             { height: 280px; }

  .hero-section           { height: 100vh; }
  .announcement-section   { padding: 0 0 40px 0; }
  .announcement-title     { font-size: 40px; }

  /* Message — 案2: block-images--vertical を 0×0 アンカーに変換、overflow 解除 */
  .message-section        { padding: 60px 0; overflow: visible; }
  .message-section__inner { flex-direction: column; gap: 30px; }
  .message-images         { flex: none; width: 100%; min-height: 35vw; overflow: visible; justify-content: flex-start; align-items: flex-start; }
  .block-images           { width: 220px; height: 160px; }
  .block-images .block-img:nth-child(1) { top: 0; left: 0; width: 165px; height: 110px; }
  .block-images .block-img:nth-child(2) { top: 66px; left: 15px; width: 135px; height: 90px; }
  .block-images .block-img:nth-child(3) { top: 30px; left: 66px; width: 150px; height: 100px; }
  .block-images--right .block-img:nth-child(1) { right: 0; left: auto; }
  .block-images--right .block-img:nth-child(2) { right: 15px; left: auto; }
  .block-images--right .block-img:nth-child(3) { right: 66px; left: auto; }
  /* --vertical: 0×0 アンカー（画像は vw 座標で viewport 全幅に展開） */
  .block-images--vertical { width: 0; height: 0; }
  /* 左の画像群: 山なり（^）— 両端は下、中央が上に飛び出す */
  .block-images--vertical .block-img:nth-child(1) { top: 12vw; left: 0;    width: 35vw; height: 23vw; z-index: 1; }
  .block-images--vertical .block-img:nth-child(2) { top: 0;    left: 33vw; width: 35vw; height: 23vw; z-index: 3; }
  .block-images--vertical .block-img:nth-child(3) { top: 12vw; left: 65vw; width: 35vw; height: 23vw; z-index: 1; }
  /* 右の画像群: 谷なり（v）— 両端は上、中央が下に飛び込む */
  .block-images--vertical.block-images--right .block-img:nth-child(1) { top: 0;    left: 0;    right: auto; }
  .block-images--vertical.block-images--right .block-img:nth-child(2) { top: 12vw; left: 33vw; right: auto; }
  .block-images--vertical.block-images--right .block-img:nth-child(3) { top: 0;    left: 65vw; right: auto; }
  .message-content        { padding: 0 20px; max-width: 100%; }

  /* Works — section__inner は row 維持（縦書きタイトルを本文の左に保持）。works-item 内のみ縦積み */
  .works-section          { padding: 40px 80px; }
  .works-item             { flex-direction: column; gap: 30px; align-items: center; }
  .section-body > .works-item:nth-of-type(2) { flex-direction: column-reverse; }
  .works-item__images     { width: 100%; justify-content: center; }
  /* section padding 160 + ヘディング ~30 + gap 40 = 230 を viewport から引き、360px でキャップ */
  .block-images--lg {
    --lg: min(360px, calc(100vw - 230px));
    width: var(--lg);
    height: calc(var(--lg) * 5 / 6);
  }
  .block-images--lg .block-img:nth-child(1) { top: 0;                          left: 0;                      width: calc(var(--lg) * 7 / 12); height: calc(var(--lg) * 7 / 18); z-index: 1; }
  .block-images--lg .block-img:nth-child(2) { top: calc(var(--lg) * 5 / 24);  left: auto; right: 0;          width: calc(var(--lg) * 7 / 12); height: calc(var(--lg) * 7 / 18); z-index: 3; }
  .block-images--lg .block-img:nth-child(3) { top: calc(var(--lg) * 4 / 9);   left: calc(var(--lg) / 24);   width: calc(var(--lg) * 7 / 12); height: calc(var(--lg) * 7 / 18); z-index: 2; }
  .block-images--lg.block-images--right .block-img:nth-child(1) { left: auto; right: 0;                       }
  .block-images--lg.block-images--right .block-img:nth-child(2) { left: 0;    right: auto;                    }
  .block-images--lg.block-images--right .block-img:nth-child(3) { left: auto; right: calc(var(--lg) / 24);   }

  /* Info / Company / Past */
  .info-section           { padding: 40px 60px; }
  .info-item__img         { height: 130px; width: 190px; max-width: 190px; }
  .company-section        { padding: 40px 60px; }
  .past-section           { padding: 40px 60px; }
  .contact-section        { padding: 40px 60px; }
  .notice-banner          { padding: 30px 60px; }
}

/* =========================================
   RESPONSIVE - MOBILE (max 540px)
   ========================================= */
@media screen and (max-width: 540px) {
  .banner-section--right  { padding: 0 20px 8px 0; }
  .banner-section--left   { padding: 0 0 8px 20px; }
  .banner-img             { height: 200px; box-shadow: 6px 6px 0 rgba(0, 0, 0, 0.18); }

  .hero-section           { height: 100vh; }
  .announcement-section   { padding: 0 0 40px 0; }
  .announcement-card      { padding: 40px 20px; gap: 14px; }
  .announcement-title     { font-size: 32px; }
  .announcement-detail    { font-size: 13px; }

  /* Message — 案2: block-images--vertical を 0×0 アンカーに変換、overflow 解除 */
  .message-section        { padding: 40px 0; overflow: visible; }
  .message-section__inner { flex-direction: column; gap: 30px; }
  .message-images         { flex: none; width: 100%; min-height: 35vw; overflow: visible; justify-content: flex-start; align-items: flex-start; }
  .block-images           { width: 220px; height: 160px; }
  .block-images .block-img:nth-child(1) { top: 0; left: 0; width: 165px; height: 110px; }
  .block-images .block-img:nth-child(2) { top: 66px; left: 15px; width: 135px; height: 90px; }
  .block-images .block-img:nth-child(3) { top: 30px; left: 66px; width: 150px; height: 100px; }
  .block-images--right .block-img:nth-child(1) { right: 0; left: auto; }
  .block-images--right .block-img:nth-child(2) { right: 15px; left: auto; }
  .block-images--right .block-img:nth-child(3) { right: 66px; left: auto; }
  /* --vertical: 0×0 アンカー（画像は vw 座標で viewport 全幅に展開） */
  .block-images--vertical { width: 0; height: 0; }
  /* 左の画像群: 山なり（^） */
  .block-images--vertical .block-img:nth-child(1) { top: 12vw; left: 0;    width: 35vw; height: 23vw; z-index: 1; }
  .block-images--vertical .block-img:nth-child(2) { top: 0;    left: 33vw; width: 35vw; height: 23vw; z-index: 3; }
  .block-images--vertical .block-img:nth-child(3) { top: 12vw; left: 65vw; width: 35vw; height: 23vw; z-index: 1; }
  /* 右の画像群: 谷なり（v） */
  .block-images--vertical.block-images--right .block-img:nth-child(1) { top: 0;    left: 0;    right: auto; }
  .block-images--vertical.block-images--right .block-img:nth-child(2) { top: 12vw; left: 33vw; right: auto; }
  .block-images--vertical.block-images--right .block-img:nth-child(3) { top: 0;    left: 65vw; right: auto; }
  .message-content        { padding: 0 20px; max-width: 100%; }

  /* Works — section__inner は row 維持。works-item 内のみ縦積み + vw-calc スケール */
  .works-section          { padding: 20px}
  .works-item             { flex-direction: column; gap: 30px; align-items: center; }
  .section-body > .works-item:nth-of-type(2) { flex-direction: column-reverse; }
  .works-item__images     { width: 100%; justify-content: center; }
  .block-images--lg {
    /* section padding 40 + 縦書きヘディング ~30 + gap 40 = 110 を viewport から引く */
    --lg: calc(100vw - 110px);
    width: var(--lg);
    height: calc(var(--lg) * 5 / 6);
  }
  .block-images--lg .block-img:nth-child(1) { top: 0;                          left: 0;                      width: calc(var(--lg) * 7 / 12); height: calc(var(--lg) * 7 / 18); z-index: 1; }
  .block-images--lg .block-img:nth-child(2) { top: calc(var(--lg) * 5 / 24);  left: auto; right: 0;          width: calc(var(--lg) * 7 / 12); height: calc(var(--lg) * 7 / 18); z-index: 3; }
  .block-images--lg .block-img:nth-child(3) { top: calc(var(--lg) * 4 / 9);   left: calc(var(--lg) / 24);   width: calc(var(--lg) * 7 / 12); height: calc(var(--lg) * 7 / 18); z-index: 2; }
  .block-images--lg.block-images--right .block-img:nth-child(1) { left: auto; right: 0;                       }
  .block-images--lg.block-images--right .block-img:nth-child(2) { left: 0;    right: auto;                    }
  .block-images--lg.block-images--right .block-img:nth-child(3) { left: auto; right: calc(var(--lg) / 24);   }
  .works-more             { margin-top: 0; }

  /* Info / Company / Past: section__inner は row 維持。中身のみ縦積み */
  .info-section           { padding: 20px; }
  .info-item              { flex-direction: column; padding: 16px 0; }
  .info-item__img         { height: auto; width: 100%; max-width: 100%; margin: 0 0 12px 0; }
  .info-item__body        { gap: 4px; }
  .company-section        { padding: 20px; }
  .company-row            { flex-direction: column; gap: 4px; }
  .company-row__label     { width: auto; }
  .past-section           { padding: 20px; }
  .contact-section        { padding: 20px; }
  .notice-banner          { padding: 20px; }
}

/* =========================================
   Past Events Popup
   ========================================= */
.past-overlay {
  align-items: center;
  background: rgba(0, 0, 0, 0.3);
  bottom: 0;
  display: flex;
  justify-content: center;
  left: 0;
  opacity: 0;
  pointer-events: none;
  position: fixed;
  right: 0;
  top: 0;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  visibility: hidden;
  z-index: 500;
}

.past-overlay.is-open {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

.past-modal {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
  display: flex;
  flex-direction: row;
  max-height: 90vh;
  max-width: 860px;
  overflow: hidden;
  overflow-y: auto;
  position: relative;
  width: 90vw;
}

.past-modal__close {
  align-items: center;
  background: transparent;
  border: none;
  color: #333;
  cursor: pointer;
  display: flex;
  font-size: 24px;
  height: 40px;
  justify-content: center;
  line-height: 1;
  padding: 0;
  position: absolute;
  right: 16px;
  top: 16px;
  width: 40px;
  z-index: 10;
}

.past-modal__close:hover { color: var(--color-accent); }

.past-modal__image {
  background: #f0f0f0;
  flex: 0 0 45%;
  min-height: 400px;
  overflow: hidden;
  padding: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.past-modal__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.past-modal__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 20px;
  padding: 48px 40px 48px 36px;
}

.past-modal__title {
  color: var(--color-text);
  font-family: var(--font-heading);
  font-size: 36px;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.3;
}

.past-modal__summary-label {
  color: var(--color-text);
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.05em;
}

.past-modal__details {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.past-modal__detail-row {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 15px;
  letter-spacing: 0.03em;
  line-height: 1.6;
}

.past-modal__links-label {
  color: var(--color-text);
  font-family: var(--font-heading);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.05em;
  margin-top: 8px;
}

.past-modal__links {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.past-modal__link {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 15px;
  letter-spacing: 0.03em;
  text-decoration: underline;
}

.past-modal__link:hover { color: var(--color-accent); }

@media screen and (max-width: 600px) {
  .past-modal {
    flex-direction: column;
    max-height: 85vh;
    width: 92vw;
  }
  .past-modal__image {
    flex: 0 0 auto;
    min-height: 200px;
    width: 100%;
  }
  .past-modal__body {
    padding: 32px 24px;
  }
  .past-modal__title { font-size: 26px; }
}