@charset "UTF-8";

/*
*  予約関連ページ
*----------------------------*/
/* 予約関連ページ共通
============================================================ */
/* 予約カレンダー
============================================================ */
.reservationCalendar {
  width: 100%;
  max-width: none;
  margin: 0;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  box-sizing: border-box;
}
.reservationCalendar .calendar-nav-warp,
.reservationCalendar .sect-calendar,
.reservationCalendar .reservationCalendar-legends {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}
.reservationCalendar .calendar-nav-warp {
  text-align: center;
}
.reservationCalendar .calendar-month-link-wrap {
  margin-bottom: 1rem;
}
.reservationCalendar .calendar-nav {
  display: inline-flex;
  align-items: center;
  gap: 1.25rem;
}
.reservationCalendar .calendar-nav .prev-month a,
.reservationCalendar .calendar-nav .next-month a {
  display: inline-block;
  padding: 0.45rem 0.9rem;
  border: 1px solid #d95347;
  border-radius: 9999px;
  background-color: #fff5f4;
  color: #b9463c;
  text-decoration: none;
  line-height: 1.2;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.reservationCalendar .calendar-nav .prev-month a:hover,
.reservationCalendar .calendar-nav .next-month a:hover,
.reservationCalendar .calendar-nav .prev-month a:focus,
.reservationCalendar .calendar-nav .next-month a:focus {
  background-color: #d95347;
  border-color: #c94b40;
  color: #fff;
}
.reservationCalendar .calendar-nav .now-month {
  display: inline-block;
  padding: 0.45rem 1.4rem;
  border: 1px solid #d95347;
  border-radius: 9999px;
  background-color: #d95347;
  color: #fff;
  font-weight: 700;
  line-height: 1.2;
  margin-left: 0.8rem;
  margin-right: 0.8rem;
}
@media (max-width: 767px) {
  .reservationCalendar .calendar-nav {
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.6rem;
  }
}

.reservationCalendar .reservationBtn {
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  width: 80%;
  font-size: 1.5rem;
  font-weight: 400;
  min-height: 2em;
  border: none;
  border-radius: 0.25em;
  cursor: pointer;
  flex-direction: column;
  padding: 5px;
}
.reservationCalendar .reservationBtn.isOK {
  color: #fff;
  background-color: #00a99d;
}
.reservationCalendar .reservationBtn.isFew {
  color: #fff;
  background-color: #808080;
}
.reservationCalendar .reservationBtn.isNothing {
  color: #fff;
  background-color: #808080;
  font-weight: 500;
  cursor: auto;
  pointer-events: none;
}

.reservationCalendar .reservationBtn.isOK span.isOKTitle {
  padding-top: 5px;
  padding-bottom: 5px;
}
.reservationCalendar .reservationBtn.isOK span.isOKNotice {
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 14px;
}
.reservationCalendar .reservationBtn.isFew span.isFewTitle {
  padding-top: 5px;
  padding-bottom: 5px;
}
.reservationCalendar .reservationBtn.isFew span.isFewNotice {
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 14px;
}
.reservationCalendar .reservationBtn.isNothing span.isNothingNotice {
  font-size: 12px;
}

.reservationCalendar .sect-calendar {
  width: 100%;
}
.reservationCalendar .sect-calendar .one-calendar .week-wrap {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}
.reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-head {
  border: 1px solid #d9d9d9;
  text-align: center;
  font-weight: 700;
  padding: 0.4rem 0.2rem;
}
.reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day {
  border: 1px solid #d9d9d9;
  min-height: 10rem;
  display: flex;
  flex-direction: column;
}
.reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day .cal-day-head {
  padding: 0.25rem 0.4rem 0;
}
.reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day.sunday .cal-day-head,
.reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day.holiday .cal-day-head {
  color: #d34841;
}
.reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day.saturday .cal-day-head {
  color: #1f5fbf;
}
.reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day.holiday.saturday .cal-day-head {
  color: #d34841;
}
@media (min-width: 768px) {
  .reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day {
    min-height: 8rem;
  }
  .reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day .cal-day-head {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 0.35rem 0.4rem;
    margin: 0 0.25rem;
  }
  .reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day .cal-day-head .wday {
    display: none;
  }
  .reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day .cal-day-body {
    justify-content: flex-start;
  }
}
.reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day .cal-day-body {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-content: flex-end;
  margin-top: 0;
  margin-bottom: 0;
}
@media (max-width: 767px) {
  .reservationCalendar {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
  .reservationCalendar .sect-calendar .one-calendar .week-wrap {
    display: block;
  }
  .reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-head {
    display: none;
  }
  .reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day {
    min-height: auto;
    margin-bottom: 0.5rem;
    padding: 0.5rem;
  }
  .reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day.blank {
    display: none;
  }
  .reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day .cal-day-head {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0 0 0.4rem;
  }
  .reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day .cal-day-body {
    justify-content: flex-start;
    align-items: center;
    align-content: flex-start;
  }
  .reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day .cal-day-body .reservationBtn {
    width: 92%;
    max-width: 22rem;
    margin-left: auto;
    margin-right: auto;
  }
  .reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day .cal-day-body {
    margin-top: 0;
    margin-bottom: 0;
  }
}
@media only screen and (max-width: 767px) {
  .reservationCalendar .sect-calendar {
    overflow-x: visible;
  }
  .reservationCalendar .sect-calendar .one-calendar {
    min-width: 0;
  }
}
@media only screen and (max-width: 599px) {
  .reservationCalendar .sect-calendar .one-calendar .week-wrap .cal-day .cal-day-body .reservationBtn {
    height: auto;
    flex-direction: column;
  }
}
.reservationCalendar .reservationCalendar-legends {
  border-radius: 0.25rem;
  width: 100%;
  margin: 1rem 0 0;
}
.reservationCalendar .reservationCalendar-legends .legends-hl {
  color: var(--color_font);
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.5em;
  letter-spacing: 0.01em;
  border-bottom: 1px solid var(--color_main);
  padding: 0 0.25em 0.4em;
}
.reservationCalendar .reservationCalendar-legends .legends-table {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 2rem;
  margin: 1.5rem 0 0;
  justify-content: end;
}
@media only screen and (max-width: 767px) {
  .reservationCalendar .reservationCalendar-legends .legends-table {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.reservationCalendar .reservationCalendar-legends .legends-table .legends-table-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0 1rem;
}
.reservationCalendar .reservationCalendar-legends .legends-table .legends-table-row > dt {
  width: 3rem;
}
.reservationCalendar .reservationCalendar-legends .legends-table .legends-table-row > dt > .reservationBtn {
  font-size: 1rem;
  width: 100%;
  min-height: 2rem;
  cursor: auto;
}
.reservationCalendar .reservationCalendar-legends .legends-table .legends-table-row > dt > .reservationBtn.isNothing {
  color: #fff;
  background-color: #808080;
}
.reservationCalendar .reservationCalendar-legends .legends-table .legends-table-row > dt > .reservationBtn:hover {
  opacity: 1 !important;
}
.reservationCalendar .reservationCalendar-legends .legends-table .legends-table-row > dd {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-line-pack: center;
      align-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  font-size: 1rem;
  text-align: justify;
}
.reservationCalendar .calendar-back-link-wrap {
  margin-top: 1.2rem;
  text-align: center;
}
.reservationCalendar .calendar-back-link-wrap .calendar-back-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 14rem;
  padding: 0.8rem 1.4rem;
  border: 1px solid #d95347;
  border-radius: 9999px;
  background-color: #fff5f4;
  color: #b9463c;
  font-weight: 700;
  font-size: 1rem;
  text-decoration: none;
  line-height: 1.2;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.reservationCalendar .calendar-back-link-wrap .calendar-back-link:hover,
.reservationCalendar .calendar-back-link-wrap .calendar-back-link:focus {
  background-color: #d95347;
  border-color: #c94b40;
  color: #fff;
}

/* Reservation Form Table
============================================================ */
.enquete-form-errors-list {
  display: block;
  margin: 0.5rem 0 0;
  padding: 0.7rem 0.9rem;
  border: 1px solid #e8b0ab;
  border-left: 4px solid #d95347;
  border-radius: 0.5rem;
  background-color: #fff3f2;
}
.enquete-form-errors-item {
  display: block;
  color: #c44238;
  font-weight: 700;
  line-height: 1.6;
}
.enquete-form-errors-item + .enquete-form-errors-item {
  margin-top: 0.25rem;
}
.reservationForm .reservation-frame-selection-notes,
.reservationConfirm .reservation-frame-selection-notes,
.reservationForm .reservation-frame-errors,
.reservationConfirm .reservation-frame-errors {
  color: #e34d4d;
  font-weight: 700;
}
.reservationForm .reservation-frame-errors,
.reservationConfirm .reservation-frame-errors {
  margin: 1rem 0 1.2rem;
  padding: 0.75rem 1rem;
  border: 2px solid #d95347;
  border-radius: 0.6rem;
  background-color: #fff1f0;
  line-height: 1.6;
}
.reservationForm .reservation-frame-errors > span,
.reservationConfirm .reservation-frame-errors > span {
  display: block;
}
.reservationForm .reservation-frame-notice,
.reservationConfirm .reservation-frame-notice {
  margin: 0.9rem 0 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid #b9d4f7;
  border-left: 4px solid #3f79c9;
  border-radius: 0.65rem;
  background-color: #f3f8ff;
  color: #2d4f79;
}
.reservationForm .reservation-frame-notice .reservation-frame-notice-title,
.reservationConfirm .reservation-frame-notice .reservation-frame-notice-title {
  margin: 0 0 0.35rem;
  color: #1f5fbf;
  font-weight: 700;
}
.reservationForm .reservation-frame-notice .reservation-frame-notice-detail,
.reservationConfirm .reservation-frame-notice .reservation-frame-notice-detail {
  margin: 0;
  line-height: 1.7;
}
.reservationForm .reservation-frame-notice a,
.reservationConfirm .reservation-frame-notice a {
  color: #1f5fbf;
}
.reservationForm .agreement-section {
  max-width: 52rem;
  margin: 1.2rem auto;
  padding: 1rem 1.2rem;
  border: 1px solid #e8d6d3;
  border-radius: 1rem;
  background-color: #fffafa;
}
.reservationConfirm .agreement-section {
  max-width: 52rem;
  margin: 1.2rem auto;
  padding: 1rem 1.2rem;
  border: 1px solid #e8d6d3;
  border-radius: 1rem;
  background-color: #fffafa;
}
.reservationForm .agreement-section .section-title,
.reservationConfirm .agreement-section .section-title {
  text-align: center;
  font-weight: 700;
  margin-bottom: 0.9rem;
}
.reservationForm .agreement-section .checkbox-group input[type="checkbox"],
.reservationConfirm .agreement-section .checkbox-group input[type="checkbox"] {
  transform: scale(1.35);
  -webkit-transform: scale(1.35);
  transform-origin: left top;
}
.reservationForm .form-multi-fields-block,
.reservationConfirm .form-multi-fields-block {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}
.reservationForm .form-checkbox-fields,
.reservationConfirm .form-checkbox-fields {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}
.reservationForm .form-checkbox-fields > label,
.reservationConfirm .form-checkbox-fields > label {
  display: inline-flex;
  align-items: flex-start;
  gap: 0.6rem;
  line-height: 1.6;
  cursor: pointer;
}
.reservationForm .form-checkbox-fields input[type="checkbox"],
.reservationConfirm .form-checkbox-fields input[type="checkbox"] {
  flex: 0 0 auto;
  margin-top: 0.15rem;
  transform: scale(1.3);
  -webkit-transform: scale(1.3);
  transform-origin: left top;
}
.reservationForm .form-checkbox-fields .multi-input-item-label,
.reservationConfirm .form-checkbox-fields .multi-input-item-label {
  display: inline-block;
}
.reservationForm .reservation-calendar-back-btn,
.reservationConfirm .reservation-calendar-back-btn {
  margin: 1rem 0 1.4rem;
  text-align: center;
}
.reservationForm .reservation-calendar-back-btn > a,
.reservationConfirm .reservation-calendar-back-btn > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 14rem;
  padding: 0.7rem 1.3rem;
  border: 1px solid #d95347;
  border-radius: 9999px;
  background-color: #fff5f4;
  color: #b9463c;
  font-weight: 700;
  text-decoration: none;
  line-height: 1.2;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.reservationForm .reservation-calendar-back-btn > a:hover,
.reservationForm .reservation-calendar-back-btn > a:focus,
.reservationConfirm .reservation-calendar-back-btn > a:hover,
.reservationConfirm .reservation-calendar-back-btn > a:focus {
  background-color: #d95347;
  border-color: #c94b40;
  color: #fff;
}
.reservationForm .tbl-form-button-block .btn.btn-primary.submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 14rem;
  height: auto;
  padding: 0.7rem 1.3rem;
  margin-right: 0;
  border: 1px solid #d95347;
  border-radius: 9999px;
  background-color: #fff5f4;
  color: #b9463c;
  font-weight: 700;
  line-height: 1.2;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.reservationConfirm .tbl-form-button-block .btn.btn-primary.submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 14rem;
  height: auto;
  padding: 0.7rem 1.3rem;
  margin-right: 0;
  border: 1px solid #d95347;
  border-radius: 9999px;
  background-color: #fff5f4;
  color: #b9463c;
  font-weight: 700;
  line-height: 1.2;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.reservationForm .tbl-form-button-block .btn.btn-primary.submit span {
  color: inherit;
}
.reservationConfirm .tbl-form-button-block .btn.btn-primary.submit span {
  color: inherit;
}
.reservationForm .tbl-form-button-block .btn.btn-primary.submit:hover,
.reservationForm .tbl-form-button-block .btn.btn-primary.submit:focus {
  background-color: #d95347;
  border-color: #c94b40;
  color: #fff;
}
.reservationConfirm .tbl-form-button-block .btn.btn-primary.submit:hover,
.reservationConfirm .tbl-form-button-block .btn.btn-primary.submit:focus {
  background-color: #d95347;
  border-color: #c94b40;
  color: #fff;
}
.reservationForm .tbl-form-button-block .btn.btn-primary.submit:disabled {
  background-color: #f6e7e5;
  border-color: #ead3d0;
  color: #c4a5a1;
  cursor: not-allowed;
  opacity: 1;
}
.reservationConfirm .tbl-form-button-block .btn.btn-primary.submit:disabled {
  background-color: #f6e7e5;
  border-color: #ead3d0;
  color: #c4a5a1;
  cursor: not-allowed;
  opacity: 1;
}
.reservationForm .sect-form-body,
.reservationConfirm .sect-form-body {
  width: 100%;
  margin: 0.8rem 0 1.2rem;
  border-collapse: collapse;
  border: 1px solid #d5cfc9;
  background-color: #fff;
}
.reservationForm .sect-form-body th,
.reservationForm .sect-form-body td,
.reservationConfirm .sect-form-body th,
.reservationConfirm .sect-form-body td {
  border: 1px solid #d5cfc9;
  padding: 0.55rem 0.7rem;
}
.reservationForm .reservation-summary th,
.reservationConfirm .reservation-summary th {
  width: 14rem;
  background-color: #f7f3f0;
  text-align: center;
  font-weight: 700;
}
.reservationForm .reservation-summary td,
.reservationConfirm .reservation-summary td {
  text-align: left;
}
.reservationForm .reservationTimeZone th,
.reservationConfirm .reservationTimeZone th,
.reservationForm .reservationTimeZone td,
.reservationConfirm .reservationTimeZone td {
  text-align: center;
  vertical-align: middle;
  min-width: 4.2rem;
}
.reservationForm .reservationTimeZone > thead > tr > th:first-child,
.reservationForm .reservationTimeZone > tbody > tr > th,
.reservationConfirm .reservationTimeZone > thead > tr > th:first-child,
.reservationConfirm .reservationTimeZone > tbody > tr > th {
  background-color: #f7f3f0;
  white-space: nowrap;
  font-weight: 700;
}
.reservationForm .reservationTimeZone .wday_sunday,
.reservationForm .reservationTimeZone .wday_holiday,
.reservationConfirm .reservationTimeZone .wday_sunday,
.reservationConfirm .reservationTimeZone .wday_holiday {
  background-color: #fff3f2;
  color: #d34841;
}
.reservationForm .reservationTimeZone .wday_saturday,
.reservationConfirm .reservationTimeZone .wday_saturday {
  background-color: #eef5ff;
  color: #1f5fbf;
}
.reservationForm .reservationTimeZone td.preparation_day_before,
.reservationConfirm .reservationTimeZone td.preparation_day_before {
  background-color: #efefef;
  color: #595959;
}
.reservationForm .reservationTimeZone td.reserve_day,
.reservationConfirm .reservationTimeZone td.reserve_day {
  background-color: #fff0df;
  color: #a85b15;
}
.reservationForm .reservationTimeZone td.input_error {
  box-shadow: inset 0 0 0 2px #d34841;
}
.reservationForm .reservationTimeZone .reserve_check,
.reservationConfirm .reservationTimeZone .reserve_check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.9em;
  min-height: 1.9em;
  border-radius: 999px;
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1;
  color: #d95347;
  background-color: #fff3f2;
}
.reservationForm .reservationTimeZone input[type="checkbox"],
.reservationForm .reservationTimeZone input[type="radio"],
.reservationConfirm .reservationTimeZone input[type="checkbox"],
.reservationConfirm .reservationTimeZone input[type="radio"] {
  transform: scale(1.35);
  -webkit-transform: scale(1.35);
}
.reservationForm .reservationTimeZone input[type="radio"],
.reservationConfirm .reservationTimeZone input[type="radio"] {
  margin-right: 0.55rem;
  margin-left: 0.35rem;
}
.reservationForm .reservationTimeZone td label,
.reservationConfirm .reservationTimeZone td label {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin: 0;
}
.reservationForm .reservation-option-check-list,
.reservationConfirm .reservation-option-check-list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.7rem;
}
.reservationForm .reservation-option-check-item,
.reservationConfirm .reservation-option-check-item {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0;
}
.reservationConfirm .sect-form-body.com-table1 th,
.reservationConfirm .sect-form-body.com-table1 td {
  vertical-align: middle;
}
.reservationConfirm .sect-form-body.com-table1 th {
  width: 20rem;
}
.reservationForm .sect-form-body.com-table1 th {
  width: 18rem;
  background-color: #f7f3f0;
  text-align: center;
  vertical-align: middle;
  font-weight: 700;
}
.reservationForm .sect-form-body.com-table1 td {
  text-align: left;
  vertical-align: middle;
}
.reservationForm .sect-form-body.com-table1 input[type="text"],
.reservationForm .sect-form-body.com-table1 input[type="number"],
.reservationForm .sect-form-body.com-table1 input[type="tel"],
.reservationForm .sect-form-body.com-table1 input[type="email"] {
  border: 1px solid #b9b2ab;
  border-radius: 0.45rem;
  padding: 0.55rem 0.75rem;
}
.reservationForm .sect-form-body.com-table1 textarea {
  width: 100%;
  min-height: 10rem;
  max-height: 10rem;
  border: 1px solid #b9b2ab;
  border-radius: 0.45rem;
  padding: 0.55rem 0.75rem;
  resize: none;
}
.reservationForm .sect-form-body.com-table1 input[type="radio"] {
  transform: scale(1.35);
  -webkit-transform: scale(1.35);
  margin-right: 0.7rem;
}
.reservationForm .sect-form-body.com-table1 td label {
  margin-right: 1rem;
}
@media (max-width: 767px) {
  .reservationForm .reservation-summary,
  .reservationConfirm .reservation-summary,
  .reservationForm .reservation-timezone-scroll,
  .reservationConfirm .reservation-timezone-scroll {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .reservationForm .reservation-timezone-scroll,
  .reservationConfirm .reservation-timezone-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x;
    padding-bottom: 0.2rem;
  }
  .reservationForm .reservation-timezone-scroll .reservationTimeZone,
  .reservationConfirm .reservation-timezone-scroll .reservationTimeZone {
    min-width: 44rem;
    margin-bottom: 0;
  }
  .reservationForm .sect-form-body,
  .reservationConfirm .sect-form-body {
    font-size: 0.92rem;
  }
  .reservationForm .sect-form-body.com-table1 tr {
    display: block;
  }
  .reservationForm .sect-form-body.com-table1 th,
  .reservationForm .sect-form-body.com-table1 td {
    display: list-item;
    list-style: none;
    width: 100%;
  }
  .reservationForm .reservation-summary th,
  .reservationConfirm .reservation-summary th {
    width: 9rem;
  }
  .reservationForm .agreement-section {
    margin: 1rem auto;
    padding: 0.9rem 0.8rem;
    border-radius: 0.85rem;
  }
  .reservationConfirm .agreement-section {
    margin: 1rem auto;
    padding: 0.9rem 0.8rem;
    border-radius: 0.85rem;
  }
  .reservationForm .reservationTimeZone th,
  .reservationConfirm .reservationTimeZone th,
  .reservationForm .reservationTimeZone td,
  .reservationConfirm .reservationTimeZone td {
    min-width: 3.5rem;
    padding: 0.5rem 0.5rem;
  }
  .reservationForm .reservation-timezone-scroll .reservationTimeZone > thead > tr > th:first-child,
  .reservationConfirm .reservation-timezone-scroll .reservationTimeZone > thead > tr > th:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    background-color: #f7f3f0;
    box-shadow: 1px 0 0 #d5cfc9;
  }
  .reservationForm .reservation-timezone-scroll .reservationTimeZone > tbody > tr > th,
  .reservationConfirm .reservation-timezone-scroll .reservationTimeZone > tbody > tr > th {
    position: sticky;
    left: 0;
    z-index: 1;
    background-color: #f7f3f0;
    box-shadow: 1px 0 0 #d5cfc9;
  }
}

/* 予約フォーム Confirm
============================================================ */
.reservationConfirm .reservationTimeZone.is-check > tbody > tr > td input[type=checkbox],
.reservationConfirm .reservationTimeZone.is-check > tbody > tr > td input[type=checkbox] + label {
  display: none;
  pointer-events: none;
}
.reservationConfirm .reservationTimeZone .selectedState {
  position: relative;
  display: block;
  font-weight: 700;
  line-height: 1.5em;
  padding: 0 0 0 2em;
}
.reservationConfirm .reservationTimeZone .selectedState.isSelected::before {
  content: "";
  position: absolute;
  display: block;
  width: 1.2em;
  height: 1.2em;
  top: calc(50% + 0.06em);
  left: 0;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  border-radius: 50%;
  background-color: var(--color_accent);
}
.reservationConfirm .reservationTimeZone .selectedState.isSelected::after {
  content: "";
  position: absolute;
  display: block;
  width: 0.5em;
  height: 0.7em;
  border: 2px solid #fff;
  border-top: none;
  border-left: none;
  top: calc(50% - 0.05em);
  left: 0.35em;
  -webkit-transform: translate(0, -50%) rotate(46deg);
          transform: translate(0, -50%) rotate(46deg);
}
@media only screen and (max-width: 1024px) {
  .reservationConfirm .reservationTimeZone .selectedState.isSelected::after {
    left: 0.3em;
  }
}
.reservationConfirm .reservationTimeZone .selectedState.isNotSelected::before {
  content: "";
  position: absolute;
  display: block;
  width: 0.8em;
  height: 2px;
  top: 50%;
  left: 0.2em;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  background-color: #999;
}