html {
  font-size: 15px;
  touch-action: manipulation;
}

a {
  text-decoration: none;
}

[v-cloak] {
  display: none !important;
}

.mt-0 {
  margin-top: 0px !important;
}

.mb-0 {
  margin-bottom: 0px !important;
}

.ml-0 {
  margin-left: 0px !important;
}

.mr-0 {
  margin-right: 0px !important;
}

.ma-0 {
  margin: 0px !important;
}

.mx-0 {
  margin-left: 0px !important;
  margin-right: 0px !important;
}

.my-0 {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

.pt-0 {
  padding-top: 0px !important;
}

.pb-0 {
  padding-bottom: 0px !important;
}

.pl-0 {
  padding-left: 0px !important;
}

.pr-0 {
  padding-right: 0px !important;
}

.pa-0 {
  padding: 0px !important;
}

.px-0 {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.py-0 {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.mt-1 {
  margin-top: 4px !important;
}

.mb-1 {
  margin-bottom: 4px !important;
}

.ml-1 {
  margin-left: 4px !important;
}

.mr-1 {
  margin-right: 4px !important;
}

.ma-1 {
  margin: 4px !important;
}

.mx-1 {
  margin-left: 4px !important;
  margin-right: 4px !important;
}

.my-1 {
  margin-top: 4px !important;
  margin-bottom: 4px !important;
}

.pt-1 {
  padding-top: 4px !important;
}

.pb-1 {
  padding-bottom: 4px !important;
}

.pl-1 {
  padding-left: 4px !important;
}

.pr-1 {
  padding-right: 4px !important;
}

.pa-1 {
  padding: 4px !important;
}

.px-1 {
  padding-left: 4px !important;
  padding-right: 4px !important;
}

.py-1 {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

.mt-2 {
  margin-top: 8px !important;
}

.mb-2 {
  margin-bottom: 8px !important;
}

.ml-2 {
  margin-left: 8px !important;
}

.mr-2 {
  margin-right: 8px !important;
}

.ma-2 {
  margin: 8px !important;
}

.mx-2 {
  margin-left: 8px !important;
  margin-right: 8px !important;
}

.my-2 {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
}

.pt-2 {
  padding-top: 8px !important;
}

.pb-2 {
  padding-bottom: 8px !important;
}

.pl-2 {
  padding-left: 8px !important;
}

.pr-2 {
  padding-right: 8px !important;
}

.pa-2 {
  padding: 8px !important;
}

.px-2 {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

.py-2 {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

.mt-3 {
  margin-top: 12px !important;
}

.mb-3 {
  margin-bottom: 12px !important;
}

.ml-3 {
  margin-left: 12px !important;
}

.mr-3 {
  margin-right: 12px !important;
}

.ma-3 {
  margin: 12px !important;
}

.mx-3 {
  margin-left: 12px !important;
  margin-right: 12px !important;
}

.my-3 {
  margin-top: 12px !important;
  margin-bottom: 12px !important;
}

.pt-3 {
  padding-top: 12px !important;
}

.pb-3 {
  padding-bottom: 12px !important;
}

.pl-3 {
  padding-left: 12px !important;
}

.pr-3 {
  padding-right: 12px !important;
}

.pa-3 {
  padding: 12px !important;
}

.px-3 {
  padding-left: 12px !important;
  padding-right: 12px !important;
}

.py-3 {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

.mt-4 {
  margin-top: 16px !important;
}

.mb-4 {
  margin-bottom: 16px !important;
}

.ml-4 {
  margin-left: 16px !important;
}

.mr-4 {
  margin-right: 16px !important;
}

.ma-4 {
  margin: 16px !important;
}

.mx-4 {
  margin-left: 16px !important;
  margin-right: 16px !important;
}

.my-4 {
  margin-top: 16px !important;
  margin-bottom: 16px !important;
}

.pt-4 {
  padding-top: 16px !important;
}

.pb-4 {
  padding-bottom: 16px !important;
}

.pl-4 {
  padding-left: 16px !important;
}

.pr-4 {
  padding-right: 16px !important;
}

.pa-4 {
  padding: 16px !important;
}

.px-4 {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.py-4 {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}

.mt-5 {
  margin-top: 20px !important;
}

.mb-5 {
  margin-bottom: 20px !important;
}

.ml-5 {
  margin-left: 20px !important;
}

.mr-5 {
  margin-right: 20px !important;
}

.ma-5 {
  margin: 20px !important;
}

.mx-5 {
  margin-left: 20px !important;
  margin-right: 20px !important;
}

.my-5 {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

.pt-5 {
  padding-top: 20px !important;
}

.pb-5 {
  padding-bottom: 20px !important;
}

.pl-5 {
  padding-left: 20px !important;
}

.pr-5 {
  padding-right: 20px !important;
}

.pa-5 {
  padding: 20px !important;
}

.px-5 {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.py-5 {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

.mt-6 {
  margin-top: 24px !important;
}

.mb-6 {
  margin-bottom: 24px !important;
}

.ml-6 {
  margin-left: 24px !important;
}

.mr-6 {
  margin-right: 24px !important;
}

.ma-6 {
  margin: 24px !important;
}

.mx-6 {
  margin-left: 24px !important;
  margin-right: 24px !important;
}

.my-6 {
  margin-top: 24px !important;
  margin-bottom: 24px !important;
}

.pt-6 {
  padding-top: 24px !important;
}

.pb-6 {
  padding-bottom: 24px !important;
}

.pl-6 {
  padding-left: 24px !important;
}

.pr-6 {
  padding-right: 24px !important;
}

.pa-6 {
  padding: 24px !important;
}

.px-6 {
  padding-left: 24px !important;
  padding-right: 24px !important;
}

.py-6 {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}

.fs-5 {
  font-size: 0.5rem !important;
}

.fs-6 {
  font-size: 0.6rem !important;
}

.fs-7 {
  font-size: 0.7rem !important;
}

.fs-8 {
  font-size: 0.8rem !important;
}

.fs-9 {
  font-size: 0.9rem !important;
}

.fs-10 {
  font-size: 1rem !important;
}

.fs-11 {
  font-size: 1.1rem !important;
}

.fs-12 {
  font-size: 1.2rem !important;
}

.fs-13 {
  font-size: 1.3rem !important;
}

.fs-14 {
  font-size: 1.4rem !important;
}

.fs-15 {
  font-size: 1.5rem !important;
}

.fs-16 {
  font-size: 1.6rem !important;
}

.fs-17 {
  font-size: 1.7rem !important;
}

.fs-18 {
  font-size: 1.8rem !important;
}

.fs-19 {
  font-size: 1.9rem !important;
}

.fs-20 {
  font-size: 2rem !important;
}

.text-center {
  text-align: center !important;
}

.text-right {
  text-align: right !important;
}

.text-red {
  color: red !important;
}

.text-white {
  color: white !important;
}

.fw-bold {
  font-weight: bold !important;
}

.text-line-through {
  text-decoration: line-through;
}

.d-block {
  display: block !important;
}

.d-none {
  display: none !important;
}

.d-inline {
  display: inline !important;
}

.d-flex {
  display: flex !important;
}

.flex-column {
  flex-direction: column !important;
}

.align-items-start {
  align-items: flex-start !important;
}

.justify-content-center {
  justify-content: center !important;
}

.align-items-center {
  align-items: center !important;
}

.f-wrap {
  flex-wrap: wrap;
}

.f-jc-center {
  justify-content: center !important;
}

.f-jc-between {
  justify-content: space-between;
}

.f-jc-around {
  justify-content: space-around;
}

.f-jc-start {
  justify-content: flex-start;
}

.f-jc-end {
  justify-content: flex-end;
}

.f-ai-center {
  align-items: center;
}

.f-ai-start {
  align-items: flex-start;
}

.f-ai-end {
  align-items: flex-end;
}

.bg-danger {
  background-color: #dc3545 !important;
}

.position-relative {
  position: relative;
}

.LayoutWrapper {
  width: 100%;
  color: #333;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.LayoutWrapper__lock {
  height: 100vh;
  overflow-y: hidden;
}
.LayoutContainer {
  width: 100%;
}
.LayoutMain {
  flex: 1;
  padding-bottom: 60px;
}
.LayoutInner {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  position: relative;
}
.LayoutSection {
  padding: 12px;
}
.LayoutHeader {
  margin-top: 20px;
  margin-bottom: 20px;
  text-align: center;
}
.LayoutBox {
  border: 1px solid #414141;
  padding: 20px 12px;
  line-height: 2;
}
.LayoutBox__red {
  border-color: #FF0000;
  color: #FF0000;
}
.LayoutBox__green {
  border-color: green;
  color: green;
}
.LayoutBox p:last-of-type {
  margin-bottom: 0;
}

.Drawer {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 10;
  transition: opacity 300ms, visibility 300ms;
  opacity: 0;
  visibility: hidden;
}
.DrawerOpen {
  opacity: 1;
  visibility: visible;
}
.DrawerContainer {
  position: absolute;
  width: 280px;
  top: 0;
  right: -280px;
  bottom: 0;
  background-color: #F0F0F0;
  transition: right 300ms;
}
.DrawerOpen .DrawerContainer {
  right: 0;
}
.DrawerHeader {
  display: flex;
  justify-content: flex-end;
  padding: 12px;
  margin-bottom: 8px;
}
.DrawerHeader__button {
  border: none;
  background: transparent;
  padding: 4px;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 0.8rem;
}
.DrawerHeader__button i {
  font-size: 3rem;
  font-weight: bold;
}
.Drawer__ul {
  background-color: #fff;
  margin-bottom: 12px;
}
.Drawer__ul li {
  border-top: 1px solid #DDDDDD;
}
.Drawer__ul li:last-of-type {
  border-bottom: 1px solid #DDDDDD;
}
.Drawer__ul li a {
  display: block;
  padding: 12px;
  color: #000;
}
.Drawer__button {
  display: block;
  padding: 8px 16px;
  border: none;
  font-size: 2rem;
  color: #fff;
  background: transparent;
}
.Drawer__notify {
  position: absolute;
  background-color: #FF0000;
  color: #FFFFFF;
  top: 4px;
  left: 2px;
  height: 1.8rem;
  width: 1.8rem;
  text-align: center;
  border-radius: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.Drawer__notify__reservation {
  position: absolute;
  background-color: #FF0000;
  color: #FFFFFF;
  top: 12px;
  left: 80px;
  height: 20px;
  width: 20px;
  text-align: center;
  border-radius: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 10px;
}

.Drawer__notify__message {
  position: absolute;
  background-color: #FF0000;
  color: #FFFFFF;
  top: 12px;
  left: 120px;
  height: 20px;
  width: 20px;
  text-align: center;
  border-radius: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 10px;
}

.Header {
  display: flex;
  background-color: #35c2c4;
  justify-content: space-between;
  align-items: center;
}
.HeaderImage {
  width: 172px;
}
.Header a {
  color: #fff;
}
.HeaderTitle {
  padding: 8px;
}
.HeaderTitle a {
  font-size: 1.5rem;
}
.HeaderNav ul {
  display: flex;
}
.HeaderNav ul li {
  position: relative;
}
.HeaderNav ul li a {
  display: block;
  padding: 12px;
  font-size: 1.2rem;
}

.Footer {
  background-color: #414141;
  color: #fff;
}
.Footer a {
  color: #fff;
}
.Footer__ul {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
}
.Footer__ul ul {
  width: 49%;
}
.Footer__ul ul li {
  width: 100%;
}
.Footer__ul ul li a {
  display: block;
  width: 100%;
  text-decoration: none;
  padding: 8px;
  position: relative;
}
.Footer__ul ul li a::after {
  display: block;
  font: var(--fa-font-solid);
  content: "\f105";
  position: absolute;
  display: flex;
  align-items: center;
  top: 0;
  right: 12px;
  bottom: 0;
}
.Footer__logo {
  font-size: 1.5rem;
  text-align: center;
  margin: 12px auto;
  display: flex;
  justify-content: center;
}
.Footer__logo--image {
  width: 172px;
}
.Footer__credit {
  font-size: 0.8rem;
  text-align: center;
}

.Bread {
  color: #333;
  overflow-x: scroll;
}
.Bread a {
  color: #333;
}
.BreadList {
  display: flex;
}
.BreadItem {
  margin-right: 4px;
  white-space: nowrap;
}
.BreadItem::after {
  content: ">";
  margin-left: 2px;
}
.BreadItem:last-of-type {
  padding-right: 12px;
}
.BreadItem:last-of-type::after {
  content: "";
  display: none;
}

.Page p {
  margin-bottom: 8px;
}
.PageTitle {
  font-size: 1.3rem;
  text-align: center;
  padding-bottom: 8px;
  border-bottom: 1px solid #707070;
}
.PageSection {
  margin-bottom: 20px;
}
.PageSection h2 {
  font-size: 1.2rem;
  margin-bottom: 12px;
}
.PageSection ol {
  list-style-type: decimal;
  padding-left: 20px;
}
.PageSection li {
  margin-bottom: 4px;
}
.PageTable {
  width: 100%;
  border-collapse: collapse;
}
.PageTable tr:nth-child(2n) {
  background-color: rgb(242, 242, 242);
}
.PageTable th, .PageTable td {
  border: 1px solid #e5e5e5;
  padding: 4px;
}

.Form input:focus {
  outline: 0;
}
.Form textarea:focus {
  outline: 0;
}
.Form select:focus {
  outline: 0;
}
.FormItem {
  margin-bottom: 24px;
}
.FormItem__mt {
  margin-top: 28px;
}
.FormLabel {
  display: block;
  padding: 2px 8px;
  font-size: 1.2rem;
}
.FormLabel__withBack {
  background-color: #E4E4E4;
  display: flex;
  align-items: center;
  padding: 4px 8px;
  margin-bottom: 8px;
}
.FormLabel__required {
  background-color: #FF7A7A;
  color: #fff;
  padding: 2px 8px;
  margin-right: 8px;
}
.FormLabel__required--not {
  background-color: #B1B1B1;
  color: #fff;
  padding: 2px 8px;
  margin-right: 8px;
}
.FormFlex {
  display: flex;
}
.FormFlex__item {
  flex: 1;
  margin-right: 8px;
}
.FormFlex__item:last-of-type {
  margin-right: 0;
}
.Form__text {
  color: #414141;
  margin: 8px auto;
}
.Form__text a {
  color: #414141;
  text-decoration: underline;
}
.Form__text--error {
  color: red;
}
.Form__confirm {
  font-size: 1.2rem;
  padding: 0px 12px;
}
.Form__input {
  display: block;
  width: 100%;
  border: 1px solid #999999;
  padding: 12px;
  font-size: 1.2rem;
}
.FormItem--error .Form__input {
  border-color: red;
}
.Form__textarea {
  width: 100%;
  border: 1px solid #999999;
  resize: none;
  padding: 12px;
  font-size: 1.2rem;
  height: 200px;
}
.FormItem--error .Form__textarea {
  border-color: red;
}
.Form__select {
  width: 100%;
  border: 1px solid #999999;
  padding: 12px;
  font-size: 1.2rem;
}
.FormItem--error .Form__select {
  border-color: red;
}
.Form__radio {
  font-size: 1.2rem;
}
.Form .terms-container {
  height: 300px;
  padding: 4px 8px;
  overflow: auto;
  border: 1px solid #999999;
}
.Form .terms-container h1 {
  text-align: center;
  font-size: 20px;
}
.Form .terms-container .content {
  line-height: 1.8;
}

.Button {
  display: block;
  position: relative;
  text-align: center;
  width: 100%;
  padding: 12px 8px;
  background-color: #414141;
  color: #fff;
  border: none;
  font-size: 1.2rem;
  margin-bottom: 12px;
}
.Button__primary {
  background-color: #35c2c4;
}
.Button__secondary {
  background-color: #848484;
}
.Button__turquoise {
  background-color: #066473;
}
.Button__red {
  background-color: #FF0000;
}
.Button__bubble {
  position: relative;
  background-color: #35c2c4;
  color: #414141;
  font-size: 1rem;
  padding: 8px 12px;
  border-radius: 5px;
  margin-bottom: 12px;
  text-align: center;
  z-index: 1;
}
.Button__bubble::after {
  content: "";
  display: block;
  border-top: 20px solid #35c2c4;
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-bottom: none;
  width: 0;
  height: 0;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin: auto;
}
.Button-check-reservation-change {
  background-color: #38B3DF;
  border-radius: 10px;
  width: auto;
  padding: 10px 40px;
}

/*# sourceMappingURL=pageForm.css.map */