/*!**************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/scss/project/reservation.scss ***!
  \**************************************************************************************************************************************************************************************************/
/*
  xl
  82 - 56
  38 - 24
  32 - 23
  28 - 20
  26 - 18
  18 - 14
  14 - 12

  btn
  18 - 18

*/

/* 新デザイン */
:root {
  --color-blue-light: #e8f0fe;
  --color-state__unenterd: var(--color-cleam);
  --color-state__clear: var(--color-blue-light);
  --color-state__checked: var(--color-gray-01);
}
.m-form-area {
  padding: 10px;
}
.js-is-required .m-form-area {
  background-color: var(--color-state__unenterd);
}
.is-error_block .m-form-area,
.is-error_block.js-is-required .m-form-area {
  background-color: var(--color-state__error__light);
}
.is-clear_block .m-form-area,
.is-clear_block.js-is-required .m-form-area {
  background-color: var(--color-state__clear);
}
.js-is-required .m-form-area .m-form-checkbox[aria-invalid=true] + label,
.m-form-checkbox.is-error + label {
  background-color: #fff;
  border-color: var(--color-border__gray__light);
}
.js-is-required .m-form-area #reservationConsent[aria-invalid=true] + label,
#reservationConsent.is-error + label {
  background-color: transparent;
  border-color: transparent;
}
.js-is-required .m-form-area .m-form-checkbox[aria-invalid=true] + label:before,
.m-form-checkbox.is-error + label:before {
  border-color: var(--color-border__gray__light);
}
.js-is-required .m-form-area .is-error .m-form-textarea,
.js-is-required .m-form-area .m-form-textarea.is-error {
  background-color: #fff;
  border-color: var(--color-border__gray__light);
}
.js-is-required .m-form-area .m-form-checkbox.is-error[aria-invalid=false]:checked + label,
.js-is-required .m-form-area .m-form-checkbox:checked + label {
  background-color: var(--color-gray-01);
}
.js-is-required .m-form-area #reservationConsent.is-error[aria-invalid=false]:checked + label,
.js-is-required .m-form-area #reservationConsent:checked + label {
  background-color: transparent;
}
.js-is-required .m-form-area .m-form-input.valid,
.js-is-required .m-form-area .valid .m-form-textarea,
.js-is-required .m-form-area .m-form-textarea.valid {
  background-color: #fff;
}
.js-is-required .valid .m-form-input,
.js-is-required .m-form-input.valid,
.js-is-required .valid .m-form-textarea,
.js-is-required .m-form-textarea.valid,
.js-is-required .valid .m-form-select,
.js-is-required .m-form-select.valid {
  background-color: var(--color-state__clear);
}
.m-form-block__label.is-wrap {
  white-space: normal;
}
.m-form-input:required {
  background-color: var(--color-state__unenterd);
}
.is-error .m-form-input:required, 
.m-form-input:required.is-error, 
.is-error .m-form-textarea:required, 
.m-form-textarea:required.is-error {
  background-color: var(--color-state__error__light);
}
.m-form-input--hidden {
  display: none;
}
.m-form-radio.is-error[aria-invalid=false]:checked + label, .m-form-radio:checked + label {
  background: var(--color-state__checked);
}
.m-form-checkbox.is-error[aria-invalid=false]:checked + label, .m-form-checkbox:checked + label {
  background: var(--color-gray-01);
}
.m-grid--form__content {
  max-width: 100%;
}
.m-grid--form__content .m-btn {
  margin-top: 20px;
  margin-bottom: 20px;
  max-width: 400px;
}
.m-hdg2 .m-label {
  margin-left: 0.5em;
}

.p-form--cancel__others__grid--col2 {
  margin: 0 auto;
}


@media only screen and (min-width: 960px) {
  .p-reservation > .m-flow {
    margin-top: 30px;
  }
}
.p-reservation__title {
  border-bottom: 1px solid var(--color-border__gray__light);
  margin: 0 auto;
  margin-bottom: 20px;
  margin-left: -20px;
  margin-right: -20px;
  max-width: var(--device-width-pc);
  padding: 0 20px 10px;
}
@media only screen and (min-width: 960px) {
  .p-reservation__title {
    margin-bottom: 40px;
    margin-left: 0;
    margin-right: 0;
    padding: 0 0 20px;
  }
}
.p-reservation__title__shopname {
  font-size: var(--fontSize-h2);
  font-weight: bold;
  line-height: 1.2;
}
.p-reservation__title__shopname__note {
  display: inline-block;
  font-size: var(--fontSize-s);
  font-weight: normal;
  margin-left: 0.5em;
}
.p-reservation__title__sub {
  display: block;
  font-size: var(--fontSize-s);
  font-weight: normal;
  margin-top: 1em;
}
.p-reservation__thanks-message {
  padding: 3rem 0;
  text-align: center;
}
.p-reservation__thanks-btn {
  margin: 2rem 0 4rem;
}
.p-reservation .m-box--info .c-accordion {
  font-size: var(--fontSize-s);
}

.p-reservation__box--reservation_details {
  background-color: var(--color-blue-light);
}
.p-reservation__table--reservation_details {
  width: 100%;
}
.p-reservation__table--reservation_details tr {
  border-bottom: 1px solid var(--color-border__gray);
}
.p-reservation__table--reservation_details tr:last-of-type {
  border-bottom: none;
}
.p-reservation__table--reservation_details th {
  width: 30%;
  padding: .5em 1em .5em 0.5em;
  font-weight: normal;
}
.p-reservation__table--reservation_details td {
  padding: .5em 0.5em .5em 0;
  font-weight: bold;
}
.p-reservation__table--reservation_details td small {
  font-weight: normal;
  font-size: var(--fontSize-s);
}

.p-reservation__disclaimer {
  color: var(--color-key);
  font-weight: bold;
}

/* 202411_予約フォーム改善 */
.is-clear_block .m-form-area, .is-clear_block.js-is-required .m-form-area {
  background: none;
  padding: 0;
}
@media only screen and (max-width: 959.98px) {
  .m-stack > * + * {
    margin-top: 1em;
  }
  .m-flow {
    padding: .65em 20px;
  }
  .m-form-blocks {
    gap: 0;
  }
  .m-form-blocks--inline {
    gap: 1em;
  }
  .p-reservation__title__shopname,.m-hdg2 {
    font-size: var(--fontSize-h3);
  }
  .m-stack > * + * {
    margin-top: 1em;
  }
  .m-label {
    font-size: var(--fontSize-min);
    margin-left: 0.5em;
    padding: .1em .6em;
    vertical-align: middle;
  }
  .m-hdg3 {
    font-size: var(--fontSize-h4);
    padding: 0 0 0 0.75em;
  }
  .m-grid--form__content {
    gap: .5em 0;
  }
  .m-form-text {
    margin: 0;
  }
  .m-grid--form {
    gap: 20px 0;
  }
  #choose-primary_rez_date {
    margin: 0;
  }
  .is-clear_block  #choose-secondary_rez_date {
    margin: .75em auto 0;
  }
  .m-form-area .m-btn {
    margin: 0 auto;
  }
  .m-grid--2 .m-grid__col {
    width: calc(50% - 15px);
  }
  .m-hdg5 {
    margin-bottom: .25em;
  }
}
#secondary_rez_date_text {
  padding: 0;
}
.c-accordion__body__contents > p:not(:first-child) {
  border-top: 1px solid #CCCCCC;
  margin-top: 1rem;
  padding-top: 1rem;
}
.c-accordion__close {
  display: block;
  padding: .75rem;
  text-align: center;
  width: 100%;
}
.c-accordion__close .m-icon {
  color: var(--color-font__light);
  padding-left: .5em;
}
.c-accordion__body__inner {
  background-color: #fff;
  padding: 1rem;
}
#secondary_rez_date_column.is-error_block .m-form-area {
  background: none;
  padding: 10px;
  background-color: var(--color-state__error__light);
}