:root{font-family:"Noto Sans JP","Yu Gothic",Meiryo,sans-serif;color:#0d3379;background:#edf8ff;font-weight:600}
*{box-sizing:border-box}body{margin:0}.reservation{max-width:540px;margin:auto;padding:0 16px 24px}.brand{padding:20px 0 16px}.brand img{width:175px;height:auto}.back-link{color:#0d3379;font-size:14px;text-underline-offset:3px}.preview-notice{background:#fff5da;color:#564a2d;padding:12px;border-radius:10px;font-size:13px;line-height:1.6}.progress{list-style:none;padding:0;display:flex;justify-content:space-between;gap:8px;margin:24px 0;color:#59636f;font-size:14px}.progress li{flex:1;text-align:center;padding-bottom:8px;border-bottom:3px solid #d3dfeb}.progress [aria-current]{color:#0b76e8;border-color:#0b76e8;font-weight:800}h1{font-size:26px;line-height:1.4;margin:0 0 12px;text-align:center}h2{font-size:18px;margin:0 0 16px}.lead{color:#465366;font-size:14px;line-height:1.7;text-align:center;margin:0 0 20px}.card{background:#fff;border:1px solid #d8e9f7;border-radius:16px;padding:20px 16px;margin:0 0 16px;box-shadow:0 4px 14px #1359930a}label,legend{font-size:14px;font-weight:700}label{display:block;margin-bottom:7px}input,select,textarea{font:inherit;font-size:16px;color:#173366;width:100%;min-width:0;max-width:100%;border:1px solid #97adc3;border-radius:8px;background:white;padding:11px 10px;min-height:46px;margin-bottom:18px}textarea{resize:vertical}fieldset{border:0;padding:0;margin:0 0 16px;min-width:0}legend{padding:0;margin:0 0 10px}.date-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}.date-row label{font-size:13px;color:#465366}.date-row input,.date-row select{margin-bottom:0;font-size:14px}.required,.optional{font-size:12px;font-weight:500;margin-left:7px}.required{color:#0b76e8}.optional{color:#59636f}.hint,.notice{font-size:12px;color:#465366;line-height:1.7}.hint{margin:-8px 0 18px}.notice{margin:16px 0}.radios{display:flex;gap:12px}.radios label{display:flex;align-items:center;min-height:44px;gap:8px;margin:0;padding:6px 12px;border:1px solid #b9d3e9;border-radius:8px}.radios input{width:18px;min-height:18px;height:18px;margin:0;accent-color:#0b76e8}.primary,.secondary{display:flex;justify-content:center;align-items:center;gap:10px;width:100%;min-height:50px;font:inherit;font-size:15px;border-radius:12px;padding:12px;text-align:center;text-decoration:none;cursor:pointer;margin:12px 0}.primary{color:white;background:linear-gradient(120deg,#1588f3,#0866db);border:0}.secondary{color:#0d3379;border:1px solid #91bce0;background:white}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #f4ca50;outline-offset:3px}[hidden]{display:none!important}h1:focus{outline:none}dl dt{font-size:13px;color:#465366;margin-bottom:4px}dl dd{margin:0 0 18px;font-size:16px;white-space:pre-wrap;overflow-wrap:anywhere}dl dd:last-child{margin-bottom:0}.complete{text-align:center;line-height:1.8}.complete h1{font-size:24px}.complete p{color:#465366;font-size:14px}.check{font-size:40px!important;color:#0b76e8!important;margin:0 0 8px}hr{border:0;border-top:1px solid #d8e9f7;margin:24px 0}footer{color:#59636f;font-size:11px;text-align:center;margin-top:28px}
.date-row>div{min-width:0}
.choice-list{display:grid;gap:8px;margin:0 0 14px}.choice-list label{display:flex;align-items:flex-start;gap:9px;margin:0;padding:8px 10px;border:1px solid #d8e9f7;border-radius:8px;font-size:14px;line-height:1.5}.choice-list input{flex:0 0 18px;width:18px;min-height:18px;height:18px;margin:2px 0 0;padding:0;accent-color:#0b76e8}.form-details{margin:10px 0 16px;border:1px solid #d8e9f7;border-radius:8px;background:#f7fbff}.form-details summary{padding:10px 12px;color:#0d3379;font-size:14px;font-weight:700;cursor:pointer}.form-details>div{padding:0 12px 12px;color:#465366;font-size:13px;line-height:1.7}.form-details a{color:#075ebc;text-underline-offset:3px}
@media(max-width:480px){.date-row{grid-template-columns:minmax(0,1fr);gap:10px}.date-row input[type=date]{box-sizing:border-box;width:100%;padding-left:0;padding-right:0}}

.date-input{position:relative;width:100%;min-width:0}.date-input input{display:block;text-align:left}.date-input input::-webkit-date-and-time-value{text-align:left}.date-input__placeholder{display:none;position:absolute;left:11px;top:50%;transform:translateY(-50%);font-size:14px;color:#173366;pointer-events:none}.date-input.is-empty:not(:focus-within) .date-input__placeholder{display:block}.date-input.is-empty:not(:focus-within) input{color:transparent}.date-input.is-empty:not(:focus-within) input::-webkit-datetime-edit{opacity:0}

@media(max-width:480px){.date-input input::-webkit-date-and-time-value{padding:0 10px}.date-input input::-webkit-datetime-edit{padding:0 10px}}

.date-input__trigger{display:block;width:100%;min-width:0;max-width:100%;min-height:46px;margin:0;padding:11px 10px;border:1px solid #97adc3;border-radius:8px;background:#fff;color:#173366;font:inherit;font-size:14px;text-align:left;cursor:pointer;touch-action:manipulation}
.date-input__trigger[aria-invalid="true"]{border-color:#b42318}
.date-input__error{margin:6px 0 0;font-size:12px;line-height:1.6;color:#b42318}
.date-input__error:empty{display:none}
.date-calendar{width:calc(100% - 32px);max-width:360px;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);margin:auto;padding:18px 14px;border:1px solid #b9d3e9;border-radius:16px;background:#fff;color:#173366;box-shadow:0 12px 40px #0d337933;overflow:auto;overscroll-behavior:contain}
.date-calendar::backdrop{background:#10294d66}
.date-calendar h2{margin:0;font-size:18px;line-height:1.5;text-align:left}
.date-calendar__hint{margin:6px 0 14px;font-size:12px;line-height:1.6;color:#465366}
.date-calendar__navigation{display:grid;grid-template-columns:40px minmax(0,1fr) 40px;align-items:center;gap:8px}
.date-calendar__navigation p{margin:0;text-align:center;font-size:16px;font-weight:700}
.date-calendar button{font:inherit;touch-action:manipulation;cursor:pointer}
.date-calendar__navigation button{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;line-height:1;border:1px solid #b9d3e9;border-radius:8px;background:#f3f9ff;color:#0d3379;font-size:25px}
.date-calendar table{width:100%;table-layout:fixed;border-spacing:3px;margin:8px 0 12px}
.date-calendar th{height:30px;padding:0;color:#465366;font-size:12px;text-align:center;font-weight:600}
.date-calendar td{padding:0;text-align:center}
.date-calendar__day{display:block;width:100%;min-height:36px;padding:6px 0;border:1px solid transparent;border-radius:7px;background:#f3f9ff;color:#173366;font-size:14px}
.date-calendar__day[aria-current="date"]{border-color:#0b76e8}
.date-calendar__day[aria-pressed="true"]{background:#0b76e8;color:#fff}
.date-calendar button:disabled{color:#a0a8b3;background:#f0f2f5;border-color:transparent;cursor:default}
.date-calendar__actions{display:flex;justify-content:space-between;gap:12px}
.date-calendar__actions button{min-height:44px;padding:8px 14px;border:1px solid #91bce0;border-radius:8px;background:#fff;color:#0d3379;font-size:14px}
@media(hover:hover){.date-calendar__day:not(:disabled):hover{background:#dceeff;color:#173366}}

.date-calendar__navigation svg{display:block;flex:none;width:20px;height:20px;pointer-events:none}
.form-details h3{margin:12px 0 5px;color:#173366;font-size:14px}.form-details ul{margin:4px 0 10px;padding-left:1.4em}.form-details p{margin:6px 0}
.reservation-initial-fee-notice{display:grid;gap:3px;margin:8px 0;padding:8px 10px;border:0;border-radius:12px;background:rgba(221,244,255,.72);color:#173366;line-height:1.45;text-align:left}.reservation-initial-fee-notice .reservation-initial-fee-label{color:#0d3379;font-size:14px;font-weight:700}.reservation-initial-fee-notice .reservation-initial-fee-main{color:#0d3379;font-size:15px;font-weight:800}.reservation-initial-fee-notice .reservation-initial-fee-detail{font-size:14px;font-weight:500}.reservation-initial-fee-notice a{color:#0a439f;font-weight:700;text-decoration:underline;text-underline-offset:2px}

/* 本人確認書類の詳細をメールフォームと同じ開閉ボタンに統一 */
.identity-faq-fold{margin:10px 0 16px;border:2px solid #1685f8;border-radius:12px;background:#fff;overflow:hidden}.identity-faq-fold .section8__mailform-btn{min-height:54px;display:flex;align-items:center;gap:9px;width:100%;margin:0;padding:14px 16px;border:0;border-radius:0;background:#fff;color:#083c7c;font-size:14.5px;font-weight:700;text-align:left;box-sizing:border-box}.identity-faq-fold .mf-ic{width:20px;height:20px;flex:0 0 20px;color:#1685f8}.identity-faq-fold .mf-name{flex:1;text-align:left}.identity-faq-fold .mf-side{flex-shrink:0;color:#1685f8;font-size:13px;font-weight:700;white-space:nowrap}.identity-faq-fold[open] .t-o{display:none}.identity-faq-fold:not([open]) .t-c{display:none}.identity-faq__body{padding:0 14px 14px;border-top:1px dashed #e8e3da;color:#465366;font-size:13px;line-height:1.7}.identity-faq__body h3{margin:12px 0 5px;color:#173366;font-size:14px}.identity-faq__body ul{margin:4px 0 10px;padding-left:1.4em}.identity-faq__body p{margin:6px 0}
/* 本人確認書類の選択に応じた入力欄 */
.choice-list .identity-conditional{padding:0 10px 8px;margin-top:-4px}.choice-list .identity-conditional>label{display:block;margin:0 0 5px;padding:0;border:0;border-radius:0;background:transparent;color:#0d3379;font-size:14px;line-height:1.5;font-weight:700;cursor:default}.choice-list .identity-conditional input[type="text"],.choice-list .identity-conditional textarea{display:block;width:100%;min-height:44px;margin:0;padding:10px;border:1px solid #97adc3;border-radius:8px;background:#fff;color:#173366;font:inherit;font-size:15px;box-sizing:border-box}.choice-list .identity-conditional textarea{min-height:80px;resize:vertical}
/* 本人確認書類の開閉表示をメールフォームと同じ山形矢印に統一 */
.identity-faq-fold > summary .mf-side :is(.t-o,.t-c)::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
}
.identity-faq-fold > summary .mf-side .t-c::before {
  transform: translateY(2px) rotate(225deg);
}
.identity-faq-fold:not([open]) > summary .mf-side .t-o,
.identity-faq-fold[open] > summary .mf-side .t-c { display: inline; }
.identity-faq-fold[open] > summary .mf-side .t-o,
.identity-faq-fold:not([open]) > summary .mf-side .t-c { display: none; }

/* 選択した銀行口座の選択肢の直下に表示する銀行名欄 */
#bank-name-field { padding: 0 10px 8px; }
#bank-name-field[hidden] { display: none; }
#bank-name-field > label { display: block; margin: 0 0 5px; padding: 0; border: 0; border-radius: 0; background: transparent; color: #0d3379; font-size: 14px; line-height: 1.5; font-weight: 700; cursor: default; }
#bank-name-field input[type="text"] { display: block; width: 100%; max-width: 100%; min-width: 0; height: auto; min-height: 44px; margin: 0; padding: 10px; border: 1px solid #97adc3; border-radius: 8px; background: #fff; color: #173366; font: inherit; font-size: 16px; box-sizing: border-box; }
#bank-name-field > p { margin: 8px 0 0; }
#bank-name-field input[type="text"]::placeholder { font-size: 14px; }
#honnin-other-name::placeholder { font-size: 14px; }
#honnin-consultation::placeholder { font-size: 14px; }
#message::placeholder { font-size: 14px; }
/* 口座登録をしない場合の手数料注記。文字色・サイズは既存注記を使用 */
#bank-fee-note { margin: 0 10px 8px; font-weight: 400; }
#bank-fee-note strong { font-weight: 700; }
/* 連絡先入力欄の案内文字を見出しのサイズに統一 */
#customer-name::placeholder,
#phone::placeholder,
#email::placeholder { font-size: 14px; }

/* 両フォームの入力欄の案内文字を統一 */
#reservation-form :is(input,textarea)::placeholder {
  font-size: 14px;
  color: #757575;
  font-weight: 600;
  text-align: left;
  opacity: 1;
}
/* 来店目的のその他入力欄を、ラジオ選択肢とは別の入力欄として表示 */
.choice-list .reservation-conditional { padding: 0 10px 8px; }
.choice-list .reservation-conditional > label { display: block; margin: 0 0 7px; padding: 0; border: 0; border-radius: 0; background: transparent; color: #0d3379; font-size: 14px; line-height: 1.5; font-weight: 700; cursor: default; }
.choice-list .reservation-conditional textarea { min-height: 88px; margin-bottom: 0; }

/* 希望時間についての任意の補足と、予約未確定の案内 */
#reservation-form .reservation-preference-notice{box-sizing:border-box;margin:0 0 14px;padding:0;border:0;border-radius:0;background:transparent;color:#465366;font-size:14px;font-weight:600;line-height:1.8;text-align:left;overflow-wrap:anywhere}
#reservation-form .reservation-time-consultation{margin-top:12px;min-width:0}
#reservation-form .reservation-time-consultation textarea{display:block;box-sizing:border-box;width:100%;min-width:0;max-width:100%;height:44px;min-height:44px;margin:0;padding:10px;border:1px solid #97adc3;border-radius:8px;background:#fff;color:#173366;font:inherit;font-size:16px;line-height:22px;text-align:left;resize:none;overflow:hidden}
#reservation-form .reservation-time-consultation textarea::placeholder{font-size:14px;color:#757575;font-weight:600;text-align:left;opacity:1}

/* 同意なしで送信しようとしたときの案内 */
.privacy-consent-error{margin:8px 0 14px;color:#b42318;font-size:14px;font-weight:600;line-height:1.7;text-align:left}.privacy-consent-error[hidden]{display:none!important}

/* 銀行口座の相談を選んだ場合のみ表示する任意欄 */
#bank-consultation-field{margin-top:12px}#bank-consultation-field[hidden]{display:none!important}
#bank-consultation-field>label{display:block;margin:0 0 5px;padding:0;border:0;background:transparent;color:#0d3379;font-size:14px;font-weight:700;line-height:1.5}
#bank-consultation-field textarea{display:block;box-sizing:border-box;width:100%;min-width:0;max-width:100%;height:44px;min-height:44px;margin:0;padding:10px;border:1px solid #97adc3;border-radius:8px;background:#fff;color:#173366;font:inherit;font-size:16px;line-height:22px;text-align:left;resize:none;overflow:hidden}
#bank-consultation-field textarea::placeholder{font-size:14px;color:#757575;font-weight:600;text-align:left;opacity:1}

/* 土日祝日の希望は通常受付と区別して案内 */
.date-special-note{margin:8px 0 0;color:#805000;background:#fff7e8;padding:9px 10px;border-radius:8px;font-size:12px;font-weight:600;line-height:1.7}.date-special-note[hidden]{display:none!important}
.contact-date-calendar__day.is-special-day:not(:disabled),.date-calendar__day.is-special-day:not(:disabled){background:#fff3df;color:#805000}
.contact-date-calendar__day.is-special-day[aria-pressed="true"],.date-calendar__day.is-special-day[aria-pressed="true"]{background:#0b76e8;color:#fff}

/* 土日祝日の注意は日付・時間の2列にまたがる全幅表示 */
#reservation-form .date-row>.date-special-note{grid-column:1/-1;width:100%;box-sizing:border-box;margin:0}

/* 必須・任意を問い合わせフォームと同じ寸法のバッジで表示 */
#reservation-form :is(.required,.optional){display:inline-block;flex-shrink:0;box-sizing:border-box;margin-left:6px;padding:2px 7px;border-radius:4px;font-size:10px;font-weight:700;line-height:1.4;vertical-align:middle;white-space:nowrap}
#reservation-form .required{background:#e8480e;color:#fff}
#reservation-form .optional{background:#e9ecef;color:#59636f}