@charset "UTF-8";
@font-face {
  font-family: "Zen Kaku Gothic Antique";
  src: url("../fonts/ZenKakuGothicAntique-Medium.woff2") format("woff2"), url("../fonts/ZenKakuGothicAntique-Medium.woff") format("woff"), url("../fonts/ZenKakuGothicAntique-Medium.eot") format("eot");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "Zen Kaku Gothic Antique";
  src: url("../fonts/ZenKakuGothicAntique-Regular.woff2") format("woff2"), url("../fonts/ZenKakuGothicAntique-Regular.woff") format("woff"), url("../fonts/ZenKakuGothicAntique-Regular.eot") format("eot");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Vollkorn";
  src: url("../fonts/Vollkorn-Regular.woff2") format("woff2"), url("../fonts/Vollkorn-Regular.woff") format("woff"), url("../fonts/Vollkorn-Regular.eot") format("eot");
  font-weight: 400;
  font-style: normal;
}
@-webkit-keyframes scroll {
  0% {
    top: -110%;
  }
  100% {
    top: 110%;
  }
}
@keyframes scroll {
  0% {
    top: -110%;
  }
  100% {
    top: 110%;
  }
}
@-webkit-keyframes header {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes header {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
* {
  letter-spacing: 0.05em;
  line-height: 1.5em;
}

html {
  /*font-size: 62.5%;*/
  font-size: 10px;
}

body {
  color: #222222;
  font-family: 'Zen Kaku Gothic Antique', 'ヒラギノ角ゴ Pro','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,Osaka,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
  font-size: 1.6rem;
}

img,
iframe {
  max-width: 100%;
}

img {
  height: auto;
}

table {
  table-layout: fixed;
  border-collapse: collapse;
}

button {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.selectStl01 {
  position: relative;
}
.selectStl01::after {
  content: "";
  position: absolute;
  top: 1.1em;
  right: 0.75em;
  display: block;
  width: 0.45em;
  height: 0.45em;
  border-right: 2px solid #968765;
  border-bottom: 2px solid #968765;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  pointer-events: none;
}
.selectStl01 select {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0.5em 2em 0.5em 0.5em;
  font-size: 1.4rem;
  text-align: left;
  line-height: 1.4em;
  vertical-align: middle;
  border: 1px solid #968765;
  border-radius: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
}

input[type=text], input[type=tel], input[type=email], input[type=number], input[type=date] {
  padding: 0.5em 0.5em;
  font-size: 1.4rem;
  text-align: left;
  border-bottom: 1px solid #968765;
}
input[type=checkbox], input[type=radio] {
  display: none;
}
input[type=checkbox] ~ span:first-of-type, input[type=radio] ~ span:first-of-type {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 0.5em;
  line-height: 1.2em;
}
input[type=checkbox] ~ span:first-of-type::before, input[type=radio] ~ span:first-of-type::before {
  content: "";
  display: block;
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
  width: 0.75em;
  height: 0.75em;
  margin-top: 0.25em;
  border: 3px solid #fff;
  -webkit-box-shadow: 0 0 0 1px #968765;
          box-shadow: 0 0 0 1px #968765;
}
input[type=checkbox]:checked ~ span:first-of-type::before, input[type=radio]:checked ~ span:first-of-type::before {
  background: #968765;
}
input[type=radio] ~ span:first-of-type::before {
  border-radius: 50%;
}
input[type=submit], input[type=button] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  -moz-appearance: button;
       appearance: button;
  border: none;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  cursor: pointer;
}
input[type=submit]::-webkit-search-decoration, input[type=button]::-webkit-search-decoration {
  display: none;
}
input[type=submit]::focus, input[type=button]::focus {
  outline-offset: -2px;
}

textarea {
  width: 100%;
  max-width: 100% !important;
  min-height: 6em;
  padding: 0.5em 0.5em;
  font-size: 1.4rem;
  text-align: left;
  border: 1px solid #968765 !important;
  resize: vertical;
  border-radius: 0;
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
}

.wrapper {
  overflow: hidden;
}

.contentIn {
  width: 1140px;
  max-width: 100%;
  margin: 0 auto;
  padding: 0 20px;
}

.dp_ib {
  display: inline-block;
}

.flexBox {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.flexL {
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
      -ms-flex-order: 1;
          order: 1;
}
.flexC {
  -webkit-box-ordinal-group: 3;
  -webkit-order: 2;
      -ms-flex-order: 2;
          order: 2;
}
.flexR {
  -webkit-box-ordinal-group: 4;
  -webkit-order: 3;
      -ms-flex-order: 3;
          order: 3;
}

.i_flex {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.ai_c {
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
.ai_fs {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.ai_fe {
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.ai_s {
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}

.jc_sb {
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.jc_sa {
  -webkit-justify-content: space-around;
      -ms-flex-pack: distribute;
          justify-content: space-around;
}
.jc_c {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.jc_fe {
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.fw_wp {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.taC {
  text-align: center;
}
.taR {
  text-align: right;
}
.taL {
  text-align: left;
}

.fwB {
  font-weight: bold;
}
.fwN {
  font-weight: normal;
}

.ma-0 {
  margin: 0em !important;
}
.mb-0 {
  margin-bottom: 0em !important;
}
.mt-0 {
  margin-top: 0em !important;
}
.ml-0 {
  margin-left: 0em !important;
}
.mr-0 {
  margin-right: 0em !important;
}

.pa-0 {
  padding: 0em !important;
}
.pb-0 {
  padding-bottom: 0em !important;
}
.pt-0 {
  padding-top: 0em !important;
}
.pl-0 {
  padding-left: 0em !important;
}
.pr-0 {
  padding-right: 0em !important;
}

.ma-1 {
  margin: 1em !important;
}
.mb-1 {
  margin-bottom: 1em !important;
}
.mt-1 {
  margin-top: 1em !important;
}
.ml-1 {
  margin-left: 1em !important;
}
.mr-1 {
  margin-right: 1em !important;
}

.pa-1 {
  padding: 1em !important;
}
.pb-1 {
  padding-bottom: 1em !important;
}
.pt-1 {
  padding-top: 1em !important;
}
.pl-1 {
  padding-left: 1em !important;
}
.pr-1 {
  padding-right: 1em !important;
}

.ma-2 {
  margin: 2em !important;
}
.mb-2 {
  margin-bottom: 2em !important;
}
.mt-2 {
  margin-top: 2em !important;
}
.ml-2 {
  margin-left: 2em !important;
}
.mr-2 {
  margin-right: 2em !important;
}

.pa-2 {
  padding: 2em !important;
}
.pb-2 {
  padding-bottom: 2em !important;
}
.pt-2 {
  padding-top: 2em !important;
}
.pl-2 {
  padding-left: 2em !important;
}
.pr-2 {
  padding-right: 2em !important;
}

.ma-3 {
  margin: 3em !important;
}
.mb-3 {
  margin-bottom: 3em !important;
}
.mt-3 {
  margin-top: 3em !important;
}
.ml-3 {
  margin-left: 3em !important;
}
.mr-3 {
  margin-right: 3em !important;
}

.pa-3 {
  padding: 3em !important;
}
.pb-3 {
  padding-bottom: 3em !important;
}
.pt-3 {
  padding-top: 3em !important;
}
.pl-3 {
  padding-left: 3em !important;
}
.pr-3 {
  padding-right: 3em !important;
}

.ma-4 {
  margin: 4em !important;
}
.mb-4 {
  margin-bottom: 4em !important;
}
.mt-4 {
  margin-top: 4em !important;
}
.ml-4 {
  margin-left: 4em !important;
}
.mr-4 {
  margin-right: 4em !important;
}

.pa-4 {
  padding: 4em !important;
}
.pb-4 {
  padding-bottom: 4em !important;
}
.pt-4 {
  padding-top: 4em !important;
}
.pl-4 {
  padding-left: 4em !important;
}
.pr-4 {
  padding-right: 4em !important;
}

.ma-5 {
  margin: 5em !important;
}
.mb-5 {
  margin-bottom: 5em !important;
}
.mt-5 {
  margin-top: 5em !important;
}
.ml-5 {
  margin-left: 5em !important;
}
.mr-5 {
  margin-right: 5em !important;
}

.pa-5 {
  padding: 5em !important;
}
.pb-5 {
  padding-bottom: 5em !important;
}
.pt-5 {
  padding-top: 5em !important;
}
.pl-5 {
  padding-left: 5em !important;
}
.pr-5 {
  padding-right: 5em !important;
}

.ma-6 {
  margin: 6em !important;
}
.mb-6 {
  margin-bottom: 6em !important;
}
.mt-6 {
  margin-top: 6em !important;
}
.ml-6 {
  margin-left: 6em !important;
}
.mr-6 {
  margin-right: 6em !important;
}

.pa-6 {
  padding: 6em !important;
}
.pb-6 {
  padding-bottom: 6em !important;
}
.pt-6 {
  padding-top: 6em !important;
}
.pl-6 {
  padding-left: 6em !important;
}
.pr-6 {
  padding-right: 6em !important;
}

.ma-7 {
  margin: 7em !important;
}
.mb-7 {
  margin-bottom: 7em !important;
}
.mt-7 {
  margin-top: 7em !important;
}
.ml-7 {
  margin-left: 7em !important;
}
.mr-7 {
  margin-right: 7em !important;
}

.pa-7 {
  padding: 7em !important;
}
.pb-7 {
  padding-bottom: 7em !important;
}
.pt-7 {
  padding-top: 7em !important;
}
.pl-7 {
  padding-left: 7em !important;
}
.pr-7 {
  padding-right: 7em !important;
}

.ma-8 {
  margin: 8em !important;
}
.mb-8 {
  margin-bottom: 8em !important;
}
.mt-8 {
  margin-top: 8em !important;
}
.ml-8 {
  margin-left: 8em !important;
}
.mr-8 {
  margin-right: 8em !important;
}

.pa-8 {
  padding: 8em !important;
}
.pb-8 {
  padding-bottom: 8em !important;
}
.pt-8 {
  padding-top: 8em !important;
}
.pl-8 {
  padding-left: 8em !important;
}
.pr-8 {
  padding-right: 8em !important;
}

.ma-9 {
  margin: 9em !important;
}
.mb-9 {
  margin-bottom: 9em !important;
}
.mt-9 {
  margin-top: 9em !important;
}
.ml-9 {
  margin-left: 9em !important;
}
.mr-9 {
  margin-right: 9em !important;
}

.pa-9 {
  padding: 9em !important;
}
.pb-9 {
  padding-bottom: 9em !important;
}
.pt-9 {
  padding-top: 9em !important;
}
.pl-9 {
  padding-left: 9em !important;
}
.pr-9 {
  padding-right: 9em !important;
}

.ma-10 {
  margin: 10em !important;
}
.mb-10 {
  margin-bottom: 10em !important;
}
.mt-10 {
  margin-top: 10em !important;
}
.ml-10 {
  margin-left: 10em !important;
}
.mr-10 {
  margin-right: 10em !important;
}

.pa-10 {
  padding: 10em !important;
}
.pb-10 {
  padding-bottom: 10em !important;
}
.pt-10 {
  padding-top: 10em !important;
}
.pl-10 {
  padding-left: 10em !important;
}
.pr-10 {
  padding-right: 10em !important;
}

.hoverOpa {
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
.hoverOpa:hover {
  opacity: 0.8;
}

.ofCover {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  font-family: "object-fit:cover;";
}
.ofContain {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  font-family: "object-fit:contain;";
}

.youtubeWrap {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtubeWrap iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

.col2 {
  display: grid;
  grid-template-columns: repeat(2, 47.5%);
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.col3 {
  display: grid;
  grid-template-columns: repeat(3, 30.9%);
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

/*==================================

全ページ共通CSS

==================================*/
.ttlStl01 {
  font-family: 'Vollkorn';
  font-size: 5rem;
  line-height: 1.2em;
}
@media screen and (max-width: 768px) {
  .ttlStl01 {
    font-size: 4rem;
  }
}
@media screen and (min-width: 768.1px) {
  .ttlStl01:not(.taC) {
    padding-left: 1.2em;
    background: url(../images/ico_arabesque_gld.svg) no-repeat center left;
  }
}
@media screen and (max-width: 768px) {
  .ttlStl01:not(.taC) {
    text-align: center;
  }
}
.ttlStl01:not(.taC):first-letter {
  color: #cf5f15;
}
.ttlStl01.taC {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.25em;
}
.ttlStl01 span {
  margin-left: 1em;
  color: #968765;
  font-size: 0.28em;
  vertical-align: middle;
}
@media screen and (max-width: 768px) {
  .ttlStl01 span {
    display: block;
    font-size: 0.325em;
  }
}

.bk_brn {
  color: #fff;
  background: #bcb5a7;
}
@media screen and (min-width: 768.1px) {
  .bk_brn .ttlStl01:not(.taC) {
    background-image: url(../images/ico_arabesque_wht.svg);
  }
}
.bk_brn .ttlStl01:not(.taC):first-letter {
  color: #fff;
}
.bk_brn .ttlStl01 span {
  color: #fff;
}

.ul01 > * {
  padding-left: 1em;
  text-indent: -1em;
}
.ul01 > *:before {
  content: "・";
}

.btnStl01 {
  position: relative;
  z-index: 1;
  display: block;
  width: 340px;
  max-width: 100%;
  padding: 2em 2em;
  font-family: 'Vollkorn';
  text-align: center;
  border: 1px solid #000;
  -webkit-transition: background 0.3s, color 0.3s;
  transition: background 0.3s, color 0.3s;
}
@media screen and (max-width: 768px) {
  .btnStl01 {
    width: 200px;
    padding: 1.25em;
  }
}

.btnStl02 {
  width: 260px;
  max-width: 100%;
  padding: 1em;
  -webkit-transition: color 0.3s, background-color 0.3s;
  transition: color 0.3s, background-color 0.3s;
}
.btnStl02.mfp_element_submit {
  border-radius: 0;
  text-shadow: none !important;
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
}

.btn-gld {
  color: #968765;
  border-color: #968765;
}
.btn-gld[target=_blank] {
  background: url(../images/ico_blank_gld.svg) no-repeat center right 1em;
}
.btn-gld:hover {
  color: #fff;
  background-color: #968765;
}
.btn-gld:hover[target=_blank] {
  background-image: url(../images/ico_blank_wht.svg);
}

.btn-orn {
  color: #fff;
  background: #cf5f15;
  border: 1px solid #cf5f15;
}
.btn-orn[target=_blank] {
  background: url(../images/ico_blank_wht.svg) no-repeat center right 1em;
}
.btn-orn:hover {
  color: #cf5f15;
  background: #fff;
}
.btn-orn:hover[target=_blank] {
  background-image: url(../images/ico_blank_gld.svg);
}

/*==================================

ヘッダー

==================================*/
.floatBtnWrap {
  position: fixed;
  z-index: 10;
}
@media screen and (min-width: 768.1px) {
  .floatBtnWrap {
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
}
@media screen and (max-width: 768px) {
  .floatBtnWrap {
    bottom: 0;
    left: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: calc(100% - 60px);
  }
}
.floatBtnWrap > * + * {
  margin-top: 1px;
}
.floatBtnWrap .floatBtn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.75em;
  padding: 1em 0.2em;
  color: #fff;
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.2em;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
.floatBtnWrap .floatBtn:hover {
  opacity: 0.8;
}
.floatBtnWrap .floatBtn:before {
  content: "";
  display: block;
  width: 1.1em;
  height: 1.1em;
}
@media screen and (max-width: 768px) {
  .floatBtnWrap .floatBtn:before {
    -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
            flex-shrink: 0;
  }
}
@media screen and (min-width: 768.1px) {
  .floatBtnWrap .floatBtn {
    width: 70px;
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
            writing-mode: vertical-rl;
    text-orientation: upright;
  }
}
@media screen and (max-width: 768px) {
  .floatBtnWrap .floatBtn {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    gap: 0.5em;
    height: 60px;
    padding: 1.2em 0.5em;
    font-size: 1.2rem;
    text-align: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .floatBtnWrap .floatBtn:after {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
  }
}

.reservationBtn {
  background: #cf5f15;
}
.reservationBtn:before {
  background: url(../images/ico_clock_wht.svg) no-repeat center center/contain;
}

.reservationBtn02 {
  background: #cf5f15;
}
.reservationBtn02:before {
  background: url(../images/ico_group_wht.svg) no-repeat center center/contain;
}

.reservationBtn03 {
  background: #333;
}
.reservationBtn03:before {
  background: url(../images/ico_calendar_wht.svg) no-repeat center center/contain;
}
@media screen and (max-width: 768px) {
  .reservationBtn03:after {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background: url(../images/ico_blank_wht.svg) no-repeat center center/contain;
  }
}

.tel-notes {
  font-family: "Zen Old Mincho";
  font-size: 0.8em;
}

header {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 100;
  padding: 1em 2%;
  color: #fff;
  font-family: 'Vollkorn';
  font-weight: 400;
  gap: 0 1em;
}
@media screen and (max-width: 768px) {
  header {
    padding: 0.25em 2% 0.25em 4%;
  }
}
header .logo {
  margin-right: auto;
  opacity: 0;
  pointer-events: none;
}
@media screen and (min-width: 768.1px) {
  header nav {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    gap: 0 1em;
  }
}
@media screen and (max-width: 768px) {
  header nav {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    max-height: 100%;
    padding: 2em;
    background-color: #cf5f15;
    overflow-y: auto;
  }
  header nav:before {
    content: "";
    display: block;
    width: 60%;
    max-width: 168px;
    margin-bottom: 5em;
    background: url(../images/logo_wht.svg) no-repeat center center/contain;
    aspect-ratio: 84/25;
  }
}
header nav .globalNav {
  gap: 1em 2em;
}
@media screen and (max-width: 768px) {
  header nav .globalNav {
    gap: 3em;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
    font-size: 1.8rem;
  }
}
@media screen and (min-width: 768.1px) {
  header nav .globalNav li a {
    position: relative;
  }
  header nav .globalNav li a:after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    display: block;
    width: 2em;
    height: 2px;
    margin: 0 auto;
    background-color: #cf5f15;
    opacity: 0;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
  }
  header nav .globalNav li a:hover:after {
    opacity: 1;
  }
}
header nav .reservationBtn {
  border: 1px solid #fff;
}
@media screen and (max-width: 768px) {
  header nav .reservationBtn {
    margin-top: 2em;
  }
}
header .header__tel {
  position: relative;
  display: inline-block;
  font-size: 2rem;
}
@media screen and (min-width: 768.1px) {
  header .header__tel {
    margin-left: 0.5em;
    padding-left: 1em;
  }
}
@media screen and (max-width: 768px) {
  header .header__tel {
    margin-top: 2em;
    padding-top: 2em;
    font-size: 2.5rem;
  }
}
header .header__tel:before {
  content: "";
  display: inline-block;
  width: 0.75em;
  height: 0.75em;
  margin-right: 0.2em;
  padding-left: 1.5em;
  background: url(../images/ico_tel_wht.svg) no-repeat center center/contain;
}
header .header__tel:after {
  content: "";
  position: absolute;
  top: 45%;
  left: 0;
  display: block;
  width: 1px;
  height: 0.75em;
  background: #fff;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  header .header__tel:after {
    top: 0;
    left: 0;
    width: 0.75em;
    height: 1px;
  }
}
header .header__tel .tel-notes {
  display: block;
  font-size: 1.1rem;
  line-height: 1.2em;
}
header.scroll {
  position: fixed;
  background: #f2f2f2;
  border-bottom: 1px solid #222222;
  -webkit-animation: header 0.3s;
          animation: header 0.3s;
}
@media screen and (min-width: 768.1px) {
  header.scroll {
    color: #222222;
  }
}
header.scroll .logo {
  opacity: 1;
  pointer-events: auto;
}
@media screen and (min-width: 768.1px) {
  header.scroll .header__tel:before {
    background-image: url(../images/ico_tel_blk.svg);
  }
}
@media screen and (min-width: 768.1px) {
  header.scroll .header__tel:after {
    background-color: #222222;
  }
}
header.scroll .spNaviButton:not(.active) {
  color: #222;
}
header.scroll .spNaviButton:not(.active):before, header.scroll .spNaviButton:not(.active):after {
  background: #222;
}
@media screen and (max-width: 768px) {
  header {
    /*　ハンバーガーメニュー
    ==================================*/
  }
  header .spNaviButton {
    position: relative;
    display: block;
    width: 40px;
    height: 40px;
    cursor: pointer;
  }
  header .spNaviButton p {
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0.25em;
    font-size: 1rem;
    line-height: 1em;
    text-align: center;
  }
  header .spNaviButton p:before {
    content: "MENU";
  }
  header .spNaviButton:before, header .spNaviButton:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    width: 70%;
    height: 2px;
    margin: 0 auto;
    background: #fff;
  }
  header .spNaviButton:before {
    top: 22%;
    -webkit-transition: top 0.3s 0.3s, -webkit-transform 0.3s;
    transition: top 0.3s 0.3s, -webkit-transform 0.3s;
    transition: top 0.3s 0.3s, transform 0.3s;
    transition: top 0.3s 0.3s, transform 0.3s, -webkit-transform 0.3s;
  }
  header .spNaviButton:after {
    top: 48%;
    -webkit-transition: top 0.3s 0.3s, -webkit-transform 0.3s;
    transition: top 0.3s 0.3s, -webkit-transform 0.3s;
    transition: top 0.3s 0.3s, transform 0.3s;
    transition: top 0.3s 0.3s, transform 0.3s, -webkit-transform 0.3s;
  }
  header .spNaviButton.active:before, header .spNaviButton.active:after {
    top: 32%;
    -webkit-transition: top 0.3s, -webkit-transform 0.3s 0.3s;
    transition: top 0.3s, -webkit-transform 0.3s 0.3s;
    transition: top 0.3s, transform 0.3s 0.3s;
    transition: top 0.3s, transform 0.3s 0.3s, -webkit-transform 0.3s 0.3s;
  }
  header .spNaviButton.active:before {
    -webkit-transform: rotate(25deg);
            transform: rotate(25deg);
  }
  header .spNaviButton.active:after {
    -webkit-transform: rotate(-25deg);
            transform: rotate(-25deg);
  }
  header .spNaviButton.active p:before {
    content: "CLOSE";
  }
}

/*==================================

フッター

==================================*/
.pagetop {
  position: fixed;
  right: 0;
  bottom: 0;
  z-index: 10;
}
@media screen and (max-width: 768px) {
  .pagetop {
    width: 60px;
  }
}

footer {
  padding: 4em 5% 3em;
  color: #fff;
  font-size: 1.3rem;
  background: #222222;
}
@media screen and (max-width: 768px) {
  footer {
    padding: 3em 5% 2em;
  }
}
footer .footerContents {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  gap: 2em 5em;
  max-width: 940px;
  margin: 0 auto;
  padding: 0 20px;
}
@media screen and (max-width: 768px) {
  footer .footerContents {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
footer .footer__logo {
  margin-bottom: 2em;
}
footer .footer__sns {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  gap: 0.5em 0.75em;
}
@media screen and (max-width: 768px) {
  footer .footer__sns {
    gap: 0.5em 3em;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
footer .footer__sns a {
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
footer .footer__sns a:hover {
  opacity: 0.8;
}
footer .footer__tel {
  gap: 0 1em;
}
footer .footer__access p {
  line-height: 1.77em;
}
footer .footer__access__mapLink {
  display: inline-block;
  margin-top: 1em;
}
footer .footer__access__mapLink span {
  margin-left: 0.35em;
  padding-bottom: 0.2em;
}
footer .footer__access__mapLink:not(:hover) span {
  border-bottom: 1px solid #fff;
}
footer .footer__access__mapLink:before {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1.2em;
  vertical-align: bottom;
  background: url(../images/ico_access_wht.svg) no-repeat center center/contain;
}
footer .footer__data tr > * {
  padding-bottom: 1em;
  line-height: 1.77em;
}
footer .footer__data tr > th {
  padding-right: 1.2em;
  font-weight: 400;
}
footer .copyright {
  margin-top: 3em;
  -webkit-flex-basis: 100%;
      -ms-flex-preferred-size: 100%;
          flex-basis: 100%;
  color: #968765;
  font-size: 1.2rem;
}
@media screen and (max-width: 768px) {
  footer .copyright {
    margin-top: 1em;
    text-align: center;
  }
}

.mfp_element_text,
.mfp_element_number,
.mfp_element_select-one,
.mfp_element_email,
.mfp_element_tel,
.mfp_element_date,
.mfp_element_password {
  border: 0;
  border-radius: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
}

form#mailformpro label,
form#mailformpro label.mfp_not_checked,
form#mailformpro label.mfp_checked {
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
}

/*==================================

トップページ

==================================*/
.bk-margin {
  margin-top: 25%;
}
@media screen and (max-width: 768px) {
  .bk-margin {
    margin-top: 50vw;
  }
}

.mv {
  position: relative;
  height: 100vh;
  overflow: hidden;
}
.mv:before {
  content: "";
  position: absolute;
  top: -5%;
  right: 0;
  bottom: -5%;
  left: 0;
  z-index: 1;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.4)), color-stop(20%, rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0)));
  background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0) 100%);
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0) 100%);
}
.mv > img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.mv__title {
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  z-index: 2;
  margin: 0 auto;
  text-align: center;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-animation: fadeIn 1.75s 0.5s forwards;
          animation: fadeIn 1.75s 0.5s forwards;
  opacity: 0;
}
.mv__slide {
  vertical-align: bottom;
}
.mv__slider {
  vertical-align: bottom;
}
.mv__slide img {
  width: 100%;
  height: 100vh;
  -o-object-fit: cover;
     object-fit: cover;
}
.mv .scroll {
  position: absolute;
  bottom: 0;
  left: 50%;
  z-index: 2;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  color: #fff;
  font-family: 'Vollkorn';
  font-size: 1.2rem;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  cursor: pointer;
}
.mv .scroll span {
  position: relative;
  gap: 10px;
  width: 2px;
  height: 38px;
  overflow: hidden;
}
.mv .scroll span:before, .mv .scroll span:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  display: block;
  height: 38px;
  background: #fff;
}
.mv .scroll span:before {
  top: -90%;
}
.mv .scroll span:after {
  top: 20%;
}
.mv .scroll:hover span:before {
  -webkit-animation: scroll 3s infinite linear;
          animation: scroll 3s infinite linear;
}
.mv .scroll:hover span:after {
  -webkit-animation: scroll 3s -1.5s infinite linear;
          animation: scroll 3s -1.5s infinite linear;
}

.bkImg {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100vh;
}
.bkImg.img_01 {
  background: url(../images/img01.jpg) no-repeat bottom center/cover;
}
.bkImg.img_02 {
  background: url(../images/img_ft.jpg) no-repeat center center/cover;
}

#about {
  padding: 5em 0;
  background: #f2f2f2 url(../images/hyogo_wht.svg) no-repeat top 3% right 26%;
}
@media screen and (max-width: 768px) {
  #about {
    padding-bottom: 1em;
    background-position: top 150vw right 3%;
  }
}
#about .ttlStl01 {
  margin-bottom: 1em;
}
@media screen and (max-width: 768px) {
  #about .about__introduction {
    margin-top: 3em;
    padding: 0 20px;
  }
}
#about .about__introductionWrap {
  position: relative;
  margin-bottom: 3em;
}
@media screen and (min-width: 768.1px) {
  #about .about__introduction {
    width: 28%;
    margin-left: 51%;
  }
}
#about .about__introduction__title {
  margin-bottom: 1em;
  color: #968765;
  font-size: 3.6rem;
  font-weight: 500;
  line-height: 1.6em;
}
@media screen and (max-width: 768px) {
  #about .about__introduction__title {
    font-size: 3rem;
  }
}
#about .about__introduction p {
  letter-spacing: 0.05em;
  line-height: 2.5em;
}
#about .about__contents {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 3px 0;
  padding: 3em 0;
}
@media screen and (max-width: 768px) {
  #about .about__contents {
    gap: 2em 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
#about .about__contents:not(:last-of-type) {
  border-bottom: 1px solid #dddddd;
}
#about .about__contents + .about__contents {
  border-top: 1px solid #dddddd;
}
@media screen and (min-width: 768.1px) {
  #about .about__contents:nth-of-type(even) .about__contents__img {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
        -ms-flex-order: 2;
            order: 2;
  }
}
#about .about__contents__text {
  -webkit-flex-basis: 47%;
      -ms-flex-preferred-size: 47%;
          flex-basis: 47%;
}
#about .about__contents__title {
  margin-bottom: 1.2em;
  color: #968765;
  font-size: 2.6rem;
  font-weight: 500;
  line-height: 1.4em;
}
@media screen and (max-width: 768px) {
  #about .about__contents__title {
    text-align: center;
  }
}
#about .about__contents__title .fzS {
  display: block;
  font-size: 0.6em;
}
#about .about__contents:has(.about__contents__about) .about__contents__title {
  margin-bottom: 0.25em;
}
#about .about__contents__about {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  gap: 0 1em;
  margin-bottom: 1em;
  color: #968765;
}
#about .about__contents__about dl {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 0 1em;
}
#about .about__contents__about dl dt {
  font-weight: normal;
}
#about .about__contents__details {
  line-height: 2em;
}
#about .about__contents__details + .about__contents__title {
  margin-top: 1em;
}
#about .about__contents__img {
  -webkit-flex-basis: 47.27%;
      -ms-flex-preferred-size: 47.27%;
          flex-basis: 47.27%;
}
#about [class^=img] img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
#about .img01 {
  right: 0;
  width: 15.277%;
  max-height: 480px;
  aspect-ratio: 11/24;
}
@media screen and (min-width: 768.1px) {
  #about .img01 {
    position: absolute;
    top: -10%;
  }
}
@media screen and (max-width: 768px) {
  #about .img01 {
    width: 21.3%;
    margin-left: auto;
  }
}
#about .img02 {
  position: absolute;
  top: 0;
  left: 0;
  width: 44.44%;
  max-height: 640px;
  aspect-ratio: 1/1;
}
@media screen and (max-width: 768px) {
  #about .img02 {
    width: 64%;
  }
}
#about .img03 {
  z-index: 1;
  width: 24.3%;
  aspect-ratio: 7/4;
}
@media screen and (min-width: 768.1px) {
  #about .img03 {
    position: absolute;
    left: 40.2%;
    bottom: 0;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
}
@media screen and (max-width: 768px) {
  #about .img03 {
    position: relative;
    width: 56%;
    margin-top: 12%;
    margin-left: 30%;
  }
}
#about .img04 {
  margin: 10% 0 0 auto;
  width: 27.77%;
}
@media screen and (max-width: 768px) {
  #about .img04 {
    width: 76%;
  }
}

#menu {
  padding: 5em 0 10em;
}
@media screen and (max-width: 768px) {
  #menu {
    padding: 3em 0;
  }
}
#menu .ttlStl01 {
  margin-bottom: 0.8em;
}
#menu .menu__list {
  gap: 5% 0;
}
@media screen and (max-width: 768px) {
  #menu .menu__list {
    gap: 3em 0;
    grid-template-columns: 100%;
  }
}
#menu .menu__list__category {
  position: relative;
}
#menu .menu__list__category:after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  display: block;
  height: 4px;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
}
#menu .menu__list__category:hover .img {
  position: relative;
}
#menu .menu__list__category:hover .img:before {
  opacity: 1;
}
#menu .menu__list__category:hover .img img {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}
#menu .menu__list__category:hover .menu__list__text {
  opacity: 0.6;
}
#menu .menu__list__category .img {
  position: relative;
  overflow: hidden;
}
#menu .menu__list__category .img:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  display: block;
  background: rgba(0, 0, 0, 0.3);
  opacity: 0;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
#menu .menu__list__category .img img {
  width: 100%;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}
#menu .menu__list__text {
  position: relative;
  padding: 1em 0;
  font-family: 'Vollkorn';
  font-size: 3.6rem;
  font-weight: 400;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
@media screen and (max-width: 768px) {
  #menu .menu__list__text {
    font-size: 2.5rem;
  }
}
#menu .menu__list__text .time {
  font-size: 1.8rem;
  line-height: 1.4em;
}
@media screen and (min-width: 768.1px) {
  #menu .menu__list__text .time {
    margin-left: 0.75em;
  }
}
@media screen and (max-width: 768px) {
  #menu .menu__list__text .time {
    display: block;
  }
}
#menu .menu__list__text:after {
  content: "MORE";
  position: absolute;
  top: 50%;
  right: 0;
  padding: 0.5em 2em 0.5em 0;
  font-size: 1.4rem;
  line-height: 1em;
  background: url(../images/ico_blank_wht.svg) no-repeat top 0.1em right/1.25em;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  #menu .menu__list__text:after {
    font-size: 1.3rem;
  }
}

#instagram {
  padding: 4em 0 6em;
  background: #f2f2f2;
}
#instagram .ttlStl01 {
  margin-bottom: 1.2em;
  padding-top: 1em;
  background: url(../images/ico_instagram.svg) no-repeat center top;
}
#instagram .col3 {
  gap: 3.65% 0;
  aspect-ratio: 1/1;
}
@media screen and (max-width: 768px) {
  #instagram .col3 {
    grid-template-columns: repeat(2, 48.5%);
  }
}
@media screen and (max-width: 768px) {
  #instagram .col3 > *:nth-of-type(n + 7) {
    display: none;
  }
}
#instagram .btnStl01 {
  margin: 4em auto 0;
}

#access {
  position: relative;
  padding: 6em 0;
  background: url(../images/texture01.png);
}
#access:after {
  content: "";
  position: absolute;
  display: block;
  top: 20em;
  left: 0;
  right: 0;
  bottom: 0;
  background: url(../images/bk_access.jpg) no-repeat center center/cover;
}
#access .access__information {
  position: relative;
  z-index: 1;
  width: calc((100% - 1100px) / 2 + 1100px);
  margin: 2.25em 0 0 auto;
  padding: 3em 4%;
  background: #fff;
}
@media screen and (max-width: 1160px) {
  #access .access__information {
    width: calc(100% - 20px);
  }
}
@media screen and (max-width: 768px) {
  #access .access__information {
    width: 90.6%;
    padding: 0 5%;
  }
}
#access .access__informationInner {
  overflow: hidden;
}
@media screen and (min-width: 768.1px) {
  #access .access__informationInner {
    -webkit-column-count: 2;
       -moz-column-count: 2;
            column-count: 2;
    -webkit-column-gap: 3%;
       -moz-column-gap: 3%;
            column-gap: 3%;
  }
}
#access .access__informationInner dl {
  padding: 1.5em 0;
  border-top: 1px solid #dddddd;
  -webkit-column-break-inside: avoid;
     -moz-column-break-inside: avoid;
          break-inside: avoid;
  -webkit-transform: translateY(-1px);
          transform: translateY(-1px);
}
#access .access__informationInner dl dt {
  margin-bottom: 0.5em;
  color: #968765;
  font-weight: 500;
}
#access .access__informationInner dl dd .fzS {
  font-size: 0.8125em;
}
#access .access__tel {
  gap: 0.25em 1em;
}
#access .access__tel .tel-notes {
  padding-left: 1em;
  text-indent: -1em;
}

@media screen and (max-width: 768px) {
  .googleMap {
    height: 200px;
  }
  .googleMap iframe {
    height: 100%;
  }
}
.googleMap iframe {
  width: 100%;
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  filter: grayscale(100%);
}

#reserve-calendar {
  padding: 8em 0 3em;
  background: #f2f2f2;
}
@media screen and (max-width: 768px) {
  #reserve-calendar {
    padding: 5em 0 2em;
  }
}
#reserve-calendar .reserve-calendar__text {
  margin: 2.5em 0 0;
}
#reserve-calendar #calendar {
  max-width: 800px;
  margin: 5em auto 0;
  font-size: 1.4rem;
}
@media screen and (max-width: 768px) {
  #reserve-calendar #calendar {
    font-size: 1.2rem;
  }
}
#reserve-calendar #calendar table,
#reserve-calendar #calendar .fc-daygrid-body {
  width: 100% !important;
}
@media screen and (max-width: 768px) {
  #reserve-calendar #calendar .fc-view-harness,
  #reserve-calendar #calendar .fc-scrollgrid-sync-table {
    height: auto !important;
  }
}
@media screen and (max-width: 768px) {
  #reserve-calendar #calendar .fc-daygrid-day-events {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  #reserve-calendar #calendar .fc-scroller-liquid-absolute,
  #reserve-calendar #calendar .fc-view-harness-active > .fc-view,
  #reserve-calendar #calendar .fc-bg-event,
  #reserve-calendar #calendar .fc-highlight,
  #reserve-calendar #calendar .fc-non-business,
  #reserve-calendar #calendar .fc-daygrid-bg-harness {
    position: static;
  }
}
#reserve-calendar #calendar .fc-col-header-cell .fc-scrollgrid-sync-inner {
  color: #fff;
  font-weight: normal;
  background: #222;
}
@media screen and (max-width: 768px) {
  #reserve-calendar #calendar .fc-daygrid-day-frame.fc-scrollgrid-sync-inner {
    min-height: 14vw;
  }
}
#reserve-calendar #calendar .fc-button-primary {
  background: #222;
  border-color: #222;
}
#reserve-calendar #calendar .fc-bg-event {
  opacity: 1;
  background: transparent !important;
  overflow-y: auto;
}
#reserve-calendar #calendar .fc-event-title {
  margin: 0 4px 2px;
  padding: 0.2em 0.25em 0.3em;
  color: #fff;
  font-size: 1.2rem;
  font-style: normal;
  letter-spacing: 0;
  line-height: 1.2em;
  border: none;
  border-radius: 3px;
}
@media screen and (max-width: 768px) {
  #reserve-calendar #calendar .fc-event-title {
    padding: 0.1em 0.2em 0.2em;
    font-size: 8px;
    border-radius: 2px;
  }
}
#reserve-calendar #calendar .gcal-event1 .fc-event-title {
  background: #cf5f15;
}
#reserve-calendar #calendar .gcal-event2 .fc-event-title {
  background: #bcb5a7;
}

#reservation {
  padding: 4em 0;
  background: #f2f2f2;
}
#reservation .ttlStl01 {
  margin-bottom: 0.75em;
}
#reservation .reservation__wrap {
  display: grid;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  grid-template-columns: 60% 40%;
  max-width: 900px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  #reservation .reservation__wrap {
    gap: 3em 0;
    grid-template-columns: 100%;
  }
}
#reservation .reservation__wrap > * {
  padding: 0 3%;
}
#reservation .reservation__information {
  color: #860e0f;
}
@media screen and (max-width: 768px) {
  #reservation .reservation__information {
    text-align: center;
  }
}
#reservation .btnStl01 {
  width: 300px;
  max-width: 100%;
}
#reservation a[href*="#reserveForm"] {
  min-height: 90px;
  padding: 1em;
}
#reservation a[href*="#reserveForm"] span {
  display: block;
  margin-bottom: 0.3em;
  color: #860e0f;
  font-family: "Zen Kaku Gothic Antique";
  font-size: 0.8em;
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
}
#reservation a[href*="#reserveForm"]:hover span {
  color: #fff;
}

#reserveForm {
  padding-right: 20px;
  padding-left: 20px;
}
#reserveForm .formWrap {
  display: table;
  width: 100%;
  max-width: 600px;
  margin: 2em auto 0;
}
@media screen and (max-width: 768px) {
  #reserveForm .formWrap {
    display: block;
  }
}
#reserveForm .formWrap > dl,
#reserveForm .formWrap > fieldset {
  display: table-row;
  width: 100%;
}
@media screen and (max-width: 768px) {
  #reserveForm .formWrap > dl,
  #reserveForm .formWrap > fieldset {
    display: block;
  }
}
#reserveForm .formWrap > dl > *,
#reserveForm .formWrap > fieldset > * {
  display: table-cell;
  padding: 1em 0;
}
@media screen and (max-width: 768px) {
  #reserveForm .formWrap > dl > *,
  #reserveForm .formWrap > fieldset > * {
    display: block;
  }
}
#reserveForm .formWrap > dl > dt,
#reserveForm .formWrap > dl legend,
#reserveForm .formWrap > fieldset > dt,
#reserveForm .formWrap > fieldset legend {
  width: 14em;
  color: #968765;
  font-size: 1.5rem;
  font-weight: normal;
  text-align: left;
  vertical-align: top;
  float: none;
  border: none;
}
@media screen and (max-width: 768px) {
  #reserveForm .formWrap > dl > dt,
  #reserveForm .formWrap > dl legend,
  #reserveForm .formWrap > fieldset > dt,
  #reserveForm .formWrap > fieldset legend {
    padding-bottom: 0;
  }
}
#reserveForm .formWrap > dl > dd,
#reserveForm .formWrap > fieldset > dd {
  border: none;
}
#reserveForm .formWrap > dl > dd input,
#reserveForm .formWrap > fieldset > dd input {
  width: 100%;
  max-width: 100%;
}
#reserveForm .formWrap > dl > dd .reserveDate,
#reserveForm .formWrap > fieldset > dd .reserveDate {
  gap: 1em;
}
#reserveForm .formWrap > dl > dd .reserveDate input[type=date],
#reserveForm .formWrap > fieldset > dd .reserveDate input[type=date] {
  width: 10em;
}
#reserveForm .formWrap .numberOfPeople {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  gap: 1em 2em;
}
#reserveForm .formWrap .numberOfPeople label {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.4rem;
}
#reserveForm .formWrap .numberOfPeople label span {
  width: 4em;
}
#reserveForm .formWrap .numberOfPeople label input {
  width: 4em;
  text-align: right;
}
#reserveForm .formWrap > fieldset {
  display: contents;
}
#reserveForm .formWrap .checkBoxWrap {
  font-size: 1.4rem;
}
#reserveForm .formWrap .checkBoxWrap .flexBox {
  gap: 1em;
}
#reserveForm .agreement {
  font-size: 1.4rem;
  vertical-align: middle;
}
#reserveForm .agreement * {
  vertical-align: middle;
}
#reserveForm .agreement .required::after {
  margin-top: 0.2em;
  margin-left: 0.5em;
}
#reserveForm .required::after {
  content: "必須";
  display: inline-block;
  margin-left: 1em;
  padding: 0.2em 0.25em;
  color: #fff;
  font-size: 1rem;
  font-weight: bold;
  line-height: 1em;
  vertical-align: middle;
  background: #968765;
  border-radius: 3px;
}
#reserveForm .cancel-policy {
  max-width: 600px;
  margin-right: auto;
  margin-left: auto;
  padding: 1.5em 1em;
  border: 1px solid #968765;
}
#reserveForm .cancel-policy > * {
  display: block;
  width: 100%;
  padding: 0;
  font-size: 1.4rem;
  text-align: left;
  border: none;
  float: none;
}
#reserveForm .cancel-policy > dt {
  margin-bottom: 0.5em;
  color: #968765;
}
#reserveForm .cancel-policy > dd {
  line-height: 1.8em;
}

#thanks {
  padding: 12em 0 8em;
}
#thanks .ttlStl01 {
  margin-bottom: 1em;
}
#thanks p {
  margin-top: 1em;
  line-height: 2em;
}
#thanks .btnStl01 {
  margin: 3em auto 0;
}

/*==================================

js animation

==================================*/
.js_st[class*=fadein] {
  opacity: 0;
}
.js_st[class*=fadeinT] {
  -webkit-transform: translate(0, 50px);
          transform: translate(0, 50px);
}
.js_st[class*=fadeinB] {
  -webkit-transform: translate(0, -50px);
          transform: translate(0, -50px);
}
.js_st[class*=fadeinR] {
  -webkit-transform: translate(-50px, 0);
          transform: translate(-50px, 0);
}
.js_st[class*=fadeinL] {
  -webkit-transform: translate(50px, 0);
          transform: translate(50px, 0);
}
.js_st[class*=fadein].scrollin {
  opacity: 1;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
  -webkit-transition: all 1500ms, background 0.3s, min-width 0s;
  transition: all 1500ms, background 0.3s, min-width 0s;
}

@media screen and (min-width: 768.1px) {
  .spOnly {
    display: none !important;
  }
}

/*==================================

@media screen SP

==================================*/
@media screen and (max-width: 768px) {
  .pcOnly {
    display: none !important;
  }
  .sp_bk {
    display: block;
  }
}/*# sourceMappingURL=style.css.map */