@charset "Shift_JIS";
/*===========================================

===========================================*/
.order__inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--min60) 0;
}
@media not screen and (min-width: 768px) {
  .order__inner {
    gap: var(--min60-sp) 0;
  }
}
.order__head p {
  margin-top: var(--min8);
}
@media not screen and (min-width: 768px) {
  .order__head p {
    margin-top: var(--min8-sp);
  }
}

.confirm__inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--min24);
}
@media not screen and (min-width: 768px) {
  .confirm__inner {
    gap: var(--min24-sp);
  }
}
.confirm__box {
  padding: var(--min32);
}
@media not screen and (min-width: 768px) {
  .confirm__box {
    padding: var(--min16-sp);
  }
}
.confirm__ttl {
  font-size: var(--min18);
  font-weight: bold;
}
@media not screen and (min-width: 768px) {
  .confirm__ttl {
    font-size: var(--min18-sp);
  }
}
.confirm__period {
  display: flex;
  align-items: center;
  row-gap: var(--min40);
  column-gap: var(--min40);
}
@media not screen and (min-width: 768px) {
  .confirm__period {
    flex-wrap: wrap;
    row-gap: var(--min16-sp);
    column-gap: var(--min8-sp);
  }
}
.confirm__periodInner {
  display: flex;
  align-items: center;
  row-gap: var(--min8);
  column-gap: var(--min8);
}
@media not screen and (min-width: 768px) {
  .confirm__periodInner {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: var(--min8-sp);
    column-gap: var(--min4-sp);
    flex-grow: 1;
  }
}
@media not screen and (min-width: 768px) {
  .confirm__periodInner span {
    grid-column: 2/3;
    grid-row: 2/3;
  }
}
.confirm__date {
  display: flex;
  align-items: center;
  row-gap: var(--min8);
  column-gap: var(--min8);
  flex: 1;
}
@media not screen and (min-width: 768px) {
  .confirm__date {
    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
    flex-direction: column;
    gap: var(--min4-sp);
  }
}
@media not screen and (min-width: 768px) {
  .confirm__date > div {
    grid-column: 1/2;
  }
}
.confirm__date p {
  font-weight: bold;
  white-space: nowrap;
}
.confirm__date input {
  width: 100px;
}
.confirm__date--start::after {
  content: "�`";
  grid-column: 2/3;
}
.confirm__station {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--min16);
}
@media not screen and (min-width: 768px) {
  .confirm__station {
    grid-template-columns: 1fr;
    gap: var(--min24-sp);
  }
}
.confirm__zip {
  display: grid;
  grid-template-columns: auto auto;
  grid-row: auto;
  gap: var(--min8);
}
@media not screen and (min-width: 768px) {
  .confirm__zip {
    grid-template-columns: auto;
    gap: var(--min8-sp);
  }
}
@media screen and (min-width: 768px) {
  .confirm__zip p {
    display: block;
  }
}
@media screen and (min-width: 768px) {
  .confirm__zip span {
    display: block;
  }
}
.confirm__shop {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: var(--min8);
}
@media not screen and (min-width: 768px) {
  .confirm__shop {
    grid-template-columns: 1fr;
    gap: var(--min8-sp);
  }
}
.confirm__shop p {
  font-weight: bold;
}
.confirm__payment {
  display: flex;
  align-items: center;
  row-gap: var(--min40);
  column-gap: var(--min40);
}
@media not screen and (min-width: 768px) {
  .confirm__payment {
    flex-wrap: wrap;
    row-gap: var(--min40-sp);
    column-gap: var(--min40-sp);
  }
}
.confirm__payment ul {
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.5em;
  column-gap: 2em;
}
@media not screen and (min-width: 768px) {
  .confirm__payment ul {
    row-gap: 0.5em;
    column-gap: 1.5em;
  }
}
.confirm__payment li {
  font-weight: bold;
}
.confirm__btn {
  display: flex;
  justify-content: center;
}
@media not screen and (min-width: 768px) {
  .confirm__btn {
    flex-basis: 100%;
  }
}
.confirm__btn p {
  width: max(11.88vw, min(228px, 21.11vw));
}
@media not screen and (min-width: 768px) {
  .confirm__btn p {
    width: min(228px, 60.8vw);
  }
}

.orderBtn__box {
  padding: var(--min24);
}
@media not screen and (min-width: 768px) {
  .orderBtn__box {
    padding: var(--min24-sp);
  }
}

.orderAccordion {
  display: grid;
  gap: var(--min16);
}
@media not screen and (min-width: 768px) {
  .orderAccordion {
    gap: var(--min16-sp);
  }
}