@charset "UTF-8";
/* =====================================================
   販売会（event）
   - ヘッダーナビ幅調整（Event 追加分）… 全ページ
   - トップの「Next Event」帯 …… .evBanner
   - /event/ ページ ……………… body.event
   ===================================================== */

/* ---------- ヘッダー：Event を足しても1行に収める ---------- */
@media screen and (min-width: 821px) and (max-width: 1400px) {
  #header .headerInner .navWrap li { font-size: 1.6rem; }
  #header .headerInner .navWrap li:nth-of-type(n+2) { margin-left: 36px; }
  #header .headerInner .navWrap li:nth-of-type(n+2):before { left: -18px; font-size: 2rem; }
  #header .headerInner .navWrap li.btn { font-size: 1.4rem; margin-left: 24px; }
  #header .headerInner .navWrap li.btn:nth-of-type(n+2):before { content: none; }
}
@media screen and (min-width: 821px) and (max-width: 1100px) {
  #header .headerInner { padding-left: 20px; padding-right: 20px; }
  #header .headerInner .logo { max-width: 150px; }
  #header .headerInner .navWrap li { font-size: 1.4rem; }
  #header .headerInner .navWrap li:nth-of-type(n+2) { margin-left: 22px; }
  #header .headerInner .navWrap li:nth-of-type(n+2):before { left: -11px; font-size: 1.6rem; }
  #header .headerInner .navWrap li.btn { font-size: 1.2rem; margin-left: 14px; padding: 0; }
  #header .headerInner .navWrap li.btn a { padding: 6px 12px; }
  #header .headerInner .navWrap li.btn img { width: 12px; margin-left: 6px; }
}

/* ---------- 共通トークン ---------- */
body.event,
.evBanner {
  --ev-green: #027657;
  --ev-deep: #236A4C;
  --ev-orange: #EA7A0C;
  --ev-orange-d: #c9650a;
  --ev-warm: #F7F2EE;
  --ev-ink: #231815;
  --ev-muted: #6f6a66;
  --ev-line: #e4ddd6;
  --ev-sat: #2a5fa8;
  --ev-sun: #b8373d;
  --ev-en: "Outfit", var(--sans, sans-serif);
}

/* ---------- トップの帯 ---------- */
.evBanner {
  background: #fff;
  border-radius: 20px;
  margin-bottom: 20px;
  padding: 22px 28px 22px 36px;
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  gap: 10px 22px;
  align-items: center;
  color: var(--ev-ink);
}
.evBanner p { margin: 0; }
.evBanner .ttl { font-family: var(--ev-en); font-size: 2.8rem; font-weight: 300; color: var(--ev-green); line-height: 1; }
.evBanner .ttl small { display: block; font-family: var(--sans, sans-serif); font-size: 1.1rem; color: var(--ev-ink); font-weight: 500; margin-top: 6px; }
.evBanner .dt { font-family: var(--ev-en); font-size: 3.2rem; font-weight: 400; line-height: 1; white-space: nowrap; padding-left: 22px; border-left: 1px solid var(--ev-ink); font-variant-numeric: tabular-nums; }
.evBanner .dt .sep { font-weight: 300; }
.evBanner .dt small { font-size: 1.3rem; margin-left: 4px; }
.evBanner .pl { font-size: 1.5rem; line-height: 1.5; font-weight: 500; }
.evBanner .pl span { display: block; font-size: 1.2rem; font-weight: 400; color: var(--ev-muted); }
.evBanner .acts { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.evBanner .acts a { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; padding: 8px 18px; font-size: 1.4rem; font-weight: 700; white-space: nowrap; transition: background-color .2s; }
.evBanner .acts a:hover { opacity: 1; }
.evBanner .more, :where(.evBanner .more) * { color: var(--ev-green); }
.evBanner .more { box-shadow: inset 0 0 0 1px var(--ev-green); }
.evBanner .more:hover { background: #eef6f3; }
.evBanner .res { background: var(--ev-orange); color: #fff; }
.evBanner .res:hover { background: var(--ev-orange-d); color: #fff; }
@media screen and (max-width: 767px) {
  .evBanner { grid-template-columns: minmax(0, 1fr) auto; padding: 18px 20px; gap: 10px 14px; border-radius: 14px; }
  .evBanner .ttl { font-size: 2.2rem; grid-column: 1 / -1; display: flex; align-items: baseline; gap: 8px; }
  .evBanner .ttl small { display: inline; margin: 0; }
  .evBanner .dt { padding-left: 0; border-left: 0; font-size: 2.6rem; }
  .evBanner .dt, .evBanner .pl, .evBanner .acts { grid-column: 1 / -1; }
  .evBanner .acts { justify-content: stretch; margin-top: 2px; }
  .evBanner .acts a { flex: 1 1 40%; padding: 9px 12px; }
}

/* ---------- /event/ ---------- */
body.event { color: var(--ev-ink); }
body.event .evWrap { max-width: 1040px; margin: 0 auto; padding: 0 20px; }
body.event [hidden] { display: none !important; }
:where(body.event) button { font: inherit; color: inherit; cursor: pointer; background: none; border: 0; }
body.event :focus-visible { outline: 2px solid var(--ev-orange); outline-offset: 2px; }
/* サイト共通CSSの「* { color: #333 }」を打ち消し、親の色を引き継がせる。
   詳細度0（:where）なので、下の個別の色指定がすべて優先される */
:where(body.event .evNext) :where(div, h3, dl, dt, dd, span, small, b, summary),
:where(body.event .evBtn) :where(small, span),
:where(body.event .evDay) :where(.n),
:where(body.event .evPast li) :where(span),
:where(.evPin, .evPin *) { color: inherit; }

.evIntro { max-width: 1040px; margin: 0 auto; padding: 0 20px 40px; }
.evIntro p { font-size: 1.4rem; line-height: 1.9; }

/* 次回 */
.evNext { background: var(--ev-deep); color: #fff; }
.evNext-in { max-width: 1040px; margin: 0 auto; padding: 44px 20px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 28px 56px; align-items: center; }
.evEyebrow { font-family: var(--ev-en); font-size: 1.2rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: #a9d8c6; }
.evBig { font-family: var(--ev-en); font-weight: 300; font-size: 8rem; line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; margin: 10px 0 8px; white-space: nowrap; }
.evBig small { font-size: .3em; font-weight: 500; letter-spacing: .06em; margin-left: 8px; vertical-align: .95em; }
.evCount { display: inline-flex; align-items: baseline; gap: 6px; background: rgba(255,255,255,.12); border-radius: 999px; padding: 3px 16px; font-size: 1.3rem; }
.evCount b { font-family: var(--ev-en); font-size: 2.2rem; font-weight: 600; line-height: 1.2; }
.evNext h3 { margin: 10px 0 12px; font-size: 2.4rem; font-weight: 700; line-height: 1.45; }
.evNext dl { margin: 0 0 20px; display: grid; grid-template-columns: auto 1fr; gap: 4px 16px; font-size: 1.4rem; line-height: 1.7; }
.evNext dt { color: #a9d8c6; white-space: nowrap; }
.evNext dd { margin: 0; }

/* ラベル */
.evChips { display: flex; flex-wrap: wrap; gap: 6px; }
.evChip { font-size: 1.1rem; font-weight: 700; letter-spacing: .04em; border-radius: 4px; padding: 1px 8px; line-height: 2rem; white-space: nowrap; }
.evChip.region { background: var(--ev-warm); color: var(--ev-deep); }
.evChip.open { background: #fdeedd; color: #a4520a; }
.evChip.few { background: var(--ev-orange); color: #fff; }
.evChip.walk { color: var(--ev-muted); box-shadow: inset 0 0 0 1px var(--ev-line); }
.evNext .evChip.region { background: rgba(255,255,255,.14); color: #fff; }
.evNext .evChip.open { background: #fff3e6; }
.evNext .evChip.walk { color: #d7ece4; box-shadow: inset 0 0 0 1px rgba(255,255,255,.3); }

/* ボタン */
.evActs { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.evBtn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 999px; padding: 10px 22px; font-size: 1.4rem; font-weight: 700; line-height: 1.3; white-space: nowrap; transition: background-color .2s; }
body.event .evBtn:hover { opacity: 1; }
.evBtn.res { background: var(--ev-orange); color: #fff; }
.evBtn.res:hover { background: var(--ev-orange-d); color: #fff; }
.evBtn.res small { font-family: var(--ev-en); font-weight: 500; font-size: 1rem; letter-spacing: .06em; opacity: .85; }
body.event .evBtn.line { box-shadow: inset 0 0 0 1px var(--ev-green); color: var(--ev-green); }
body.event .evBtn.line:hover { background: #eef6f3; }
.evNext .evBtn.line { box-shadow: inset 0 0 0 1px rgba(255,255,255,.6); color: #fff; }
body.event .evNext .evBtn.line { box-shadow: inset 0 0 0 1px rgba(255,255,255,.6); color: #fff; }
body.event .evNext .evBtn.line:hover { background: rgba(255,255,255,.08); }
.evPin { width: 12px; height: 12px; flex: none; }

/* カレンダーに追加 */
.evAdd { position: relative; }
.evAdd summary { list-style: none; cursor: pointer; padding: 10px 8px; font-size: 1.4rem; color: var(--ev-muted); text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.evAdd summary::-webkit-details-marker { display: none; }
.evNext .evAdd summary { color: #d7ece4; }
.evAdd-menu { position: absolute; z-index: 5; right: 0; top: calc(100% + 2px); background: #fff; border: 1px solid var(--ev-line); border-radius: 8px; box-shadow: 0 8px 20px rgba(35,24,21,.12); padding: 6px; min-width: 210px; display: flex; flex-direction: column; }
.evNext .evAdd-menu { left: 0; right: auto; }
.evAdd-menu a { display: block; padding: 8px 12px; border-radius: 6px; font-size: 1.4rem; color: var(--ev-ink); white-space: nowrap; }
.evAdd-menu a:hover { background: var(--ev-warm); opacity: 1; }

/* 操作 */
.evCtrl { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; justify-content: space-between; padding: 56px 0 10px; border-bottom: 1px solid var(--ev-line); }
.evHead { margin: 0; display: flex; align-items: baseline; gap: 12px; font-size: 2rem; font-weight: 700; }
.evHead .en { font-family: var(--ev-en); font-size: 1.2rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--ev-green); }
.evFilters { display: flex; flex-wrap: wrap; gap: 6px; width: 100%; }
body.event .evFilters button { border: 1px solid var(--ev-line); background: #fff; border-radius: 999px; padding: 3px 14px; font-size: 1.3rem; }
body.event .evFilters button[aria-pressed="true"] { background: var(--ev-green); border-color: var(--ev-green); color: #fff; font-weight: 700; }
.evViews { display: inline-flex; border: 1px solid var(--ev-line); border-radius: 8px; overflow: hidden; }
body.event .evViews button { background: #fff; padding: 6px 18px; font-size: 1.3rem; }
body.event .evViews button + button { border-left: 1px solid var(--ev-line); }
body.event .evViews button[aria-pressed="true"] { background: var(--ev-ink); color: #fff; }
.evLegend { font-size: 1.4rem; color: var(--ev-muted); margin: 12px 0 0; }

/* リスト */
.evMonth { margin: 32px 0 0; }
.evMonth h4 { margin: 0 0 6px; font-family: var(--ev-en); font-weight: 500; font-size: 1.3rem; letter-spacing: .14em; color: var(--ev-muted); }
.evMonth h4 b { font-size: 3rem; color: var(--ev-ink); font-weight: 400; letter-spacing: 0; margin-right: 4px; }
.evItem { display: grid; grid-template-columns: 140px minmax(0, 1fr) auto; gap: 12px 28px; padding: 24px 0; border-top: 1px solid var(--ev-line); align-items: start; scroll-margin-top: 140px; }
.evMonth .evItem:first-of-type { border-top-color: var(--ev-ink); }
.evDate { font-family: var(--ev-en); font-variant-numeric: tabular-nums; line-height: 1; }
.evDate .d { font-size: 4rem; font-weight: 400; letter-spacing: -.02em; white-space: nowrap; }
.evDate .d .sep { font-weight: 200; }
.evDate .w { display: block; margin-top: 8px; font-family: var(--sans, sans-serif); font-size: 1.2rem; color: var(--ev-muted); }
.evDate .w .s { color: var(--ev-sat); }
.evDate .w .u { color: var(--ev-sun); }
.evItem h5 { margin: 8px 0 4px; font-size: 1.8rem; font-weight: 700; line-height: 1.5; }
.evItem .addr, .evItem .hours, .evItem .note { margin: 0; font-size: 1.4rem; line-height: 1.7; color: var(--ev-muted); }
.evItem .note { margin-top: 4px; color: var(--ev-ink); }
.evItem .evActs { justify-content: flex-end; max-width: 320px; }
.evMap { grid-column: 2 / -1; border-radius: 10px; overflow: hidden; border: 1px solid var(--ev-line); display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
.evMap iframe { display: block; width: 100%; height: 100%; min-height: 260px; border: 0; }
.evMap-side { padding: 18px 20px; font-size: 1.4rem; line-height: 1.7; display: flex; flex-direction: column; gap: 10px; background: var(--ev-warm); }
.evMap-side p { margin: 0; }
body.event .evMap-side a { color: var(--ev-green); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.evEmpty { padding: 32px 0; color: var(--ev-muted); font-size: 1.4rem; }
body.event .evEmpty a { color: var(--ev-green); text-decoration: underline; }

/* カレンダー */
.evCal { margin-top: 24px; }
.evCal-hd { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.evCal-hd b { font-family: var(--ev-en); font-size: 2.6rem; font-weight: 400; font-variant-numeric: tabular-nums; }
body.event .evCal-hd button { border: 1px solid var(--ev-line); background: #fff; border-radius: 50%; width: 38px; height: 38px; padding: 0; display: grid; place-items: center; font-size: 2rem; line-height: 1; }
body.event .evCal-hd button:disabled { opacity: .3; cursor: default; }
.evGrid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1px solid var(--ev-line); border-left: 1px solid var(--ev-line); }
.evGrid .dow { font-size: 1.2rem; text-align: center; padding: 6px 0; background: var(--ev-warm); border-right: 1px solid var(--ev-line); border-bottom: 1px solid var(--ev-line); }
.evGrid .dow.s { color: var(--ev-sat); }
.evGrid .dow.u { color: var(--ev-sun); }
body.event .evDay { min-height: 96px; border-right: 1px solid var(--ev-line); border-bottom: 1px solid var(--ev-line); padding: 5px; font-family: var(--ev-en); font-size: 1.3rem; font-variant-numeric: tabular-nums; background: #fff; text-align: left; display: flex; flex-direction: column; gap: 3px; align-items: stretch; cursor: default; }
body.event .evDay.out { background: #faf8f6; color: #c7c0b9; }
.evDay.today .n { background: var(--ev-ink); color: #fff; border-radius: 50%; width: 24px; height: 24px; display: inline-grid; place-items: center; }
.evDay .tag { display: block; font-family: var(--sans, sans-serif); font-size: 1.1rem; line-height: 1.35; font-weight: 700; color: #fff; background: var(--ev-green); border-radius: 3px; padding: 2px 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.evDay .tag.past { background: #bdb6af; }
body.event .evDay.has { cursor: pointer; }
body.event .evDay.has:hover { background: #f1f8f5; }
.evDay.sel { box-shadow: inset 0 0 0 2px var(--ev-orange); }
.evCal-detail { margin-top: 16px; }
.evCal-detail .evItem:first-child { border-top-color: var(--ev-ink); }

/* 過去 */
.evPast { margin: 64px 0 0; }
.evPast .evHead .en { color: var(--ev-muted); }
.evPast ul { list-style: none; margin: 12px 0 0; padding: 0; }
.evPast li { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 4px 20px; padding: 14px 0; border-top: 1px solid var(--ev-line); font-size: 1.4rem; color: var(--ev-muted); align-items: baseline; }
.evPast li .d { font-family: var(--ev-en); font-variant-numeric: tabular-nums; }
body.event .evPast li a { color: var(--ev-green); font-weight: 700; font-size: 1.3rem; white-space: nowrap; }
/* 過去の開催が無い時もフッターとの間を空ける */
.evSchedule { padding-bottom: 120px; }

@media screen and (max-width: 767px) {
  .evIntro { padding-bottom: 28px; }
  .evNext-in { grid-template-columns: 1fr; padding: 30px 20px; gap: 14px; }
  .evBig { font-size: 5.6rem; }
  .evNext h3 { font-size: 2rem; }
  .evNext .evActs .evBtn { flex: 1 1 auto; }
  .evCtrl { padding-top: 36px; gap: 12px; }
  .evFilters { flex-wrap: nowrap; overflow-x: auto; margin: 0 -20px; padding: 2px 20px 4px; width: calc(100% + 40px); scrollbar-width: none; }
  .evItem { grid-template-columns: 88px minmax(0, 1fr); gap: 10px 12px; padding: 20px 0; scroll-margin-top: 90px; }
  .evDate .d { font-size: 2.6rem; }
  .evItem h5 { font-size: 1.6rem; }
  .evItem .evActs { grid-column: 1 / -1; justify-content: flex-start; max-width: none; }
  .evItem .evActs .evBtn { flex: 1 1 40%; }
  .evAdd-menu { left: 0; right: auto; }
  .evMap { grid-column: 1 / -1; grid-template-columns: 1fr; }
  .evMap iframe { min-height: 220px; }
  body.event .evDay { min-height: 54px; padding: 4px 2px; align-items: center; }
  .evDay .tag { width: 8px; height: 8px; padding: 0; border-radius: 50%; font-size: 0; }
  .evPast li { grid-template-columns: 1fr; gap: 0; }
  .evSchedule { padding-bottom: 80px; }
}
@media (prefers-reduced-motion: reduce) {
  .evBtn, .evBanner .more { transition: none; }
}

/* ---------- トップ右下の枠（.topNews）に次回販売会 ---------- */
.evPickup .evPickup-label { font-family: var(--ev-en, "Outfit", sans-serif); font-size: 1.1rem; font-weight: 600; letter-spacing: .18em; color: #a9d8c6; padding: 10px 10px 0; line-height: 1.4; }
.evPickup .evPickup-date { font-family: "Outfit", var(--sans, sans-serif); font-size: 4.4rem; font-weight: 300; line-height: 1; letter-spacing: -.02em; color: #fff; padding: 6px 10px 10px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.evPickup .evPickup-date small { font-size: 1.3rem; font-weight: 500; letter-spacing: .06em; margin-left: 6px; vertical-align: .9em; }
:where(.evPickup) :where(span, small) { color: inherit; }
.evPickup .evPickup-res { display: inline-block; margin: 10px 10px 0; padding: 3px 12px; border-radius: 999px; background: var(--ev-orange, #EA7A0C); color: #fff; font-size: 1.3rem; font-weight: 700; line-height: 1.5; }

/* ---------- ナビの「NEW」 ---------- */
#header .navNew { position: relative; }
#header .navNewBadge { font-family: "Outfit", var(--sans, sans-serif); font-size: 1rem; font-weight: 700; letter-spacing: .06em; line-height: 1.5rem; color: #fff; background: #EA7A0C; border-radius: 3px; padding: 0 5px; }
#header .navWrap .navNewBadge { position: absolute; top: -13px; right: -26px; }
#header .burgerNav .navNewBadge { display: inline-block; margin-left: 10px; vertical-align: middle; }