/* 会場案内・キャンペーン・予約フォーム */

/* 会場のご案内 */
.info { background: var(--sand); }
.info-head { padding: 44px 24px 28px; background: var(--cream); text-align: center; display: flex; flex-direction: column; gap: 10px; }
.info-head .en { font-size: 32px; letter-spacing: .2em; line-height: 1; }
.info-head h2 { font-family: var(--mincho); font-size: 13px; letter-spacing: .2em; color: #666; font-weight: 400; }
.info-body { padding: 28px 20px 44px; display: flex; flex-direction: column; gap: 22px; }
.info-addr { display: grid; grid-template-columns: minmax(0,1fr) 112px; gap: 14px; align-items: center; font-family: var(--mincho); }
.info-addr .photo { height: 100px; }
.info-addr .l1 { font-size: 16px; padding: 0 0 12px; border-bottom: 1px solid #b9b7b1; display: flex; gap: 6px; align-items: center; }
.info-addr .l1::before { content: ""; width: 10px; height: 10px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: var(--sub); flex: none; }
.info-addr .l2 { font-size: 13px; padding: 12px 0; border-bottom: 1px solid #b9b7b1; }
.info-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.info-tags span { background: var(--sub); color: #fff; font-size: 12px; padding: 9px 12px; font-family: var(--mincho); }
.info-map { display: flex; flex-direction: column; gap: 8px; }
.info-map iframe { width: 100%; aspect-ratio: 4/3; border: 0; display: block; background: #d6d4ce; }
.info-map a { align-self: flex-end; font-size: 12px; color: var(--sub); text-decoration: underline; }
.info-note { text-align: center; font-family: var(--mincho); font-size: 14px; line-height: 2.2; }
.info-team { width: 72%; margin: 0 auto; aspect-ratio: 3/2; }

/* キャンペーン */
.campaign { background: var(--cream); padding: 28px 0 0; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.campaign .ribbon { background: #555250; color: #fff; font-family: var(--mincho); font-size: 12px; letter-spacing: .12em; padding: 7px 28px; clip-path: polygon(18px 0, calc(100% - 18px) 0, 100% 50%, calc(100% - 18px) 100%, 18px 100%, 0 50%); }
.campaign h2 { text-align: center; font-family: var(--mincho); font-size: 19px; line-height: 1.5; letter-spacing: .1em; font-weight: 700; }
.gift { width: calc(100% - 48px); padding: 18px 16px; background: radial-gradient(ellipse at 70% 20%, #7a6a42 0%, #4e463a 55%, #3d3832 100%); color: #fff; text-align: center; font-family: var(--mincho); font-weight: 700; text-shadow: 0 2px 8px rgba(0,0,0,.3); }
.gift .amount { line-height: 1.3; font-size: 17px; }
.gift .amount b { font-family: var(--serif-en); font-size: 36px; font-weight: 500; color: #f3e3b0; }
.gift .what { font-size: 18px; letter-spacing: .1em; margin-top: 2px; }
.gift .only { font-size: 11px; font-weight: 400; letter-spacing: .08em; margin-top: 6px; opacity: .9; }
.terms { width: calc(100% - 48px); background: var(--sand); padding: 14px; font-size: 11px; line-height: 1.75; }
.terms b { display: block; }
.terms ul { list-style: none; margin: 2px 0 0; padding: 0; }
.terms li::before { content: "・"; }
.terms small { display: block; margin-top: 8px; font-size: 10px; color: var(--sub); }

/* 予約フォーム */
.reserve { padding: 48px 24px 64px; background: var(--paper); display: flex; flex-direction: column; gap: 24px; scroll-margin-top: 52px; }
.reserve-head { text-align: center; display: flex; flex-direction: column; }
.reserve-head .script { font-family: var(--script); font-size: 58px; color: #c9c6c0; line-height: 1; }
.reserve-head h2 { font-family: var(--mincho); font-size: 22px; letter-spacing: .2em; font-weight: 600; margin-top: -14px; }
.reserve-head p { font-size: 12px; color: #666; margin-top: 12px; line-height: 1.8; }
.form-box, .done-box { background: #fff; padding: 24px 18px; display: flex; flex-direction: column; gap: 22px; }
.step { display: flex; flex-direction: column; gap: 12px; }
.step-title { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; }
.step-title i { width: 22px; height: 22px; border-radius: 50%; background: var(--sub); color: #fff; font-size: 11px; font-style: normal; display: flex; align-items: center; justify-content: center; }
.step-title small { font-weight: 400; color: var(--muted); font-size: 12px; }
.cal-nav { display: flex; align-items: center; justify-content: space-between; }
.cal-nav button { width: 44px; height: 44px; border: none; background: none; font-size: 20px; color: var(--sub); cursor: pointer; }
.cal-nav button:disabled { color: #ddd; cursor: default; }
.cal-nav strong { font-family: var(--mincho); font-size: 17px; font-weight: 600; letter-spacing: .1em; }
.cal-dow, .cal-days { display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 4px; }
.cal-dow { font-size: 11px; text-align: center; color: #888; }
.cal-dow :first-child { color: var(--red); }
.cal-dow :last-child { color: var(--blue); }
.cal-days button { height: 44px; border: none; border-radius: 6px; font-size: 14px; background: var(--paper); color: var(--ink); cursor: pointer; }
.cal-days button.sun { color: var(--red); }
.cal-days button.sat { color: var(--blue); }
.cal-days button:disabled { background: transparent; color: #c9c6c0; cursor: default; }
.cal-days button.blank { visibility: hidden; }
.cal-days button.sel, .times button.sel { background: var(--green); color: #fff; border-color: var(--green); }
.cal-status { font-size: 11px; color: #888; text-align: center; min-height: 1em; }
.times { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
.times button { height: 44px; border-radius: 6px; font-size: 14px; border: 1px solid #ccc; background: #fff; color: var(--ink); cursor: pointer; }
.times button:disabled { border-color: #e5e3df; color: #c9c6c0; cursor: default; }
.field { display: flex; flex-direction: column; gap: 6px; font-size: 12px; }
.field em { color: var(--red); font-size: 10px; font-style: normal; margin-top: -4px; }
.field input, .field textarea { border: 1px solid #ccc; border-radius: 6px; padding: 0 12px; font-size: 16px; font-family: inherit; }
.field input { height: 46px; }
.field textarea { padding: 10px 12px; resize: vertical; }
.field input[aria-invalid="true"] { border-color: var(--red); }
.field .err { color: var(--red); font-size: 11px; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.submit-area { display: flex; flex-direction: column; gap: 8px; align-items: center; }
.submit-btn { width: 100%; height: 56px; border: none; border-radius: 28px; background: #c9c6c0; color: #fff; font-weight: 700; font-size: 15px; letter-spacing: .08em; cursor: default; }
.submit-btn.ready { background: var(--green); cursor: pointer; }
.hint { font-size: 11px; color: #888; text-align: center; line-height: 1.6; }
.hint.error { color: var(--red); }
.done-box { padding: 40px 20px; gap: 14px; align-items: center; text-align: center; }
.done-box .check { width: 56px; height: 56px; border-radius: 50%; background: var(--green); color: #fff; font-size: 26px; display: flex; align-items: center; justify-content: center; }
.done-box h3 { font-family: var(--mincho); font-size: 19px; font-weight: 600; letter-spacing: .1em; }
.done-box .summary { font-size: 14px; font-weight: 700; }
.done-box p { font-size: 12px; color: #666; line-height: 1.9; }
.done-box button { margin-top: 6px; height: 44px; padding: 0 20px; border: 1px solid var(--stone); border-radius: 22px; background: #fff; color: var(--sub); font-size: 13px; cursor: pointer; }
