@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;500&display=swap");
@import url("https://fonts.googleapis.com/css2?family=EB+Garamond&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Marcellus&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;500&display=swap");
@import url("https://fonts.googleapis.com/css2?family=EB+Garamond&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500&display=swap");
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

/* Slider */
/* Icons */
@font-face {
  font-family: "slick";
  src: url("./fonts/slick.eot");
  src: url("./fonts/slick.eot?#iefix") format("embedded-opentype"), url("./fonts/slick.woff") format("woff"), url("./fonts/slick.ttf") format("truetype"), url("./fonts/slick.svg#slick") format("svg");
  font-weight: normal;
  font-style: normal;
}
/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  height: 20px;
  width: 20px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none;
}
.slick-prev:hover, .slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
  outline: none;
  background: transparent;
  color: transparent;
}
.slick-prev:hover:before, .slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
  opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
  opacity: 0.25;
}
.slick-prev:before,
.slick-next:before {
  font-family: "slick";
  font-size: 20px;
  line-height: 1;
  color: white;
  opacity: 0.75;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-prev {
  left: -25px;
}
[dir=rtl] .slick-prev {
  left: auto;
  right: -25px;
}
.slick-prev:before {
  content: "←";
}
[dir=rtl] .slick-prev:before {
  content: "→";
}

.slick-next {
  right: -25px;
}
[dir=rtl] .slick-next {
  left: -25px;
  right: auto;
}
.slick-next:before {
  content: "→";
}
[dir=rtl] .slick-next:before {
  content: "←";
}

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 30px;
}

.slick-dots {
  position: absolute;
  bottom: -25px;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%;
}
.slick-dots li {
  position: relative;
  display: inline-block;
  height: 20px;
  width: 20px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
}
.slick-dots li button {
  border: 0;
  background: transparent;
  display: block;
  height: 20px;
  width: 20px;
  outline: none;
  line-height: 0px;
  font-size: 0px;
  color: transparent;
  padding: 5px;
  cursor: pointer;
}
.slick-dots li button:hover, .slick-dots li button:focus {
  outline: none;
}
.slick-dots li button:hover:before, .slick-dots li button:focus:before {
  opacity: 1;
}
.slick-dots li button:before {
  position: absolute;
  top: 0;
  left: 0;
  content: "•";
  width: 20px;
  height: 20px;
  font-family: "slick";
  font-size: 6px;
  line-height: 20px;
  text-align: center;
  color: black;
  opacity: 0.25;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before {
  color: black;
  opacity: 0.75;
}

html * {
  box-sizing: border-box;
}

* {
  box-sizing: border-box;
  font-feature-settings: "palt" 1;
}

html {
  width: 100%;
  height: 100%;
  font-size: 62.5%;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body.sp-nav--open {
  overflow: hidden;
}

.sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .sp {
    display: inline-block;
  }
}

.pc {
  display: inline-block;
}
@media screen and (max-width: 767px) {
  .pc {
    display: none;
  }
}

img {
  max-width: 100%;
}

p {
  line-height: 1.5;
}

.pwrap {
  display: inline-block;
}

.page-lead {
  width: 100%;
  text-align: center;
  padding: 1.5em 0;
}
@media screen and (max-width: 767px) {
  .page-lead {
    font-size: 2rem;
  }
}
.page-lead--main {
  font-size: 1em;
  margin-bottom: 1em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
@media screen and (max-width: 1099px) {
  .page-lead--main {
    font-size: 2.16vw;
  }
}
@media screen and (max-width: 767px) {
  .page-lead--main {
    font-size: 5.4vw;
  }
}
.page-lead--copy {
  font-size: 0.7em;
  margin-bottom: 3em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
@media screen and (max-width: 1099px) {
  .page-lead--copy {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .page-lead--copy {
    font-size: 3.6vw;
  }
}

.contents-container {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1400px;
}

.mxW {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1400px;
}

.fixed-nav {
  display: none;
}
@media screen and (max-width: 767px) {
  .fixed-nav {
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 100;
    height: 80px;
  }
}
.fixed-nav ul.fixed-nav-list-hotel {
  display: flex;
  justify-content: space-between;
  width: 100%;
  position: relative;
  z-index: 2;
  height: calc(100% - 30px);
}
.fixed-nav ul.fixed-nav-list-hotel li {
  font-size: 1.6rem;
  height: 100%;
  /*
   AIコンシェルジュあり
   &:nth-of-type(1){
    width: calc( (100% - 50px ) *.4 );
  background-color: c.$color-cv;
   border-right: 1px solid #888;
   }
   &:nth-of-type(2){
   width: calc( (100% - 50px ) *.4 );
  background-color: c.$color-cv;
   border-right: 1px solid #888;
   }
   &:nth-of-type(3){
     width: calc( (100% - 50px ) *.2 );
    background-color: c.$color-cv;
     border-right: 1px solid #888;
     img{
  	  width: 1.4em;
  	  border-radius: 10rem;
  	  margin-right: .3em;
  	}
  }
  &:nth-of-type(4){
  	  width: 50px;
  	  //background-color: #333;
  	  background-color: darken(c.$color-cv,5%);

  	  position: relative;
     }
  */
}
.fixed-nav ul.fixed-nav-list-hotel li a {
  text-decoration: none;
  text-decoration: none;
  color: #fff;
  width: 100%;
  height: 100%;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.fixed-nav ul.fixed-nav-list-hotel li a, .fixed-nav ul.fixed-nav-list-hotel li a:link, .fixed-nav ul.fixed-nav-list-hotel li a:visited {
  color: #fff;
}
.fixed-nav ul.fixed-nav-list-hotel li a:hover, .fixed-nav ul.fixed-nav-list-hotel li a:active {
  text-decoration: none;
  color: #fff;
}
.fixed-nav ul.fixed-nav-list-hotel li:nth-of-type(1) {
  width: calc((100% - 50px) * 0.3);
  background-color: #003f87;
  border-right: 1px solid #888;
}
.fixed-nav ul.fixed-nav-list-hotel li:nth-of-type(2) {
  width: calc((100% - 50px) * 0.7);
  background-color: #003f87;
  border-right: 1px solid #888;
}
.fixed-nav ul.fixed-nav-list-hotel li:nth-of-type(3) {
  width: 50px;
  background-color: #00336e;
  position: relative;
}
.fixed-nav ul.fixed-nav-list-hotel li.instagram {
  order: -1;
  width: 50px;
  background-color: #003f87;
  border-right: 1px solid #888;
}
.fixed-nav ul.fixed-nav-list-hotel li.instagram a {
  padding: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.fixed-nav ul.fixed-nav-list-hotel.light li a {
  color: #000;
}
.fixed-nav ul.fixed-nav-list-portal {
  display: flex;
  justify-content: space-between;
  width: 100%;
  position: relative;
  z-index: 2;
  height: 100%;
}
.fixed-nav ul.fixed-nav-list-portal li {
  font-size: 1.6rem;
  height: 100%;
}
.fixed-nav ul.fixed-nav-list-portal li a {
  text-decoration: none;
  text-decoration: none;
  color: #fff;
  width: 100%;
  height: 100%;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.fixed-nav ul.fixed-nav-list-portal li a, .fixed-nav ul.fixed-nav-list-portal li a:link, .fixed-nav ul.fixed-nav-list-portal li a:visited {
  color: #fff;
}
.fixed-nav ul.fixed-nav-list-portal li a:hover, .fixed-nav ul.fixed-nav-list-portal li a:active {
  text-decoration: none;
  color: #fff;
}
.fixed-nav ul.fixed-nav-list-portal li:nth-of-type(1) {
  width: 50%;
  background-color: #333;
  border-right: 1px solid #888;
}
.fixed-nav ul.fixed-nav-list-portal li:nth-of-type(2) {
  width: 50%;
  background-color: #333;
}
.fixed-nav .aiBtn a {
  width: 100%;
  background: #645346 !important;
  color: #fff;
  font-size: 1.4rem;
  transition: opacity 0.5s;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  text-decoration: none;
  padding: 0.5em 0;
  transition: all 0.5s;
}
.fixed-nav .aiBtn img {
  width: 1.4em;
  border-radius: 10rem;
  margin-right: 0.3em;
}
.fixed-nav-dynamic {
  position: fixed;
  bottom: 50px;
  right: 0;
  display: none;
  align-items: center;
  text-decoration: none;
  text-decoration: none;
  background-color: #00336e;
  text-decoration: none;
  color: #333;
  text-align: center;
  padding: 0.8em 2em;
  z-index: 101;
  font-size: 1.6rem;
}
.fixed-nav-dynamic, .fixed-nav-dynamic:link, .fixed-nav-dynamic:visited {
  color: #fff;
}
.fixed-nav-dynamic:hover, .fixed-nav-dynamic:active {
  text-decoration: none;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .fixed-nav-dynamic {
    display: inline-flex;
  }
}
.fixed-nav-dynamic img {
  width: 1.7em;
  margin-top: 0.2em;
  margin-right: 0.5em;
}

.nav-dynamic {
  align-items: center;
  text-decoration: none;
  text-decoration: none;
  background-color: #00336e;
  text-decoration: none;
  color: #333;
  text-align: center;
  padding: 0.5em 2em;
  font-size: 1.6rem;
}
.nav-dynamic, .nav-dynamic:link, .nav-dynamic:visited {
  color: #fff;
}
.nav-dynamic:hover, .nav-dynamic:active {
  text-decoration: none;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .nav-dynamic {
    display: inline-flex;
  }
}
.nav-dynamic img {
  width: 1.7em;
  margin-top: 0.2em;
  margin-right: 0.5em;
}

.nav-sp-content {
  position: fixed;
  top: 100%;
  right: 0;
  bottom: 50px;
  left: 0;
  opacity: 0;
  transition: opacity 0.5;
  background-color: #000f21;
  overflow-y: auto;
}
.nav-sp-content.active {
  opacity: 1;
  top: 0;
  z-index: 1;
}
.nav-sp-content-logo {
  width: 100%;
  text-align: center;
  margin-bottom: 10%;
}
.nav-sp-content-logo img {
  max-width: 100px;
  width: 100%;
}
.nav-sp-content-logo span {
  color: #003f87;
  margin-top: 0.5em;
  white-space: nowrap;
  letter-spacing: 0;
  display: block;
}
.nav-sp-content-inner {
  padding: 2% 2% 15% 2%;
  width: 100%;
}
.nav-sp-content ul.nav-sp-content-list {
  margin-bottom: 10%;
  list-style: none;
  width: 100%;
  font-size: 1.8rem;
}
.nav-sp-content ul.nav-sp-content-list li {
  width: 100%;
}
.nav-sp-content ul.nav-sp-content-list li a {
  display: inline-block;
  width: 100%;
  padding: 1em;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  text-decoration: none;
}
.nav-sp-content ul.nav-sp-content-list li a, .nav-sp-content ul.nav-sp-content-list li a:link, .nav-sp-content ul.nav-sp-content-list li a:visited {
  color: #fff;
}
.nav-sp-content ul.nav-sp-content-list li a:hover, .nav-sp-content ul.nav-sp-content-list li a:active {
  text-decoration: none;
  color: #fff;
}
.nav-sp-content ul.nav-sp-content-list li a:last-child {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.nav-sp-content-contact {
  width: 100%;
}
.nav-sp-content-contact a {
  color: #fff;
  text-decoration: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-end;
  font-size: 1.6rem;
}
.nav-sp-content-contact a span {
  display: inline-block;
}
.nav-sp-content-contact a span.nav-sp-content-contact-02 {
  font-size: 1.3em;
  margin: 0 0.1em 0 0.3em;
}
.nav-sp-content-contact a span.nav-sp-content-contact-03 {
  font-size: 0.8em;
}
.nav-sp-content-bnr {
  width: 100%;
  padding-top: 10%;
}
.nav-sp-content-bnr h3 {
  color: #fff;
  text-align: center;
  font-size: 1.4rem;
  padding: 0.5em 0 0.5em 0;
}

.nav-reserve-content {
  position: fixed;
  top: 100%;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.5;
  background: white;
  overflow-y: auto;
}
@media screen and (max-width: 767px) {
  .nav-reserve-content {
    bottom: 50px;
  }
}
.nav-reserve-content.active {
  opacity: 1;
  top: 0;
  z-index: 3;
}
.nav-reserve-content-inner {
  padding: 2%;
  width: 100%;
  position: relative;
}
.nav-reserve-content ul.nav-sp-content-list {
  margin-bottom: 10%;
  list-style: none;
  width: 100%;
  font-size: 1.8rem;
}
.nav-reserve-content ul.nav-sp-content-list li {
  width: 100%;
}
.nav-reserve-content ul.nav-sp-content-list li a {
  display: inline-block;
  width: 100%;
  padding: 1em;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  text-decoration: none;
}
.nav-reserve-content ul.nav-sp-content-list li a, .nav-reserve-content ul.nav-sp-content-list li a:link, .nav-reserve-content ul.nav-sp-content-list li a:visited {
  color: #fff;
}
.nav-reserve-content ul.nav-sp-content-list li a:hover, .nav-reserve-content ul.nav-sp-content-list li a:active {
  text-decoration: none;
  color: #fff;
}
.nav-reserve-content ul.nav-sp-content-list li a:last-child {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.nav-reserve-content-contact {
  width: 100%;
}
.nav-reserve-content-contact a {
  color: #fff;
  text-decoration: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-end;
  font-size: 1.6rem;
}
.nav-reserve-content-contact a span {
  display: inline-block;
}
.nav-reserve-content-contact a span.nav-sp-content-contact-02 {
  font-size: 1.3em;
  margin: 0 0.1em 0 0.3em;
}
.nav-reserve-content-contact a span.nav-sp-content-contact-03 {
  font-size: 0.8em;
}
.nav-reserve-content-bnr {
  width: 100%;
  padding-top: 5%;
}
.nav-reserve-content-bnr h3 {
  color: #fff;
}
.nav-reserve-content .close-bo {
  width: 30px;
  height: 30px;
  position: absolute;
  right: 3%;
  top: 3%;
}
@media screen and (max-width: 767px) {
  .nav-reserve-content .close-bo {
    position: fixed;
    padding: 15px;
    right: 0;
    top: 0;
  }
}
.nav-reserve-content .close-bo::before, .nav-reserve-content .close-bo::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  top: 50%;
  left: 0;
  position: absolute;
  background: #333;
}
.nav-reserve-content .close-bo::before {
  transform: rotate(45deg);
}
.nav-reserve-content .close-bo::after {
  transform: rotate(-45deg);
}

.hamburger-c {
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
}
@media screen and (max-width: 767px) {
  .hamburger-c {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: stretch;
    align-items: center;
    right: 0;
    top: 0;
    z-index: 999;
  }
}
.hamburger-c .menu-trigger,
.hamburger-c .menu-trigger span {
  display: inline-block;
  transition: all 0.4s;
  box-sizing: border-box;
}
.hamburger-c .menu-trigger {
  position: relative;
  width: 30px !important;
  height: 19px !important;
  z-index: 110;
  padding: 0;
}
.hamburger-c .menu-trigger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #fff;
}
.hamburger-c .menu-trigger.active span {
  background-color: #fff;
}
.hamburger-c .menu-trigger span:nth-of-type(1) {
  top: 0;
}
.hamburger-c .menu-trigger span:nth-of-type(2) {
  top: 9px;
}
.hamburger-c .menu-trigger span:nth-of-type(3) {
  bottom: 0;
}
.hamburger-c .menu-trigger.active span:nth-of-type(1) {
  -webkit-transform: translateY(9px) rotate(-45deg);
  transform: translateY(9px) rotate(-45deg);
}
.hamburger-c .menu-trigger.active span:nth-of-type(2) {
  opacity: 0;
}
.hamburger-c .menu-trigger.active span:nth-of-type(3) {
  -webkit-transform: translateY(-8px) rotate(45deg);
  transform: translateY(-8px) rotate(45deg);
}

.morelink a {
  display: inline-block;
  padding: 0.8em 2em;
  font-size: 1.8rem;
  text-decoration: none;
  line-height: 1;
  position: relative;
  text-decoration: none;
}
.morelink a, .morelink a:link, .morelink a:visited {
  color: #000;
}
.morelink a:hover, .morelink a:active {
  text-decoration: none;
  color: #000;
}
.morelink a::after {
  display: inline-block;
  content: "";
  width: 100%;
  background-color: #000;
  height: 1px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  opacity: 0.2;
}
.morelink a::before {
  display: inline-block;
  content: "";
  width: 0.4em;
  height: 0.4em;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  transform: rotate(-45deg) translateY(-52%);
  position: absolute;
  right: 0.5em;
  top: 50%;
}

.area-bnr {
  width: 100%;
  padding: 0 0 4% 0;
}
@media screen and (max-width: 767px) {
  .area-bnr {
    padding: 0px 0 50px;
  }
}
.area-bnr .inner {
  width: 100%;
}
.area-bnr .title {
  font-size: 2rem;
}
.area-bnr .bnr-list {
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.area-bnr .bnr {
  font-size: 1.8rem;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .area-bnr .bnr {
    width: 100%;
    margin-bottom: 3%;
  }
}
@media screen and (max-width: 767px) {
  .area-bnr .bnr:last-child {
    margin-bottom: 0;
  }
}
.area-bnr .bnr a {
  display: inline-block;
  text-decoration: none;
  width: 100%;
  color: #fff;
  transition: opacity 0.5s;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}
.area-bnr .bnr a:hover {
  opacity: 0.8;
}
.area-bnr .bnr a span {
  display: inline-block;
  width: 100%;
  text-align: center;
}
.area-bnr .bnr a span:nth-of-type(2) {
  font-size: 0.7em;
}
.area-bnr .bnr.bnr-crystalgroup {
  position: relative;
  z-index: 0;
}
@media screen and (max-width: 767px) {
  .area-bnr .bnr.bnr-crystalgroup {
    margin-top: 0;
  }
}
.area-bnr .bnr.bnr-crystalgroup p {
  text-align: center;
  z-index: 1;
  position: relative;
}
.area-bnr .bnr.bnr-crystalgroup a::before {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 0;
  background: #000;
  opacity: 0.4;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transition: opacity 0.5s;
}
.area-bnr .bnr.bnr-crystalgroup img {
  width: 60%;
  max-width: 280px;
}
.area-bnr .bnr.bnr-crystalgroup .bnr-crystalgroup-bg {
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  align-content: stretch;
}
.area-bnr .bnr.bnr-crystalgroup .bnr-crystalgroup-bg > div {
  width: 25%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.hotel-info {
  background-color: #f2f3f5;
  padding: 8em 0;
}
.hotel-info .inner {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}
.hotel-info h1 {
  width: 90%;
  margin: 0 auto 1em;
  max-width: 230px;
}
.hotel-info h1 img {
  width: 100%;
}
.hotel-info-content {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  letter-spacing: 0;
  color: #fff;
}
@media screen and (max-width: 1099px) {
  .hotel-info-content {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .hotel-info-content {
    font-size: 3.6vw;
  }
}
.hotel-info-content a {
  text-decoration: none;
}
.hotel-info-content a, .hotel-info-content a:link, .hotel-info-content a:visited {
  color: #fff;
}
.hotel-info-content a:hover, .hotel-info-content a:active {
  text-decoration: none;
  color: #fff;
}
.hotel-info-content span {
  color: #fff;
}
@media screen and (max-width: 767px) {
  .hotel-info-content {
    margin-top: 2rem;
    text-align: center;
  }
}
.hotel-info-content-contact {
  width: 100%;
}
.hotel-info-content-contact a {
  line-height: 1;
  text-decoration: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-end;
  font-size: 1.4rem;
}
.hotel-info-content-contact a span {
  display: inline-block;
}
.hotel-info-content-contact-address {
  width: 100%;
  text-align: center;
  margin-bottom: 0.5em;
}
.hotel-info-content-contact-address p {
  width: 100%;
  font-size: 1.4rem;
  text-align: center;
  line-height: 1.5;
}
.hotel-info-content-contact-sns {
  display: flex;
  justify-content: center;
  margin-top: 3rem;
}
.hotel-info-content-contact-sns > a {
  margin: 0 10px;
  display: inline-block;
  width: 30px;
}
.hotel-info-content .instagram {
  width: 2rem;
  display: inline-flex;
  justify-content: center;
  align-content: center;
}

.contactBtn {
  border: 1px solid rgba(115, 95, 81, 0.3);
  color: #735F51;
  font-size: 1em;
  padding: 0.6em;
  margin-right: 1em;
}

.breadcrumbs {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1400px;
  font-size: 1.2rem;
  padding: 1em 0;
}
.breadcrumbs ul {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
}
.breadcrumbs ul li:nth-of-type(n+2) {
  margin-left: 0.5em;
}
.breadcrumbs ul li:nth-of-type(n+2)::before {
  content: ">";
  margin-right: 0.5em;
  color: #888;
}
.breadcrumbs ul li a {
  text-decoration: none;
}
.breadcrumbs ul li a, .breadcrumbs ul li a:link, .breadcrumbs ul li a:visited {
  color: #333;
}
.breadcrumbs ul li a:hover, .breadcrumbs ul li a:active {
  text-decoration: none;
  color: #333;
}
.breadcrumbs ul li span {
  color: #888;
}
.breadcrumbs ul li a, .breadcrumbs ul li span {
  display: inline-block;
}

.caption {
  font-size: 12px;
}

.comingsoon {
  width: 90%;
  text-align: center;
  margin: 0 auto;
}
.comingsoon p {
  text-align: center;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  padding: 5% 0;
}
@media screen and (max-width: 1099px) {
  .comingsoon p {
    font-size: 2.16vw;
  }
}
@media screen and (max-width: 767px) {
  .comingsoon p {
    font-size: 5.4vw;
  }
}
@media screen and (max-width: 767px) {
  .comingsoon p {
    padding: 15% 0;
  }
}
.comingsoon p:after {
  content: "ただいま準備中です、しばらくお待ちください";
  display: inline-block;
  width: 100%;
  text-align: center;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 0.8em;
  margin-top: 1em;
}

.top-bnr-inner {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 800px;
  padding: 5rem 0 0;
}

.text-xxxxl {
  font-size: 4rem;
  font-weight: normal;
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  .text-xxxxl {
    font-size: 3.2rem;
  }
}

.text-xxxl {
  font-size: 3.2rem;
  font-weight: normal;
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  .text-xxxl {
    font-size: 2.8rem;
  }
}

.text-xxl {
  font-size: 2.8rem;
  font-weight: normal;
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  .text-xxl {
    font-size: 2.6rem;
  }
}

.text-xl {
  font-size: 2.4rem;
  font-weight: normal;
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  .text-xl {
    font-size: 2rem;
  }
}

.text-l {
  font-size: 1.7rem;
  font-weight: normal;
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  .text-l {
    font-size: 1.5rem;
  }
}

.text-r {
  font-size: 1.6rem;
  font-weight: normal;
  line-height: 2;
}
@media screen and (max-width: 767px) {
  .text-r {
    font-size: 1.4rem;
  }
}

.text-s {
  font-size: 1.4rem;
  font-weight: normal;
  line-height: 2;
}
@media screen and (max-width: 767px) {
  .text-s {
    font-size: 1.2rem;
  }
}

.text-xs {
  font-size: 1.2rem;
  font-weight: normal;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .text-xs {
    font-size: 1rem;
  }
}

.flex {
  display: flex;
}

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

@media screen and (max-width: 767px) {
  .sp-text-center {
    text-align: center;
  }
}

.text-justify {
  text-align: justify;
}

@media screen and (max-width: 767px) {
  .sp-text-justify {
    text-align: justify;
  }
}

.underline {
  text-decoration: underline !important;
}

.sans-serif {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 300;
}

.serif {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}

.border-b {
  border-bottom: 1px solid rgba(115, 95, 81, 0.2);
}

.border-t {
  border-top: 1px solid rgba(115, 95, 81, 0.2);
}

.color-lblue {
  color: #735F51;
}

.color-main {
  color: #735F51;
}

.color-light {
  color: #fff;
}

.color-dark {
  color: #735F51;
}

.reserve-btn-left {
  position: fixed;
  opacity: 0;
  transition: opacity 0.5s;
  visibility: hidden;
  left: 0;
  bottom: 1rem;
  z-index: 10;
}
.scrolled .reserve-btn-left {
  opacity: 1;
  visibility: visible;
}
.reserve-btn-left a {
  padding: 2em 1em;
  background: #003f87;
  color: #fff;
  font-size: 1.9rem;
  display: inline-block;
  cursor: pointer;
  transition: background 0.5s, color 0.5s;
}
.reserve-btn-left a:hover {
  background: #004ba1;
  color: #fff;
}
.reserve-btn-left a span {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
@media screen and (max-width: 767px) {
  .reserve-btn-left {
    display: none;
  }
}

.rooms-detail button.modalTrg, .rooms-detail button.close {
  display: block;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  padding: 0.5em;
  background: none;
  font-weight: normal;
  line-height: 1;
  cursor: pointer;
  transition: all 0.5s;
}
@media screen and (max-width: 1099px) {
  .rooms-detail button.modalTrg, .rooms-detail button.close {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail button.modalTrg, .rooms-detail button.close {
    font-size: 3.6vw;
  }
}
.rooms-detail button.modalTrg:hover, .rooms-detail button.close:hover {
  opacity: 0.7;
}
@media screen and (max-width: 767px) {
  .rooms-detail button.modalTrg, .rooms-detail button.close {
    font-size: 1.3rem;
  }
}
.rooms-detail button.close {
  color: #735F51;
}
.rooms-detail button.modalTrg {
  border: none;
  width: 100%;
  color: #735F51;
  border-bottom: 1px solid rgba(115, 95, 81, 0.3);
  display: inline-flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .rooms-detail button.modalTrg {
    margin-top: 1rem;
  }
}
.rooms-detail button.modalTrg .arrw {
  position: relative;
  width: 3rem;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.rooms-detail button.modalTrg .arrw::before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  position: absolute;
  left: 0;
  background: #735F51;
  z-index: 0;
  transition: all 1.3s ease-out;
}
.rooms-detail button.modalTrg .arrw::after {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  border-right: 1px solid #735F51;
  border-bottom: 1px solid #735F51;
  transform: rotate(-45deg);
  transition: all 1.3s ease-out;
}
.rooms-detail button.close {
  border: 1px solid #aaa;
  margin: 1rem auto;
  padding: 0.5em 2rem;
  width: auto;
}
.rooms-detail .modal-container {
  position: fixed;
  z-index: 10;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transition: all 0.5s;
  visibility: hidden;
  opacity: 0;
}
.rooms-detail .modal-container.show {
  visibility: visible;
  opacity: 1;
}
.rooms-detail .modal-container .overlay {
  position: absolute;
  z-index: 10;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1rem;
}
.rooms-detail .modal-container .overlay > div {
  max-height: 90%;
  max-width: 90%;
  background: #fff;
  border-radius: 10px;
  padding: 2%;
}
.rooms-detail .modal-container .overlay > div figure {
  max-height: 100vh;
  max-width: 100vh;
}
.rooms-detail .modal-container .overlay > div figure img {
  max-height: 100%;
  max-width: 100%;
  object-fit: contain;
  aspect-ratio: 1.8;
}

body.modalOpen {
  overflow: hidden;
}

.mt-0 {
  margin-top: 0rem;
}
@media screen and (max-width: 767px) {
  .mt-0 {
    margin-top: calc( 0rem * .7);
  }
}

.mb-0 {
  margin-bottom: 0rem;
}
@media screen and (max-width: 767px) {
  .mb-0 {
    margin-bottom: calc( 0rem * .7);
  }
}

.ml-0 {
  margin-left: 0rem;
}
@media screen and (max-width: 767px) {
  .ml-0 {
    margin-left: calc( 0rem * .7);
  }
}

.mr-0 {
  margin-right: 0rem;
}
@media screen and (max-width: 767px) {
  .mr-0 {
    margin-right: calc( 0rem * .7);
  }
}

.mx-0 {
  margin-left: 0rem;
  margin-right: 0rem;
}
@media screen and (max-width: 767px) {
  .mx-0 {
    margin-left: calc( 0rem * .7);
    margin-right: calc( 0rem * .7);
  }
}

.my-0 {
  margin-top: 0rem;
  margin-bottom: 0rem;
}
@media screen and (max-width: 767px) {
  .my-0 {
    margin-top: calc( 0rem * .7);
    margin-bottom: calc( 0rem * .7);
  }
}

.pt-0 {
  padding-top: 0rem;
}
@media screen and (max-width: 767px) {
  .pt-0 {
    padding-top: calc( 0rem * .7);
  }
}

.pb-0 {
  padding-bottom: 0rem;
}
@media screen and (max-width: 767px) {
  .pb-0 {
    padding-bottom: calc( 0rem * .7);
  }
}

.pl-0 {
  padding-left: 0rem;
}
@media screen and (max-width: 767px) {
  .pl-0 {
    padding-left: calc( 0rem * .7);
  }
}

.pr-0 {
  padding-right: 0rem;
}
@media screen and (max-width: 767px) {
  .pr-0 {
    padding-right: calc( 0rem * .7);
  }
}

.px-0 {
  padding-left: 0rem;
  padding-right: 0rem;
}
@media screen and (max-width: 767px) {
  .px-0 {
    padding-left: calc( 0rem * .7);
    padding-right: calc( 0rem * .7);
  }
}

.py-0 {
  padding-top: 0rem;
  padding-bottom: 0rem;
}
@media screen and (max-width: 767px) {
  .py-0 {
    padding-top: calc( 0rem * .7);
    padding-bottom: calc( 0rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-0 {
    margin-top: 0rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-0 {
    margin-bottom: 0rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-0 {
    margin-bottom: 0rem !important;
    margin-top: 0rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-0 {
    padding-top: 0rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-0 {
    padding-bottom: 0rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-0 {
    padding-bottom: 0rem !important;
    padding-top: 0rem !important;
  }
}

.mt-1 {
  margin-top: 1rem;
}
@media screen and (max-width: 767px) {
  .mt-1 {
    margin-top: calc( 1rem * .7);
  }
}

.mb-1 {
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .mb-1 {
    margin-bottom: calc( 1rem * .7);
  }
}

.ml-1 {
  margin-left: 1rem;
}
@media screen and (max-width: 767px) {
  .ml-1 {
    margin-left: calc( 1rem * .7);
  }
}

.mr-1 {
  margin-right: 1rem;
}
@media screen and (max-width: 767px) {
  .mr-1 {
    margin-right: calc( 1rem * .7);
  }
}

.mx-1 {
  margin-left: 1rem;
  margin-right: 1rem;
}
@media screen and (max-width: 767px) {
  .mx-1 {
    margin-left: calc( 1rem * .7);
    margin-right: calc( 1rem * .7);
  }
}

.my-1 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .my-1 {
    margin-top: calc( 1rem * .7);
    margin-bottom: calc( 1rem * .7);
  }
}

.pt-1 {
  padding-top: 1rem;
}
@media screen and (max-width: 767px) {
  .pt-1 {
    padding-top: calc( 1rem * .7);
  }
}

.pb-1 {
  padding-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .pb-1 {
    padding-bottom: calc( 1rem * .7);
  }
}

.pl-1 {
  padding-left: 1rem;
}
@media screen and (max-width: 767px) {
  .pl-1 {
    padding-left: calc( 1rem * .7);
  }
}

.pr-1 {
  padding-right: 1rem;
}
@media screen and (max-width: 767px) {
  .pr-1 {
    padding-right: calc( 1rem * .7);
  }
}

.px-1 {
  padding-left: 1rem;
  padding-right: 1rem;
}
@media screen and (max-width: 767px) {
  .px-1 {
    padding-left: calc( 1rem * .7);
    padding-right: calc( 1rem * .7);
  }
}

.py-1 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .py-1 {
    padding-top: calc( 1rem * .7);
    padding-bottom: calc( 1rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-1 {
    margin-top: 1rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-1 {
    margin-bottom: 1rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-1 {
    margin-bottom: 1rem !important;
    margin-top: 1rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-1 {
    padding-top: 1rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-1 {
    padding-bottom: 1rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-1 {
    padding-bottom: 1rem !important;
    padding-top: 1rem !important;
  }
}

.mt-2 {
  margin-top: 2rem;
}
@media screen and (max-width: 767px) {
  .mt-2 {
    margin-top: calc( 2rem * .7);
  }
}

.mb-2 {
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .mb-2 {
    margin-bottom: calc( 2rem * .7);
  }
}

.ml-2 {
  margin-left: 2rem;
}
@media screen and (max-width: 767px) {
  .ml-2 {
    margin-left: calc( 2rem * .7);
  }
}

.mr-2 {
  margin-right: 2rem;
}
@media screen and (max-width: 767px) {
  .mr-2 {
    margin-right: calc( 2rem * .7);
  }
}

.mx-2 {
  margin-left: 2rem;
  margin-right: 2rem;
}
@media screen and (max-width: 767px) {
  .mx-2 {
    margin-left: calc( 2rem * .7);
    margin-right: calc( 2rem * .7);
  }
}

.my-2 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .my-2 {
    margin-top: calc( 2rem * .7);
    margin-bottom: calc( 2rem * .7);
  }
}

.pt-2 {
  padding-top: 2rem;
}
@media screen and (max-width: 767px) {
  .pt-2 {
    padding-top: calc( 2rem * .7);
  }
}

.pb-2 {
  padding-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .pb-2 {
    padding-bottom: calc( 2rem * .7);
  }
}

.pl-2 {
  padding-left: 2rem;
}
@media screen and (max-width: 767px) {
  .pl-2 {
    padding-left: calc( 2rem * .7);
  }
}

.pr-2 {
  padding-right: 2rem;
}
@media screen and (max-width: 767px) {
  .pr-2 {
    padding-right: calc( 2rem * .7);
  }
}

.px-2 {
  padding-left: 2rem;
  padding-right: 2rem;
}
@media screen and (max-width: 767px) {
  .px-2 {
    padding-left: calc( 2rem * .7);
    padding-right: calc( 2rem * .7);
  }
}

.py-2 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .py-2 {
    padding-top: calc( 2rem * .7);
    padding-bottom: calc( 2rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-2 {
    margin-top: 2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-2 {
    margin-bottom: 2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-2 {
    margin-bottom: 2rem !important;
    margin-top: 2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-2 {
    padding-top: 2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-2 {
    padding-bottom: 2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-2 {
    padding-bottom: 2rem !important;
    padding-top: 2rem !important;
  }
}

.mt-3 {
  margin-top: 3rem;
}
@media screen and (max-width: 767px) {
  .mt-3 {
    margin-top: calc( 3rem * .7);
  }
}

.mb-3 {
  margin-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .mb-3 {
    margin-bottom: calc( 3rem * .7);
  }
}

.ml-3 {
  margin-left: 3rem;
}
@media screen and (max-width: 767px) {
  .ml-3 {
    margin-left: calc( 3rem * .7);
  }
}

.mr-3 {
  margin-right: 3rem;
}
@media screen and (max-width: 767px) {
  .mr-3 {
    margin-right: calc( 3rem * .7);
  }
}

.mx-3 {
  margin-left: 3rem;
  margin-right: 3rem;
}
@media screen and (max-width: 767px) {
  .mx-3 {
    margin-left: calc( 3rem * .7);
    margin-right: calc( 3rem * .7);
  }
}

.my-3 {
  margin-top: 3rem;
  margin-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .my-3 {
    margin-top: calc( 3rem * .7);
    margin-bottom: calc( 3rem * .7);
  }
}

.pt-3 {
  padding-top: 3rem;
}
@media screen and (max-width: 767px) {
  .pt-3 {
    padding-top: calc( 3rem * .7);
  }
}

.pb-3 {
  padding-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .pb-3 {
    padding-bottom: calc( 3rem * .7);
  }
}

.pl-3 {
  padding-left: 3rem;
}
@media screen and (max-width: 767px) {
  .pl-3 {
    padding-left: calc( 3rem * .7);
  }
}

.pr-3 {
  padding-right: 3rem;
}
@media screen and (max-width: 767px) {
  .pr-3 {
    padding-right: calc( 3rem * .7);
  }
}

.px-3 {
  padding-left: 3rem;
  padding-right: 3rem;
}
@media screen and (max-width: 767px) {
  .px-3 {
    padding-left: calc( 3rem * .7);
    padding-right: calc( 3rem * .7);
  }
}

.py-3 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .py-3 {
    padding-top: calc( 3rem * .7);
    padding-bottom: calc( 3rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-3 {
    margin-top: 3rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-3 {
    margin-bottom: 3rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-3 {
    margin-bottom: 3rem !important;
    margin-top: 3rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-3 {
    padding-top: 3rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-3 {
    padding-bottom: 3rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-3 {
    padding-bottom: 3rem !important;
    padding-top: 3rem !important;
  }
}

.mt-4 {
  margin-top: 4rem;
}
@media screen and (max-width: 767px) {
  .mt-4 {
    margin-top: calc( 4rem * .7);
  }
}

.mb-4 {
  margin-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .mb-4 {
    margin-bottom: calc( 4rem * .7);
  }
}

.ml-4 {
  margin-left: 4rem;
}
@media screen and (max-width: 767px) {
  .ml-4 {
    margin-left: calc( 4rem * .7);
  }
}

.mr-4 {
  margin-right: 4rem;
}
@media screen and (max-width: 767px) {
  .mr-4 {
    margin-right: calc( 4rem * .7);
  }
}

.mx-4 {
  margin-left: 4rem;
  margin-right: 4rem;
}
@media screen and (max-width: 767px) {
  .mx-4 {
    margin-left: calc( 4rem * .7);
    margin-right: calc( 4rem * .7);
  }
}

.my-4 {
  margin-top: 4rem;
  margin-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .my-4 {
    margin-top: calc( 4rem * .7);
    margin-bottom: calc( 4rem * .7);
  }
}

.pt-4 {
  padding-top: 4rem;
}
@media screen and (max-width: 767px) {
  .pt-4 {
    padding-top: calc( 4rem * .7);
  }
}

.pb-4 {
  padding-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .pb-4 {
    padding-bottom: calc( 4rem * .7);
  }
}

.pl-4 {
  padding-left: 4rem;
}
@media screen and (max-width: 767px) {
  .pl-4 {
    padding-left: calc( 4rem * .7);
  }
}

.pr-4 {
  padding-right: 4rem;
}
@media screen and (max-width: 767px) {
  .pr-4 {
    padding-right: calc( 4rem * .7);
  }
}

.px-4 {
  padding-left: 4rem;
  padding-right: 4rem;
}
@media screen and (max-width: 767px) {
  .px-4 {
    padding-left: calc( 4rem * .7);
    padding-right: calc( 4rem * .7);
  }
}

.py-4 {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .py-4 {
    padding-top: calc( 4rem * .7);
    padding-bottom: calc( 4rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-4 {
    margin-top: 4rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-4 {
    margin-bottom: 4rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-4 {
    margin-bottom: 4rem !important;
    margin-top: 4rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-4 {
    padding-top: 4rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-4 {
    padding-bottom: 4rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-4 {
    padding-bottom: 4rem !important;
    padding-top: 4rem !important;
  }
}

.mt-5 {
  margin-top: 5rem;
}
@media screen and (max-width: 767px) {
  .mt-5 {
    margin-top: calc( 5rem * .7);
  }
}

.mb-5 {
  margin-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .mb-5 {
    margin-bottom: calc( 5rem * .7);
  }
}

.ml-5 {
  margin-left: 5rem;
}
@media screen and (max-width: 767px) {
  .ml-5 {
    margin-left: calc( 5rem * .7);
  }
}

.mr-5 {
  margin-right: 5rem;
}
@media screen and (max-width: 767px) {
  .mr-5 {
    margin-right: calc( 5rem * .7);
  }
}

.mx-5 {
  margin-left: 5rem;
  margin-right: 5rem;
}
@media screen and (max-width: 767px) {
  .mx-5 {
    margin-left: calc( 5rem * .7);
    margin-right: calc( 5rem * .7);
  }
}

.my-5 {
  margin-top: 5rem;
  margin-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .my-5 {
    margin-top: calc( 5rem * .7);
    margin-bottom: calc( 5rem * .7);
  }
}

.pt-5 {
  padding-top: 5rem;
}
@media screen and (max-width: 767px) {
  .pt-5 {
    padding-top: calc( 5rem * .7);
  }
}

.pb-5 {
  padding-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .pb-5 {
    padding-bottom: calc( 5rem * .7);
  }
}

.pl-5 {
  padding-left: 5rem;
}
@media screen and (max-width: 767px) {
  .pl-5 {
    padding-left: calc( 5rem * .7);
  }
}

.pr-5 {
  padding-right: 5rem;
}
@media screen and (max-width: 767px) {
  .pr-5 {
    padding-right: calc( 5rem * .7);
  }
}

.px-5 {
  padding-left: 5rem;
  padding-right: 5rem;
}
@media screen and (max-width: 767px) {
  .px-5 {
    padding-left: calc( 5rem * .7);
    padding-right: calc( 5rem * .7);
  }
}

.py-5 {
  padding-top: 5rem;
  padding-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .py-5 {
    padding-top: calc( 5rem * .7);
    padding-bottom: calc( 5rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-5 {
    margin-top: 5rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-5 {
    margin-bottom: 5rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-5 {
    margin-bottom: 5rem !important;
    margin-top: 5rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-5 {
    padding-top: 5rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-5 {
    padding-bottom: 5rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-5 {
    padding-bottom: 5rem !important;
    padding-top: 5rem !important;
  }
}

.mt-6 {
  margin-top: 6rem;
}
@media screen and (max-width: 767px) {
  .mt-6 {
    margin-top: calc( 6rem * .7);
  }
}

.mb-6 {
  margin-bottom: 6rem;
}
@media screen and (max-width: 767px) {
  .mb-6 {
    margin-bottom: calc( 6rem * .7);
  }
}

.ml-6 {
  margin-left: 6rem;
}
@media screen and (max-width: 767px) {
  .ml-6 {
    margin-left: calc( 6rem * .7);
  }
}

.mr-6 {
  margin-right: 6rem;
}
@media screen and (max-width: 767px) {
  .mr-6 {
    margin-right: calc( 6rem * .7);
  }
}

.mx-6 {
  margin-left: 6rem;
  margin-right: 6rem;
}
@media screen and (max-width: 767px) {
  .mx-6 {
    margin-left: calc( 6rem * .7);
    margin-right: calc( 6rem * .7);
  }
}

.my-6 {
  margin-top: 6rem;
  margin-bottom: 6rem;
}
@media screen and (max-width: 767px) {
  .my-6 {
    margin-top: calc( 6rem * .7);
    margin-bottom: calc( 6rem * .7);
  }
}

.pt-6 {
  padding-top: 6rem;
}
@media screen and (max-width: 767px) {
  .pt-6 {
    padding-top: calc( 6rem * .7);
  }
}

.pb-6 {
  padding-bottom: 6rem;
}
@media screen and (max-width: 767px) {
  .pb-6 {
    padding-bottom: calc( 6rem * .7);
  }
}

.pl-6 {
  padding-left: 6rem;
}
@media screen and (max-width: 767px) {
  .pl-6 {
    padding-left: calc( 6rem * .7);
  }
}

.pr-6 {
  padding-right: 6rem;
}
@media screen and (max-width: 767px) {
  .pr-6 {
    padding-right: calc( 6rem * .7);
  }
}

.px-6 {
  padding-left: 6rem;
  padding-right: 6rem;
}
@media screen and (max-width: 767px) {
  .px-6 {
    padding-left: calc( 6rem * .7);
    padding-right: calc( 6rem * .7);
  }
}

.py-6 {
  padding-top: 6rem;
  padding-bottom: 6rem;
}
@media screen and (max-width: 767px) {
  .py-6 {
    padding-top: calc( 6rem * .7);
    padding-bottom: calc( 6rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-6 {
    margin-top: 6rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-6 {
    margin-bottom: 6rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-6 {
    margin-bottom: 6rem !important;
    margin-top: 6rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-6 {
    padding-top: 6rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-6 {
    padding-bottom: 6rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-6 {
    padding-bottom: 6rem !important;
    padding-top: 6rem !important;
  }
}

.mt-7 {
  margin-top: 7rem;
}
@media screen and (max-width: 767px) {
  .mt-7 {
    margin-top: calc( 7rem * .7);
  }
}

.mb-7 {
  margin-bottom: 7rem;
}
@media screen and (max-width: 767px) {
  .mb-7 {
    margin-bottom: calc( 7rem * .7);
  }
}

.ml-7 {
  margin-left: 7rem;
}
@media screen and (max-width: 767px) {
  .ml-7 {
    margin-left: calc( 7rem * .7);
  }
}

.mr-7 {
  margin-right: 7rem;
}
@media screen and (max-width: 767px) {
  .mr-7 {
    margin-right: calc( 7rem * .7);
  }
}

.mx-7 {
  margin-left: 7rem;
  margin-right: 7rem;
}
@media screen and (max-width: 767px) {
  .mx-7 {
    margin-left: calc( 7rem * .7);
    margin-right: calc( 7rem * .7);
  }
}

.my-7 {
  margin-top: 7rem;
  margin-bottom: 7rem;
}
@media screen and (max-width: 767px) {
  .my-7 {
    margin-top: calc( 7rem * .7);
    margin-bottom: calc( 7rem * .7);
  }
}

.pt-7 {
  padding-top: 7rem;
}
@media screen and (max-width: 767px) {
  .pt-7 {
    padding-top: calc( 7rem * .7);
  }
}

.pb-7 {
  padding-bottom: 7rem;
}
@media screen and (max-width: 767px) {
  .pb-7 {
    padding-bottom: calc( 7rem * .7);
  }
}

.pl-7 {
  padding-left: 7rem;
}
@media screen and (max-width: 767px) {
  .pl-7 {
    padding-left: calc( 7rem * .7);
  }
}

.pr-7 {
  padding-right: 7rem;
}
@media screen and (max-width: 767px) {
  .pr-7 {
    padding-right: calc( 7rem * .7);
  }
}

.px-7 {
  padding-left: 7rem;
  padding-right: 7rem;
}
@media screen and (max-width: 767px) {
  .px-7 {
    padding-left: calc( 7rem * .7);
    padding-right: calc( 7rem * .7);
  }
}

.py-7 {
  padding-top: 7rem;
  padding-bottom: 7rem;
}
@media screen and (max-width: 767px) {
  .py-7 {
    padding-top: calc( 7rem * .7);
    padding-bottom: calc( 7rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-7 {
    margin-top: 7rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-7 {
    margin-bottom: 7rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-7 {
    margin-bottom: 7rem !important;
    margin-top: 7rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-7 {
    padding-top: 7rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-7 {
    padding-bottom: 7rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-7 {
    padding-bottom: 7rem !important;
    padding-top: 7rem !important;
  }
}

.mt-8 {
  margin-top: 8rem;
}
@media screen and (max-width: 767px) {
  .mt-8 {
    margin-top: calc( 8rem * .7);
  }
}

.mb-8 {
  margin-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .mb-8 {
    margin-bottom: calc( 8rem * .7);
  }
}

.ml-8 {
  margin-left: 8rem;
}
@media screen and (max-width: 767px) {
  .ml-8 {
    margin-left: calc( 8rem * .7);
  }
}

.mr-8 {
  margin-right: 8rem;
}
@media screen and (max-width: 767px) {
  .mr-8 {
    margin-right: calc( 8rem * .7);
  }
}

.mx-8 {
  margin-left: 8rem;
  margin-right: 8rem;
}
@media screen and (max-width: 767px) {
  .mx-8 {
    margin-left: calc( 8rem * .7);
    margin-right: calc( 8rem * .7);
  }
}

.my-8 {
  margin-top: 8rem;
  margin-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .my-8 {
    margin-top: calc( 8rem * .7);
    margin-bottom: calc( 8rem * .7);
  }
}

.pt-8 {
  padding-top: 8rem;
}
@media screen and (max-width: 767px) {
  .pt-8 {
    padding-top: calc( 8rem * .7);
  }
}

.pb-8 {
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .pb-8 {
    padding-bottom: calc( 8rem * .7);
  }
}

.pl-8 {
  padding-left: 8rem;
}
@media screen and (max-width: 767px) {
  .pl-8 {
    padding-left: calc( 8rem * .7);
  }
}

.pr-8 {
  padding-right: 8rem;
}
@media screen and (max-width: 767px) {
  .pr-8 {
    padding-right: calc( 8rem * .7);
  }
}

.px-8 {
  padding-left: 8rem;
  padding-right: 8rem;
}
@media screen and (max-width: 767px) {
  .px-8 {
    padding-left: calc( 8rem * .7);
    padding-right: calc( 8rem * .7);
  }
}

.py-8 {
  padding-top: 8rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .py-8 {
    padding-top: calc( 8rem * .7);
    padding-bottom: calc( 8rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-8 {
    margin-top: 8rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-8 {
    margin-bottom: 8rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-8 {
    margin-bottom: 8rem !important;
    margin-top: 8rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-8 {
    padding-top: 8rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-8 {
    padding-bottom: 8rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-8 {
    padding-bottom: 8rem !important;
    padding-top: 8rem !important;
  }
}

.mt-9 {
  margin-top: 9rem;
}
@media screen and (max-width: 767px) {
  .mt-9 {
    margin-top: calc( 9rem * .7);
  }
}

.mb-9 {
  margin-bottom: 9rem;
}
@media screen and (max-width: 767px) {
  .mb-9 {
    margin-bottom: calc( 9rem * .7);
  }
}

.ml-9 {
  margin-left: 9rem;
}
@media screen and (max-width: 767px) {
  .ml-9 {
    margin-left: calc( 9rem * .7);
  }
}

.mr-9 {
  margin-right: 9rem;
}
@media screen and (max-width: 767px) {
  .mr-9 {
    margin-right: calc( 9rem * .7);
  }
}

.mx-9 {
  margin-left: 9rem;
  margin-right: 9rem;
}
@media screen and (max-width: 767px) {
  .mx-9 {
    margin-left: calc( 9rem * .7);
    margin-right: calc( 9rem * .7);
  }
}

.my-9 {
  margin-top: 9rem;
  margin-bottom: 9rem;
}
@media screen and (max-width: 767px) {
  .my-9 {
    margin-top: calc( 9rem * .7);
    margin-bottom: calc( 9rem * .7);
  }
}

.pt-9 {
  padding-top: 9rem;
}
@media screen and (max-width: 767px) {
  .pt-9 {
    padding-top: calc( 9rem * .7);
  }
}

.pb-9 {
  padding-bottom: 9rem;
}
@media screen and (max-width: 767px) {
  .pb-9 {
    padding-bottom: calc( 9rem * .7);
  }
}

.pl-9 {
  padding-left: 9rem;
}
@media screen and (max-width: 767px) {
  .pl-9 {
    padding-left: calc( 9rem * .7);
  }
}

.pr-9 {
  padding-right: 9rem;
}
@media screen and (max-width: 767px) {
  .pr-9 {
    padding-right: calc( 9rem * .7);
  }
}

.px-9 {
  padding-left: 9rem;
  padding-right: 9rem;
}
@media screen and (max-width: 767px) {
  .px-9 {
    padding-left: calc( 9rem * .7);
    padding-right: calc( 9rem * .7);
  }
}

.py-9 {
  padding-top: 9rem;
  padding-bottom: 9rem;
}
@media screen and (max-width: 767px) {
  .py-9 {
    padding-top: calc( 9rem * .7);
    padding-bottom: calc( 9rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-9 {
    margin-top: 9rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-9 {
    margin-bottom: 9rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-9 {
    margin-bottom: 9rem !important;
    margin-top: 9rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-9 {
    padding-top: 9rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-9 {
    padding-bottom: 9rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-9 {
    padding-bottom: 9rem !important;
    padding-top: 9rem !important;
  }
}

.mt-10 {
  margin-top: 10rem;
}
@media screen and (max-width: 767px) {
  .mt-10 {
    margin-top: calc( 10rem * .7);
  }
}

.mb-10 {
  margin-bottom: 10rem;
}
@media screen and (max-width: 767px) {
  .mb-10 {
    margin-bottom: calc( 10rem * .7);
  }
}

.ml-10 {
  margin-left: 10rem;
}
@media screen and (max-width: 767px) {
  .ml-10 {
    margin-left: calc( 10rem * .7);
  }
}

.mr-10 {
  margin-right: 10rem;
}
@media screen and (max-width: 767px) {
  .mr-10 {
    margin-right: calc( 10rem * .7);
  }
}

.mx-10 {
  margin-left: 10rem;
  margin-right: 10rem;
}
@media screen and (max-width: 767px) {
  .mx-10 {
    margin-left: calc( 10rem * .7);
    margin-right: calc( 10rem * .7);
  }
}

.my-10 {
  margin-top: 10rem;
  margin-bottom: 10rem;
}
@media screen and (max-width: 767px) {
  .my-10 {
    margin-top: calc( 10rem * .7);
    margin-bottom: calc( 10rem * .7);
  }
}

.pt-10 {
  padding-top: 10rem;
}
@media screen and (max-width: 767px) {
  .pt-10 {
    padding-top: calc( 10rem * .7);
  }
}

.pb-10 {
  padding-bottom: 10rem;
}
@media screen and (max-width: 767px) {
  .pb-10 {
    padding-bottom: calc( 10rem * .7);
  }
}

.pl-10 {
  padding-left: 10rem;
}
@media screen and (max-width: 767px) {
  .pl-10 {
    padding-left: calc( 10rem * .7);
  }
}

.pr-10 {
  padding-right: 10rem;
}
@media screen and (max-width: 767px) {
  .pr-10 {
    padding-right: calc( 10rem * .7);
  }
}

.px-10 {
  padding-left: 10rem;
  padding-right: 10rem;
}
@media screen and (max-width: 767px) {
  .px-10 {
    padding-left: calc( 10rem * .7);
    padding-right: calc( 10rem * .7);
  }
}

.py-10 {
  padding-top: 10rem;
  padding-bottom: 10rem;
}
@media screen and (max-width: 767px) {
  .py-10 {
    padding-top: calc( 10rem * .7);
    padding-bottom: calc( 10rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-10 {
    margin-top: 10rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-10 {
    margin-bottom: 10rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-10 {
    margin-bottom: 10rem !important;
    margin-top: 10rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-10 {
    padding-top: 10rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-10 {
    padding-bottom: 10rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-10 {
    padding-bottom: 10rem !important;
    padding-top: 10rem !important;
  }
}

.mt-11 {
  margin-top: 11rem;
}
@media screen and (max-width: 767px) {
  .mt-11 {
    margin-top: calc( 11rem * .7);
  }
}

.mb-11 {
  margin-bottom: 11rem;
}
@media screen and (max-width: 767px) {
  .mb-11 {
    margin-bottom: calc( 11rem * .7);
  }
}

.ml-11 {
  margin-left: 11rem;
}
@media screen and (max-width: 767px) {
  .ml-11 {
    margin-left: calc( 11rem * .7);
  }
}

.mr-11 {
  margin-right: 11rem;
}
@media screen and (max-width: 767px) {
  .mr-11 {
    margin-right: calc( 11rem * .7);
  }
}

.mx-11 {
  margin-left: 11rem;
  margin-right: 11rem;
}
@media screen and (max-width: 767px) {
  .mx-11 {
    margin-left: calc( 11rem * .7);
    margin-right: calc( 11rem * .7);
  }
}

.my-11 {
  margin-top: 11rem;
  margin-bottom: 11rem;
}
@media screen and (max-width: 767px) {
  .my-11 {
    margin-top: calc( 11rem * .7);
    margin-bottom: calc( 11rem * .7);
  }
}

.pt-11 {
  padding-top: 11rem;
}
@media screen and (max-width: 767px) {
  .pt-11 {
    padding-top: calc( 11rem * .7);
  }
}

.pb-11 {
  padding-bottom: 11rem;
}
@media screen and (max-width: 767px) {
  .pb-11 {
    padding-bottom: calc( 11rem * .7);
  }
}

.pl-11 {
  padding-left: 11rem;
}
@media screen and (max-width: 767px) {
  .pl-11 {
    padding-left: calc( 11rem * .7);
  }
}

.pr-11 {
  padding-right: 11rem;
}
@media screen and (max-width: 767px) {
  .pr-11 {
    padding-right: calc( 11rem * .7);
  }
}

.px-11 {
  padding-left: 11rem;
  padding-right: 11rem;
}
@media screen and (max-width: 767px) {
  .px-11 {
    padding-left: calc( 11rem * .7);
    padding-right: calc( 11rem * .7);
  }
}

.py-11 {
  padding-top: 11rem;
  padding-bottom: 11rem;
}
@media screen and (max-width: 767px) {
  .py-11 {
    padding-top: calc( 11rem * .7);
    padding-bottom: calc( 11rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-11 {
    margin-top: 11rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-11 {
    margin-bottom: 11rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-11 {
    margin-bottom: 11rem !important;
    margin-top: 11rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-11 {
    padding-top: 11rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-11 {
    padding-bottom: 11rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-11 {
    padding-bottom: 11rem !important;
    padding-top: 11rem !important;
  }
}

.mt-12 {
  margin-top: 12rem;
}
@media screen and (max-width: 767px) {
  .mt-12 {
    margin-top: calc( 12rem * .7);
  }
}

.mb-12 {
  margin-bottom: 12rem;
}
@media screen and (max-width: 767px) {
  .mb-12 {
    margin-bottom: calc( 12rem * .7);
  }
}

.ml-12 {
  margin-left: 12rem;
}
@media screen and (max-width: 767px) {
  .ml-12 {
    margin-left: calc( 12rem * .7);
  }
}

.mr-12 {
  margin-right: 12rem;
}
@media screen and (max-width: 767px) {
  .mr-12 {
    margin-right: calc( 12rem * .7);
  }
}

.mx-12 {
  margin-left: 12rem;
  margin-right: 12rem;
}
@media screen and (max-width: 767px) {
  .mx-12 {
    margin-left: calc( 12rem * .7);
    margin-right: calc( 12rem * .7);
  }
}

.my-12 {
  margin-top: 12rem;
  margin-bottom: 12rem;
}
@media screen and (max-width: 767px) {
  .my-12 {
    margin-top: calc( 12rem * .7);
    margin-bottom: calc( 12rem * .7);
  }
}

.pt-12 {
  padding-top: 12rem;
}
@media screen and (max-width: 767px) {
  .pt-12 {
    padding-top: calc( 12rem * .7);
  }
}

.pb-12 {
  padding-bottom: 12rem;
}
@media screen and (max-width: 767px) {
  .pb-12 {
    padding-bottom: calc( 12rem * .7);
  }
}

.pl-12 {
  padding-left: 12rem;
}
@media screen and (max-width: 767px) {
  .pl-12 {
    padding-left: calc( 12rem * .7);
  }
}

.pr-12 {
  padding-right: 12rem;
}
@media screen and (max-width: 767px) {
  .pr-12 {
    padding-right: calc( 12rem * .7);
  }
}

.px-12 {
  padding-left: 12rem;
  padding-right: 12rem;
}
@media screen and (max-width: 767px) {
  .px-12 {
    padding-left: calc( 12rem * .7);
    padding-right: calc( 12rem * .7);
  }
}

.py-12 {
  padding-top: 12rem;
  padding-bottom: 12rem;
}
@media screen and (max-width: 767px) {
  .py-12 {
    padding-top: calc( 12rem * .7);
    padding-bottom: calc( 12rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-12 {
    margin-top: 12rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-12 {
    margin-bottom: 12rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-12 {
    margin-bottom: 12rem !important;
    margin-top: 12rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-12 {
    padding-top: 12rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-12 {
    padding-bottom: 12rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-12 {
    padding-bottom: 12rem !important;
    padding-top: 12rem !important;
  }
}

.mt-13 {
  margin-top: 13rem;
}
@media screen and (max-width: 767px) {
  .mt-13 {
    margin-top: calc( 13rem * .7);
  }
}

.mb-13 {
  margin-bottom: 13rem;
}
@media screen and (max-width: 767px) {
  .mb-13 {
    margin-bottom: calc( 13rem * .7);
  }
}

.ml-13 {
  margin-left: 13rem;
}
@media screen and (max-width: 767px) {
  .ml-13 {
    margin-left: calc( 13rem * .7);
  }
}

.mr-13 {
  margin-right: 13rem;
}
@media screen and (max-width: 767px) {
  .mr-13 {
    margin-right: calc( 13rem * .7);
  }
}

.mx-13 {
  margin-left: 13rem;
  margin-right: 13rem;
}
@media screen and (max-width: 767px) {
  .mx-13 {
    margin-left: calc( 13rem * .7);
    margin-right: calc( 13rem * .7);
  }
}

.my-13 {
  margin-top: 13rem;
  margin-bottom: 13rem;
}
@media screen and (max-width: 767px) {
  .my-13 {
    margin-top: calc( 13rem * .7);
    margin-bottom: calc( 13rem * .7);
  }
}

.pt-13 {
  padding-top: 13rem;
}
@media screen and (max-width: 767px) {
  .pt-13 {
    padding-top: calc( 13rem * .7);
  }
}

.pb-13 {
  padding-bottom: 13rem;
}
@media screen and (max-width: 767px) {
  .pb-13 {
    padding-bottom: calc( 13rem * .7);
  }
}

.pl-13 {
  padding-left: 13rem;
}
@media screen and (max-width: 767px) {
  .pl-13 {
    padding-left: calc( 13rem * .7);
  }
}

.pr-13 {
  padding-right: 13rem;
}
@media screen and (max-width: 767px) {
  .pr-13 {
    padding-right: calc( 13rem * .7);
  }
}

.px-13 {
  padding-left: 13rem;
  padding-right: 13rem;
}
@media screen and (max-width: 767px) {
  .px-13 {
    padding-left: calc( 13rem * .7);
    padding-right: calc( 13rem * .7);
  }
}

.py-13 {
  padding-top: 13rem;
  padding-bottom: 13rem;
}
@media screen and (max-width: 767px) {
  .py-13 {
    padding-top: calc( 13rem * .7);
    padding-bottom: calc( 13rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-13 {
    margin-top: 13rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-13 {
    margin-bottom: 13rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-13 {
    margin-bottom: 13rem !important;
    margin-top: 13rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-13 {
    padding-top: 13rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-13 {
    padding-bottom: 13rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-13 {
    padding-bottom: 13rem !important;
    padding-top: 13rem !important;
  }
}

.mt-14 {
  margin-top: 14rem;
}
@media screen and (max-width: 767px) {
  .mt-14 {
    margin-top: calc( 14rem * .7);
  }
}

.mb-14 {
  margin-bottom: 14rem;
}
@media screen and (max-width: 767px) {
  .mb-14 {
    margin-bottom: calc( 14rem * .7);
  }
}

.ml-14 {
  margin-left: 14rem;
}
@media screen and (max-width: 767px) {
  .ml-14 {
    margin-left: calc( 14rem * .7);
  }
}

.mr-14 {
  margin-right: 14rem;
}
@media screen and (max-width: 767px) {
  .mr-14 {
    margin-right: calc( 14rem * .7);
  }
}

.mx-14 {
  margin-left: 14rem;
  margin-right: 14rem;
}
@media screen and (max-width: 767px) {
  .mx-14 {
    margin-left: calc( 14rem * .7);
    margin-right: calc( 14rem * .7);
  }
}

.my-14 {
  margin-top: 14rem;
  margin-bottom: 14rem;
}
@media screen and (max-width: 767px) {
  .my-14 {
    margin-top: calc( 14rem * .7);
    margin-bottom: calc( 14rem * .7);
  }
}

.pt-14 {
  padding-top: 14rem;
}
@media screen and (max-width: 767px) {
  .pt-14 {
    padding-top: calc( 14rem * .7);
  }
}

.pb-14 {
  padding-bottom: 14rem;
}
@media screen and (max-width: 767px) {
  .pb-14 {
    padding-bottom: calc( 14rem * .7);
  }
}

.pl-14 {
  padding-left: 14rem;
}
@media screen and (max-width: 767px) {
  .pl-14 {
    padding-left: calc( 14rem * .7);
  }
}

.pr-14 {
  padding-right: 14rem;
}
@media screen and (max-width: 767px) {
  .pr-14 {
    padding-right: calc( 14rem * .7);
  }
}

.px-14 {
  padding-left: 14rem;
  padding-right: 14rem;
}
@media screen and (max-width: 767px) {
  .px-14 {
    padding-left: calc( 14rem * .7);
    padding-right: calc( 14rem * .7);
  }
}

.py-14 {
  padding-top: 14rem;
  padding-bottom: 14rem;
}
@media screen and (max-width: 767px) {
  .py-14 {
    padding-top: calc( 14rem * .7);
    padding-bottom: calc( 14rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-14 {
    margin-top: 14rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-14 {
    margin-bottom: 14rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-14 {
    margin-bottom: 14rem !important;
    margin-top: 14rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-14 {
    padding-top: 14rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-14 {
    padding-bottom: 14rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-14 {
    padding-bottom: 14rem !important;
    padding-top: 14rem !important;
  }
}

.mt-15 {
  margin-top: 15rem;
}
@media screen and (max-width: 767px) {
  .mt-15 {
    margin-top: calc( 15rem * .7);
  }
}

.mb-15 {
  margin-bottom: 15rem;
}
@media screen and (max-width: 767px) {
  .mb-15 {
    margin-bottom: calc( 15rem * .7);
  }
}

.ml-15 {
  margin-left: 15rem;
}
@media screen and (max-width: 767px) {
  .ml-15 {
    margin-left: calc( 15rem * .7);
  }
}

.mr-15 {
  margin-right: 15rem;
}
@media screen and (max-width: 767px) {
  .mr-15 {
    margin-right: calc( 15rem * .7);
  }
}

.mx-15 {
  margin-left: 15rem;
  margin-right: 15rem;
}
@media screen and (max-width: 767px) {
  .mx-15 {
    margin-left: calc( 15rem * .7);
    margin-right: calc( 15rem * .7);
  }
}

.my-15 {
  margin-top: 15rem;
  margin-bottom: 15rem;
}
@media screen and (max-width: 767px) {
  .my-15 {
    margin-top: calc( 15rem * .7);
    margin-bottom: calc( 15rem * .7);
  }
}

.pt-15 {
  padding-top: 15rem;
}
@media screen and (max-width: 767px) {
  .pt-15 {
    padding-top: calc( 15rem * .7);
  }
}

.pb-15 {
  padding-bottom: 15rem;
}
@media screen and (max-width: 767px) {
  .pb-15 {
    padding-bottom: calc( 15rem * .7);
  }
}

.pl-15 {
  padding-left: 15rem;
}
@media screen and (max-width: 767px) {
  .pl-15 {
    padding-left: calc( 15rem * .7);
  }
}

.pr-15 {
  padding-right: 15rem;
}
@media screen and (max-width: 767px) {
  .pr-15 {
    padding-right: calc( 15rem * .7);
  }
}

.px-15 {
  padding-left: 15rem;
  padding-right: 15rem;
}
@media screen and (max-width: 767px) {
  .px-15 {
    padding-left: calc( 15rem * .7);
    padding-right: calc( 15rem * .7);
  }
}

.py-15 {
  padding-top: 15rem;
  padding-bottom: 15rem;
}
@media screen and (max-width: 767px) {
  .py-15 {
    padding-top: calc( 15rem * .7);
    padding-bottom: calc( 15rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-15 {
    margin-top: 15rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-15 {
    margin-bottom: 15rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-15 {
    margin-bottom: 15rem !important;
    margin-top: 15rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-15 {
    padding-top: 15rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-15 {
    padding-bottom: 15rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-15 {
    padding-bottom: 15rem !important;
    padding-top: 15rem !important;
  }
}

.mt-16 {
  margin-top: 16rem;
}
@media screen and (max-width: 767px) {
  .mt-16 {
    margin-top: calc( 16rem * .7);
  }
}

.mb-16 {
  margin-bottom: 16rem;
}
@media screen and (max-width: 767px) {
  .mb-16 {
    margin-bottom: calc( 16rem * .7);
  }
}

.ml-16 {
  margin-left: 16rem;
}
@media screen and (max-width: 767px) {
  .ml-16 {
    margin-left: calc( 16rem * .7);
  }
}

.mr-16 {
  margin-right: 16rem;
}
@media screen and (max-width: 767px) {
  .mr-16 {
    margin-right: calc( 16rem * .7);
  }
}

.mx-16 {
  margin-left: 16rem;
  margin-right: 16rem;
}
@media screen and (max-width: 767px) {
  .mx-16 {
    margin-left: calc( 16rem * .7);
    margin-right: calc( 16rem * .7);
  }
}

.my-16 {
  margin-top: 16rem;
  margin-bottom: 16rem;
}
@media screen and (max-width: 767px) {
  .my-16 {
    margin-top: calc( 16rem * .7);
    margin-bottom: calc( 16rem * .7);
  }
}

.pt-16 {
  padding-top: 16rem;
}
@media screen and (max-width: 767px) {
  .pt-16 {
    padding-top: calc( 16rem * .7);
  }
}

.pb-16 {
  padding-bottom: 16rem;
}
@media screen and (max-width: 767px) {
  .pb-16 {
    padding-bottom: calc( 16rem * .7);
  }
}

.pl-16 {
  padding-left: 16rem;
}
@media screen and (max-width: 767px) {
  .pl-16 {
    padding-left: calc( 16rem * .7);
  }
}

.pr-16 {
  padding-right: 16rem;
}
@media screen and (max-width: 767px) {
  .pr-16 {
    padding-right: calc( 16rem * .7);
  }
}

.px-16 {
  padding-left: 16rem;
  padding-right: 16rem;
}
@media screen and (max-width: 767px) {
  .px-16 {
    padding-left: calc( 16rem * .7);
    padding-right: calc( 16rem * .7);
  }
}

.py-16 {
  padding-top: 16rem;
  padding-bottom: 16rem;
}
@media screen and (max-width: 767px) {
  .py-16 {
    padding-top: calc( 16rem * .7);
    padding-bottom: calc( 16rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-16 {
    margin-top: 16rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-16 {
    margin-bottom: 16rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-16 {
    margin-bottom: 16rem !important;
    margin-top: 16rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-16 {
    padding-top: 16rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-16 {
    padding-bottom: 16rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-16 {
    padding-bottom: 16rem !important;
    padding-top: 16rem !important;
  }
}

.mt-17 {
  margin-top: 17rem;
}
@media screen and (max-width: 767px) {
  .mt-17 {
    margin-top: calc( 17rem * .7);
  }
}

.mb-17 {
  margin-bottom: 17rem;
}
@media screen and (max-width: 767px) {
  .mb-17 {
    margin-bottom: calc( 17rem * .7);
  }
}

.ml-17 {
  margin-left: 17rem;
}
@media screen and (max-width: 767px) {
  .ml-17 {
    margin-left: calc( 17rem * .7);
  }
}

.mr-17 {
  margin-right: 17rem;
}
@media screen and (max-width: 767px) {
  .mr-17 {
    margin-right: calc( 17rem * .7);
  }
}

.mx-17 {
  margin-left: 17rem;
  margin-right: 17rem;
}
@media screen and (max-width: 767px) {
  .mx-17 {
    margin-left: calc( 17rem * .7);
    margin-right: calc( 17rem * .7);
  }
}

.my-17 {
  margin-top: 17rem;
  margin-bottom: 17rem;
}
@media screen and (max-width: 767px) {
  .my-17 {
    margin-top: calc( 17rem * .7);
    margin-bottom: calc( 17rem * .7);
  }
}

.pt-17 {
  padding-top: 17rem;
}
@media screen and (max-width: 767px) {
  .pt-17 {
    padding-top: calc( 17rem * .7);
  }
}

.pb-17 {
  padding-bottom: 17rem;
}
@media screen and (max-width: 767px) {
  .pb-17 {
    padding-bottom: calc( 17rem * .7);
  }
}

.pl-17 {
  padding-left: 17rem;
}
@media screen and (max-width: 767px) {
  .pl-17 {
    padding-left: calc( 17rem * .7);
  }
}

.pr-17 {
  padding-right: 17rem;
}
@media screen and (max-width: 767px) {
  .pr-17 {
    padding-right: calc( 17rem * .7);
  }
}

.px-17 {
  padding-left: 17rem;
  padding-right: 17rem;
}
@media screen and (max-width: 767px) {
  .px-17 {
    padding-left: calc( 17rem * .7);
    padding-right: calc( 17rem * .7);
  }
}

.py-17 {
  padding-top: 17rem;
  padding-bottom: 17rem;
}
@media screen and (max-width: 767px) {
  .py-17 {
    padding-top: calc( 17rem * .7);
    padding-bottom: calc( 17rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-17 {
    margin-top: 17rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-17 {
    margin-bottom: 17rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-17 {
    margin-bottom: 17rem !important;
    margin-top: 17rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-17 {
    padding-top: 17rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-17 {
    padding-bottom: 17rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-17 {
    padding-bottom: 17rem !important;
    padding-top: 17rem !important;
  }
}

.mt-18 {
  margin-top: 18rem;
}
@media screen and (max-width: 767px) {
  .mt-18 {
    margin-top: calc( 18rem * .7);
  }
}

.mb-18 {
  margin-bottom: 18rem;
}
@media screen and (max-width: 767px) {
  .mb-18 {
    margin-bottom: calc( 18rem * .7);
  }
}

.ml-18 {
  margin-left: 18rem;
}
@media screen and (max-width: 767px) {
  .ml-18 {
    margin-left: calc( 18rem * .7);
  }
}

.mr-18 {
  margin-right: 18rem;
}
@media screen and (max-width: 767px) {
  .mr-18 {
    margin-right: calc( 18rem * .7);
  }
}

.mx-18 {
  margin-left: 18rem;
  margin-right: 18rem;
}
@media screen and (max-width: 767px) {
  .mx-18 {
    margin-left: calc( 18rem * .7);
    margin-right: calc( 18rem * .7);
  }
}

.my-18 {
  margin-top: 18rem;
  margin-bottom: 18rem;
}
@media screen and (max-width: 767px) {
  .my-18 {
    margin-top: calc( 18rem * .7);
    margin-bottom: calc( 18rem * .7);
  }
}

.pt-18 {
  padding-top: 18rem;
}
@media screen and (max-width: 767px) {
  .pt-18 {
    padding-top: calc( 18rem * .7);
  }
}

.pb-18 {
  padding-bottom: 18rem;
}
@media screen and (max-width: 767px) {
  .pb-18 {
    padding-bottom: calc( 18rem * .7);
  }
}

.pl-18 {
  padding-left: 18rem;
}
@media screen and (max-width: 767px) {
  .pl-18 {
    padding-left: calc( 18rem * .7);
  }
}

.pr-18 {
  padding-right: 18rem;
}
@media screen and (max-width: 767px) {
  .pr-18 {
    padding-right: calc( 18rem * .7);
  }
}

.px-18 {
  padding-left: 18rem;
  padding-right: 18rem;
}
@media screen and (max-width: 767px) {
  .px-18 {
    padding-left: calc( 18rem * .7);
    padding-right: calc( 18rem * .7);
  }
}

.py-18 {
  padding-top: 18rem;
  padding-bottom: 18rem;
}
@media screen and (max-width: 767px) {
  .py-18 {
    padding-top: calc( 18rem * .7);
    padding-bottom: calc( 18rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-18 {
    margin-top: 18rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-18 {
    margin-bottom: 18rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-18 {
    margin-bottom: 18rem !important;
    margin-top: 18rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-18 {
    padding-top: 18rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-18 {
    padding-bottom: 18rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-18 {
    padding-bottom: 18rem !important;
    padding-top: 18rem !important;
  }
}

.mt-19 {
  margin-top: 19rem;
}
@media screen and (max-width: 767px) {
  .mt-19 {
    margin-top: calc( 19rem * .7);
  }
}

.mb-19 {
  margin-bottom: 19rem;
}
@media screen and (max-width: 767px) {
  .mb-19 {
    margin-bottom: calc( 19rem * .7);
  }
}

.ml-19 {
  margin-left: 19rem;
}
@media screen and (max-width: 767px) {
  .ml-19 {
    margin-left: calc( 19rem * .7);
  }
}

.mr-19 {
  margin-right: 19rem;
}
@media screen and (max-width: 767px) {
  .mr-19 {
    margin-right: calc( 19rem * .7);
  }
}

.mx-19 {
  margin-left: 19rem;
  margin-right: 19rem;
}
@media screen and (max-width: 767px) {
  .mx-19 {
    margin-left: calc( 19rem * .7);
    margin-right: calc( 19rem * .7);
  }
}

.my-19 {
  margin-top: 19rem;
  margin-bottom: 19rem;
}
@media screen and (max-width: 767px) {
  .my-19 {
    margin-top: calc( 19rem * .7);
    margin-bottom: calc( 19rem * .7);
  }
}

.pt-19 {
  padding-top: 19rem;
}
@media screen and (max-width: 767px) {
  .pt-19 {
    padding-top: calc( 19rem * .7);
  }
}

.pb-19 {
  padding-bottom: 19rem;
}
@media screen and (max-width: 767px) {
  .pb-19 {
    padding-bottom: calc( 19rem * .7);
  }
}

.pl-19 {
  padding-left: 19rem;
}
@media screen and (max-width: 767px) {
  .pl-19 {
    padding-left: calc( 19rem * .7);
  }
}

.pr-19 {
  padding-right: 19rem;
}
@media screen and (max-width: 767px) {
  .pr-19 {
    padding-right: calc( 19rem * .7);
  }
}

.px-19 {
  padding-left: 19rem;
  padding-right: 19rem;
}
@media screen and (max-width: 767px) {
  .px-19 {
    padding-left: calc( 19rem * .7);
    padding-right: calc( 19rem * .7);
  }
}

.py-19 {
  padding-top: 19rem;
  padding-bottom: 19rem;
}
@media screen and (max-width: 767px) {
  .py-19 {
    padding-top: calc( 19rem * .7);
    padding-bottom: calc( 19rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-19 {
    margin-top: 19rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-19 {
    margin-bottom: 19rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-19 {
    margin-bottom: 19rem !important;
    margin-top: 19rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-19 {
    padding-top: 19rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-19 {
    padding-bottom: 19rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-19 {
    padding-bottom: 19rem !important;
    padding-top: 19rem !important;
  }
}

.mt-20 {
  margin-top: 20rem;
}
@media screen and (max-width: 767px) {
  .mt-20 {
    margin-top: calc( 20rem * .7);
  }
}

.mb-20 {
  margin-bottom: 20rem;
}
@media screen and (max-width: 767px) {
  .mb-20 {
    margin-bottom: calc( 20rem * .7);
  }
}

.ml-20 {
  margin-left: 20rem;
}
@media screen and (max-width: 767px) {
  .ml-20 {
    margin-left: calc( 20rem * .7);
  }
}

.mr-20 {
  margin-right: 20rem;
}
@media screen and (max-width: 767px) {
  .mr-20 {
    margin-right: calc( 20rem * .7);
  }
}

.mx-20 {
  margin-left: 20rem;
  margin-right: 20rem;
}
@media screen and (max-width: 767px) {
  .mx-20 {
    margin-left: calc( 20rem * .7);
    margin-right: calc( 20rem * .7);
  }
}

.my-20 {
  margin-top: 20rem;
  margin-bottom: 20rem;
}
@media screen and (max-width: 767px) {
  .my-20 {
    margin-top: calc( 20rem * .7);
    margin-bottom: calc( 20rem * .7);
  }
}

.pt-20 {
  padding-top: 20rem;
}
@media screen and (max-width: 767px) {
  .pt-20 {
    padding-top: calc( 20rem * .7);
  }
}

.pb-20 {
  padding-bottom: 20rem;
}
@media screen and (max-width: 767px) {
  .pb-20 {
    padding-bottom: calc( 20rem * .7);
  }
}

.pl-20 {
  padding-left: 20rem;
}
@media screen and (max-width: 767px) {
  .pl-20 {
    padding-left: calc( 20rem * .7);
  }
}

.pr-20 {
  padding-right: 20rem;
}
@media screen and (max-width: 767px) {
  .pr-20 {
    padding-right: calc( 20rem * .7);
  }
}

.px-20 {
  padding-left: 20rem;
  padding-right: 20rem;
}
@media screen and (max-width: 767px) {
  .px-20 {
    padding-left: calc( 20rem * .7);
    padding-right: calc( 20rem * .7);
  }
}

.py-20 {
  padding-top: 20rem;
  padding-bottom: 20rem;
}
@media screen and (max-width: 767px) {
  .py-20 {
    padding-top: calc( 20rem * .7);
    padding-bottom: calc( 20rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-20 {
    margin-top: 20rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-20 {
    margin-bottom: 20rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-20 {
    margin-bottom: 20rem !important;
    margin-top: 20rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-20 {
    padding-top: 20rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-20 {
    padding-bottom: 20rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-20 {
    padding-bottom: 20rem !important;
    padding-top: 20rem !important;
  }
}

.mt-21 {
  margin-top: 21rem;
}
@media screen and (max-width: 767px) {
  .mt-21 {
    margin-top: calc( 21rem * .7);
  }
}

.mb-21 {
  margin-bottom: 21rem;
}
@media screen and (max-width: 767px) {
  .mb-21 {
    margin-bottom: calc( 21rem * .7);
  }
}

.ml-21 {
  margin-left: 21rem;
}
@media screen and (max-width: 767px) {
  .ml-21 {
    margin-left: calc( 21rem * .7);
  }
}

.mr-21 {
  margin-right: 21rem;
}
@media screen and (max-width: 767px) {
  .mr-21 {
    margin-right: calc( 21rem * .7);
  }
}

.mx-21 {
  margin-left: 21rem;
  margin-right: 21rem;
}
@media screen and (max-width: 767px) {
  .mx-21 {
    margin-left: calc( 21rem * .7);
    margin-right: calc( 21rem * .7);
  }
}

.my-21 {
  margin-top: 21rem;
  margin-bottom: 21rem;
}
@media screen and (max-width: 767px) {
  .my-21 {
    margin-top: calc( 21rem * .7);
    margin-bottom: calc( 21rem * .7);
  }
}

.pt-21 {
  padding-top: 21rem;
}
@media screen and (max-width: 767px) {
  .pt-21 {
    padding-top: calc( 21rem * .7);
  }
}

.pb-21 {
  padding-bottom: 21rem;
}
@media screen and (max-width: 767px) {
  .pb-21 {
    padding-bottom: calc( 21rem * .7);
  }
}

.pl-21 {
  padding-left: 21rem;
}
@media screen and (max-width: 767px) {
  .pl-21 {
    padding-left: calc( 21rem * .7);
  }
}

.pr-21 {
  padding-right: 21rem;
}
@media screen and (max-width: 767px) {
  .pr-21 {
    padding-right: calc( 21rem * .7);
  }
}

.px-21 {
  padding-left: 21rem;
  padding-right: 21rem;
}
@media screen and (max-width: 767px) {
  .px-21 {
    padding-left: calc( 21rem * .7);
    padding-right: calc( 21rem * .7);
  }
}

.py-21 {
  padding-top: 21rem;
  padding-bottom: 21rem;
}
@media screen and (max-width: 767px) {
  .py-21 {
    padding-top: calc( 21rem * .7);
    padding-bottom: calc( 21rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-21 {
    margin-top: 21rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-21 {
    margin-bottom: 21rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-21 {
    margin-bottom: 21rem !important;
    margin-top: 21rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-21 {
    padding-top: 21rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-21 {
    padding-bottom: 21rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-21 {
    padding-bottom: 21rem !important;
    padding-top: 21rem !important;
  }
}

.mt-22 {
  margin-top: 22rem;
}
@media screen and (max-width: 767px) {
  .mt-22 {
    margin-top: calc( 22rem * .7);
  }
}

.mb-22 {
  margin-bottom: 22rem;
}
@media screen and (max-width: 767px) {
  .mb-22 {
    margin-bottom: calc( 22rem * .7);
  }
}

.ml-22 {
  margin-left: 22rem;
}
@media screen and (max-width: 767px) {
  .ml-22 {
    margin-left: calc( 22rem * .7);
  }
}

.mr-22 {
  margin-right: 22rem;
}
@media screen and (max-width: 767px) {
  .mr-22 {
    margin-right: calc( 22rem * .7);
  }
}

.mx-22 {
  margin-left: 22rem;
  margin-right: 22rem;
}
@media screen and (max-width: 767px) {
  .mx-22 {
    margin-left: calc( 22rem * .7);
    margin-right: calc( 22rem * .7);
  }
}

.my-22 {
  margin-top: 22rem;
  margin-bottom: 22rem;
}
@media screen and (max-width: 767px) {
  .my-22 {
    margin-top: calc( 22rem * .7);
    margin-bottom: calc( 22rem * .7);
  }
}

.pt-22 {
  padding-top: 22rem;
}
@media screen and (max-width: 767px) {
  .pt-22 {
    padding-top: calc( 22rem * .7);
  }
}

.pb-22 {
  padding-bottom: 22rem;
}
@media screen and (max-width: 767px) {
  .pb-22 {
    padding-bottom: calc( 22rem * .7);
  }
}

.pl-22 {
  padding-left: 22rem;
}
@media screen and (max-width: 767px) {
  .pl-22 {
    padding-left: calc( 22rem * .7);
  }
}

.pr-22 {
  padding-right: 22rem;
}
@media screen and (max-width: 767px) {
  .pr-22 {
    padding-right: calc( 22rem * .7);
  }
}

.px-22 {
  padding-left: 22rem;
  padding-right: 22rem;
}
@media screen and (max-width: 767px) {
  .px-22 {
    padding-left: calc( 22rem * .7);
    padding-right: calc( 22rem * .7);
  }
}

.py-22 {
  padding-top: 22rem;
  padding-bottom: 22rem;
}
@media screen and (max-width: 767px) {
  .py-22 {
    padding-top: calc( 22rem * .7);
    padding-bottom: calc( 22rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-22 {
    margin-top: 22rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-22 {
    margin-bottom: 22rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-22 {
    margin-bottom: 22rem !important;
    margin-top: 22rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-22 {
    padding-top: 22rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-22 {
    padding-bottom: 22rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-22 {
    padding-bottom: 22rem !important;
    padding-top: 22rem !important;
  }
}

.mt-23 {
  margin-top: 23rem;
}
@media screen and (max-width: 767px) {
  .mt-23 {
    margin-top: calc( 23rem * .7);
  }
}

.mb-23 {
  margin-bottom: 23rem;
}
@media screen and (max-width: 767px) {
  .mb-23 {
    margin-bottom: calc( 23rem * .7);
  }
}

.ml-23 {
  margin-left: 23rem;
}
@media screen and (max-width: 767px) {
  .ml-23 {
    margin-left: calc( 23rem * .7);
  }
}

.mr-23 {
  margin-right: 23rem;
}
@media screen and (max-width: 767px) {
  .mr-23 {
    margin-right: calc( 23rem * .7);
  }
}

.mx-23 {
  margin-left: 23rem;
  margin-right: 23rem;
}
@media screen and (max-width: 767px) {
  .mx-23 {
    margin-left: calc( 23rem * .7);
    margin-right: calc( 23rem * .7);
  }
}

.my-23 {
  margin-top: 23rem;
  margin-bottom: 23rem;
}
@media screen and (max-width: 767px) {
  .my-23 {
    margin-top: calc( 23rem * .7);
    margin-bottom: calc( 23rem * .7);
  }
}

.pt-23 {
  padding-top: 23rem;
}
@media screen and (max-width: 767px) {
  .pt-23 {
    padding-top: calc( 23rem * .7);
  }
}

.pb-23 {
  padding-bottom: 23rem;
}
@media screen and (max-width: 767px) {
  .pb-23 {
    padding-bottom: calc( 23rem * .7);
  }
}

.pl-23 {
  padding-left: 23rem;
}
@media screen and (max-width: 767px) {
  .pl-23 {
    padding-left: calc( 23rem * .7);
  }
}

.pr-23 {
  padding-right: 23rem;
}
@media screen and (max-width: 767px) {
  .pr-23 {
    padding-right: calc( 23rem * .7);
  }
}

.px-23 {
  padding-left: 23rem;
  padding-right: 23rem;
}
@media screen and (max-width: 767px) {
  .px-23 {
    padding-left: calc( 23rem * .7);
    padding-right: calc( 23rem * .7);
  }
}

.py-23 {
  padding-top: 23rem;
  padding-bottom: 23rem;
}
@media screen and (max-width: 767px) {
  .py-23 {
    padding-top: calc( 23rem * .7);
    padding-bottom: calc( 23rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-23 {
    margin-top: 23rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-23 {
    margin-bottom: 23rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-23 {
    margin-bottom: 23rem !important;
    margin-top: 23rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-23 {
    padding-top: 23rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-23 {
    padding-bottom: 23rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-23 {
    padding-bottom: 23rem !important;
    padding-top: 23rem !important;
  }
}

.mt-24 {
  margin-top: 24rem;
}
@media screen and (max-width: 767px) {
  .mt-24 {
    margin-top: calc( 24rem * .7);
  }
}

.mb-24 {
  margin-bottom: 24rem;
}
@media screen and (max-width: 767px) {
  .mb-24 {
    margin-bottom: calc( 24rem * .7);
  }
}

.ml-24 {
  margin-left: 24rem;
}
@media screen and (max-width: 767px) {
  .ml-24 {
    margin-left: calc( 24rem * .7);
  }
}

.mr-24 {
  margin-right: 24rem;
}
@media screen and (max-width: 767px) {
  .mr-24 {
    margin-right: calc( 24rem * .7);
  }
}

.mx-24 {
  margin-left: 24rem;
  margin-right: 24rem;
}
@media screen and (max-width: 767px) {
  .mx-24 {
    margin-left: calc( 24rem * .7);
    margin-right: calc( 24rem * .7);
  }
}

.my-24 {
  margin-top: 24rem;
  margin-bottom: 24rem;
}
@media screen and (max-width: 767px) {
  .my-24 {
    margin-top: calc( 24rem * .7);
    margin-bottom: calc( 24rem * .7);
  }
}

.pt-24 {
  padding-top: 24rem;
}
@media screen and (max-width: 767px) {
  .pt-24 {
    padding-top: calc( 24rem * .7);
  }
}

.pb-24 {
  padding-bottom: 24rem;
}
@media screen and (max-width: 767px) {
  .pb-24 {
    padding-bottom: calc( 24rem * .7);
  }
}

.pl-24 {
  padding-left: 24rem;
}
@media screen and (max-width: 767px) {
  .pl-24 {
    padding-left: calc( 24rem * .7);
  }
}

.pr-24 {
  padding-right: 24rem;
}
@media screen and (max-width: 767px) {
  .pr-24 {
    padding-right: calc( 24rem * .7);
  }
}

.px-24 {
  padding-left: 24rem;
  padding-right: 24rem;
}
@media screen and (max-width: 767px) {
  .px-24 {
    padding-left: calc( 24rem * .7);
    padding-right: calc( 24rem * .7);
  }
}

.py-24 {
  padding-top: 24rem;
  padding-bottom: 24rem;
}
@media screen and (max-width: 767px) {
  .py-24 {
    padding-top: calc( 24rem * .7);
    padding-bottom: calc( 24rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-24 {
    margin-top: 24rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-24 {
    margin-bottom: 24rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-24 {
    margin-bottom: 24rem !important;
    margin-top: 24rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-24 {
    padding-top: 24rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-24 {
    padding-bottom: 24rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-24 {
    padding-bottom: 24rem !important;
    padding-top: 24rem !important;
  }
}

.mt-25 {
  margin-top: 25rem;
}
@media screen and (max-width: 767px) {
  .mt-25 {
    margin-top: calc( 25rem * .7);
  }
}

.mb-25 {
  margin-bottom: 25rem;
}
@media screen and (max-width: 767px) {
  .mb-25 {
    margin-bottom: calc( 25rem * .7);
  }
}

.ml-25 {
  margin-left: 25rem;
}
@media screen and (max-width: 767px) {
  .ml-25 {
    margin-left: calc( 25rem * .7);
  }
}

.mr-25 {
  margin-right: 25rem;
}
@media screen and (max-width: 767px) {
  .mr-25 {
    margin-right: calc( 25rem * .7);
  }
}

.mx-25 {
  margin-left: 25rem;
  margin-right: 25rem;
}
@media screen and (max-width: 767px) {
  .mx-25 {
    margin-left: calc( 25rem * .7);
    margin-right: calc( 25rem * .7);
  }
}

.my-25 {
  margin-top: 25rem;
  margin-bottom: 25rem;
}
@media screen and (max-width: 767px) {
  .my-25 {
    margin-top: calc( 25rem * .7);
    margin-bottom: calc( 25rem * .7);
  }
}

.pt-25 {
  padding-top: 25rem;
}
@media screen and (max-width: 767px) {
  .pt-25 {
    padding-top: calc( 25rem * .7);
  }
}

.pb-25 {
  padding-bottom: 25rem;
}
@media screen and (max-width: 767px) {
  .pb-25 {
    padding-bottom: calc( 25rem * .7);
  }
}

.pl-25 {
  padding-left: 25rem;
}
@media screen and (max-width: 767px) {
  .pl-25 {
    padding-left: calc( 25rem * .7);
  }
}

.pr-25 {
  padding-right: 25rem;
}
@media screen and (max-width: 767px) {
  .pr-25 {
    padding-right: calc( 25rem * .7);
  }
}

.px-25 {
  padding-left: 25rem;
  padding-right: 25rem;
}
@media screen and (max-width: 767px) {
  .px-25 {
    padding-left: calc( 25rem * .7);
    padding-right: calc( 25rem * .7);
  }
}

.py-25 {
  padding-top: 25rem;
  padding-bottom: 25rem;
}
@media screen and (max-width: 767px) {
  .py-25 {
    padding-top: calc( 25rem * .7);
    padding-bottom: calc( 25rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-25 {
    margin-top: 25rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-25 {
    margin-bottom: 25rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-25 {
    margin-bottom: 25rem !important;
    margin-top: 25rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-25 {
    padding-top: 25rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-25 {
    padding-bottom: 25rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-25 {
    padding-bottom: 25rem !important;
    padding-top: 25rem !important;
  }
}

.mt-26 {
  margin-top: 26rem;
}
@media screen and (max-width: 767px) {
  .mt-26 {
    margin-top: calc( 26rem * .7);
  }
}

.mb-26 {
  margin-bottom: 26rem;
}
@media screen and (max-width: 767px) {
  .mb-26 {
    margin-bottom: calc( 26rem * .7);
  }
}

.ml-26 {
  margin-left: 26rem;
}
@media screen and (max-width: 767px) {
  .ml-26 {
    margin-left: calc( 26rem * .7);
  }
}

.mr-26 {
  margin-right: 26rem;
}
@media screen and (max-width: 767px) {
  .mr-26 {
    margin-right: calc( 26rem * .7);
  }
}

.mx-26 {
  margin-left: 26rem;
  margin-right: 26rem;
}
@media screen and (max-width: 767px) {
  .mx-26 {
    margin-left: calc( 26rem * .7);
    margin-right: calc( 26rem * .7);
  }
}

.my-26 {
  margin-top: 26rem;
  margin-bottom: 26rem;
}
@media screen and (max-width: 767px) {
  .my-26 {
    margin-top: calc( 26rem * .7);
    margin-bottom: calc( 26rem * .7);
  }
}

.pt-26 {
  padding-top: 26rem;
}
@media screen and (max-width: 767px) {
  .pt-26 {
    padding-top: calc( 26rem * .7);
  }
}

.pb-26 {
  padding-bottom: 26rem;
}
@media screen and (max-width: 767px) {
  .pb-26 {
    padding-bottom: calc( 26rem * .7);
  }
}

.pl-26 {
  padding-left: 26rem;
}
@media screen and (max-width: 767px) {
  .pl-26 {
    padding-left: calc( 26rem * .7);
  }
}

.pr-26 {
  padding-right: 26rem;
}
@media screen and (max-width: 767px) {
  .pr-26 {
    padding-right: calc( 26rem * .7);
  }
}

.px-26 {
  padding-left: 26rem;
  padding-right: 26rem;
}
@media screen and (max-width: 767px) {
  .px-26 {
    padding-left: calc( 26rem * .7);
    padding-right: calc( 26rem * .7);
  }
}

.py-26 {
  padding-top: 26rem;
  padding-bottom: 26rem;
}
@media screen and (max-width: 767px) {
  .py-26 {
    padding-top: calc( 26rem * .7);
    padding-bottom: calc( 26rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-26 {
    margin-top: 26rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-26 {
    margin-bottom: 26rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-26 {
    margin-bottom: 26rem !important;
    margin-top: 26rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-26 {
    padding-top: 26rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-26 {
    padding-bottom: 26rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-26 {
    padding-bottom: 26rem !important;
    padding-top: 26rem !important;
  }
}

.mt-27 {
  margin-top: 27rem;
}
@media screen and (max-width: 767px) {
  .mt-27 {
    margin-top: calc( 27rem * .7);
  }
}

.mb-27 {
  margin-bottom: 27rem;
}
@media screen and (max-width: 767px) {
  .mb-27 {
    margin-bottom: calc( 27rem * .7);
  }
}

.ml-27 {
  margin-left: 27rem;
}
@media screen and (max-width: 767px) {
  .ml-27 {
    margin-left: calc( 27rem * .7);
  }
}

.mr-27 {
  margin-right: 27rem;
}
@media screen and (max-width: 767px) {
  .mr-27 {
    margin-right: calc( 27rem * .7);
  }
}

.mx-27 {
  margin-left: 27rem;
  margin-right: 27rem;
}
@media screen and (max-width: 767px) {
  .mx-27 {
    margin-left: calc( 27rem * .7);
    margin-right: calc( 27rem * .7);
  }
}

.my-27 {
  margin-top: 27rem;
  margin-bottom: 27rem;
}
@media screen and (max-width: 767px) {
  .my-27 {
    margin-top: calc( 27rem * .7);
    margin-bottom: calc( 27rem * .7);
  }
}

.pt-27 {
  padding-top: 27rem;
}
@media screen and (max-width: 767px) {
  .pt-27 {
    padding-top: calc( 27rem * .7);
  }
}

.pb-27 {
  padding-bottom: 27rem;
}
@media screen and (max-width: 767px) {
  .pb-27 {
    padding-bottom: calc( 27rem * .7);
  }
}

.pl-27 {
  padding-left: 27rem;
}
@media screen and (max-width: 767px) {
  .pl-27 {
    padding-left: calc( 27rem * .7);
  }
}

.pr-27 {
  padding-right: 27rem;
}
@media screen and (max-width: 767px) {
  .pr-27 {
    padding-right: calc( 27rem * .7);
  }
}

.px-27 {
  padding-left: 27rem;
  padding-right: 27rem;
}
@media screen and (max-width: 767px) {
  .px-27 {
    padding-left: calc( 27rem * .7);
    padding-right: calc( 27rem * .7);
  }
}

.py-27 {
  padding-top: 27rem;
  padding-bottom: 27rem;
}
@media screen and (max-width: 767px) {
  .py-27 {
    padding-top: calc( 27rem * .7);
    padding-bottom: calc( 27rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-27 {
    margin-top: 27rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-27 {
    margin-bottom: 27rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-27 {
    margin-bottom: 27rem !important;
    margin-top: 27rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-27 {
    padding-top: 27rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-27 {
    padding-bottom: 27rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-27 {
    padding-bottom: 27rem !important;
    padding-top: 27rem !important;
  }
}

.mt-28 {
  margin-top: 28rem;
}
@media screen and (max-width: 767px) {
  .mt-28 {
    margin-top: calc( 28rem * .7);
  }
}

.mb-28 {
  margin-bottom: 28rem;
}
@media screen and (max-width: 767px) {
  .mb-28 {
    margin-bottom: calc( 28rem * .7);
  }
}

.ml-28 {
  margin-left: 28rem;
}
@media screen and (max-width: 767px) {
  .ml-28 {
    margin-left: calc( 28rem * .7);
  }
}

.mr-28 {
  margin-right: 28rem;
}
@media screen and (max-width: 767px) {
  .mr-28 {
    margin-right: calc( 28rem * .7);
  }
}

.mx-28 {
  margin-left: 28rem;
  margin-right: 28rem;
}
@media screen and (max-width: 767px) {
  .mx-28 {
    margin-left: calc( 28rem * .7);
    margin-right: calc( 28rem * .7);
  }
}

.my-28 {
  margin-top: 28rem;
  margin-bottom: 28rem;
}
@media screen and (max-width: 767px) {
  .my-28 {
    margin-top: calc( 28rem * .7);
    margin-bottom: calc( 28rem * .7);
  }
}

.pt-28 {
  padding-top: 28rem;
}
@media screen and (max-width: 767px) {
  .pt-28 {
    padding-top: calc( 28rem * .7);
  }
}

.pb-28 {
  padding-bottom: 28rem;
}
@media screen and (max-width: 767px) {
  .pb-28 {
    padding-bottom: calc( 28rem * .7);
  }
}

.pl-28 {
  padding-left: 28rem;
}
@media screen and (max-width: 767px) {
  .pl-28 {
    padding-left: calc( 28rem * .7);
  }
}

.pr-28 {
  padding-right: 28rem;
}
@media screen and (max-width: 767px) {
  .pr-28 {
    padding-right: calc( 28rem * .7);
  }
}

.px-28 {
  padding-left: 28rem;
  padding-right: 28rem;
}
@media screen and (max-width: 767px) {
  .px-28 {
    padding-left: calc( 28rem * .7);
    padding-right: calc( 28rem * .7);
  }
}

.py-28 {
  padding-top: 28rem;
  padding-bottom: 28rem;
}
@media screen and (max-width: 767px) {
  .py-28 {
    padding-top: calc( 28rem * .7);
    padding-bottom: calc( 28rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-28 {
    margin-top: 28rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-28 {
    margin-bottom: 28rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-28 {
    margin-bottom: 28rem !important;
    margin-top: 28rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-28 {
    padding-top: 28rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-28 {
    padding-bottom: 28rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-28 {
    padding-bottom: 28rem !important;
    padding-top: 28rem !important;
  }
}

.mt-29 {
  margin-top: 29rem;
}
@media screen and (max-width: 767px) {
  .mt-29 {
    margin-top: calc( 29rem * .7);
  }
}

.mb-29 {
  margin-bottom: 29rem;
}
@media screen and (max-width: 767px) {
  .mb-29 {
    margin-bottom: calc( 29rem * .7);
  }
}

.ml-29 {
  margin-left: 29rem;
}
@media screen and (max-width: 767px) {
  .ml-29 {
    margin-left: calc( 29rem * .7);
  }
}

.mr-29 {
  margin-right: 29rem;
}
@media screen and (max-width: 767px) {
  .mr-29 {
    margin-right: calc( 29rem * .7);
  }
}

.mx-29 {
  margin-left: 29rem;
  margin-right: 29rem;
}
@media screen and (max-width: 767px) {
  .mx-29 {
    margin-left: calc( 29rem * .7);
    margin-right: calc( 29rem * .7);
  }
}

.my-29 {
  margin-top: 29rem;
  margin-bottom: 29rem;
}
@media screen and (max-width: 767px) {
  .my-29 {
    margin-top: calc( 29rem * .7);
    margin-bottom: calc( 29rem * .7);
  }
}

.pt-29 {
  padding-top: 29rem;
}
@media screen and (max-width: 767px) {
  .pt-29 {
    padding-top: calc( 29rem * .7);
  }
}

.pb-29 {
  padding-bottom: 29rem;
}
@media screen and (max-width: 767px) {
  .pb-29 {
    padding-bottom: calc( 29rem * .7);
  }
}

.pl-29 {
  padding-left: 29rem;
}
@media screen and (max-width: 767px) {
  .pl-29 {
    padding-left: calc( 29rem * .7);
  }
}

.pr-29 {
  padding-right: 29rem;
}
@media screen and (max-width: 767px) {
  .pr-29 {
    padding-right: calc( 29rem * .7);
  }
}

.px-29 {
  padding-left: 29rem;
  padding-right: 29rem;
}
@media screen and (max-width: 767px) {
  .px-29 {
    padding-left: calc( 29rem * .7);
    padding-right: calc( 29rem * .7);
  }
}

.py-29 {
  padding-top: 29rem;
  padding-bottom: 29rem;
}
@media screen and (max-width: 767px) {
  .py-29 {
    padding-top: calc( 29rem * .7);
    padding-bottom: calc( 29rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-29 {
    margin-top: 29rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-29 {
    margin-bottom: 29rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-29 {
    margin-bottom: 29rem !important;
    margin-top: 29rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-29 {
    padding-top: 29rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-29 {
    padding-bottom: 29rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-29 {
    padding-bottom: 29rem !important;
    padding-top: 29rem !important;
  }
}

.mt-30 {
  margin-top: 30rem;
}
@media screen and (max-width: 767px) {
  .mt-30 {
    margin-top: calc( 30rem * .7);
  }
}

.mb-30 {
  margin-bottom: 30rem;
}
@media screen and (max-width: 767px) {
  .mb-30 {
    margin-bottom: calc( 30rem * .7);
  }
}

.ml-30 {
  margin-left: 30rem;
}
@media screen and (max-width: 767px) {
  .ml-30 {
    margin-left: calc( 30rem * .7);
  }
}

.mr-30 {
  margin-right: 30rem;
}
@media screen and (max-width: 767px) {
  .mr-30 {
    margin-right: calc( 30rem * .7);
  }
}

.mx-30 {
  margin-left: 30rem;
  margin-right: 30rem;
}
@media screen and (max-width: 767px) {
  .mx-30 {
    margin-left: calc( 30rem * .7);
    margin-right: calc( 30rem * .7);
  }
}

.my-30 {
  margin-top: 30rem;
  margin-bottom: 30rem;
}
@media screen and (max-width: 767px) {
  .my-30 {
    margin-top: calc( 30rem * .7);
    margin-bottom: calc( 30rem * .7);
  }
}

.pt-30 {
  padding-top: 30rem;
}
@media screen and (max-width: 767px) {
  .pt-30 {
    padding-top: calc( 30rem * .7);
  }
}

.pb-30 {
  padding-bottom: 30rem;
}
@media screen and (max-width: 767px) {
  .pb-30 {
    padding-bottom: calc( 30rem * .7);
  }
}

.pl-30 {
  padding-left: 30rem;
}
@media screen and (max-width: 767px) {
  .pl-30 {
    padding-left: calc( 30rem * .7);
  }
}

.pr-30 {
  padding-right: 30rem;
}
@media screen and (max-width: 767px) {
  .pr-30 {
    padding-right: calc( 30rem * .7);
  }
}

.px-30 {
  padding-left: 30rem;
  padding-right: 30rem;
}
@media screen and (max-width: 767px) {
  .px-30 {
    padding-left: calc( 30rem * .7);
    padding-right: calc( 30rem * .7);
  }
}

.py-30 {
  padding-top: 30rem;
  padding-bottom: 30rem;
}
@media screen and (max-width: 767px) {
  .py-30 {
    padding-top: calc( 30rem * .7);
    padding-bottom: calc( 30rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-30 {
    margin-top: 30rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-30 {
    margin-bottom: 30rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-30 {
    margin-bottom: 30rem !important;
    margin-top: 30rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-30 {
    padding-top: 30rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-30 {
    padding-bottom: 30rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-30 {
    padding-bottom: 30rem !important;
    padding-top: 30rem !important;
  }
}

.mt-31 {
  margin-top: 31rem;
}
@media screen and (max-width: 767px) {
  .mt-31 {
    margin-top: calc( 31rem * .7);
  }
}

.mb-31 {
  margin-bottom: 31rem;
}
@media screen and (max-width: 767px) {
  .mb-31 {
    margin-bottom: calc( 31rem * .7);
  }
}

.ml-31 {
  margin-left: 31rem;
}
@media screen and (max-width: 767px) {
  .ml-31 {
    margin-left: calc( 31rem * .7);
  }
}

.mr-31 {
  margin-right: 31rem;
}
@media screen and (max-width: 767px) {
  .mr-31 {
    margin-right: calc( 31rem * .7);
  }
}

.mx-31 {
  margin-left: 31rem;
  margin-right: 31rem;
}
@media screen and (max-width: 767px) {
  .mx-31 {
    margin-left: calc( 31rem * .7);
    margin-right: calc( 31rem * .7);
  }
}

.my-31 {
  margin-top: 31rem;
  margin-bottom: 31rem;
}
@media screen and (max-width: 767px) {
  .my-31 {
    margin-top: calc( 31rem * .7);
    margin-bottom: calc( 31rem * .7);
  }
}

.pt-31 {
  padding-top: 31rem;
}
@media screen and (max-width: 767px) {
  .pt-31 {
    padding-top: calc( 31rem * .7);
  }
}

.pb-31 {
  padding-bottom: 31rem;
}
@media screen and (max-width: 767px) {
  .pb-31 {
    padding-bottom: calc( 31rem * .7);
  }
}

.pl-31 {
  padding-left: 31rem;
}
@media screen and (max-width: 767px) {
  .pl-31 {
    padding-left: calc( 31rem * .7);
  }
}

.pr-31 {
  padding-right: 31rem;
}
@media screen and (max-width: 767px) {
  .pr-31 {
    padding-right: calc( 31rem * .7);
  }
}

.px-31 {
  padding-left: 31rem;
  padding-right: 31rem;
}
@media screen and (max-width: 767px) {
  .px-31 {
    padding-left: calc( 31rem * .7);
    padding-right: calc( 31rem * .7);
  }
}

.py-31 {
  padding-top: 31rem;
  padding-bottom: 31rem;
}
@media screen and (max-width: 767px) {
  .py-31 {
    padding-top: calc( 31rem * .7);
    padding-bottom: calc( 31rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-31 {
    margin-top: 31rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-31 {
    margin-bottom: 31rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-31 {
    margin-bottom: 31rem !important;
    margin-top: 31rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-31 {
    padding-top: 31rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-31 {
    padding-bottom: 31rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-31 {
    padding-bottom: 31rem !important;
    padding-top: 31rem !important;
  }
}

.mt-32 {
  margin-top: 32rem;
}
@media screen and (max-width: 767px) {
  .mt-32 {
    margin-top: calc( 32rem * .7);
  }
}

.mb-32 {
  margin-bottom: 32rem;
}
@media screen and (max-width: 767px) {
  .mb-32 {
    margin-bottom: calc( 32rem * .7);
  }
}

.ml-32 {
  margin-left: 32rem;
}
@media screen and (max-width: 767px) {
  .ml-32 {
    margin-left: calc( 32rem * .7);
  }
}

.mr-32 {
  margin-right: 32rem;
}
@media screen and (max-width: 767px) {
  .mr-32 {
    margin-right: calc( 32rem * .7);
  }
}

.mx-32 {
  margin-left: 32rem;
  margin-right: 32rem;
}
@media screen and (max-width: 767px) {
  .mx-32 {
    margin-left: calc( 32rem * .7);
    margin-right: calc( 32rem * .7);
  }
}

.my-32 {
  margin-top: 32rem;
  margin-bottom: 32rem;
}
@media screen and (max-width: 767px) {
  .my-32 {
    margin-top: calc( 32rem * .7);
    margin-bottom: calc( 32rem * .7);
  }
}

.pt-32 {
  padding-top: 32rem;
}
@media screen and (max-width: 767px) {
  .pt-32 {
    padding-top: calc( 32rem * .7);
  }
}

.pb-32 {
  padding-bottom: 32rem;
}
@media screen and (max-width: 767px) {
  .pb-32 {
    padding-bottom: calc( 32rem * .7);
  }
}

.pl-32 {
  padding-left: 32rem;
}
@media screen and (max-width: 767px) {
  .pl-32 {
    padding-left: calc( 32rem * .7);
  }
}

.pr-32 {
  padding-right: 32rem;
}
@media screen and (max-width: 767px) {
  .pr-32 {
    padding-right: calc( 32rem * .7);
  }
}

.px-32 {
  padding-left: 32rem;
  padding-right: 32rem;
}
@media screen and (max-width: 767px) {
  .px-32 {
    padding-left: calc( 32rem * .7);
    padding-right: calc( 32rem * .7);
  }
}

.py-32 {
  padding-top: 32rem;
  padding-bottom: 32rem;
}
@media screen and (max-width: 767px) {
  .py-32 {
    padding-top: calc( 32rem * .7);
    padding-bottom: calc( 32rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-32 {
    margin-top: 32rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-32 {
    margin-bottom: 32rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-32 {
    margin-bottom: 32rem !important;
    margin-top: 32rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-32 {
    padding-top: 32rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-32 {
    padding-bottom: 32rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-32 {
    padding-bottom: 32rem !important;
    padding-top: 32rem !important;
  }
}

.mt-33 {
  margin-top: 33rem;
}
@media screen and (max-width: 767px) {
  .mt-33 {
    margin-top: calc( 33rem * .7);
  }
}

.mb-33 {
  margin-bottom: 33rem;
}
@media screen and (max-width: 767px) {
  .mb-33 {
    margin-bottom: calc( 33rem * .7);
  }
}

.ml-33 {
  margin-left: 33rem;
}
@media screen and (max-width: 767px) {
  .ml-33 {
    margin-left: calc( 33rem * .7);
  }
}

.mr-33 {
  margin-right: 33rem;
}
@media screen and (max-width: 767px) {
  .mr-33 {
    margin-right: calc( 33rem * .7);
  }
}

.mx-33 {
  margin-left: 33rem;
  margin-right: 33rem;
}
@media screen and (max-width: 767px) {
  .mx-33 {
    margin-left: calc( 33rem * .7);
    margin-right: calc( 33rem * .7);
  }
}

.my-33 {
  margin-top: 33rem;
  margin-bottom: 33rem;
}
@media screen and (max-width: 767px) {
  .my-33 {
    margin-top: calc( 33rem * .7);
    margin-bottom: calc( 33rem * .7);
  }
}

.pt-33 {
  padding-top: 33rem;
}
@media screen and (max-width: 767px) {
  .pt-33 {
    padding-top: calc( 33rem * .7);
  }
}

.pb-33 {
  padding-bottom: 33rem;
}
@media screen and (max-width: 767px) {
  .pb-33 {
    padding-bottom: calc( 33rem * .7);
  }
}

.pl-33 {
  padding-left: 33rem;
}
@media screen and (max-width: 767px) {
  .pl-33 {
    padding-left: calc( 33rem * .7);
  }
}

.pr-33 {
  padding-right: 33rem;
}
@media screen and (max-width: 767px) {
  .pr-33 {
    padding-right: calc( 33rem * .7);
  }
}

.px-33 {
  padding-left: 33rem;
  padding-right: 33rem;
}
@media screen and (max-width: 767px) {
  .px-33 {
    padding-left: calc( 33rem * .7);
    padding-right: calc( 33rem * .7);
  }
}

.py-33 {
  padding-top: 33rem;
  padding-bottom: 33rem;
}
@media screen and (max-width: 767px) {
  .py-33 {
    padding-top: calc( 33rem * .7);
    padding-bottom: calc( 33rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-33 {
    margin-top: 33rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-33 {
    margin-bottom: 33rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-33 {
    margin-bottom: 33rem !important;
    margin-top: 33rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-33 {
    padding-top: 33rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-33 {
    padding-bottom: 33rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-33 {
    padding-bottom: 33rem !important;
    padding-top: 33rem !important;
  }
}

.mt-34 {
  margin-top: 34rem;
}
@media screen and (max-width: 767px) {
  .mt-34 {
    margin-top: calc( 34rem * .7);
  }
}

.mb-34 {
  margin-bottom: 34rem;
}
@media screen and (max-width: 767px) {
  .mb-34 {
    margin-bottom: calc( 34rem * .7);
  }
}

.ml-34 {
  margin-left: 34rem;
}
@media screen and (max-width: 767px) {
  .ml-34 {
    margin-left: calc( 34rem * .7);
  }
}

.mr-34 {
  margin-right: 34rem;
}
@media screen and (max-width: 767px) {
  .mr-34 {
    margin-right: calc( 34rem * .7);
  }
}

.mx-34 {
  margin-left: 34rem;
  margin-right: 34rem;
}
@media screen and (max-width: 767px) {
  .mx-34 {
    margin-left: calc( 34rem * .7);
    margin-right: calc( 34rem * .7);
  }
}

.my-34 {
  margin-top: 34rem;
  margin-bottom: 34rem;
}
@media screen and (max-width: 767px) {
  .my-34 {
    margin-top: calc( 34rem * .7);
    margin-bottom: calc( 34rem * .7);
  }
}

.pt-34 {
  padding-top: 34rem;
}
@media screen and (max-width: 767px) {
  .pt-34 {
    padding-top: calc( 34rem * .7);
  }
}

.pb-34 {
  padding-bottom: 34rem;
}
@media screen and (max-width: 767px) {
  .pb-34 {
    padding-bottom: calc( 34rem * .7);
  }
}

.pl-34 {
  padding-left: 34rem;
}
@media screen and (max-width: 767px) {
  .pl-34 {
    padding-left: calc( 34rem * .7);
  }
}

.pr-34 {
  padding-right: 34rem;
}
@media screen and (max-width: 767px) {
  .pr-34 {
    padding-right: calc( 34rem * .7);
  }
}

.px-34 {
  padding-left: 34rem;
  padding-right: 34rem;
}
@media screen and (max-width: 767px) {
  .px-34 {
    padding-left: calc( 34rem * .7);
    padding-right: calc( 34rem * .7);
  }
}

.py-34 {
  padding-top: 34rem;
  padding-bottom: 34rem;
}
@media screen and (max-width: 767px) {
  .py-34 {
    padding-top: calc( 34rem * .7);
    padding-bottom: calc( 34rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-34 {
    margin-top: 34rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-34 {
    margin-bottom: 34rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-34 {
    margin-bottom: 34rem !important;
    margin-top: 34rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-34 {
    padding-top: 34rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-34 {
    padding-bottom: 34rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-34 {
    padding-bottom: 34rem !important;
    padding-top: 34rem !important;
  }
}

.mt-35 {
  margin-top: 35rem;
}
@media screen and (max-width: 767px) {
  .mt-35 {
    margin-top: calc( 35rem * .7);
  }
}

.mb-35 {
  margin-bottom: 35rem;
}
@media screen and (max-width: 767px) {
  .mb-35 {
    margin-bottom: calc( 35rem * .7);
  }
}

.ml-35 {
  margin-left: 35rem;
}
@media screen and (max-width: 767px) {
  .ml-35 {
    margin-left: calc( 35rem * .7);
  }
}

.mr-35 {
  margin-right: 35rem;
}
@media screen and (max-width: 767px) {
  .mr-35 {
    margin-right: calc( 35rem * .7);
  }
}

.mx-35 {
  margin-left: 35rem;
  margin-right: 35rem;
}
@media screen and (max-width: 767px) {
  .mx-35 {
    margin-left: calc( 35rem * .7);
    margin-right: calc( 35rem * .7);
  }
}

.my-35 {
  margin-top: 35rem;
  margin-bottom: 35rem;
}
@media screen and (max-width: 767px) {
  .my-35 {
    margin-top: calc( 35rem * .7);
    margin-bottom: calc( 35rem * .7);
  }
}

.pt-35 {
  padding-top: 35rem;
}
@media screen and (max-width: 767px) {
  .pt-35 {
    padding-top: calc( 35rem * .7);
  }
}

.pb-35 {
  padding-bottom: 35rem;
}
@media screen and (max-width: 767px) {
  .pb-35 {
    padding-bottom: calc( 35rem * .7);
  }
}

.pl-35 {
  padding-left: 35rem;
}
@media screen and (max-width: 767px) {
  .pl-35 {
    padding-left: calc( 35rem * .7);
  }
}

.pr-35 {
  padding-right: 35rem;
}
@media screen and (max-width: 767px) {
  .pr-35 {
    padding-right: calc( 35rem * .7);
  }
}

.px-35 {
  padding-left: 35rem;
  padding-right: 35rem;
}
@media screen and (max-width: 767px) {
  .px-35 {
    padding-left: calc( 35rem * .7);
    padding-right: calc( 35rem * .7);
  }
}

.py-35 {
  padding-top: 35rem;
  padding-bottom: 35rem;
}
@media screen and (max-width: 767px) {
  .py-35 {
    padding-top: calc( 35rem * .7);
    padding-bottom: calc( 35rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-35 {
    margin-top: 35rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-35 {
    margin-bottom: 35rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-35 {
    margin-bottom: 35rem !important;
    margin-top: 35rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-35 {
    padding-top: 35rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-35 {
    padding-bottom: 35rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-35 {
    padding-bottom: 35rem !important;
    padding-top: 35rem !important;
  }
}

.mt-36 {
  margin-top: 36rem;
}
@media screen and (max-width: 767px) {
  .mt-36 {
    margin-top: calc( 36rem * .7);
  }
}

.mb-36 {
  margin-bottom: 36rem;
}
@media screen and (max-width: 767px) {
  .mb-36 {
    margin-bottom: calc( 36rem * .7);
  }
}

.ml-36 {
  margin-left: 36rem;
}
@media screen and (max-width: 767px) {
  .ml-36 {
    margin-left: calc( 36rem * .7);
  }
}

.mr-36 {
  margin-right: 36rem;
}
@media screen and (max-width: 767px) {
  .mr-36 {
    margin-right: calc( 36rem * .7);
  }
}

.mx-36 {
  margin-left: 36rem;
  margin-right: 36rem;
}
@media screen and (max-width: 767px) {
  .mx-36 {
    margin-left: calc( 36rem * .7);
    margin-right: calc( 36rem * .7);
  }
}

.my-36 {
  margin-top: 36rem;
  margin-bottom: 36rem;
}
@media screen and (max-width: 767px) {
  .my-36 {
    margin-top: calc( 36rem * .7);
    margin-bottom: calc( 36rem * .7);
  }
}

.pt-36 {
  padding-top: 36rem;
}
@media screen and (max-width: 767px) {
  .pt-36 {
    padding-top: calc( 36rem * .7);
  }
}

.pb-36 {
  padding-bottom: 36rem;
}
@media screen and (max-width: 767px) {
  .pb-36 {
    padding-bottom: calc( 36rem * .7);
  }
}

.pl-36 {
  padding-left: 36rem;
}
@media screen and (max-width: 767px) {
  .pl-36 {
    padding-left: calc( 36rem * .7);
  }
}

.pr-36 {
  padding-right: 36rem;
}
@media screen and (max-width: 767px) {
  .pr-36 {
    padding-right: calc( 36rem * .7);
  }
}

.px-36 {
  padding-left: 36rem;
  padding-right: 36rem;
}
@media screen and (max-width: 767px) {
  .px-36 {
    padding-left: calc( 36rem * .7);
    padding-right: calc( 36rem * .7);
  }
}

.py-36 {
  padding-top: 36rem;
  padding-bottom: 36rem;
}
@media screen and (max-width: 767px) {
  .py-36 {
    padding-top: calc( 36rem * .7);
    padding-bottom: calc( 36rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-36 {
    margin-top: 36rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-36 {
    margin-bottom: 36rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-36 {
    margin-bottom: 36rem !important;
    margin-top: 36rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-36 {
    padding-top: 36rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-36 {
    padding-bottom: 36rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-36 {
    padding-bottom: 36rem !important;
    padding-top: 36rem !important;
  }
}

.mt-37 {
  margin-top: 37rem;
}
@media screen and (max-width: 767px) {
  .mt-37 {
    margin-top: calc( 37rem * .7);
  }
}

.mb-37 {
  margin-bottom: 37rem;
}
@media screen and (max-width: 767px) {
  .mb-37 {
    margin-bottom: calc( 37rem * .7);
  }
}

.ml-37 {
  margin-left: 37rem;
}
@media screen and (max-width: 767px) {
  .ml-37 {
    margin-left: calc( 37rem * .7);
  }
}

.mr-37 {
  margin-right: 37rem;
}
@media screen and (max-width: 767px) {
  .mr-37 {
    margin-right: calc( 37rem * .7);
  }
}

.mx-37 {
  margin-left: 37rem;
  margin-right: 37rem;
}
@media screen and (max-width: 767px) {
  .mx-37 {
    margin-left: calc( 37rem * .7);
    margin-right: calc( 37rem * .7);
  }
}

.my-37 {
  margin-top: 37rem;
  margin-bottom: 37rem;
}
@media screen and (max-width: 767px) {
  .my-37 {
    margin-top: calc( 37rem * .7);
    margin-bottom: calc( 37rem * .7);
  }
}

.pt-37 {
  padding-top: 37rem;
}
@media screen and (max-width: 767px) {
  .pt-37 {
    padding-top: calc( 37rem * .7);
  }
}

.pb-37 {
  padding-bottom: 37rem;
}
@media screen and (max-width: 767px) {
  .pb-37 {
    padding-bottom: calc( 37rem * .7);
  }
}

.pl-37 {
  padding-left: 37rem;
}
@media screen and (max-width: 767px) {
  .pl-37 {
    padding-left: calc( 37rem * .7);
  }
}

.pr-37 {
  padding-right: 37rem;
}
@media screen and (max-width: 767px) {
  .pr-37 {
    padding-right: calc( 37rem * .7);
  }
}

.px-37 {
  padding-left: 37rem;
  padding-right: 37rem;
}
@media screen and (max-width: 767px) {
  .px-37 {
    padding-left: calc( 37rem * .7);
    padding-right: calc( 37rem * .7);
  }
}

.py-37 {
  padding-top: 37rem;
  padding-bottom: 37rem;
}
@media screen and (max-width: 767px) {
  .py-37 {
    padding-top: calc( 37rem * .7);
    padding-bottom: calc( 37rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-37 {
    margin-top: 37rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-37 {
    margin-bottom: 37rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-37 {
    margin-bottom: 37rem !important;
    margin-top: 37rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-37 {
    padding-top: 37rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-37 {
    padding-bottom: 37rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-37 {
    padding-bottom: 37rem !important;
    padding-top: 37rem !important;
  }
}

.mt-38 {
  margin-top: 38rem;
}
@media screen and (max-width: 767px) {
  .mt-38 {
    margin-top: calc( 38rem * .7);
  }
}

.mb-38 {
  margin-bottom: 38rem;
}
@media screen and (max-width: 767px) {
  .mb-38 {
    margin-bottom: calc( 38rem * .7);
  }
}

.ml-38 {
  margin-left: 38rem;
}
@media screen and (max-width: 767px) {
  .ml-38 {
    margin-left: calc( 38rem * .7);
  }
}

.mr-38 {
  margin-right: 38rem;
}
@media screen and (max-width: 767px) {
  .mr-38 {
    margin-right: calc( 38rem * .7);
  }
}

.mx-38 {
  margin-left: 38rem;
  margin-right: 38rem;
}
@media screen and (max-width: 767px) {
  .mx-38 {
    margin-left: calc( 38rem * .7);
    margin-right: calc( 38rem * .7);
  }
}

.my-38 {
  margin-top: 38rem;
  margin-bottom: 38rem;
}
@media screen and (max-width: 767px) {
  .my-38 {
    margin-top: calc( 38rem * .7);
    margin-bottom: calc( 38rem * .7);
  }
}

.pt-38 {
  padding-top: 38rem;
}
@media screen and (max-width: 767px) {
  .pt-38 {
    padding-top: calc( 38rem * .7);
  }
}

.pb-38 {
  padding-bottom: 38rem;
}
@media screen and (max-width: 767px) {
  .pb-38 {
    padding-bottom: calc( 38rem * .7);
  }
}

.pl-38 {
  padding-left: 38rem;
}
@media screen and (max-width: 767px) {
  .pl-38 {
    padding-left: calc( 38rem * .7);
  }
}

.pr-38 {
  padding-right: 38rem;
}
@media screen and (max-width: 767px) {
  .pr-38 {
    padding-right: calc( 38rem * .7);
  }
}

.px-38 {
  padding-left: 38rem;
  padding-right: 38rem;
}
@media screen and (max-width: 767px) {
  .px-38 {
    padding-left: calc( 38rem * .7);
    padding-right: calc( 38rem * .7);
  }
}

.py-38 {
  padding-top: 38rem;
  padding-bottom: 38rem;
}
@media screen and (max-width: 767px) {
  .py-38 {
    padding-top: calc( 38rem * .7);
    padding-bottom: calc( 38rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-38 {
    margin-top: 38rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-38 {
    margin-bottom: 38rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-38 {
    margin-bottom: 38rem !important;
    margin-top: 38rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-38 {
    padding-top: 38rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-38 {
    padding-bottom: 38rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-38 {
    padding-bottom: 38rem !important;
    padding-top: 38rem !important;
  }
}

.mt-39 {
  margin-top: 39rem;
}
@media screen and (max-width: 767px) {
  .mt-39 {
    margin-top: calc( 39rem * .7);
  }
}

.mb-39 {
  margin-bottom: 39rem;
}
@media screen and (max-width: 767px) {
  .mb-39 {
    margin-bottom: calc( 39rem * .7);
  }
}

.ml-39 {
  margin-left: 39rem;
}
@media screen and (max-width: 767px) {
  .ml-39 {
    margin-left: calc( 39rem * .7);
  }
}

.mr-39 {
  margin-right: 39rem;
}
@media screen and (max-width: 767px) {
  .mr-39 {
    margin-right: calc( 39rem * .7);
  }
}

.mx-39 {
  margin-left: 39rem;
  margin-right: 39rem;
}
@media screen and (max-width: 767px) {
  .mx-39 {
    margin-left: calc( 39rem * .7);
    margin-right: calc( 39rem * .7);
  }
}

.my-39 {
  margin-top: 39rem;
  margin-bottom: 39rem;
}
@media screen and (max-width: 767px) {
  .my-39 {
    margin-top: calc( 39rem * .7);
    margin-bottom: calc( 39rem * .7);
  }
}

.pt-39 {
  padding-top: 39rem;
}
@media screen and (max-width: 767px) {
  .pt-39 {
    padding-top: calc( 39rem * .7);
  }
}

.pb-39 {
  padding-bottom: 39rem;
}
@media screen and (max-width: 767px) {
  .pb-39 {
    padding-bottom: calc( 39rem * .7);
  }
}

.pl-39 {
  padding-left: 39rem;
}
@media screen and (max-width: 767px) {
  .pl-39 {
    padding-left: calc( 39rem * .7);
  }
}

.pr-39 {
  padding-right: 39rem;
}
@media screen and (max-width: 767px) {
  .pr-39 {
    padding-right: calc( 39rem * .7);
  }
}

.px-39 {
  padding-left: 39rem;
  padding-right: 39rem;
}
@media screen and (max-width: 767px) {
  .px-39 {
    padding-left: calc( 39rem * .7);
    padding-right: calc( 39rem * .7);
  }
}

.py-39 {
  padding-top: 39rem;
  padding-bottom: 39rem;
}
@media screen and (max-width: 767px) {
  .py-39 {
    padding-top: calc( 39rem * .7);
    padding-bottom: calc( 39rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-39 {
    margin-top: 39rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-39 {
    margin-bottom: 39rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-39 {
    margin-bottom: 39rem !important;
    margin-top: 39rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-39 {
    padding-top: 39rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-39 {
    padding-bottom: 39rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-39 {
    padding-bottom: 39rem !important;
    padding-top: 39rem !important;
  }
}

.mt-40 {
  margin-top: 40rem;
}
@media screen and (max-width: 767px) {
  .mt-40 {
    margin-top: calc( 40rem * .7);
  }
}

.mb-40 {
  margin-bottom: 40rem;
}
@media screen and (max-width: 767px) {
  .mb-40 {
    margin-bottom: calc( 40rem * .7);
  }
}

.ml-40 {
  margin-left: 40rem;
}
@media screen and (max-width: 767px) {
  .ml-40 {
    margin-left: calc( 40rem * .7);
  }
}

.mr-40 {
  margin-right: 40rem;
}
@media screen and (max-width: 767px) {
  .mr-40 {
    margin-right: calc( 40rem * .7);
  }
}

.mx-40 {
  margin-left: 40rem;
  margin-right: 40rem;
}
@media screen and (max-width: 767px) {
  .mx-40 {
    margin-left: calc( 40rem * .7);
    margin-right: calc( 40rem * .7);
  }
}

.my-40 {
  margin-top: 40rem;
  margin-bottom: 40rem;
}
@media screen and (max-width: 767px) {
  .my-40 {
    margin-top: calc( 40rem * .7);
    margin-bottom: calc( 40rem * .7);
  }
}

.pt-40 {
  padding-top: 40rem;
}
@media screen and (max-width: 767px) {
  .pt-40 {
    padding-top: calc( 40rem * .7);
  }
}

.pb-40 {
  padding-bottom: 40rem;
}
@media screen and (max-width: 767px) {
  .pb-40 {
    padding-bottom: calc( 40rem * .7);
  }
}

.pl-40 {
  padding-left: 40rem;
}
@media screen and (max-width: 767px) {
  .pl-40 {
    padding-left: calc( 40rem * .7);
  }
}

.pr-40 {
  padding-right: 40rem;
}
@media screen and (max-width: 767px) {
  .pr-40 {
    padding-right: calc( 40rem * .7);
  }
}

.px-40 {
  padding-left: 40rem;
  padding-right: 40rem;
}
@media screen and (max-width: 767px) {
  .px-40 {
    padding-left: calc( 40rem * .7);
    padding-right: calc( 40rem * .7);
  }
}

.py-40 {
  padding-top: 40rem;
  padding-bottom: 40rem;
}
@media screen and (max-width: 767px) {
  .py-40 {
    padding-top: calc( 40rem * .7);
    padding-bottom: calc( 40rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-40 {
    margin-top: 40rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-40 {
    margin-bottom: 40rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-40 {
    margin-bottom: 40rem !important;
    margin-top: 40rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-40 {
    padding-top: 40rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-40 {
    padding-bottom: 40rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-40 {
    padding-bottom: 40rem !important;
    padding-top: 40rem !important;
  }
}

.spAreaBnr .inner .bnr-list .bnr {
  width: 100%;
}
.spAreaBnr .inner .bnr-list .bnr a {
  font-size: 1.6rem;
  text-decoration: none;
  text-align: center;
  margin-bottom: 0.5em;
  display: block;
  width: 100%;
  padding: 0.5em 0;
  background: #735F51;
  color: #fff;
}

.bgLight {
  background: #f0f8fc;
}

.imgWide {
  aspect-ratio: 2.4;
  object-fit: cover;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .imgWide {
    aspect-ratio: 1.8;
  }
}

.page-title {
  width: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.page-title-inner {
  padding: 20rem 0;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .page-title-inner {
    padding: 7rem 0;
  }
}
.page-title-inner h3 {
  letter-spacing: 0.2em;
}

.page-title-section {
  width: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}
.page-title-section-text {
  text-align: center;
  position: absolute;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  text-shadow: 0 0 0.2em black, 0 0 0.4em black;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .page-title-section-text {
    padding: 6rem 0 4rem;
  }
}
.page-title-section-text-en {
  font-size: 3.6rem;
  font-family: "Marcellus", serif;
  font-weight: 400;
  font-style: normal;
  margin-bottom: 0.4em;
  letter-spacing: 0.1em;
}
.page-title-section-text-ja {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  opacity: 0.9;
  font-size: 1.9rem;
  letter-spacing: 0.1em;
}
.page-title-section-img {
  width: 100%;
}
.page-title-section-img img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 2;
}
@media screen and (max-width: 767px) {
  .page-title-section-img img {
    aspect-ratio: 1.2;
  }
}
.page-title-section.noimg {
  padding: 15rem 0 1rem;
}
@media screen and (max-width: 767px) {
  .page-title-section.noimg {
    padding: 1rem 0 0;
  }
}
.page-title-section.noimg .page-title-section-text {
  text-shadow: none;
  color: #735F51;
  position: static;
}

.vOpen {
  overflow: hidden;
  width: 100%;
  position: relative;
  z-index: 0;
}
.vOpen figure {
  transition: all 1s ease-in;
  transition-delay: 0.5s;
  opacity: 0;
}
.vOpen::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  background: #fff;
  top: 0;
  z-index: 1;
  transition: all 1.3s ease-out;
  transition-delay: 0.5s;
}
.is-anm .vOpen figure {
  transform: scale(1.02);
  opacity: 1;
}
.is-anm .vOpen::before {
  left: 100%;
}

.letterIn span {
  display: inline-block;
  opacity: 0;
  transform: translateY(0.5em);
}
.is-anm .letterIn span {
  transition: all 0.8s;
  transform: translateY(0);
  opacity: 1;
}
.is-anm .letterIn span:nth-of-type(1) {
  transition-delay: 0.07s;
}
.is-anm .letterIn span:nth-of-type(2) {
  transition-delay: 0.14s;
}
.is-anm .letterIn span:nth-of-type(3) {
  transition-delay: 0.21s;
}
.is-anm .letterIn span:nth-of-type(4) {
  transition-delay: 0.28s;
}
.is-anm .letterIn span:nth-of-type(5) {
  transition-delay: 0.35s;
}
.is-anm .letterIn span:nth-of-type(6) {
  transition-delay: 0.42s;
}
.is-anm .letterIn span:nth-of-type(7) {
  transition-delay: 0.49s;
}
.is-anm .letterIn span:nth-of-type(8) {
  transition-delay: 0.56s;
}
.is-anm .letterIn span:nth-of-type(9) {
  transition-delay: 0.63s;
}
.is-anm .letterIn span:nth-of-type(10) {
  transition-delay: 0.7s;
}
.is-anm .letterIn span:nth-of-type(11) {
  transition-delay: 0.77s;
}
.is-anm .letterIn span:nth-of-type(12) {
  transition-delay: 0.84s;
}
.is-anm .letterIn span:nth-of-type(13) {
  transition-delay: 0.91s;
}
.is-anm .letterIn span:nth-of-type(14) {
  transition-delay: 0.98s;
}
.is-anm .letterIn span:nth-of-type(15) {
  transition-delay: 1.05s;
}
.is-anm .letterIn span:nth-of-type(16) {
  transition-delay: 1.12s;
}
.is-anm .letterIn span:nth-of-type(17) {
  transition-delay: 1.19s;
}
.is-anm .letterIn span:nth-of-type(18) {
  transition-delay: 1.26s;
}
.is-anm .letterIn span:nth-of-type(19) {
  transition-delay: 1.33s;
}
.is-anm .letterIn span:nth-of-type(20) {
  transition-delay: 1.4s;
}

.text-shadow {
  text-shadow: 0 0 0.2em black, 0 0 0.4em black, 0 0 0.5em black;
}

.pc-text-shadow {
  text-shadow: 0 0 0.2em black, 0 0 0.4em black, 0 0 0.5em black;
}
@media screen and (max-width: 767px) {
  .pc-text-shadow {
    text-shadow: none;
  }
}

@media screen and (max-width: 767px) {
  .sp-text-shadow {
    text-shadow: 0 0 0.2em black, 0 0 0.4em black, 0 0 0.5em black;
  }
}

.contents-more {
  text-align: center;
  color: #735F51;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  margin-top: 3rem;
  letter-spacing: 0.3em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .contents-more {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .contents-more {
    font-size: 3.6vw;
  }
}
@media screen and (max-width: 767px) {
  .contents-more {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.8;
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .contents-more {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .contents-more {
    font-size: 3.15vw;
  }
}
.contents-more span {
  position: relative;
  display: inline-block;
  padding: 0 0.5em 0.5em;
}
.contents-more span::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  background: rgba(115, 95, 81, 0.3);
  width: 0;
  height: 1px;
  transition: all 0.5s;
}

.fluid-bnr {
  width: 100%;
}
.fluid-bnr .inner {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}
.fluid-bnr-block a {
  position: relative;
  display: block;
  text-decoration: none;
  z-index: 0;
  transition: opacity 0.5s;
}
.fluid-bnr-block a, .fluid-bnr-block a:link, .fluid-bnr-block a:visited {
  color: #000;
}
.fluid-bnr-block a:hover, .fluid-bnr-block a:active {
  text-decoration: none;
  color: #000;
}
.fluid-bnr-block a:hover {
  opacity: 0.7;
}
.fluid-bnr-block a::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
  mix-blend-mode: darken;
  position: absolute;
  z-index: 0;
}
.fluid-bnr-block a figure img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 4;
}
@media screen and (max-width: 767px) {
  .fluid-bnr-block a figure img {
    aspect-ratio: 2.2;
  }
}
.fluid-bnr-block a .col2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.fluid-bnr-block a .col2 figure img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 2;
}
@media screen and (max-width: 767px) {
  .fluid-bnr-block a .col2 figure img {
    aspect-ratio: 1.3;
  }
}
.fluid-bnr-block a p {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  line-height: 1.2;
}
@media screen and (max-width: 1099px) {
  .fluid-bnr-block a p {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .fluid-bnr-block a p {
    font-size: 4.5vw;
  }
}
.fluid-bnr-block a p span {
  white-space: nowrap;
}
.fluid-bnr-block a p span:not(.en) {
  font-size: 1em;
  font-family: "Shippori Mincho", serif;
  font-weight: 500;
  color: #fff;
  font-weight: normal;
}
@media screen and (max-width: 767px) {
  .fluid-bnr-block a p span:not(.en) {
    font-size: 0.8em;
  }
}
.fluid-bnr-block a p span.en {
  font-size: 4em;
  letter-spacing: 0.3em;
  opacity: 0.5;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  text-transform: uppercase;
  color: #fff;
  mix-blend-mode: multiply;
}
@media screen and (max-width: 767px) {
  .fluid-bnr-block a p span.en {
    font-size: 1.7em;
  }
}

#tripla-chat-circle-icon, #tripla-icon-message, #tripla-minimized-chat {
  display: none !important;
}

.constrain {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1000px;
}

.letterIn span {
  display: inline-block;
  opacity: 0;
  transform: translateY(0.5em);
}
.is-anm .letterIn span {
  transition: transform 0.8s, opacity 0.8s;
  transform: translateY(0);
  opacity: 1;
}
.is-anm .letterIn span:nth-of-type(1) {
  transition-delay: 0.07s;
}
.is-anm .letterIn span:nth-of-type(2) {
  transition-delay: 0.14s;
}
.is-anm .letterIn span:nth-of-type(3) {
  transition-delay: 0.21s;
}
.is-anm .letterIn span:nth-of-type(4) {
  transition-delay: 0.28s;
}
.is-anm .letterIn span:nth-of-type(5) {
  transition-delay: 0.35s;
}
.is-anm .letterIn span:nth-of-type(6) {
  transition-delay: 0.42s;
}
.is-anm .letterIn span:nth-of-type(7) {
  transition-delay: 0.49s;
}
.is-anm .letterIn span:nth-of-type(8) {
  transition-delay: 0.56s;
}
.is-anm .letterIn span:nth-of-type(9) {
  transition-delay: 0.63s;
}
.is-anm .letterIn span:nth-of-type(10) {
  transition-delay: 0.7s;
}
.is-anm .letterIn span:nth-of-type(11) {
  transition-delay: 0.77s;
}
.is-anm .letterIn span:nth-of-type(12) {
  transition-delay: 0.84s;
}
.is-anm .letterIn span:nth-of-type(13) {
  transition-delay: 0.91s;
}
.is-anm .letterIn span:nth-of-type(14) {
  transition-delay: 0.98s;
}
.is-anm .letterIn span:nth-of-type(15) {
  transition-delay: 1.05s;
}
.is-anm .letterIn span:nth-of-type(16) {
  transition-delay: 1.12s;
}
.is-anm .letterIn span:nth-of-type(17) {
  transition-delay: 1.19s;
}
.is-anm .letterIn span:nth-of-type(18) {
  transition-delay: 1.26s;
}
.is-anm .letterIn span:nth-of-type(19) {
  transition-delay: 1.33s;
}
.is-anm .letterIn span:nth-of-type(20) {
  transition-delay: 1.4s;
}
.is-anm .letterIn span:nth-of-type(21) {
  transition-delay: 1.47s;
}
.is-anm .letterIn span:nth-of-type(22) {
  transition-delay: 1.54s;
}
.is-anm .letterIn span:nth-of-type(23) {
  transition-delay: 1.61s;
}
.is-anm .letterIn span:nth-of-type(24) {
  transition-delay: 1.68s;
}
.is-anm .letterIn span:nth-of-type(25) {
  transition-delay: 1.75s;
}
.is-anm .letterIn span:nth-of-type(26) {
  transition-delay: 1.82s;
}
.is-anm .letterIn span:nth-of-type(27) {
  transition-delay: 1.89s;
}
.is-anm .letterIn span:nth-of-type(28) {
  transition-delay: 1.96s;
}
.is-anm .letterIn span:nth-of-type(29) {
  transition-delay: 2.03s;
}
.is-anm .letterIn span:nth-of-type(30) {
  transition-delay: 2.1s;
}
.is-anm .letterIn span:nth-of-type(31) {
  transition-delay: 2.17s;
}
.is-anm .letterIn span:nth-of-type(32) {
  transition-delay: 2.24s;
}
.is-anm .letterIn span:nth-of-type(33) {
  transition-delay: 2.31s;
}
.is-anm .letterIn span:nth-of-type(34) {
  transition-delay: 2.38s;
}
.is-anm .letterIn span:nth-of-type(35) {
  transition-delay: 2.45s;
}
.is-anm .letterIn span:nth-of-type(36) {
  transition-delay: 2.52s;
}
.is-anm .letterIn span:nth-of-type(37) {
  transition-delay: 2.59s;
}
.is-anm .letterIn span:nth-of-type(38) {
  transition-delay: 2.66s;
}
.is-anm .letterIn span:nth-of-type(39) {
  transition-delay: 2.73s;
}
.is-anm .letterIn span:nth-of-type(40) {
  transition-delay: 2.8s;
}
.is-anm .letterIn span:nth-of-type(41) {
  transition-delay: 2.87s;
}
.is-anm .letterIn span:nth-of-type(42) {
  transition-delay: 2.94s;
}
.is-anm .letterIn span:nth-of-type(43) {
  transition-delay: 3.01s;
}
.is-anm .letterIn span:nth-of-type(44) {
  transition-delay: 3.08s;
}
.is-anm .letterIn span:nth-of-type(45) {
  transition-delay: 3.15s;
}
.is-anm .letterIn span:nth-of-type(46) {
  transition-delay: 3.22s;
}
.is-anm .letterIn span:nth-of-type(47) {
  transition-delay: 3.29s;
}
.is-anm .letterIn span:nth-of-type(48) {
  transition-delay: 3.36s;
}
.is-anm .letterIn span:nth-of-type(49) {
  transition-delay: 3.43s;
}
.is-anm .letterIn span:nth-of-type(50) {
  transition-delay: 3.5s;
}

.text-shadow {
  text-shadow: 0 0 0.2em black, 0 0 0.4em black, 0 0 0.5em black;
}

.pc-text-shadow {
  text-shadow: 0 0 0.2em black, 0 0 0.4em black, 0 0 0.5em black;
}
@media screen and (max-width: 767px) {
  .pc-text-shadow {
    text-shadow: none;
  }
}

@media screen and (max-width: 767px) {
  .sp-text-shadow {
    text-shadow: 0 0 0.2em black, 0 0 0.4em black, 0 0 0.5em black;
  }
}

.basic-title h3,
.basic-title p {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transform: translate(0, 1em);
}
.basic-title h3 {
  transition-delay: 0.2s;
}
.basic-title p.en {
  transition-delay: 0.3s;
}
.basic-title p.title-area {
  transition-delay: 0.1s;
}
.basic-title.is-anm h3,
.basic-title.is-anm p, .is-anm .basic-title h3,
.is-anm .basic-title p {
  opacity: 1;
  transform: translate(0, 0);
}

.hotels-list-block h4,
.hotels-list-block .text-block--lead,
.hotels-list-block .text-block--text,
.hotels-list-block .text-block--link,
.hotels-list-block .text-block--detail,
.hotels-list-block .img-block,
.restaurant-list-block h4,
.restaurant-list-block .text-block--lead,
.restaurant-list-block .text-block--text,
.restaurant-list-block .text-block--link,
.restaurant-list-block .text-block--detail,
.restaurant-list-block .img-block {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transform: translate(0, 1em);
}
.hotels-list-block h4,
.restaurant-list-block h4 {
  transition-delay: 0.2s;
}
.hotels-list-block .text-block--lead,
.restaurant-list-block .text-block--lead {
  transition-delay: 0.3s;
}
.hotels-list-block .text-block--text,
.restaurant-list-block .text-block--text {
  transition-delay: 0.4s;
}
.hotels-list-block .text-block--link,
.restaurant-list-block .text-block--link {
  transition-delay: 0.6s;
}
.hotels-list-block .text-block--detail,
.restaurant-list-block .text-block--detail {
  transition-delay: 0.5s;
}
.hotels-list-block .img-block,
.restaurant-list-block .img-block {
  transition-delay: 0.4s;
  transform: translate(0, -1em);
}
@media screen and (max-width: 767px) {
  .hotels-list-block .img-block,
.restaurant-list-block .img-block {
    transform: translate(0, 1em);
  }
}
.hotels-list-block.is-anm h4,
.hotels-list-block.is-anm .text-block--lead,
.hotels-list-block.is-anm .text-block--text,
.hotels-list-block.is-anm .text-block--link,
.hotels-list-block.is-anm .text-block--detail,
.hotels-list-block.is-anm .img-block,
.restaurant-list-block.is-anm h4,
.restaurant-list-block.is-anm .text-block--lead,
.restaurant-list-block.is-anm .text-block--text,
.restaurant-list-block.is-anm .text-block--link,
.restaurant-list-block.is-anm .text-block--detail,
.restaurant-list-block.is-anm .img-block {
  opacity: 1;
  transform: translate(0, 0);
}

.map .pin {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transform: translate(0, 1em);
}
.map .pin:nth-of-type(1) {
  transition-delay: calc(500ms + (100ms * 1));
}
.map .pin:nth-of-type(2) {
  transition-delay: calc(500ms + (100ms * 2));
}
.map .pin:nth-of-type(3) {
  transition-delay: calc(500ms + (100ms * 3));
}
.map .pin:nth-of-type(4) {
  transition-delay: calc(500ms + (100ms * 4));
}
.map .pin:nth-of-type(5) {
  transition-delay: calc(500ms + (100ms * 5));
}
.map .pin:nth-of-type(6) {
  transition-delay: calc(500ms + (100ms * 6));
}
.map .pin:nth-of-type(7) {
  transition-delay: calc(500ms + (100ms * 7));
}
.map .pin:nth-of-type(8) {
  transition-delay: calc(500ms + (100ms * 8));
}
.map .pin:nth-of-type(9) {
  transition-delay: calc(500ms + (100ms * 9));
}
.map .pin:nth-of-type(10) {
  transition-delay: calc(500ms + (100ms * 10));
}
.map .pin:nth-of-type(11) {
  transition-delay: calc(500ms + (100ms * 11));
}
.map .pin:nth-of-type(12) {
  transition-delay: calc(500ms + (100ms * 12));
}
.map .pin:nth-of-type(13) {
  transition-delay: calc(500ms + (100ms * 13));
}
.map .pin:nth-of-type(14) {
  transition-delay: calc(500ms + (100ms * 14));
}
.map .pin:nth-of-type(15) {
  transition-delay: calc(500ms + (100ms * 15));
}
.map.is-anm .pin {
  opacity: 1;
  transform: translate(0, 0);
}

.mv-copy {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0s;
  transform: translate(0, 0.5em);
}
.is-anm .mv-copy, .mv-copy.is-anm {
  opacity: 1;
  transform: translate(0, 0);
}

.letterAnm span {
  opacity: 0;
  display: inline-block;
  transition-property: all;
  transition-duration: 0.5s;
  transform: translate(-0.2em, 0.2em);
}
.letterAnm span:nth-of-type(1) {
  transition-delay: 0.07s;
}
.letterAnm span:nth-of-type(2) {
  transition-delay: 0.14s;
}
.letterAnm span:nth-of-type(3) {
  transition-delay: 0.21s;
}
.letterAnm span:nth-of-type(4) {
  transition-delay: 0.28s;
}
.letterAnm span:nth-of-type(5) {
  transition-delay: 0.35s;
}
.letterAnm span:nth-of-type(6) {
  transition-delay: 0.42s;
}
.letterAnm span:nth-of-type(7) {
  transition-delay: 0.49s;
}
.letterAnm span:nth-of-type(8) {
  transition-delay: 0.56s;
}
.letterAnm span:nth-of-type(9) {
  transition-delay: 0.63s;
}
.letterAnm span:nth-of-type(10) {
  transition-delay: 0.7s;
}
.letterAnm span:nth-of-type(11) {
  transition-delay: 0.77s;
}
.letterAnm span:nth-of-type(12) {
  transition-delay: 0.84s;
}
.letterAnm span:nth-of-type(13) {
  transition-delay: 0.91s;
}
.letterAnm span:nth-of-type(14) {
  transition-delay: 0.98s;
}
.letterAnm span:nth-of-type(15) {
  transition-delay: 1.05s;
}
.letterAnm span:nth-of-type(16) {
  transition-delay: 1.12s;
}
.letterAnm span:nth-of-type(17) {
  transition-delay: 1.19s;
}
.letterAnm span:nth-of-type(18) {
  transition-delay: 1.26s;
}
.letterAnm span:nth-of-type(19) {
  transition-delay: 1.33s;
}
.letterAnm span:nth-of-type(20) {
  transition-delay: 1.4s;
}
.letterAnm span:nth-of-type(21) {
  transition-delay: 1.47s;
}
.letterAnm span:nth-of-type(22) {
  transition-delay: 1.54s;
}
.letterAnm span:nth-of-type(23) {
  transition-delay: 1.61s;
}
.letterAnm span:nth-of-type(24) {
  transition-delay: 1.68s;
}
.letterAnm span:nth-of-type(25) {
  transition-delay: 1.75s;
}
.letterAnm span:nth-of-type(26) {
  transition-delay: 1.82s;
}
.letterAnm span:nth-of-type(27) {
  transition-delay: 1.89s;
}
.letterAnm span:nth-of-type(28) {
  transition-delay: 1.96s;
}
.letterAnm span:nth-of-type(29) {
  transition-delay: 2.03s;
}
.letterAnm span:nth-of-type(30) {
  transition-delay: 2.1s;
}
.is-anm .letterAnm span {
  opacity: 1;
  transform: translate(0, 0);
}

.orderFadein > * {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transform: translate(0, 1em);
}
.orderFadein > *:nth-of-type(1) {
  transition-delay: 0.1s;
}
.orderFadein > *:nth-of-type(2) {
  transition-delay: 0.2s;
}
.orderFadein > *:nth-of-type(3) {
  transition-delay: 0.3s;
}
.orderFadein > *:nth-of-type(4) {
  transition-delay: 0.4s;
}
.orderFadein > *:nth-of-type(5) {
  transition-delay: 0.5s;
}
.orderFadein > *:nth-of-type(6) {
  transition-delay: 0.6s;
}
.orderFadein > *:nth-of-type(7) {
  transition-delay: 0.7s;
}
.orderFadein > *:nth-of-type(8) {
  transition-delay: 0.8s;
}
.orderFadein > *:nth-of-type(9) {
  transition-delay: 0.9s;
}
.orderFadein > *:nth-of-type(10) {
  transition-delay: 1s;
}
.orderFadein > *:nth-of-type(11) {
  transition-delay: 1.1s;
}
.orderFadein > *:nth-of-type(12) {
  transition-delay: 1.2s;
}
.orderFadein > *:nth-of-type(13) {
  transition-delay: 1.3s;
}
.orderFadein > *:nth-of-type(14) {
  transition-delay: 1.4s;
}
.orderFadein > *:nth-of-type(15) {
  transition-delay: 1.5s;
}
.orderFadein > *:nth-of-type(16) {
  transition-delay: 1.6s;
}
.orderFadein > *:nth-of-type(17) {
  transition-delay: 1.7s;
}
.orderFadein > *:nth-of-type(18) {
  transition-delay: 1.8s;
}
.orderFadein > *:nth-of-type(19) {
  transition-delay: 1.9s;
}
.orderFadein > *:nth-of-type(20) {
  transition-delay: 2s;
}
.orderFadein > *:nth-of-type(21) {
  transition-delay: 2.1s;
}
.orderFadein > *:nth-of-type(22) {
  transition-delay: 2.2s;
}
.orderFadein > *:nth-of-type(23) {
  transition-delay: 2.3s;
}
.orderFadein > *:nth-of-type(24) {
  transition-delay: 2.4s;
}
.orderFadein > *:nth-of-type(25) {
  transition-delay: 2.5s;
}
.orderFadein > *:nth-of-type(26) {
  transition-delay: 2.6s;
}
.orderFadein > *:nth-of-type(27) {
  transition-delay: 2.7s;
}
.orderFadein > *:nth-of-type(28) {
  transition-delay: 2.8s;
}
.orderFadein > *:nth-of-type(29) {
  transition-delay: 2.9s;
}
.orderFadein > *:nth-of-type(30) {
  transition-delay: 3s;
}
.is-anm .orderFadein > * {
  opacity: 1;
  transform: translate(0, 0);
}

.fadeIn {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0s;
  transform: translate(0, 0.5em);
}
.is-anm .fadeIn, .fadeIn.is-anm {
  opacity: 1;
  transform: translate(0, 0);
}

.fadeInScaleDown {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0s;
  transform: translate(0, 0.5em) scale(1.1);
}
.is-anm .fadeInScaleDown, .fadeInScaleDown.is-anm {
  opacity: 1;
  transform: translate(0, 0) scale(1);
}

.bnr-list .bnr:nth-of-type(1) {
  transition-delay: 0.1s;
}
.bnr-list .bnr:nth-of-type(2) {
  transition-delay: 0.2s;
}
.bnr-list .bnr:nth-of-type(3) {
  transition-delay: 0.3s;
}

.blurIn {
  opacity: 0;
  filter: blur(10px);
  transform: scale(0.95);
  transition: all 1.8s ease;
  /* アクティブ状態：表示されてぼかしがなくなる */
}
.is-anm .blurIn, .blurIn.is-anm {
  opacity: 1;
  transform: scale(1);
  filter: blur(0);
}

h4 {
  margin: 0;
  padding: 0;
  font-size: 14px;
}

.bookingengine {
  color: #D6D6D6;
}

.booking {
  font-size: 14px;
  font-weight: bold;
  color: #333;
  padding: 0 0 0.2em 0;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}

.booking_date {
  margin: 0;
  padding: 0 5px;
  display: block;
}
@media screen and (max-width: 767px) {
  .booking_date {
    width: 100%;
  }
}

.booking_date_2col {
  float: left;
  display: block;
  width: 80px;
  margin-right: 5px;
  padding: 0 5px;
}

input, select {
  margin: 2px 0;
  padding: 2px 3px;
}

input.button {
  width: 230px;
  margin: 3px auto;
  text-align: center;
}

hr {
  clear: both;
  width: 98%;
  height: 0;
  margin: 0;
  padding: 0;
  border: none;
  border-bottom: 1px dotted #CCCCCC;
}

#nitteiarea,
#ninzuarea,
#ryokinarea,
#searchtypearea {
  width: 100%;
  margin: 0;
  padding: 5px;
  border: none;
}

input#chkymd,
input#chkpsn {
  margin: 0;
  padding: 0;
}

#calidif,
#apple_overlayif {
  width: 0;
  height: 0;
  position: absolute;
  display: block;
}

.form-container {
  padding: 2%;
  width: 100%;
  margin: 0 auto;
}
.form-container #booking_inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin: 0;
  padding: 0;
  line-height: 1.5em;
  font-size: 12px;
}
.form-container #booking_inner .field-wrap {
  width: 40%;
}
.form-container #booking_inner .field-wrap-wide {
  width: 60%;
}
@media screen and (max-width: 767px) {
  .form-container #booking_inner .field-wrap {
    width: 100%;
    margin-bottom: 0.3em;
  }
}
.form-container #booking_inner .field-wrap.submit-wrap {
  display: flex;
  justify-content: center;
  padding: 1em 0 0 0;
}
@media screen and (max-width: 767px) {
  .form-container #booking_inner .field-wrap.submit-wrap {
    width: 100%;
  }
}
.form-container #booking_inner .field-wrap.submit-wrap input {
  border: none;
  width: 100%;
  max-width: 700px;
  border: 1px solid #333;
  font-size: 20px;
  color: #333;
  cursor: pointer;
  padding: 0.3em 5em;
}
.form-container #booking_inner .field-wrap.submit-wrap input:hover {
  opacity: 0.7;
}

.mini {
  font-size: 0.7em;
}

.flex-group {
  display: flex;
}
@media screen and (max-width: 767px) {
  .flex-group {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 767px) {
  .flex-group > div {
    width: 100%;
  }
}

.date-group {
  margin-right: 2em;
  margin-bottom: 0.5em;
}

.field-group {
  background: #fff;
}
@media screen and (max-width: 767px) {
  .field-group {
    width: 100%;
    padding: 0;
  }
}

.ninzu-wrap {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .ninzu-wrap {
    flex-wrap: wrap;
  }
}
.ninzu-wrap .ninzu {
  margin-right: 1em;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .ninzu-wrap .ninzu:last-of-type {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .ninzu-wrap .ninzu {
    margin-right: 0;
  }
}

.flex {
  display: flex;
  align-items: center;
}
.flex > * {
  margin-right: 0.5em;
}
.flex > *:last-child {
  margin-right: 0;
}

select, input {
  border-radius: 0 !important;
  -webkit-appearance: none;
  padding: 0.5em 0.8em;
  border: none;
  font-size: 1.6rem;
  color: #555;
  background: none;
}
@media screen and (max-width: 767px) {
  select, input {
    padding: 0.3em;
    font-size: 1.4rem;
  }
}

input {
  border: 1px solid #eee;
}
input[type=checkbox] {
  width: 1em;
  height: 1em;
}

/* チェックボックス01 */
input[type=checkbox] {
  display: none;
}

.checkboxText {
  box-sizing: border-box;
  cursor: pointer;
  display: inline-block;
  padding: 5px 30px;
  position: relative;
  width: auto;
}

.checkboxText::before {
  background: #fff;
  border: 1px solid #eee;
  content: "";
  display: block;
  height: 16px;
  left: 5px;
  margin-top: -8px;
  position: absolute;
  top: 50%;
  width: 16px;
}

.checkboxText::after {
  border-right: 3px solid #333;
  border-bottom: 3px solid #333;
  content: "";
  display: block;
  height: 9px;
  left: 10px;
  margin-top: -7px;
  opacity: 0;
  position: absolute;
  top: 50%;
  transform: rotate(45deg);
  width: 5px;
}

input[type=checkbox]:checked + .checkboxText::after {
  opacity: 1;
}

.select-wrap {
  position: relative;
  border: 1px solid #eee;
}
.select-wrap::after {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 0.4em solid #333;
  border-right: 0.3em solid transparent;
  border-left: 0.3em solid transparent;
  position: absolute;
  right: 0.5em;
  top: 50%;
  transform: translateY(-50%);
}
.select-wrap select {
  width: 100%;
  padding-right: 1.5em;
}

@media screen and (max-width: 767px) {
  #hotelarea select {
    width: 100%;
  }
}

.date-group span {
  display: inline-block;
  margin: 0 0.3em;
  opacity: 0.7;
}
@media screen and (max-width: 767px) {
  .form-s-text {
    font-size: 16px;
  }
}

select[name=minPrice], select[name=maxPrice] {
  width: 8em;
}

@media screen and (max-width: 767px) {
  .ninzu {
    flex-wrap: wrap;
    width: 25%;
  }
}
.ninzu > div {
  display: flex;
  align-items: center;
}
.ninzu select {
  min-width: 3em;
}
@media screen and (max-width: 767px) {
  .ninzu span.form-s-text {
    display: inline-block;
    width: 100%;
    font-size: 1rem;
  }
}

#calid_screen table {
  background-color: #fff !important;
}

.groupHotels {
  width: 100%;
  background: #e0e0e0;
}
.groupHotels .inner {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}
.groupHotels .groupHotels-container .inner {
  padding: 1em 0;
}
.groupHotels .groupHotels-container .inner .groupHotels-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  list-style: none;
}
.groupHotels .groupHotels-container .inner .groupHotels-list li {
  padding: 2rem 0;
}
@media screen and (max-width: 767px) {
  .groupHotels .groupHotels-container .inner .groupHotels-list li {
    width: 100%;
    padding: 0.5em 0;
  }
}
.groupHotels .groupHotels-container .inner .groupHotels-list li a, .groupHotels .groupHotels-container .inner .groupHotels-list li span {
  text-decoration: none;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  display: block;
  width: 100%;
  padding: 0.3rem 1em;
  opacity: 0.7;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-align: center;
  line-height: 1.2;
}
.groupHotels .groupHotels-container .inner .groupHotels-list li a, .groupHotels .groupHotels-container .inner .groupHotels-list li a:link, .groupHotels .groupHotels-container .inner .groupHotels-list li a:visited, .groupHotels .groupHotels-container .inner .groupHotels-list li span, .groupHotels .groupHotels-container .inner .groupHotels-list li span:link, .groupHotels .groupHotels-container .inner .groupHotels-list li span:visited {
  color: #404c4f;
}
.groupHotels .groupHotels-container .inner .groupHotels-list li a:hover, .groupHotels .groupHotels-container .inner .groupHotels-list li a:active, .groupHotels .groupHotels-container .inner .groupHotels-list li span:hover, .groupHotels .groupHotels-container .inner .groupHotels-list li span:active {
  text-decoration: none;
  color: #404c4f;
}
@media screen and (max-width: 1099px) {
  .groupHotels .groupHotels-container .inner .groupHotels-list li a, .groupHotels .groupHotels-container .inner .groupHotels-list li span {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .groupHotels .groupHotels-container .inner .groupHotels-list li a, .groupHotels .groupHotels-container .inner .groupHotels-list li span {
    font-size: 3.15vw;
  }
}
.groupHotels .groupHotels-container .inner .groupHotels-list li:not(:last-of-type) a {
  border-right: 1px solid rgba(64, 76, 79, 0.4);
}
@media screen and (max-width: 767px) {
  .groupHotels .groupHotels-container .inner .groupHotels-list li:not(:last-of-type) a {
    border-right: none;
  }
}
@media screen and (max-width: 767px) {
  .groupHotels .groupHotels-container .inner .groupHotels-list li:nth-of-type(even) a {
    border-right: none;
  }
}
.groupHotels .areaBnr {
  background: #404c4f !important;
  padding-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .groupHotels .areaBnr {
    padding-bottom: 8rem;
  }
}
.groupHotels .areaBnr .inner {
  padding: 1em 0;
}
.groupHotels .areaBnr .inner .bnr-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.groupHotels .areaBnr .inner .bnr-list .bnr {
  width: 25%;
  padding: 2rem 0;
}
@media screen and (max-width: 767px) {
  .groupHotels .areaBnr .inner .bnr-list .bnr {
    width: 50%;
    padding: 0.5em 0;
  }
}
.groupHotels .areaBnr .inner .bnr-list .bnr a {
  text-decoration: none;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  display: block;
  width: 100%;
  padding: 0.3rem 0;
  opacity: 0.7;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-align: center;
}
.groupHotels .areaBnr .inner .bnr-list .bnr a, .groupHotels .areaBnr .inner .bnr-list .bnr a:link, .groupHotels .areaBnr .inner .bnr-list .bnr a:visited {
  color: #fff;
}
.groupHotels .areaBnr .inner .bnr-list .bnr a:hover, .groupHotels .areaBnr .inner .bnr-list .bnr a:active {
  text-decoration: none;
  color: #fff;
}
@media screen and (max-width: 1099px) {
  .groupHotels .areaBnr .inner .bnr-list .bnr a {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .groupHotels .areaBnr .inner .bnr-list .bnr a {
    font-size: 3.15vw;
  }
}
.groupHotels .areaBnr .inner .bnr-list .bnr:not(:last-of-type) a {
  border-right: 1px solid rgba(255, 255, 255, 0.4);
}
@media screen and (max-width: 767px) {
  .groupHotels .areaBnr .inner .bnr-list .bnr:nth-of-type(even) a {
    border-right: none;
  }
}

.hotels {
  width: 100%;
  position: relative;
  z-index: 0;
  overflow: hidden;
}
.hotels .inner {
  width: 100%;
}
.hotels .block-group {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}
.hotels .block-group > div.img-block {
  width: 40%;
}
@media screen and (max-width: 767px) {
  .hotels .block-group > div.img-block {
    width: 100%;
  }
}
.hotels .block-group > div.text-block {
  width: 60%;
}
@media screen and (max-width: 767px) {
  .hotels .block-group > div.text-block {
    width: 100%;
  }
}
.hotels .block-group .img-block {
  display: flex;
  padding: 5%;
}
.hotels .block-group .img-block figure {
  width: 100%;
  transition-delay: 0.2s;
}
.hotels .block-group .text-block {
  padding: 3%;
}
.hotels .title {
  width: 100%;
  padding: 16% 0;
  transition: all 1.5s;
  opacity: 0;
  text-align: center;
  color: #fff;
  font-size: 3.2rem;
  position: relative;
}
.hotels .title::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 0;
}
@media screen and (max-width: 767px) {
  .hotels .title {
    padding: 20% 0;
  }
}
.hotels .title p.title-area {
  font-family: "EB Garamond", serif;
  font-weight: 400;
  font-size: 4.5vw;
  font-weight: 400;
  white-space: nowrap;
  position: absolute;
  display: inline-block;
  opacity: 0.3;
  top: 9%;
  left: 50%;
  transform: translateX(-50%);
  line-height: 1;
}
.hotels .title h3, .hotels .title p {
  position: relative;
  z-index: 1;
}
.hotels .title h3 {
  margin-bottom: 0.3em;
}
.hotels .title.is-anm {
  opacity: 1;
}
.hotels .title .section-lead {
  margin-top: 2em;
}

.hotels-list {
  width: 100%;
}
.hotels-list-block {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  border-bottom: 1px solid #eee;
  background-color: white;
}
.hotels-list-block:nth-child(even) {
  background-color: #fafaf9;
}
.hotels-list-block:first-of-type {
  border-top: 1px solid #eee;
}
.hotels-list-block .img-block, .hotels-list-block .text-block {
  width: 50%;
  transition-delay: 0.2s;
}
@media screen and (max-width: 767px) {
  .hotels-list-block .img-block, .hotels-list-block .text-block {
    width: 100%;
  }
}
.hotels-list-block .img-block {
  min-height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .hotels-list-block .img-block {
    min-height: auto;
    height: 0;
    padding-bottom: 60%;
  }
}
.hotels-list-block .text-block {
  padding: 8% 2%;
  text-align: center;
}
.hotels-list-block .text-block--title {
  width: 100%;
  text-align: center;
  margin-bottom: 3rem;
}
.hotels-list-block .text-block--title span {
  display: inline-block;
  width: 100%;
  text-align: center;
}
.hotels-list-block .text-block--title .hotels-name {
  margin-top: 0.8em;
  font-size: 1.4rem;
}
.hotels-list-block .text-block--lead {
  font-size: 2rem;
  margin-bottom: 0.8em;
}
.hotels-list-block .text-block--text {
  font-size: 1.4rem;
  margin-bottom: 2em;
  line-height: 1.9;
}
.hotels-list-block .text-block--link {
  width: 100%;
  text-align: center;
  /*a{
   display: inline-block;
   padding: .8em 2em;
   font-size: 1.8rem;
   text-decoration: none;
   line-height: 1;
   position: relative;
   @include c.aset(#000,#000);
   &::after{
  	 display: inline-block;
  	   content: '';
  	   width: 100%;
  	   background-color: #000;
  	   height: 1px;
  	   position: absolute;
  	   left: 50%;
  	   transform: translateX(-50%);
  	   bottom: 0;
  	   opacity: .2;
  	  }
   &::before{
  	 display: inline-block;
  	 content: '';
  	 width: .4em;
  	 height: .4em;
  	 border-right: 1px solid #000;
  	 border-bottom: 1px solid #000;
  	 transform: rotate(-45deg) translateY(-52%);
  	 position: absolute;
  	 right: .5em;
  	 top: 50%;
   }
  }*/
}
.hotels-list-block .text-block--detail {
  padding: 0.5em 0;
  margin-bottom: 2em;
}
.hotels-list-block .text-block--detail p {
  text-align: center;
  font-size: 1.3rem;
  margin-bottom: 0.2em;
}

.restaurant-list {
  width: 80%;
  margin: 5% auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.restaurant-list-block {
  width: 48%;
  margin-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .restaurant-list-block {
    width: 100%;
  }
}
.restaurant-list-block .img-block, .restaurant-list-block .text-block {
  width: 100%;
  transition-delay: 0.2s;
}
.restaurant-list-block .img-block {
  height: 0;
  padding-bottom: 60%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  margin-bottom: 2em;
}
.restaurant-list-block .text-block {
  padding: 0;
  text-align: center;
}
.restaurant-list-block .text-block--title {
  width: 100%;
  text-align: center;
  margin-bottom: 3rem;
}
.restaurant-list-block .text-block--title span {
  display: inline-block;
  width: 100%;
  text-align: center;
}
.restaurant-list-block .text-block--title .restaurant-name {
  margin-top: 0.5em;
  font-size: 1.4rem;
}
.restaurant-list-block .text-block--lead {
  font-size: 2rem;
  margin-bottom: 0.8em;
}
.restaurant-list-block .text-block--text {
  font-size: 1.6rem;
  margin-bottom: 2em;
  line-height: 1.5;
}
.restaurant-list-block .text-block--link {
  width: 100%;
  text-align: center;
  /*a{
     display: inline-block;
     padding: .8em 2em;
     font-size: 1.8rem;
     text-decoration: none;
     line-height: 1;
     position: relative;
     @include c.aset(#000,#000);
     &::after{
  	   display: inline-block;
  		 content: '';
  		 width: 100%;
  		 background-color: #000;
  		 height: 1px;
  		 position: absolute;
  		 left: 50%;
  		 transform: translateX(-50%);
  		 bottom: 0;
  		 opacity: .2;
  		}
     &::before{
  	   display: inline-block;
  	   content: '';
  	   width: .4em;
  	   height: .4em;
  	   border-right: 1px solid #000;
  	   border-bottom: 1px solid #000;
  	   transform: rotate(-45deg) translateY(-52%);
  	   position: absolute;
  	   right: .5em;
  	   top: 50%;
     }
    }*/
}

.hotels-logo.logo-size20 img, .restaurant-logo.logo-size20 img {
  width: 20%;
}
.hotels-logo.logo-size30 img, .restaurant-logo.logo-size30 img {
  width: 30%;
}
.hotels-logo.logo-size40 img, .restaurant-logo.logo-size40 img {
  width: 40%;
}
.hotels-logo.logo-size50 img, .restaurant-logo.logo-size50 img {
  width: 50%;
}
.hotels-logo.logo-size60 img, .restaurant-logo.logo-size60 img {
  width: 60%;
}

.plans {
  width: 100%;
  padding: 5% 0;
}
.plans .title {
  text-align: center;
}

.tab-wrap {
  width: 80%;
  margin: 40px auto;
}
@media screen and (max-width: 767px) {
  .tab-wrap {
    width: 100%;
    margin: 20px auto 20px auto;
  }
}

.scroll-arrw {
  display: none;
  transition: opacity 0.5s;
  padding-bottom: 5%;
}
@media screen and (max-width: 767px) {
  .scroll-arrw {
    width: 100%;
    position: relative;
    display: block;
  }
}
.scroll-arrw.horscrolled {
  opacity: 0;
}

/*スクロールダウン全体の場所*/
.horScroll {
  /*描画位置※位置は適宜調整してください*/
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-22px);
}

/* 丸の描写 */
.horScroll:before {
  content: "";
  /*描画位置*/
  position: absolute;
  left: 0;
  bottom: -4px;
  /*丸の形状*/
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #888;
  /*丸の動き1.6秒かけて透過し、永遠にループ*/
  animation: circlemove 2s ease-in-out infinite, cirlemovehide 2s ease-out infinite;
}

/*下からの距離が変化して丸の全体が上から下に動く*/
@keyframes circlemove {
  0% {
    left: 45px;
  }
  100% {
    left: -5px;
  }
}
/*上から下にかけて丸が透過→不透明→透過する*/
@keyframes cirlemovehide {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  80% {
    opacity: 0.9;
  }
  100% {
    opacity: 0;
  }
}
/* 線の描写 */
.horScroll:after {
  content: "";
  /*描画位置*/
  position: absolute;
  bottom: 0;
  left: 0;
  /*線の形状*/
  height: 1px;
  width: 50px;
  background: #000;
  opacity: 0.1;
}

.tab-block {
  margin-bottom: 60px;
  box-shadow: 0 0 70px rgba(0, 0, 0, 0.1);
}
@media screen and (max-width: 767px) {
  .tab-block .tab-nav-wrap {
    overflow-x: auto;
    padding: 5% 5% 0% 5%;
    width: 100%;
    margin: auto;
    position: relative;
  }
}
.tab-block .tab-nav {
  list-style: none;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .tab-block .tab-nav {
    padding: 5% 0;
    margin: auto;
  }
}
.tab-block .tab-nav li {
  font-size: 1.6rem;
  width: 20%;
  text-align: center;
  padding: 20px 10px;
  cursor: pointer;
  transition: background-color 0.3s;
}
@media screen and (max-width: 767px) {
  .tab-block .tab-nav li {
    background: rgba(15, 35, 67, 0.1);
    width: auto;
    margin: 0 5px;
    text-align: left;
    padding: 0.5em 1em;
    border-radius: 10em;
    border-left: none;
    font-size: 1.5rem;
    white-space: nowrap;
  }
}
.tab-block .tab-nav li:hover {
  background-color: #414d5e;
  color: #fff;
}
.tab-block .tab-nav li:first-child {
  border-left: none;
}
.tab-block .tab-nav li.active {
  color: #fff;
  background: #0F2343;
}
.tab-block .tab-nav li > span {
  /*@include c.mq(){
  	text-align: left;
  	padding: 0 0 0 .7em;
  	  position: relative;
  	&::before{
  			  content: "";
  			  display: block;
  			  width: .5em;
  			  height: 1px;
  			  position: absolute;
  			  top: 50%;
  			  left: 0;
  			  background: rgba(#000,.3);
  		  }
  }*/
}
.tab-block .tab-body {
  list-style: none;
  padding: 50px 20px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .tab-block .tab-body {
    padding: 20px 20px 20px 20px;
  }
}
.tab-block .tab-body h3 {
  font-size: 131%;
  margin-bottom: 5px;
  font-weight: bold;
}
.tab-block .tab-body li {
  display: none;
}
.tab-block .tab-body li.active {
  display: block;
  animation-duration: 1.5s;
  animation-name: fade-in;
}

@keyframes fade-in {
  0% {
    display: none;
    opacity: 0;
  }
  1% {
    display: block;
    opacity: 0;
  }
  100% {
    display: block;
    opacity: 1;
  }
}
.plan-list-inner {
  display: flex;
  flex-wrap: wrap;
  width: 90%;
  margin: 0 auto;
  justify-content: space-between;
}
.plan-list-inner .plan-block {
  width: 48%;
}
@media screen and (max-width: 767px) {
  .plan-list-inner .plan-block {
    width: 100%;
    margin-bottom: 10%;
  }
}
@media screen and (max-width: 767px) {
  .plan-list-inner .plan-block:last-child {
    margin-bottom: 0;
  }
}
.plan-list-inner .plan-info .plan-title {
  text-align: left;
  font-size: 2.4rem;
  margin: 0.5em 0;
  line-height: 1.5;
}
.plan-list-inner .plan-info .plan-text {
  text-align: left;
  font-size: 1.6rem;
  margin-bottom: 1em;
  line-height: 1.5;
}
.plan-list-inner .plan-info .plan-link {
  width: 100%;
  text-align: center;
  /* a{
    display: inline-block;
    //border-radius: 10em;
    padding: .8em 5em;
    background-color: c.$color01;
    color: #fff;
    font-size: 1.8rem;
    text-decoration: none;
    line-height: 1;
    position: relative;
    &::before{
  	  display: inline-block;
  	  content: '';
  	  width: .5em;
  	  height: .5em;
  	  border-right: 1px solid #fff;
  	  border-bottom: 1px solid #fff;
  	  transform: rotate(-45deg) translateY(-50%);
  	  position: absolute;
  	  right: .5em;
  	  top: 50%;
    }
    @include c.mq(){
  	  padding: .8em 0;
  	  width: 100%;
  	  text-align: center;
    }
   }*/
}

.plan-list-slide {
  width: 90%;
  margin: 0 auto;
  padding-top: 5%;
}
.plan-list-slide .plan-block {
  margin: 0 10px;
}
@media screen and (max-width: 767px) {
  .plan-list-slide .plan-block {
    width: 100%;
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  .plan-list-slide .plan-block:last-child {
    margin-bottom: 0;
  }
}
.plan-list-slide .plan-info .plan-title {
  text-align: left;
  font-size: 1.8rem;
  margin: 0.5em 0;
  line-height: 1.5;
}
.plan-list-slide .plan-info .plan-text {
  text-align: left;
  font-size: 1.4rem;
  margin-bottom: 2em;
  line-height: 1.5;
}
.plan-list-slide .plan-info .plan-link {
  width: 100%;
  text-align: center;
  /* a{
    display: inline-block;
    //border-radius: 10em;
    padding: .8em 5em;
    background-color: c.$color01;
    color: #fff;
    font-size: 1.8rem;
    text-decoration: none;
    line-height: 1;
    position: relative;
    &::before{
  	  display: inline-block;
  	  content: '';
  	  width: .5em;
  	  height: .5em;
  	  border-right: 1px solid #fff;
  	  border-bottom: 1px solid #fff;
  	  transform: rotate(-45deg) translateY(-50%);
  	  position: absolute;
  	  right: .5em;
  	  top: 50%;
    }
    @include c.mq(){
  	  padding: .8em 0;
  	  width: 100%;
  	  text-align: center;
    }
   }*/
}

.plans-light .plan-title {
  color: #000;
}
.plans-light .plan-text {
  color: #000;
}
.news {
  width: 100%;
  padding: 5% 0;
}
@media screen and (max-width: 767px) {
  .news {
    padding: 11% 0 8% 0;
  }
}
.news .inner {
  width: 100%;
}
.news .title {
  text-align: center;
}
.news-list {
  width: 90%;
  padding: 3% 0 0 0;
  max-width: 1000px;
  margin: 0 auto;
}
.news-list ul {
  list-style: none;
  margin: 0;
}
.news-list li {
  width: 100%;
  margin-bottom: 0.8em;
}
.news-list li p {
  display: flex;
  font-size: 1.6rem;
}
.news-list li p .news-date {
  color: #BAB8A0;
  margin-right: 1.5em;
}
@media screen and (max-width: 767px) {
  .news-list li p {
    font-size: 1.4rem;
  }
}

#news-list {
  max-height: 150px;
  /* 初期表示の高さを設定 */
  overflow-y: auto;
  /* スクロール可能にする */
}

.newsMore-wrap {
  width: 90%;
  padding: 3% 0 0 0;
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
}

.newsMore {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0.3em 1em;
  appearance: none;
  font-weight: normal;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  border: 1px solid rgba(50, 51, 58, 0.1);
  transition: all 0.5s;
}
@media screen and (max-width: 1099px) {
  .newsMore {
    font-size: 1.08vw;
  }
}
@media screen and (max-width: 767px) {
  .newsMore {
    font-size: 2.7vw;
  }
}
.newsMore:hover {
  border: 1px solid rgba(50, 51, 58, 0.5);
}

.news-contents-container {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}

.news-contents-inner {
  padding: 2rem 0 5rem 0;
}
@media screen and (max-width: 767px) {
  .news-contents-inner {
    padding: 1rem 0 3rem 0;
  }
}

.news-jishin-block {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1000px;
}
.news-jishin-block dl dt {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .news-jishin-block dl dt {
    font-size: 1.62vw;
  }
}
@media screen and (max-width: 767px) {
  .news-jishin-block dl dt {
    font-size: 4.05vw;
  }
}
.news-jishin-block dl dt::before {
  content: "";
  display: inline-block;
  width: 0.7em;
  height: 0.7em;
  background: #000;
  border-radius: 10rem;
  margin-right: 0.1em;
}
.news-jishin-block dl dd {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .news-jishin-block dl dd {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .news-jishin-block dl dd {
    font-size: 3.15vw;
  }
}
.news-jishin-block dl dd:not(:last-of-type) {
  margin-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .news-jishin-block dl dd:not(:last-of-type) {
    margin-bottom: 2rem;
  }
}

ul.noDist {
  list-style: none;
}

.news-jishin-area-name {
  display: inline-block;
  padding: 0.3em 0.4em;
  background: #333;
  color: #fff;
  font-size: 0.8em;
  line-height: 1;
  border-radius: 5px;
  margin-left: 0.3em;
}

.bousai-app-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}

.bousai-app-block-link-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}
.bousai-app-block-link-wrap a {
  text-decoration: none;
  color: #333;
}

.access {
  margin-top: 30px;
  display: flex;
  flex-wrap: wrap;
}
.access .gmap {
  width: 60%;
}
@media screen and (max-width: 767px) {
  .access .gmap {
    width: 100%;
  }
}
.access #googlemaps {
  width: 60%;
}
@media screen and (max-width: 767px) {
  .access #googlemaps {
    width: 100%;
  }
}
.access .access-info {
  width: 40%;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .access .access-info {
    width: 100%;
  }
}
.access .access-info .title {
  margin-bottom: 1em;
}

.access-info {
  width: 100%;
  text-align: center;
  padding: 5% 0;
}
@media screen and (max-width: 767px) {
  .access-info {
    padding: 11% 0 8% 0;
  }
}
.access-info p {
  width: 100%;
  text-align: center;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .access-info p {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .access-info p {
    font-size: 3.6vw;
  }
}

.access-detail .lead {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #333;
  text-align: center;
  width: 100%;
  padding: 3em 0;
}
@media screen and (max-width: 1099px) {
  .access-detail .lead {
    font-size: 1.62vw;
  }
}
@media screen and (max-width: 767px) {
  .access-detail .lead {
    font-size: 4.05vw;
  }
}
.access-detail .title {
  padding: 13% 0;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .access-detail .title {
    padding: 30% 0;
  }
}
.access-detail .title h3, .access-detail .title p {
  color: #fff;
  text-align: center;
  width: 100%;
}
.access-detail .title {
  position: relative;
}
.access-detail .title::before, .access-detail .title::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
}
.access-detail .title::before {
  z-index: -2;
  background: url(../img/access/access-title-bg.jpg) no-repeat center bottom 30%/cover;
}
.access-detail .title::after {
  z-index: -1;
}
.access-detail-block {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 5%;
  justify-content: center;
  width: 100%;
}
.access-detail-block--text {
  width: 100%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .access-detail-block--text {
    width: 100%;
  }
}
.access-detail-block--text h4 {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .access-detail-block--text h4 {
    font-size: 2.16vw;
  }
}
@media screen and (max-width: 767px) {
  .access-detail-block--text h4 {
    font-size: 5.4vw;
  }
}
.access-detail-block--text .access-route {
  padding: 5% 0;
  width: 100%;
  background-color: #e8edf7;
}
.access-detail-block--text .access-route-title {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 26px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-align: center;
  margin-bottom: 1em;
}
@media screen and (max-width: 1099px) {
  .access-detail-block--text .access-route-title {
    font-size: 2.34vw;
  }
}
@media screen and (max-width: 767px) {
  .access-detail-block--text .access-route-title {
    font-size: 5.85vw;
  }
}
.access-detail-block--text .access-route ul {
  list-style: none;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 1099px) {
  .access-detail-block--text .access-route ul {
    font-size: 1.62vw;
  }
}
@media screen and (max-width: 767px) {
  .access-detail-block--text .access-route ul {
    font-size: 4.05vw;
  }
}
@media screen and (max-width: 767px) {
  .access-detail-block--text .access-route ul {
    flex-wrap: wrap;
  }
}
.access-detail-block--text .access-route ul li {
  border-right: 1px solid rgba(0, 0, 0, 0.2);
  padding: 0.7em 2em;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .access-detail-block--text .access-route ul li {
    width: 100%;
    border-right: none;
  }
}
.access-detail-block--text .access-route ul li:first-of-type {
  border-left: 1px solid rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 767px) {
  .access-detail-block--text .access-route ul li:first-of-type {
    border-left: none;
  }
}
.access-detail-block--text .access-route ul li p {
  text-align: center;
  line-height: 1;
}
.access-detail-block--text .access-route ul li p span {
  padding: 0.5em 1em;
}
.access-detail-block--text .access-route ul li p span b:first-of-type {
  padding-right: 5em;
  position: relative;
  font-size: 1.2em;
}
.access-detail-block--text .access-route ul li p span b:first-of-type::after {
  content: "";
  display: inline-block;
  width: 3em;
  height: 1px;
  background: rgba(0, 0, 0, 0.3);
  position: absolute;
  top: 50%;
  right: 0;
  margin: 0 1em 0 0;
}
.access-detail-block--text .access-route ul li p span b:nth-of-type(2) {
  color: #888;
}
.access-detail-block--text .access-route ul li span {
  display: inline-block;
  text-align: center;
}
.access-detail-block--map {
  width: 60%;
}
@media screen and (max-width: 767px) {
  .access-detail-block--map {
    width: 100%;
  }
}

.access-detail-gmap #googlemaps {
  width: 100%;
  height: 300px;
}
.access-detail-gmap .access-info {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .access-detail-gmap .access-info {
    width: 100%;
  }
}
.access-detail-gmap .access-info .title {
  margin-bottom: 1em;
}

.facilities-detail .lead {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #333;
  text-align: center;
  width: 100%;
  padding: 3em 0;
}
@media screen and (max-width: 1099px) {
  .facilities-detail .lead {
    font-size: 1.62vw;
  }
}
@media screen and (max-width: 767px) {
  .facilities-detail .lead {
    font-size: 4.05vw;
  }
}
.facilities-detail .title {
  padding: 13% 0;
}
@media screen and (max-width: 767px) {
  .facilities-detail .title {
    padding: 30% 0;
  }
}
.facilities-detail .title h3, .facilities-detail .title p {
  text-align: center;
  width: 100%;
}
.facilities-detail.ce2 .title {
  position: relative;
}
.facilities-detail.ce2 .title::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
}
.facilities-detail.ce2 .title::before {
  z-index: -2;
  background: url(../img/facilities/facilities-title-bg.jpg) no-repeat center center/cover;
}
.facilities-detail-contents {
  padding-top: 5%;
}
.facilities-detail-block {
  display: flex;
  flex-wrap: wrap;
  padding: 0 5%;
  margin-bottom: 5%;
}
.facilities-detail-block--img {
  width: 100%;
}
.facilities-detail-block--img > div {
  width: 100%;
  height: 0;
  padding-bottom: 30%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}
.facilities-detail-block--text {
  width: 100%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  align-content: center;
  padding: 1em 0 0 0;
}
@media screen and (max-width: 767px) {
  .facilities-detail-block--text {
    width: 100%;
  }
}
.facilities-detail-block--text h5 {
  width: 100%;
  display: flex;
  align-items: center;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .facilities-detail-block--text h5 {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .facilities-detail-block--text h5 {
    font-size: 4.5vw;
  }
}
.facilities-detail-block--text-info {
  width: 100%;
}
.facilities-detail-block--text-info dl {
  display: flex;
  justify-content: space-between;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
@media screen and (max-width: 1099px) {
  .facilities-detail-block--text-info dl {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .facilities-detail-block--text-info dl {
    font-size: 3.15vw;
  }
}
.facilities-detail-block--text-info dl dt {
  width: 10%;
  color: #888;
}
.facilities-detail-block--text-info dl dd {
  width: 88%;
}

.cal-tab-wrap {
  width: 100%;
}
.cal-tab-body-block {
  width: 100%;
  position: relative;
  height: 0;
  padding-bottom: 73%;
}
@media screen and (max-width: 767px) {
  .cal-tab-body-block {
    padding-bottom: 160%;
  }
}
.cal-tab-body-block iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
}

@media screen and (max-width: 767px) {
  .cal-tab-block .cal-tab-nav-wrap {
    overflow-x: auto;
    padding: 1% 5% 0% 5%;
    width: 100%;
    margin: auto;
    position: relative;
  }
}
.cal-tab-block .cal-tab-nav {
  list-style: none;
  display: flex;
  border-bottom: 1px solid #0F2343;
}
@media screen and (max-width: 767px) {
  .cal-tab-block .cal-tab-nav {
    border-bottom: none;
    padding: 5% 0;
    margin: auto;
  }
}
.cal-tab-block .cal-tab-nav li {
  font-size: 1.5rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 1em 1em;
  cursor: pointer;
  transition: background-color 0.3s;
}
@media screen and (max-width: 767px) {
  .cal-tab-block .cal-tab-nav li {
    background: rgba(15, 35, 67, 0.1);
    width: auto;
    margin: 0 5px;
    text-align: left;
    padding: 0.5em 1em;
    border-radius: 10em;
    border-left: none;
    font-size: 1.5rem;
    white-space: nowrap;
  }
}
.cal-tab-block .cal-tab-nav li:hover {
  background-color: #414d5e;
  color: #fff;
}
.cal-tab-block .cal-tab-nav li:first-child {
  border-left: none;
}
.cal-tab-block .cal-tab-nav li.active {
  color: #fff;
  background: #0F2343;
}
.cal-tab-block .cal-tab-nav li > span {
  /*@include c.mq(){
  	text-align: left;
  	padding: 0 0 0 .7em;
  	  position: relative;
  	&::before{
  			  content: "";
  			  display: block;
  			  width: .5em;
  			  height: 1px;
  			  position: absolute;
  			  top: 50%;
  			  left: 0;
  			  background: rgba(#000,.3);
  		  }
  }*/
}
.cal-tab-block .cal-tab-body {
  list-style: none;
  padding: 10px 20px 10px 20px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .cal-tab-block .cal-tab-body {
    padding: 0;
  }
}
.cal-tab-block .cal-tab-body h3 {
  font-size: 131%;
  margin-bottom: 5px;
  font-weight: bold;
}
.cal-tab-block .cal-tab-body li {
  display: none;
}
.cal-tab-block .cal-tab-body li.active {
  display: block;
  animation-duration: 1.5s;
  animation-name: fade-in;
}

@keyframes fade-in {
  0% {
    display: none;
    opacity: 0;
  }
  1% {
    display: block;
    opacity: 0;
  }
  100% {
    display: block;
    opacity: 1;
  }
}
.cal-container {
  width: 100%;
  position: relative;
  height: 0;
  padding-bottom: 73%;
}
@media screen and (max-width: 767px) {
  .cal-container {
    padding-bottom: 160%;
  }
}
.cal-container iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
}

.about-detail .page-lead {
  width: 80%;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

.about-block {
  width: 100%;
  margin: 0 auto 10rem;
  /*display: flex;
  flex-wrap: wrap;
  align-items: center;
  */
}
@media screen and (max-width: 767px) {
  .about-block {
    margin: 0 auto 7rem;
  }
}
.about-block:nth-of-type(even) .about-block-text {
  order: -1;
}
@media screen and (max-width: 767px) {
  .about-block:nth-of-type(even) .about-block-text {
    order: 2;
  }
}
.about-block-img {
  width: 90%;
  max-width: 800px;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .about-block-img {
    width: 100%;
  }
}
.about-block-img img {
  width: 100%;
  aspect-ratio: 2.4;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .about-block-img img {
    aspect-ratio: 1.5;
  }
}
.about-block-text {
  width: 100%;
  padding: 5rem 0;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  font-size: 1.4rem;
  line-height: 1.8;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .about-block-text {
    width: 100%;
    padding: 3rem;
  }
}
.about-block-text h4 {
  font-size: 1.6em;
  font-weight: normal;
  margin-bottom: 0.6em;
  margin: 0 auto 0.6em;
}
@media screen and (max-width: 767px) {
  .about-block-text h4 {
    font-size: 1.4em;
  }
}
.about-block-text p {
  width: 100%;
  line-height: 2;
}

.about-detail .lead {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #333;
  text-align: center;
  width: 100%;
  padding: 3em 0;
}
@media screen and (max-width: 1099px) {
  .about-detail .lead {
    font-size: 1.62vw;
  }
}
@media screen and (max-width: 767px) {
  .about-detail .lead {
    font-size: 4.05vw;
  }
}
.about-detail .title {
  padding: 13% 0 30% 0;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .about-detail .title {
    padding: 30% 0;
  }
}
.about-detail .title h3, .about-detail .title p {
  color: #fff;
  text-align: center;
  width: 100%;
}
.about-detail .title {
  position: relative;
}
.about-detail .title::before, .about-detail .title::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
}
.about-detail .title::before {
  z-index: -2;
  background: url(../img/about/about-title-bg.jpg) no-repeat center bottom 30%/cover;
}
.about-detail .title::after {
  z-index: -1;
}

#about03 .about-block-img {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#about03 .about-block-img figure:nth-of-type(1) {
  width: 100%;
  margin-bottom: 5px;
}
#about03 .about-block-img figure:nth-of-type(1) img {
  width: 100%;
  aspect-ratio: 2;
  object-fit: cover;
}
#about03 .about-block-img figure:nth-of-type(2), #about03 .about-block-img figure:nth-of-type(3) {
  width: calc((100% - 5px) / 2);
}
#about03 .about-block-img figure:nth-of-type(2) img, #about03 .about-block-img figure:nth-of-type(3) img {
  width: 100%;
  aspect-ratio: 1.5;
  object-fit: cover;
}

.about-lead p:nth-of-type(1) {
  text-align: center;
  margin-bottom: 2rem;
}
.about-lead p:nth-of-type(2) {
  text-align: center;
  line-height: 2;
}
@media screen and (max-width: 767px) {
  .about-lead p:nth-of-type(2) {
    text-align: justify;
  }
}

.l-inner {
  position: relative;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 10rem;
}

[class*=swiper]:focus {
  outline: none;
}

.slide-media,
.thumb-media {
  position: relative;
  overflow: hidden;
}

.slide-media img,
.thumb-media img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.swiper-button-disabled {
  pointer-events: none;
  opacity: 0;
}

.slideF {
  overflow: hidden;
}

.slideF .swiper {
  overflow: visible;
}

.slideF .slide {
  overflow: hidden;
  -webkit-transition: var(--transition), opacity 1s;
  transition: var(--transition), opacity 1s;
}

.slideF .slide {
  padding-right: 3.5em;
}
@media screen and (max-width: 767px) {
  .slideF .slide {
    padding-right: 3.5em;
  }
}
.slideF .slide .featSlideImg, .slideF .slide .featSlideImgs {
  aspect-ratio: 1.2;
}
@media screen and (max-width: 767px) {
  .slideF .slide .featSlideImg, .slideF .slide .featSlideImgs {
    aspect-ratio: 0.9;
  }
}
.slideF .slide .featSlideImg img, .slideF .slide .featSlideImgs img {
  display: inline-block;
  object-fit: cover;
}
.slideF .slide .featSlideImg img {
  width: 100%;
  height: 100%;
}
.slideF .slide .featSlideImgs figure {
  aspect-ratio: 1.2;
}
@media screen and (max-width: 767px) {
  .slideF .slide .featSlideImgs figure {
    aspect-ratio: 0.9;
  }
}
.slideF .slide .featSlideImgs img {
  width: 100%;
  aspect-ratio: 1.2;
}
@media screen and (max-width: 767px) {
  .slideF .slide .featSlideImgs img {
    aspect-ratio: 0.9;
  }
}
.slideF .slide .featSlideImgs {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.slideF .slide .villaname {
  position: absolute;
  right: 0;
  top: 0;
  line-height: 1;
  writing-mode: vertical-rl;
  padding: 0.5em;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  letter-spacing: 0.1em;
  color: #333;
}
@media screen and (max-width: 1099px) {
  .slideF .slide .villaname {
    font-size: 0.9vw;
  }
}
@media screen and (max-width: 767px) {
  .slideF .slide .villaname {
    font-size: 2.25vw;
  }
}
@media screen and (max-width: 767px) {
  .slideF .slide .villaname {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 10px;
    line-height: 1.8;
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .slideF .slide .villaname {
    font-size: 0.9vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .slideF .slide .villaname {
    font-size: 2.25vw;
  }
}
.slideF .slide .villaname span {
  font-size: 1.5em;
  margin-left: 0.5em;
}
@media screen and (max-width: 767px) {
  .slideF .slide .villaname span {
    font-size: 1.2em;
  }
}

.slideF img {
  /*aspect-ratio:1.2;
  object-fit: cover;
  width: 100%;
  @include c.mq(){
    aspect-ratio:1;
  }*/
}

.slideF .slide-content {
  padding: 3.2rem;
}

.slideF .swiper-slide:not(.swiper-slide-visible) .slide {
  pointer-events: none;
}

.slideS .slide-media {
  padding-top: 60%;
}
@media screen and (max-width: 767px) {
  .slideS .slide-media {
    padding-top: 90%;
  }
}
.slideS img {
  aspect-ratio: 2.4;
  object-fit: cover;
  width: 100%;
}

/*@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;800&display=swap');
.swiper-container {
  overflow: hidden;
  position: relative;
}
.d-demo {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  position: relative;
  padding-bottom: 60px;
}
.d-demo__heading {
  width: 20%;
  position: relative;
}
.d-demo__ttl {
  width: 20%;
  max-width: 55px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.d-demo__slider {
  width: 100%;
}
.d-demo__slide {
  width: 100%;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  will-change: transform;
}
.d-demo__slide-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  will-change: transform;
}
.swiper-container-main {
  height: calc(100vh - 10rem);
  min-height: 500px;
  transition: opacity 0.6s ease, transform 0.3s ease;
}
.d-demo__slide-heading {
  position: absolute;
  top: 32%;
  left: 0;
  width: 50%;
  padding-left: 5%;
  color: #fff;
}
.d-demo__slide-ttl {
  font-size: 30px;
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
  margin-bottom: 30px;
}
.d-demo__slide-txt {
  font-size: 13px;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  line-height: 1.4;
  transform: translateX(50px);
}
.swiper-container-nav {
  width: 50%;
  height: 13%;
  position: absolute;
  right: 0;
  bottom: 3.5%;
  z-index: 10;
}
.d-demo__nav {
  cursor: pointer;
}
.d-demo__nav-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  will-change: transform;
}
.d-demo__nav:before {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0.55);
  transition: background-color 0.3s ease;
  content: '';
  z-index: 1;
  transform:translateZ(1px); //safari対策
}
.swiper-slide-active.d-demo__nav:before {
  background-color: rgba(0, 0, 0, 0);
}
.d-demo__nav:hover:before {
  background-color: rgba(0, 0, 0, 0);
}
.d-demo__nav-heading {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
  color: #fff;
  font-size: 15px;
}
 .swiper-button-prev,
  .swiper-button-next {
	--swiper-navigation-size: 12px;
	background-color: transparent;
	border-radius: 50%;
	width: 25px !important;
	height: 25px !important;
	&::after{
		color: #fff;
	}
}*/
.faq-detail .title {
  padding: 10% 0 5% 0;
}
@media screen and (max-width: 767px) {
  .faq-detail .title {
    padding: 30% 0;
  }
}
.faq-detail .qa-list {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  color: #735F51;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1400px;
  padding-top: 8em;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}
@media screen and (max-width: 1099px) {
  .faq-detail .qa-list {
    justify-content: space-between;
  }
}
.faq-detail .qa-list dl {
  font-size: 1.8rem;
  border-bottom: 1px solid rgba(115, 95, 81, 0.2);
  margin-bottom: 1.2em;
  line-height: 1.5;
  width: 100%;
  margin-right: 10px;
}
.faq-detail .qa-list dl:nth-of-type(3n) {
  margin-right: 0;
}
@media screen and (max-width: 1099px) {
  .faq-detail .qa-list dl {
    margin-right: 0;
  }
}
@media screen and (max-width: 767px) {
  .faq-detail .qa-list dl {
    width: 100%;
  }
}
.faq-detail .qa-list dl:nth-of-type(1) dt::before {
  content: "Q1";
}
.faq-detail .qa-list dl:nth-of-type(2) dt::before {
  content: "Q2";
}
.faq-detail .qa-list dl:nth-of-type(3) dt::before {
  content: "Q3";
}
.faq-detail .qa-list dl:nth-of-type(4) dt::before {
  content: "Q4";
}
.faq-detail .qa-list dl:nth-of-type(5) dt::before {
  content: "Q5";
}
.faq-detail .qa-list dl:nth-of-type(6) dt::before {
  content: "Q6";
}
.faq-detail .qa-list dl:nth-of-type(7) dt::before {
  content: "Q7";
}
.faq-detail .qa-list dl:nth-of-type(8) dt::before {
  content: "Q8";
}
.faq-detail .qa-list dl:nth-of-type(9) dt::before {
  content: "Q9";
}
.faq-detail .qa-list dl:nth-of-type(10) dt::before {
  content: "Q10";
}
.faq-detail .qa-list dl:nth-of-type(11) dt::before {
  content: "Q11";
}
.faq-detail .qa-list dl:nth-of-type(12) dt::before {
  content: "Q12";
}
.faq-detail .qa-list dl:nth-of-type(13) dt::before {
  content: "Q13";
}
.faq-detail .qa-list dl:nth-of-type(14) dt::before {
  content: "Q14";
}
.faq-detail .qa-list dl:nth-of-type(15) dt::before {
  content: "Q15";
}
.faq-detail .qa-list dl:nth-of-type(16) dt::before {
  content: "Q16";
}
.faq-detail .qa-list dl:nth-of-type(17) dt::before {
  content: "Q17";
}
.faq-detail .qa-list dl:nth-of-type(18) dt::before {
  content: "Q18";
}
.faq-detail .qa-list dl:nth-of-type(19) dt::before {
  content: "Q19";
}
.faq-detail .qa-list dl:nth-of-type(20) dt::before {
  content: "Q20";
}
.faq-detail .qa-list dl:nth-of-type(21) dt::before {
  content: "Q21";
}
.faq-detail .qa-list dl:nth-of-type(22) dt::before {
  content: "Q22";
}
.faq-detail .qa-list dl:nth-of-type(23) dt::before {
  content: "Q23";
}
.faq-detail .qa-list dl:nth-of-type(24) dt::before {
  content: "Q24";
}
.faq-detail .qa-list dl:nth-of-type(25) dt::before {
  content: "Q25";
}
.faq-detail .qa-list dl:nth-of-type(26) dt::before {
  content: "Q26";
}
.faq-detail .qa-list dl:nth-of-type(27) dt::before {
  content: "Q27";
}
.faq-detail .qa-list dl:nth-of-type(28) dt::before {
  content: "Q28";
}
.faq-detail .qa-list dl:nth-of-type(29) dt::before {
  content: "Q29";
}
.faq-detail .qa-list dl:nth-of-type(30) dt::before {
  content: "Q30";
}
.faq-detail .qa-list dl:nth-of-type(31) dt::before {
  content: "Q31";
}
.faq-detail .qa-list dl:nth-of-type(32) dt::before {
  content: "Q32";
}
.faq-detail .qa-list dl:nth-of-type(33) dt::before {
  content: "Q33";
}
.faq-detail .qa-list dl:nth-of-type(34) dt::before {
  content: "Q34";
}
.faq-detail .qa-list dl:nth-of-type(35) dt::before {
  content: "Q35";
}
.faq-detail .qa-list dl:nth-of-type(36) dt::before {
  content: "Q36";
}
.faq-detail .qa-list dl:nth-of-type(37) dt::before {
  content: "Q37";
}
.faq-detail .qa-list dl:nth-of-type(38) dt::before {
  content: "Q38";
}
.faq-detail .qa-list dl:nth-of-type(39) dt::before {
  content: "Q39";
}
.faq-detail .qa-list dl:nth-of-type(40) dt::before {
  content: "Q40";
}
.faq-detail .qa-list dl:nth-of-type(41) dt::before {
  content: "Q41";
}
.faq-detail .qa-list dl:nth-of-type(42) dt::before {
  content: "Q42";
}
.faq-detail .qa-list dl:nth-of-type(43) dt::before {
  content: "Q43";
}
.faq-detail .qa-list dl:nth-of-type(44) dt::before {
  content: "Q44";
}
.faq-detail .qa-list dl:nth-of-type(45) dt::before {
  content: "Q45";
}
.faq-detail .qa-list dl:nth-of-type(46) dt::before {
  content: "Q46";
}
.faq-detail .qa-list dl:nth-of-type(47) dt::before {
  content: "Q47";
}
.faq-detail .qa-list dl:nth-of-type(48) dt::before {
  content: "Q48";
}
.faq-detail .qa-list dl:nth-of-type(49) dt::before {
  content: "Q49";
}
.faq-detail .qa-list dl:nth-of-type(50) dt::before {
  content: "Q50";
}
.faq-detail .qa-list dl dt {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  width: 100%;
  padding: 1em;
  font-size: 2rem;
}
@media screen and (max-width: 767px) {
  .faq-detail .qa-list dl dt {
    font-size: 1.6rem;
  }
}
.faq-detail .qa-list dl dt::before {
  color: #463a31;
  margin-right: 0.5em;
  font-size: 1.2em;
}
.faq-detail .qa-list dl dt span {
  display: inline-block;
}
.faq-detail .qa-list dl dd {
  display: none;
  opacity: 0.8;
  font-size: 0.8em;
  padding: 0 2em 2em 2em;
}
.faq-detail .qa-list dl .room-guide-pet {
  margin-top: 0.5em;
  position: relative;
}
@media screen and (max-width: 767px) {
  .faq-detail .qa-list dl .room-guide-pet {
    padding: 1em 0 0;
    margin-top: 0;
  }
}
.faq-detail .qa-list dl .room-guide-pet a {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-align: center;
  text-decoration: none;
  padding: 0.5em;
  display: inline-block;
  border: 1px solid #735F51;
  background: #fff;
  transition: opacity 0.5s;
  margin-bottom: 10px;
}
@media screen and (max-width: 1099px) {
  .faq-detail .qa-list dl .room-guide-pet a {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .faq-detail .qa-list dl .room-guide-pet a {
    font-size: 3.15vw;
  }
}
.faq-detail .qa-list dl .room-guide-pet a, .faq-detail .qa-list dl .room-guide-pet a:link, .faq-detail .qa-list dl .room-guide-pet a:visited {
  color: #735F51;
}
.faq-detail .qa-list dl .room-guide-pet a:hover, .faq-detail .qa-list dl .room-guide-pet a:active {
  text-decoration: none;
  color: #735F51;
}
.faq-detail .qa-list dl .room-guide-pet a:hover {
  opacity: 0.6;
}

.modelcourse-mv {
  width: 100%;
  background: rgba(150, 173, 215, 0.2);
}
.modelcourse-mv > div {
  display: flex;
  justify-content: space-between;
}
.modelcourse-mv > div > div {
  padding-bottom: min(30%, 400px);
}
.modelcourse-mv > div:nth-of-type(1) > div:nth-of-type(1) {
  width: 33%;
  transition-delay: 0.5s;
}
.modelcourse-mv > div:nth-of-type(1) > div:nth-of-type(2) {
  width: 33%;
  transition-delay: 0.2s;
}
.modelcourse-mv > div:nth-of-type(1) > div:nth-of-type(3) {
  width: 33%;
  transition-delay: 0;
}
.modelcourse-mv > div:nth-of-type(2) {
  margin-top: 0.5%;
}
.modelcourse-mv > div:nth-of-type(2) > div:nth-of-type(1) {
  width: 22%;
  transition-delay: 0.3s;
}
.modelcourse-mv > div:nth-of-type(2) > div:nth-of-type(2) {
  width: 38%;
  transition-delay: 0.1s;
}
.modelcourse-mv > div:nth-of-type(2) > div:nth-of-type(3) {
  width: 39%;
  transition-delay: 0.4s;
}

.modelcourse-container {
  color: #333;
}

.modelcourse-contents-container {
  position: relative;
}
.modelcourse-contents-container .modelcourse-contents-left {
  /*	position: absolute;
  	left: 5%;
  	top: 0;
  	height: 100%;
  	*/
}
@media screen and (max-width: 767px) {
  .modelcourse-contents-container .modelcourse-contents-left {
    position: static;
    height: auto;
  }
}
.modelcourse-contents-container .modelcourse-nav-wrap {
  display: inline-block;
  width: 100%;
  text-align: center;
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .modelcourse-contents-container .modelcourse-nav-wrap {
    position: static;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    max-width: 700px;
    display: block;
    margin-top: 3rem;
  }
}
.modelcourse-contents-container .modelcourse-nav-wrap.sp {
  display: none !important;
}
@media screen and (max-width: 767px) {
  .modelcourse-contents-container .modelcourse-nav-wrap.sp {
    display: block !important;
  }
}
.modelcourse-contents-container .modelcourse-nav-wrap .modelcourse-nav {
  display: flex;
  width: 100%;
  justify-content: center;
}
.modelcourse-contents-container .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block {
  display: flex;
  width: auto;
  align-content: center;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .modelcourse-contents-container .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block {
    width: 30%;
  }
}
.modelcourse-contents-container .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block a {
  width: 18em;
  height: 3em;
  border-right: 1px solid #2b59af;
  text-decoration: none;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  display: inline-flex;
  justify-content: center;
  align-content: center;
  align-items: center;
  text-align: center;
  background: #2b59af;
  color: #fff;
  font-size: 1.2rem;
  transition: all 0.5s;
}
@media screen and (max-width: 767px) {
  .modelcourse-contents-container .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block a {
    width: 100%;
    width: 12rem;
  }
}
.modelcourse-contents-container .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block a p {
  display: inline-block;
  line-height: 1;
}
.modelcourse-contents-container .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block a span {
  text-align: center;
}
.modelcourse-contents-container .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block a span:nth-of-type(1) {
  font-size: 1.1em;
}
.modelcourse-contents-container .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block a span:nth-of-type(2) {
  font-size: 2.2em;
}
.modelcourse-contents-container .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block:first-of-type {
  border-left: 1px solid #2b59af;
}
.modelcourse-contents-container .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block:not(:last-of-type) {
  position: relative;
  margin-bottom: 0;
  padding-bottom: 0;
}
.modelcourse-contents-container .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block:not(:last-of-type)::after {
  display: block;
  background: rgba(115, 95, 81, 0.1);
  bottom: 1rem;
  left: 50%;
  width: 3rem;
  height: 1px;
  position: static;
  margin: 0 0.5em;
}
.modelcourse-contents-container .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block:not(.active) a {
  background: #fff;
  color: #2b59af;
}
.modelcourse-contents-container .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block:not(.active) a:hover {
  background: rgba(43, 89, 175, 0.1);
}
.modelcourse-contents-navMain {
  padding: 3rem 0 0 0;
}
.modelcourse-contents-navMain .modelcourse-nav-wrap {
  display: inline-block;
  width: 100%;
  text-align: center;
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .modelcourse-contents-navMain .modelcourse-nav-wrap {
    position: static;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    max-width: 700px;
    display: block;
    margin-top: 3rem;
  }
}
.modelcourse-contents-navMain .modelcourse-nav-wrap.sp {
  display: none !important;
}
@media screen and (max-width: 767px) {
  .modelcourse-contents-navMain .modelcourse-nav-wrap.sp {
    display: block !important;
  }
}
.modelcourse-contents-navMain .modelcourse-nav-wrap .modelcourse-nav {
  display: flex;
  width: 100%;
  justify-content: center;
}
.modelcourse-contents-navMain .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block {
  display: flex;
  width: auto;
  align-content: center;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .modelcourse-contents-navMain .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block {
    width: 30%;
  }
}
.modelcourse-contents-navMain .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block a {
  width: 18em;
  height: 3em;
  border-right: 1px solid #2b59af;
  text-decoration: none;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  display: inline-flex;
  justify-content: center;
  align-content: center;
  align-items: center;
  text-align: center;
  background: #2b59af;
  color: #fff;
  font-size: 1.1rem;
  transition: all 0.5s;
}
@media screen and (max-width: 767px) {
  .modelcourse-contents-navMain .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block a {
    width: 100%;
    width: 12rem;
  }
}
.modelcourse-contents-navMain .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block a p {
  display: inline-block;
  line-height: 1;
}
.modelcourse-contents-navMain .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block a span {
  text-align: center;
}
.modelcourse-contents-navMain .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block a span:nth-of-type(1) {
  font-size: 1.1em;
}
.modelcourse-contents-navMain .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block a span:nth-of-type(2) {
  font-size: 2.2em;
}
.modelcourse-contents-navMain .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block:first-of-type {
  border-left: 1px solid #2b59af;
}
.modelcourse-contents-navMain .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block:not(:last-of-type) {
  position: relative;
  margin-bottom: 0;
  padding-bottom: 0;
}
.modelcourse-contents-navMain .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block:not(:last-of-type)::after {
  display: block;
  background: rgba(115, 95, 81, 0.1);
  bottom: 1rem;
  left: 50%;
  width: 3rem;
  height: 1px;
  position: static;
  margin: 0 0.5em;
}
.modelcourse-contents-navMain .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block:not(.active) a {
  background: transparent;
  color: #2b59af;
}
.modelcourse-contents-navMain .modelcourse-nav-wrap .modelcourse-nav .modelcourse-nav-block:not(.active) a:hover {
  background: rgba(43, 89, 175, 0.1);
}

.modelcourse-lead-container {
  background: rgba(150, 173, 215, 0.2);
  position: relative;
  z-index: 0;
}
.modelcourse-lead-container::before {
  content: "";
  display: block;
  width: 100%;
  height: 8rem;
  position: absolute;
  left: 0;
  bottom: -10px;
  z-index: 0;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, white 89%, white 100%);
}

.modelcourse-title {
  margin-top: 5rem;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 700px;
}

.modelcourse-lead {
  margin-top: 3rem;
  text-align: center;
}
.modelcourse-lead p {
  display: inline-block;
  text-align: center;
  font-size: 2rem;
  line-height: 1.8;
  /*
  & {
    position: relative;
    text-align: center;
    padding: 1em;
  }
  &::before, &::after {
    position: absolute;
    content: '';
    width: 20px;
    height: 100%;
    border-top: $color-key2 solid 1px;
    border-bottom: $color-key2 solid 1px;
  }
  &::before {
    left: 0;
    top: 0;
    border-left: $color-key2 solid 1px;
  }
  &::after {
    right: 0;
    bottom: 0;
    border-right: $color-key2 solid 1px;
  }
  */
}
@media screen and (max-width: 767px) {
  .modelcourse-lead p {
    font-size: 1.7rem;
  }
}

.modelcourse-full {
  width: 100%;
  position: relative;
  z-index: 0;
}
.modelcourse-full-inner {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  padding: 15% 0;
}
.modelcourse-full-inner.text-right {
  display: flex;
  justify-content: flex-end;
}
@media screen and (max-width: 767px) {
  .modelcourse-full-inner {
    padding: 0;
  }
}
.modelcourse-full p {
  width: 40%;
  font-size: 1.6em;
  line-height: 1.8 !important;
}
@media screen and (max-width: 767px) {
  .modelcourse-full p {
    width: 100%;
    margin-top: 3rem;
  }
}
.modelcourse-full p.text-light {
  color: #fff;
}
@media screen and (max-width: 767px) {
  .modelcourse-full p.text-light {
    color: #735F51;
  }
}
.modelcourse-full-bg {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .modelcourse-full-bg {
    height: auto;
    aspect-ratio: 1.5;
    position: static;
  }
}

.modelcourse-block {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  font-size: 1rem;
  color: #333;
}
.modelcourse-block.text-right {
  flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
  .modelcourse-block.text-right {
    flex-direction: row;
  }
}
.modelcourse-block:not(:last-of-type) {
  margin-bottom: 10%;
}
@media screen and (max-width: 767px) {
  .modelcourse-block:not(:last-of-type) {
    margin-bottom: 20%;
  }
}
.modelcourse-block .modelcourse-block-wave {
  width: 160px;
}
@media screen and (max-width: 767px) {
  .modelcourse-block .modelcourse-block-wave {
    width: 130px;
  }
}
.modelcourse-block-text {
  width: 40%;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-text {
    width: 100%;
  }
}
.modelcourse-block-text p {
  line-height: 1.5;
}
.modelcourse-block-text-no {
  font-family: "EB Garamond", serif;
  font-weight: 400;
  font-size: 3.6em;
  color: #2b59af;
}
.modelcourse-block-text-name {
  font-size: 2.2em;
  line-height: 1.5;
  display: inline-flex;
  align-items: center;
  padding: 0.8em 0 0.6em;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-text-name {
    width: 100%;
    font-size: 2em;
  }
}
.modelcourse-block-text-name .spotNum {
  position: relative;
  display: inline-block;
  margin-right: 0.5em;
}
.modelcourse-block-text-name .mdlPin {
  width: 2.8em;
  height: auto;
}
.modelcourse-block-text-name .num {
  line-height: 1;
  position: absolute;
  text-align: center;
  transform: translateX(-50%);
  left: 50%;
  top: 18%;
  color: #2b59af;
}
.modelcourse-block-text-name .num::before {
  content: "SPOT";
  display: block;
  width: 100%;
  text-align: center;
  font-size: 0.4em;
}
.modelcourse-block-text-name b {
  font-weight: normal;
  display: inline-block;
  position: relative;
}
.modelcourse-block-text-name b::after {
  background: radial-gradient(circle farthest-side, #000, #000 30%, transparent 30%, transparent);
  background-size: 5px;
  content: "";
  display: inline-block;
  height: 5px;
  width: 100%;
  position: absolute;
  left: 0;
  bottom: -15px;
  /*content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 1px;
  background: #aaa;
  left: 0;
  bottom: -5px;*/
}
.modelcourse-block-text-title {
  font-size: 2.8em;
  margin-top: 0.8em;
  line-height: 1.5;
  color: #2b59af;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-text-title {
    font-size: 2em;
  }
}
.modelcourse-block-text-titleEn {
  font-size: 1.4em;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  margin-top: 0.3em;
}
.modelcourse-block-text-description {
  margin-top: 2em;
  font-size: 1.5em;
  text-align: justify;
  line-height: 2.2 !important;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-text-description {
    margin-top: 1em;
    text-align: justify;
    font-size: 1.4em;
  }
}
.modelcourse-block-text-info {
  margin-top: 5em;
  background: #fff;
  border-right: 1px solid rgba(43, 89, 175, 0.2);
  border-top: 1px solid rgba(43, 89, 175, 0.2);
  padding: 2.5em;
  position: relative;
  z-index: 0;
}
.modelcourse-block-text-info::before {
  display: block;
  width: 10rem;
  height: 10rem;
  background: #2b59af;
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  border-radius: 20rem;
  filter: blur(5rem);
  /*width: 5rem;
  height: 5rem;
  border-bottom: 1px solid rgba($color-key2,.2);
  border-left: 1px solid rgba($color-key2,.2);
  position: absolute;
  z-index: -1;
  left: 0;
  bottom: 0;*/
}
@media screen and (max-width: 767px) {
  .modelcourse-block-text-info {
    padding: 1.5em;
  }
}
.modelcourse-block-text-info-title {
  color: #2b59af;
  font-size: 1.8em;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  margin-bottom: 0.7em;
}
.modelcourse-block-text-info-contents {
  font-size: 1.6em;
}
.modelcourse-block-text-info-contents.teikei {
  display: flex;
  align-items: center;
  align-content: center;
  text-decoration: none;
}
.modelcourse-block-text-info-contents.teikei, .modelcourse-block-text-info-contents.teikei:link, .modelcourse-block-text-info-contents.teikei:visited {
  color: #735F51;
}
.modelcourse-block-text-info-contents.teikei:hover, .modelcourse-block-text-info-contents.teikei:active {
  text-decoration: none;
  color: #735F51;
}
.modelcourse-block-text-info-contents.teikei span {
  display: inline-block;
}
.modelcourse-block-text-info-contents.teikei::before {
  display: block;
  width: 2em;
  height: 2em;
  background: url(../img/modelcourse/icon-service.svg) no-repeat center center/contain;
}
.modelcourse-block-text-info-link {
  font-size: 1.4em;
  margin-top: 0.5em;
}
.modelcourse-block-text-info-link a {
  text-decoration: underline;
  text-decoration: none;
}
.modelcourse-block-text-info-link a, .modelcourse-block-text-info-link a:link, .modelcourse-block-text-info-link a:visited {
  color: #735F51;
}
.modelcourse-block-text-info-link a:hover, .modelcourse-block-text-info-link a:active {
  text-decoration: none;
  color: #735F51;
}
.modelcourse-block-text-info-houhou {
  display: flex;
  margin-top: 1.5em;
  align-items: center;
  align-content: center;
}
.modelcourse-block-text-info-houhou span {
  display: inline-block;
}
.modelcourse-block-text-info-houhou span:nth-of-type(1) {
  font-size: 1.2em;
  width: 4.5em;
  line-height: 1.1;
  height: 4.5em;
  display: inline-flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  text-align: center;
  background: #fff;
  border-radius: 20rem;
}
.modelcourse-block-text-info-houhou span:nth-of-type(2) {
  padding-left: 1em;
  font-size: 1.6em;
  width: calc(100% - 4.5em);
}
.modelcourse-block-text-info-maplink {
  display: inline-block;
  padding: 0.6em 1.5em 0.4em;
  border: 1px solid #2b59af;
  border-radius: 10rem;
  background: #fff;
}
.modelcourse-block-text-info-maplink a {
  display: inline-flex;
  align-items: center;
  line-height: 1;
  align-content: center;
  text-decoration: none;
}
.modelcourse-block-text-info-maplink a, .modelcourse-block-text-info-maplink a:link, .modelcourse-block-text-info-maplink a:visited {
  color: #735F51;
}
.modelcourse-block-text-info-maplink a:hover, .modelcourse-block-text-info-maplink a:active {
  text-decoration: none;
  color: #735F51;
}
.modelcourse-block-text-info-maplink a::before {
  content: "";
  display: block;
  width: 2em;
  height: 2em;
  background: url(../img/modelcourse/map_pin.svg) no-repeat center center/contain;
}
.modelcourse-block-text-info-maplink span {
  margin-left: 0.5em;
  font-size: 1.4em;
  display: inline-block;
}
.modelcourse-block-text-info-sitelink {
  display: block;
  padding: 0.6em 1.5em 0.4em;
  border-radius: 10rem;
  background: #fff;
}
.modelcourse-block-text-info-sitelink a {
  display: inline-flex;
  padding-bottom: 0.4em;
  border-bottom: 1px solid #2b59af;
  align-items: center;
  line-height: 1;
  align-content: center;
  text-decoration: none;
}
.modelcourse-block-text-info-sitelink a, .modelcourse-block-text-info-sitelink a:link, .modelcourse-block-text-info-sitelink a:visited {
  color: #735F51;
}
.modelcourse-block-text-info-sitelink a:hover, .modelcourse-block-text-info-sitelink a:active {
  text-decoration: none;
  color: #735F51;
}
.modelcourse-block-text-info-sitelink a::before {
  content: "";
  display: block;
  width: 1.7em;
  height: 1.7em;
  background: url(../img/modelcourse/launch.svg) no-repeat center center/contain;
}
.modelcourse-block-text-info-sitelink span {
  margin-left: 0.5em;
  font-size: 1.4em;
  display: inline-block;
}
.modelcourse-block-img {
  width: 55%;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img {
    width: 100%;
    order: -1;
    margin-bottom: 0;
  }
}
.modelcourse-block-img-hor img {
  object-fit: cover;
  width: 100%;
  aspect-ratio: 417/285;
}
.modelcourse-block-img-ver img {
  object-fit: cover;
  width: 100%;
  aspect-ratio: 226/280;
}
.modelcourse-block-img-ver2 img {
  object-fit: cover;
  width: 100%;
  aspect-ratio: 266/280;
}
.modelcourse-block-img-sq img {
  object-fit: cover;
  width: 100%;
  aspect-ratio: 1;
}
.modelcourse-block-img-01 {
  width: 100%;
  margin-bottom: 5%;
}
.modelcourse-block-img-02 {
  width: 100%;
  display: flex;
  justify-content: flex-end;
}
.modelcourse-block-img-02 .modelcourse-block-img-hor {
  width: 61%;
}
.modelcourse-block-img-02 .modelcourse-block-img-ver {
  width: 39%;
}
.modelcourse-block-img-02 figure:nth-of-type(2) {
  margin-top: 4em;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img-02 figure:nth-of-type(2) {
    margin-top: 2em;
  }
}
.modelcourse-block-img-02 figure {
  margin-right: 5%;
  margin-top: -10%;
}
.modelcourse-block-img-03 {
  width: 100%;
  display: flex;
  justify-content: center;
}
.modelcourse-block-img-03 .modelcourse-block-img-ver {
  width: 35%;
}
.modelcourse-block-img-03 figure:nth-of-type(2) {
  margin-top: 4em;
  margin-left: -3%;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img-03 figure:nth-of-type(2) {
    margin-top: 3em;
  }
}
.modelcourse-block-img-03 figure {
  margin-right: 5%;
  margin-top: -10%;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img-03 figure {
    margin-right: 0;
    margin-top: 0;
  }
}
.modelcourse-block-img-04 {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  margin-left: -30%;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img-04 {
    margin-left: 0;
    justify-content: space-between;
    margin-top: 1%;
  }
}
.modelcourse-block-img-04 .modelcourse-block-img-ver {
  width: 35%;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img-04 .modelcourse-block-img-ver {
    width: 49%;
  }
}
.modelcourse-block-img-04 figure:nth-of-type(2) {
  margin-top: 4em;
  margin-left: -3%;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img-04 figure:nth-of-type(2) {
    margin-top: 0;
  }
}
.modelcourse-block-img-04 figure {
  margin-right: 5%;
  margin-top: -10%;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img-04 figure {
    margin-right: 0;
    margin-top: 0;
    width: 50%;
  }
}
.modelcourse-block-img-05 {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  margin-right: -30%;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img-05 {
    margin-right: 0;
    justify-content: space-between;
    margin-top: 1%;
  }
}
.modelcourse-block-img-05 .modelcourse-block-img-ver {
  width: 35%;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img-05 .modelcourse-block-img-ver {
    width: 49%;
  }
}
.modelcourse-block-img-05 figure {
  margin-right: -5%;
  margin-top: -5%;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img-05 figure {
    margin-right: 0;
    margin-top: 0;
    width: 50%;
  }
}
.modelcourse-block-img-05 figure:nth-of-type(2) {
  margin-top: 4em;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img-05 figure:nth-of-type(2) {
    margin-top: 0;
  }
}
.modelcourse-block-img-06 {
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-top: 1%;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img-06 {
    margin-left: 0;
    justify-content: space-between;
    margin-top: 1%;
  }
}
.modelcourse-block-img-06 figure {
  width: 48%;
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img-06 figure {
    margin-right: 0;
    margin-top: 0;
    width: 48%;
  }
}
@media screen and (max-width: 767px) {
  .modelcourse-block-img-06 figure:nth-of-type(2) {
    margin-top: 0;
  }
}
.modelcourse-block-img .right {
  margin-left: auto;
}
.modelcourse-block-img .nmt-2 {
  margin-top: -2em;
}

.bg-light {
  background-color: #e7eff9;
  background-image: linear-gradient(315deg, #e7eff9 0%, #cfd6e6 74%);
}

:root {
  --color-dark: 8,4,39;
}

.bg-dark {
  z-index: 0;
  position: relative;
  width: 100%;
}
.bg-dark::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-color: #09041c;
}

.gradBlob {
  position: relative;
  z-index: 0;
}
.gradBlob::before {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  width: 30%;
  height: 30%;
  border-radius: 17rem;
  background: linear-gradient(180deg, #341D65 0%, rgba(52, 29, 101, 0) 100%), radial-gradient(94.51% 124.88% at 94.32% 94.43%, rgba(65, 244, 255, 0.78) 0%, rgba(128, 217, 255, 0.78) 46.52%, rgba(65, 198, 255, 0) 100%), linear-gradient(41deg, #FFFCE6 4.33%, rgba(255, 252, 230, 0) 73.7%);
  background-blend-mode: normal, normal, normal, normal, normal, normal;
  filter: blur(100px);
}

.bg-dark2 {
  background: #06142a;
}

.bg-dark .modelcourse-block-text-description, .bg-dark .modelcourse-block-text-title, .bg-dark .modelcourse-full p, .bg-dark .modelcourse-block-text-name, .bg-dark .modelcourse-block-text-name span, .bg-dark .modelcourse-block-text-no, .bg-dark2 .modelcourse-block-text-description, .bg-dark2 .modelcourse-block-text-title, .bg-dark2 .modelcourse-full p, .bg-dark2 .modelcourse-block-text-name, .bg-dark2 .modelcourse-block-text-name span, .bg-dark2 .modelcourse-block-text-no {
  color: #fff !important;
}
.bg-dark .modelcourse-block-text-description a, .bg-dark2 .modelcourse-block-text-description a {
  color: #fff !important;
}

.modelcourseSubTitleEn {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
@media screen and (max-width: 1099px) {
  .modelcourseSubTitleEn {
    font-size: 1.08vw;
  }
}
@media screen and (max-width: 767px) {
  .modelcourseSubTitleEn {
    font-size: 2.7vw;
  }
}

h2.modelcourseSubTitle {
  font-size: 2rem;
  display: inline-block;
  text-align: center;
  font-weight: normal;
  /*& {
    position: relative;
    padding: 0.25em 1em;
    border-top: solid 1px rgba(#000,.3);
    border-bottom: solid 1px rgba(#000,.3);
  }
  &:before, &:after {
   // content: '';
    position: absolute;
    top: -7px;
    width: 1px;
    height: -webkit-calc(100% + 14px);
    height: calc(100% + 14px);
    background-color: #333;
  }
  &:before {
    left: 7px;
  }
  &:after {
    right: 7px;
  }*/
}
h2.modelcourseSubTitle {
  border-bottom: 1px solid #2b59af;
  padding: 0.3em 0.3em 0.8em 0.3em;
  margin-bottom: 10px;
  position: relative;
}
h2.modelcourseSubTitle::before {
  content: "";
  background-color: #eaeef7;
  width: 20px;
  height: 3px;
  position: absolute;
  left: 30px;
  bottom: -3px;
}
h2.modelcourseSubTitle::after {
  content: "";
  background-color: #2b59af;
  width: 20px;
  height: 1px;
  transform: rotate(50deg);
  position: absolute;
  left: 26px;
  bottom: -10px;
}

.dayTitle {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 68px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Dancing Script", cursive;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
@media screen and (max-width: 1099px) {
  .dayTitle {
    font-size: 6.12vw;
  }
}
@media screen and (max-width: 767px) {
  .dayTitle {
    font-size: 15.3vw;
  }
}
.dayTitle span {
  font-size: 0.8em;
  color: rgba(43, 89, 175, 0.6);
}
.dayTitle b {
  color: rgba(43, 89, 175, 0.8);
}

.accessTime {
  text-align: center;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
  /*&::before,&::after{
  	content: '';
  	display: block;
  	width: calc(50% - 9rem);
  	height: 1px;
  	background: rgba($color-key2,.2);
  }*/
}
.accessTime p {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  letter-spacing: 0.2em;
  padding: 0.7em 0 1em;
  line-height: 1.1;
  position: relative;
}
@media screen and (max-width: 1099px) {
  .accessTime p {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .accessTime p {
    font-size: 4.5vw;
  }
}
.accessTime p br {
  display: none;
}
.accessTime p b {
  font-weight: normal;
}
.accessTime p::before {
  display: block;
  width: 9rem;
  aspect-ratio: 1;
  position: absolute;
  z-index: -1;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(0, 0, 0, 0.7);
  border-radius: 30rem;
}
.accessTime .accessTime-sideline {
  width: calc(50% - 9rem);
  position: relative;
  /*
  &:first-of-type{
  &::after{
  		content: '';
  		display: block;
  		height: 1em;
  		width: 1em;
  		border-left: 1px solid rgba($color-key2,.2);
  		border-bottom: 1px solid rgba($color-key2,.2);
  		transform: rotate(45deg) translateY(-50%);
  		position: absolute;
  		right: 0;
  		top: 50%;	
  	}
  }
  &:last-of-type{
  &::after{
  		content: '';
  		display: block;
  		height: 1em;
  		width: 1em;
  		border-left: 1px solid rgba($color-key2,.2);
  		border-bottom: 1px solid rgba($color-key2,.2);
  		transform: rotate(-135deg) translateY(-50%);
  		position: absolute;
  		left: 0;
  		top: 50%;	
  	}
  }*/
}
.accessTime .accessTime-sideline::before {
  content: "";
  display: block;
  height: 1px;
  width: calc(100% - 1em);
  background: rgba(43, 89, 175, 0.2);
}
.accessTime .accessTime-line {
  display: none;
  height: 5rem;
  position: relative;
}
.accessTime .accessTime-line::after {
  background: radial-gradient(ellipse at center, black 0%, black 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%) center 0 repeat-y;
  background-size: 8px 8px;
  width: 8px;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: -3px;
  content: "";
}
.pttn {
  --color-pttn: #aaa;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}
.pttn > div {
  width: 100%;
  height: 8px;
  display: block;
  background-size: auto auto;
  background-color: white;
  background-image: repeating-linear-gradient(-45deg, transparent, transparent 5px, #e8e8e8 5px, #e8e8e8 7px);
}

.food-detail {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .food-detail {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .food-detail {
    font-size: 3.6vw;
  }
}
.food-detail .inner {
  padding-bottom: 3rem;
}
.food-detail .lead {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #735F51;
  text-align: center;
  width: 100%;
  padding: 3em 0;
}
@media screen and (max-width: 1099px) {
  .food-detail .lead {
    font-size: 1.62vw;
  }
}
@media screen and (max-width: 767px) {
  .food-detail .lead {
    font-size: 4.05vw;
  }
}
.food-detail .basic-title h3 {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 100px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  font-weight: normal;
  position: absolute;
  right: 1%;
  bottom: -25%;
  margin-bottom: 0;
}
@media screen and (max-width: 1099px) {
  .food-detail .basic-title h3 {
    font-size: 9vw;
  }
}
@media screen and (max-width: 767px) {
  .food-detail .basic-title h3 {
    font-size: 22.5vw;
  }
}
@media screen and (max-width: 767px) {
  .food-detail .basic-title h3 {
    font-size: 10vw;
    right: 50%;
    transform: translateX(50%);
    white-space: nowrap;
    bottom: -15%;
  }
}
.food-detail .title {
  position: relative;
}
.food-detail .title::before, .food-detail .title::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
}
.food-detail .title::after {
  z-index: -1;
}

.food-detail-contents .food-detail-nav {
  display: flex;
  justify-content: center;
  width: 94%;
  margin-left: auto;
  margin-right: auto;
  max-width: 900px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  padding-bottom: 1rem;
  margin-bottom: 10rem;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
  .food-detail-contents .food-detail-nav {
    justify-content: flex-start;
  }
}
.food-detail-contents .food-detail-nav a {
  display: block;
  width: 20%;
  text-align: center;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-decoration: none;
}
@media screen and (max-width: 1099px) {
  .food-detail-contents .food-detail-nav a {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .food-detail-contents .food-detail-nav a {
    font-size: 4.5vw;
  }
}
.food-detail-contents .food-detail-nav a, .food-detail-contents .food-detail-nav a:link, .food-detail-contents .food-detail-nav a:visited {
  color: #555;
}
.food-detail-contents .food-detail-nav a:hover, .food-detail-contents .food-detail-nav a:active {
  text-decoration: none;
  color: #555;
}
@media screen and (max-width: 767px) {
  .food-detail-contents .food-detail-nav a {
    width: 50%;
    text-align: left;
  }
}
.food-detail-contents .food-detail-nav a span {
  display: inline-flex;
  align-items: center;
}
.food-detail-contents .food-detail-nav a span .arrw {
  display: inline-block;
  width: 0.8em;
  height: 0.8em;
  position: relative;
  margin-right: 1em;
}
.food-detail-contents .food-detail-nav a span .arrw::before, .food-detail-contents .food-detail-nav a span .arrw::after {
  content: "";
  display: inline-block;
}
.food-detail-contents .food-detail-nav a span .arrw::before {
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  border: 1px solid rgba(115, 95, 81, 0.5);
  border-radius: 10rem;
}
.food-detail-contents .food-detail-nav a span .arrw::after {
  position: absolute;
  left: 0;
  top: -0.1em;
  width: 100%;
  height: 100%;
  transform: rotate(-45deg) scale(0.3);
  border-left: 2px solid #735f51;
  border-bottom: 2px solid #735f51;
}

.food-group-inner {
  width: 96%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
  position: relative;
}
.food-group-head {
  position: relative;
  flex-wrap: wrap;
  justify-content: space-between;
}
.food-group-info {
  width: 30%;
  padding: 4% 3%;
  position: absolute;
  right: 2%;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  background: rgba(255, 255, 255, 0.9);
}
@media screen and (max-width: 767px) {
  .food-group-info {
    width: 90%;
    margin: 0 auto;
    position: static;
    transform: translateY(0);
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  }
}
.food-group-info h4 {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 36px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #735F51;
  line-height: 1.5;
  font-weight: normal;
}
@media screen and (max-width: 1099px) {
  .food-group-info h4 {
    font-size: 3.24vw;
  }
}
@media screen and (max-width: 767px) {
  .food-group-info h4 {
    font-size: 8.1vw;
  }
}
.food-group-info-disc {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  background: rgba(115, 95, 81, 0.1);
  color: #735F51;
  border-radius: 5px;
  padding: 0.3em 1em;
  display: inline-block;
}
@media screen and (max-width: 1099px) {
  .food-group-info-disc {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .food-group-info-disc {
    font-size: 3.15vw;
  }
}
.food-group-info-text {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .food-group-info-text {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .food-group-info-text {
    font-size: 3.6vw;
  }
}
.food-group-img {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .food-group-img {
    width: 100%;
  }
}
.food-group-img img {
  aspect-ratio: 2.4;
  width: 100%;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .food-group-img img {
    aspect-ratio: 2;
  }
}
.food-group-lead {
  padding: 2rem 0 5rem;
}
.food-group-lead h4 {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 40px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  margin-bottom: 0.5em;
}
@media screen and (max-width: 1099px) {
  .food-group-lead h4 {
    font-size: 3.6vw;
  }
}
@media screen and (max-width: 767px) {
  .food-group-lead h4 {
    font-size: 9vw;
  }
}
.food-group-lead p {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .food-group-lead p {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .food-group-lead p {
    font-size: 3.6vw;
  }
}
.food-group-lead .caption {
  font-size: 1.6rem;
}
.food-group-lead .caption span {
  display: inline-block;
}
.food-group-lead .caption span:not(:first-of-type)::before {
  content: "　|　";
}
@media screen and (max-width: 767px) {
  .food-group-lead .caption span:not(:first-of-type)::before {
    content: none;
  }
}
.food-group-menu-col3 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.food-group-menu-col3 .food-group-menu-title {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  font-size: 2.4rem;
  text-align: center;
  position: relative;
  z-index: 0;
}
@media screen and (max-width: 767px) {
  .food-group-menu-col3 .food-group-menu-title {
    font-size: 2.2rem;
  }
}
.food-group-menu-col3 .food-group-menu-title::before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  position: absolute;
  z-index: -1;
  left: 0;
  top: 50%;
  background: rgba(0, 0, 0, 0.1);
}
.food-group-menu-col3 .food-group-menu-title span {
  display: inline-block;
  padding: 0 1em;
  background: #fff;
}
.food-group-menu-col3 > div {
  width: 32%;
}
@media screen and (max-width: 767px) {
  .food-group-menu-col3 > div {
    width: 100%;
  }
}
.food-group-menu-col3 img {
  aspect-ratio: 1.2;
  width: 100%;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .food-group-menu-col3 img {
    aspect-ratio: 1.8;
  }
}
.food-group .caption-block {
  display: inline-block;
  width: 100%;
}
.food-group .border {
  border: 1px solid rgba(0, 0, 0, 0.2);
}

.food-group-menu-block-info {
  font-size: 1.8rem;
  padding: 0.7em 0;
  /*ul{
  	margin: 1em 0 0 0;
  	list-style: none;
  	font-size: .9em;
  	li{
  		&::before{
  			content: '・';
  		}
  		&:not(:first-of-type){
  			margin-top: .6em;
  		}
  	}
  }*/
}
.food-group-menu-block-info-title {
  font-size: 1.4em;
  margin-bottom: 0.3em;
  line-height: 1.2;
  color: #735F51;
}
@media screen and (max-width: 767px) {
  .food-group-menu-block-info-title {
    font-size: 1.1em;
  }
}
.food-group-menu-block-info-title span {
  display: inline-block;
  margin-left: 0.3em;
}
.food-group-menu-block-info-title small {
  font-size: 0.6em;
}
.food-group-menu-block-info-price {
  font-size: 1.4em;
}
.food-group-menu-block-info-price small {
  font-size: 0.8em;
}
.food-group-menu-block-info-price span {
  font-size: 1em;
}
.food-group-menu-block-info-text {
  font-size: 0.9em;
  margin-top: 1rem;
}
.food-group-menu-block-info-text span {
  display: inline-block;
}
.food-group-menu-block-info-list {
  font-size: 0.7em;
  margin-top: 1.5rem;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
}
.food-group-menu-block-info-list li {
  display: inline-block;
  padding: 0.25em 0.9em;
  background: rgba(115, 95, 81, 0.1);
  border-radius: 6px;
  margin-right: 0.3em;
  line-height: 1.1;
  margin-bottom: 0.3em;
}
.food-group-menu-block-info-list2 {
  font-size: 0.7em;
  margin-top: 1.5rem;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  align-items: flex-start;
}
.food-group-menu-block-info-list2 dt {
  width: 10rem;
  display: inline-block;
  padding: 0.25em 0.9em;
  background: rgba(115, 95, 81, 0.1);
  border-radius: 6px;
  margin-right: 0.5em;
  line-height: 1.1;
  margin-bottom: 0.3em;
  text-align: center;
}
.food-group-menu-block-info-list2 dd {
  display: inline-block;
  width: calc(100% - 11rem);
}
.food-group-menu-block-info-menulist {
  font-size: 0.9em;
  margin-top: 1.5rem;
  list-style: none;
}
@media screen and (max-width: 767px) {
  .food-group-menu-block-info-menulist {
    font-size: 0.8em;
  }
}
.food-group-menu-block-info-menulist li {
  width: 100%;
  line-height: 1.1;
  margin-bottom: 0.5em;
}
.food-group-menu-block-info-menulist li small {
  font-size: 0.8em;
}
.food-group-menu-block-info-menulist li span:nth-of-type(2) {
  margin-left: 0.8em;
}

.food-group-sub .food-group-sub-title {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 36px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-align: center;
  color: #735F51;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  font-weight: normal;
}
@media screen and (max-width: 1099px) {
  .food-group-sub .food-group-sub-title {
    font-size: 3.24vw;
  }
}
@media screen and (max-width: 767px) {
  .food-group-sub .food-group-sub-title {
    font-size: 8.1vw;
  }
}
@media screen and (max-width: 767px) {
  .food-group-sub .food-group-sub-title {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 30px;
    line-height: 1.8;
    letter-spacing: 0.05em;
    font-family: "EB Garamond", serif;
    font-weight: 400;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .food-group-sub .food-group-sub-title {
    font-size: 2.7vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .food-group-sub .food-group-sub-title {
    font-size: 6.75vw;
  }
}
.food-group-sub .food-group-sub-title-sub {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #555;
  text-align: center;
}
@media screen and (max-width: 1099px) {
  .food-group-sub .food-group-sub-title-sub {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .food-group-sub .food-group-sub-title-sub {
    font-size: 4.5vw;
  }
}
.food-group-sub .food-group-sub-title-sub small {
  font-size: 0.9em;
}
.food-group-sub .food-menu-col1 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.food-group-sub .food-menu-col1 .food-menu-col1-block {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .food-group-sub .food-menu-col1 .food-menu-col1-block {
    width: 100%;
  }
  .food-group-sub .food-menu-col1 .food-menu-col1-block:not(:last-of-type) {
    margin-bottom: 2rem;
  }
}
.food-group-sub .food-menu-col1 h5 {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .food-group-sub .food-menu-col1 h5 {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .food-group-sub .food-menu-col1 h5 {
    font-size: 4.5vw;
  }
}
.food-group-sub .food-menu-col2 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.food-group-sub .food-menu-col2 .food-menu-col2-block {
  width: 47%;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .food-group-sub .food-menu-col2 .food-menu-col2-block {
    width: 100%;
  }
  .food-group-sub .food-menu-col2 .food-menu-col2-block:not(:last-of-type) {
    margin-bottom: 2rem;
  }
}
.food-group-sub .food-menu-col2 h5 {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .food-group-sub .food-menu-col2 h5 {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .food-group-sub .food-menu-col2 h5 {
    font-size: 4.5vw;
  }
}
.food-group-sub .food-menu-col3 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.food-group-sub .food-menu-col3 .food-menu-col3-block {
  width: 32%;
}
@media screen and (max-width: 767px) {
  .food-group-sub .food-menu-col3 .food-menu-col3-block {
    width: 100%;
  }
  .food-group-sub .food-menu-col3 .food-menu-col3-block:not(:last-of-type) {
    margin-bottom: 2rem;
  }
}
.food-group-sub .food-menu-col3 h5 {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .food-group-sub .food-menu-col3 h5 {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .food-group-sub .food-menu-col3 h5 {
    font-size: 4.5vw;
  }
}

.menuImg01 {
  width: 100%;
}
.menuImg01 img {
  aspect-ratio: 2.4;
  width: 100%;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .menuImg01 img {
    aspect-ratio: 2;
  }
}

.menuImg02 {
  width: 100%;
  position: relative;
}
.menuImg02 img {
  aspect-ratio: 1.7;
  width: 100%;
  object-fit: cover;
}
.menuImg02 figcaption {
  position: absolute;
  right: 1em;
  bottom: 1em;
  color: #fff;
  font-size: 14px;
}

.na figure {
  position: relative;
  z-index: 0;
}
.na figure img {
  z-index: -1;
}
.na figure::before {
  z-index: 0;
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.6);
}
.na figcaption {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 22px;
  text-align: center;
  right: auto;
  bottom: auto;
  letter-spacing: 0.2em;
}
@media screen and (max-width: 767px) {
  .na figcaption {
    font-size: 20px;
  }
}

.food-reserve {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
  margin-bottom: 5rem;
  margin-top: 3rem;
  font-size: 1.4rem;
}
@media screen and (max-width: 767px) {
  .food-reserve {
    font-size: 1.2rem;
  }
}
.food-reserve > p {
  text-align: center;
  font-size: 1.6em;
  margin-bottom: 2em;
}
.food-reserve-container {
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .food-reserve-container {
    flex-wrap: wrap;
  }
}
.food-reserve-container .food-reserve-block {
  display: inline-block;
  padding: 0 1rem;
}
@media screen and (max-width: 767px) {
  .food-reserve-container .food-reserve-block {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .food-reserve-container .food-reserve-block:first-of-type {
    border-right: none;
  }
}
.food-reserve-container .food-reserve-block > p {
  text-align: center;
  font-size: 1.4em;
  padding: 0.2em 0;
}
.food-reserve-container .food-reserve-block a {
  text-align: center;
  font-size: 1.8em;
  text-decoration: none;
  color: #fff;
  padding: 0.6em;
  background: #003f87;
  display: inline-flex;
  position: relative;
  justify-content: center;
  width: 100%;
  align-items: center;
  transition: opacity 0.5s;
  border-radius: 5px;
}
.food-reserve-container .food-reserve-block a::before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  margin-right: 0.5em;
  border-left: 0.3em solid #fff;
  border-top: 0.2em solid transparent;
  border-bottom: 0.2em solid transparent;
}
.food-reserve-container .food-reserve-block a:hover {
  opacity: 0.6;
}
.food-reserve-container .food-reserve-block small {
  font-size: 0.7em;
}

.cake-bnr {
  width: 94%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}
.cake-bnr a {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  padding: 1em;
  background: #eee;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-decoration: none;
  transition: all 0.5s;
  border: 1px solid #eee;
}
@media screen and (max-width: 1099px) {
  .cake-bnr a {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .cake-bnr a {
    font-size: 3.6vw;
  }
}
.cake-bnr a, .cake-bnr a:link, .cake-bnr a:visited {
  color: #000;
}
.cake-bnr a:hover, .cake-bnr a:active {
  text-decoration: none;
  color: #000;
}
.cake-bnr a:hover {
  border: 1px solid #003f87;
}
.cake-bnr a figure {
  display: inline-block;
  width: 48%;
}
@media screen and (max-width: 767px) {
  .cake-bnr a figure {
    width: 100%;
  }
}
.cake-bnr a figure img {
  width: 100%;
  aspect-ratio: 2;
  object-fit: cover;
}
.cake-bnr a div {
  width: 48%;
  padding: 1em;
}
@media screen and (max-width: 767px) {
  .cake-bnr a div {
    width: 100%;
  }
}
.cake-bnr a div .cake-bnr-titleEn {
  color: #003f87;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  font-size: 0.9em;
  letter-spacing: 0.1em;
  margin-bottom: 1em;
}
.cake-bnr a div .cake-bnr-lead {
  font-size: 1.5em;
  margin-bottom: 0.5em;
}
.cake-bnr a div .cake-bnr-link {
  margin-top: 2em;
  font-size: 0.8em;
  border-top: 1px solid rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  padding: 0.3em 1em;
  display: inline-block;
}

.food-attn {
  padding: 0.3em 0.5em;
  background: #aba65e;
  color: #fff;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .food-attn {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .food-attn {
    font-size: 3.6vw;
  }
}

@keyframes spriteAnimation {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 100% 0;
  }
}
.intro_logo {
  position: fixed;
  width: 100%;
  height: 100%;
  background: url(../img/cmn/ptn01.jpg) repeat;
  z-index: 1000;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  /*
  .awase{
  	position: absolute;
  	z-index: 10;
  	opacity: .5;

  	width: 69.5%;
  	left: 22%;
  	top: -23%;
  }*/
}
.intro_logo .intro_logo-inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
}
.intro_logo .intro_logo-block {
  width: 70%;
  position: relative;
  max-width: 400px;
}
.intro_logo .intro_logo-logo {
  width: 80%;
  max-width: 230px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
.intro_logo .intro_logo-logo .intro_logo-logo-crystal {
  position: relative;
  z-index: 0;
  width: 50%;
  aspect-ratio: 500/395;
}
.intro_logo .intro_logo-logo .intro_logo-logo-crystal img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  transition-property: opacity;
  transition-duration: 1.9s;
  opacity: 0;
}
.intro_logo .intro_logo-logo .intro_logo-logo-crystal img:nth-of-type(1) {
  transition-delay: 1.08s;
}
.intro_logo .intro_logo-logo .intro_logo-logo-crystal img:nth-of-type(2) {
  transition-delay: 1.16s;
}
.intro_logo .intro_logo-logo .intro_logo-logo-crystal img:nth-of-type(3) {
  transition-delay: 1.24s;
}
.intro_logo .intro_logo-logo .intro_logo-logo-crystal img:nth-of-type(4) {
  transition-delay: 1.32s;
}
.intro_logo .intro_logo-logo .intro_logo-logo-crystal img:nth-of-type(5) {
  transition-delay: 1.4s;
}
.intro_logo .intro_logo-logo .intro_logo-logo-crystal img:nth-of-type(6) {
  transition-delay: 1.48s;
}
.intro_logo .intro_logo-logo .intro_logo-logo-crystal img:nth-of-type(7) {
  transition-delay: 1.56s;
}
.intro_logo .intro_logo-logo .intro_logo-logo-crystal img:nth-of-type(8) {
  transition-delay: 1.64s;
}
.intro_logo .intro_logo-logo .intro_logo-logo-mark {
  aspect-ratio: 500/395;
  width: 50%;
  background-image: url("../img/top/intro/logo_s.png");
  background-position: 0 0;
  background-size: cover;
  background-repeat: no-repeat;
  animation-name: spriteAnimation;
  animation-duration: 1.2s;
  animation-timing-function: steps(26, end);
  animation-delay: 2s;
  animation-fill-mode: forwards;
  animation-direction: alternate;
  animation-iteration-count: 1;
}
.intro_logo .intro_logo-logo .intro_logo-logo-text {
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 5%;
}
.intro_logo .intro_logo-logo .intro_logo-logo-text p {
  opacity: 0;
  transition-property: all;
  transition-duration: 1.5s;
  transform: translate(0, 6%);
}
.intro_logo .intro_logo-logo .intro_logo-logo-text p:nth-of-type(1) {
  width: 100%;
  transition-delay: 2.3s;
}
.intro_logo .intro_logo-logo .intro_logo-logo-text p:nth-of-type(1) img {
  width: 100%;
}
.intro_logo .intro_logo-logo .intro_logo-logo-text p:nth-of-type(2) {
  width: 91%;
  transition-delay: 2.5s;
}
.intro_logo .intro_logo-logo .intro_logo-logo-text p:nth-of-type(2) img {
  width: 100%;
}
.intro_logo.is-anm .intro_logo-logo-crystal img {
  opacity: 1;
}
.intro_logo.is-anm .intro_logo-logo-text p {
  opacity: 1;
  transform: translate(0, 0);
}

@keyframes turtleIn {
  50% {
    opacity: 0;
    transform: rotate(-5deg) translate(3%, 2%);
  }
  100% {
    opacity: 1;
    transform: rotate(0) translate(0, 0);
  }
}
.intro_logo-turtle {
  position: absolute;
  right: -9%;
  top: -28%;
  width: 31%;
  opacity: 0;
  animation-fill-mode: forwards;
  animation-duration: 3s;
}
.intro_logo-turtle img {
  width: 100%;
}
.anm_start .intro_logo-turtle {
  animation-name: turtleIn;
}

.intro_logo-block {
  transition: all 7s ease-out;
}
.anm_start .intro_logo-block {
  transform: scale(0.9);
}

.top-food {
  margin-top: 20rem;
  position: relative;
  z-index: 0;
  padding: 8rem 0 9rem;
}
@media screen and (max-width: 767px) {
  .top-food {
    padding: 0 0 3rem;
  }
}
.top-food::before {
  content: "";
  display: block;
  width: 100%;
  right: 0;
  left: 0;
  bottom: 0;
  top: 0;
  height: 100%;
  background: #21262b;
  z-index: -1;
  transition-delay: 0.2s;
  position: absolute;
  transition: all 1.6s;
  transform: scaleX(0) rotate(0.0005deg);
  transform-origin: left top;
}
@media screen and (max-width: 767px) {
  .top-food::before {
    top: 0;
  }
}
.top-food.is-anm::before {
  transform: scaleX(100%) rotate(0deg);
}
.top-food .more {
  text-align: left;
  color: #735F51;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  margin-top: 3rem;
  letter-spacing: 0.3em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .top-food .more {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .top-food .more {
    font-size: 3.15vw;
  }
}
@media screen and (max-width: 767px) {
  .top-food .more {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.8;
    letter-spacing: 0.05em;
    text-align: center;
    margin-top: 0;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .top-food .more {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .top-food .more {
    font-size: 3.15vw;
  }
}
.top-food .more span {
  position: relative;
  display: inline-block;
  padding: 0 0.5em 0.5em;
}
.top-food .more span::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.3);
  width: 100%;
  height: 1px;
  transition: all 0.5s;
}
@media screen and (max-width: 767px) {
  .top-food {
    margin-top: 3rem;
  }
}
.top-food-block {
  width: 100%;
}
.top-food-block:nth-of-type(1) {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  align-content: center;
}
.top-food-block:nth-of-type(1) .top-food-block-text {
  color: #fff;
  width: 30%;
  margin-left: 5%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .top-food-block:nth-of-type(1) .top-food-block-text {
    margin-bottom: 3rem;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
}
.top-food-block:nth-of-type(1) .top-food-block-text a, .top-food-block:nth-of-type(1) .top-food-block-text p {
  color: #fff;
}
.top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(1) {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0.4s;
  transform: translate(0px, 10px);
}
.is-anm .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(1), .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(1).is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(2) {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0.6s;
  transform: translate(0px, 10px);
}
.is-anm .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(2), .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(2).is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(3) {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0.8s;
  transform: translate(0px, 10px);
}
.is-anm .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(3), .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(3).is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(4) {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 1s;
  transform: translate(0px, 10px);
}
.is-anm .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(4), .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(4).is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(5) {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 1.2s;
  transform: translate(0px, 10px);
}
.is-anm .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(5), .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(5).is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(6) {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 1.4s;
  transform: translate(0px, 10px);
}
.is-anm .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(6), .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(6).is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(7) {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 1.6s;
  transform: translate(0px, 10px);
}
.is-anm .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(7), .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(7).is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(8) {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 1.8s;
  transform: translate(0px, 10px);
}
.is-anm .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(8), .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(8).is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(9) {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 2s;
  transform: translate(0px, 10px);
}
.is-anm .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(9), .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(9).is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(10) {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 2.2s;
  transform: translate(0px, 10px);
}
.is-anm .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(10), .top-food-block:nth-of-type(1) .top-food-block-text > *:nth-child(10).is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.top-food-block:nth-of-type(1) .top-food-block-text > p {
  width: 100%;
}
.top-food-block:nth-of-type(1) .top-food-block-text-img {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .top-food-block:nth-of-type(1) .top-food-block-text-img {
    order: -1;
    margin-bottom: 3rem;
  }
}
.top-food-block:nth-of-type(1) .top-food-block-text-img > figure {
  transition-delay: 0.2s;
}
.top-food-block:nth-of-type(1) .top-food-block-text-img > figure img {
  aspect-ratio: 1.6;
  object-fit: cover;
  width: 100%;
}
.top-food-block:nth-of-type(1) .top-food-block-text-img > figure:nth-of-type(2) {
  margin-top: 5%;
  transition-delay: 0.4s;
}
.top-food-block:nth-of-type(1) .top-food-block-text-img > figure:nth-of-type(2) img {
  aspect-ratio: 0.7;
  object-fit: cover;
  width: 100%;
}
.top-food-block:nth-of-type(1) .top-food-block-text-img > figure:nth-of-type(2) {
  width: 35%;
}
.top-food-block:nth-of-type(1) .top-food-block-img {
  width: 60%;
  order: -1;
  margin-top: -10%;
}
@media screen and (max-width: 767px) {
  .top-food-block:nth-of-type(1) .top-food-block-img {
    width: 100%;
    margin-bottom: 3rem;
    margin-top: -10%;
  }
}
.top-food-block:nth-of-type(1) .top-food-block-img > figure {
  width: 85%;
  transition-delay: 0.2s;
}
.top-food-block:nth-of-type(1) .top-food-block-img > figure img {
  aspect-ratio: 1.6;
  object-fit: cover;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .top-food-block:nth-of-type(1) .top-food-block-img > figure img {
    aspect-ratio: 1.6;
  }
}
.top-food-block:nth-of-type(1) .top-food-block-img > figure:nth-of-type(2) {
  /*margin-top: -2rem;
  width: 33%;
  transition-delay: .4s;
  margin-left: auto;
  margin-right: 1rem;
  img{
   aspect-ratio:.9;
   object-fit: cover;
   width: 100%;
  }*/
  margin-top: -2rem;
  width: 40%;
  transition-delay: 0.4s;
  margin-left: auto;
  margin-right: 1rem;
}
@media screen and (max-width: 767px) {
  .top-food-block:nth-of-type(1) .top-food-block-img > figure:nth-of-type(2) {
    width: 50%;
  }
}
.top-food-block:nth-of-type(1) .top-food-block-img > figure:nth-of-type(2) img {
  aspect-ratio: 1.6;
  object-fit: cover;
  width: 100%;
}
.top-food-block:nth-of-type(1) .top-food-block-img > div {
  display: flex;
  justify-content: space-around;
  margin-top: -3rem;
}
.top-food-block:nth-of-type(1) .top-food-block-img > div figure:nth-of-type(1) {
  margin-top: 5rem;
  width: 33%;
  transition-delay: 0.4s;
}
.top-food-block:nth-of-type(1) .top-food-block-img > div figure:nth-of-type(1) img {
  aspect-ratio: 0.9;
  object-fit: cover;
  width: 100%;
}

.top-intro {
  position: relative;
}
.top-intro.bg-dark {
  background: #735F51;
}
.top-intro-img-block {
  position: absolute;
  z-index: 0;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.top-intro-img-block figure {
  position: absolute;
  opacity: 0;
  transition-property: opacity;
  transition-duration: 1.8s;
}
.top-intro-img-block figure img {
  object-fit: cover;
  border-radius: 7px;
}
@media screen and (max-width: 767px) {
  .top-intro-img-block figure img {
    border-radius: 5px;
  }
}
.top-intro-img-block-01 {
  width: 27%;
  left: 0;
  top: 4%;
  transition-delay: 0.3s;
}
.top-intro-img-block-01 img {
  aspect-ratio: 1.1;
}
@media screen and (max-width: 767px) {
  .top-intro-img-block-01 {
    width: 37%;
    top: 2%;
  }
  .top-intro-img-block-01 img {
    aspect-ratio: 1.3;
  }
}
.top-intro-img-block-02 {
  width: 16%;
  left: 14%;
  top: 59%;
  transition-delay: 0.6s;
}
.top-intro-img-block-02 img {
  aspect-ratio: 1.5;
}
@media screen and (max-width: 767px) {
  .top-intro-img-block-02 {
    width: 23%;
    left: 0%;
    top: 27%;
  }
  .top-intro-img-block-02 img {
    aspect-ratio: 1.2;
  }
}
.top-intro-img-block-03 {
  width: 16%;
  right: 15%;
  top: 12%;
  transition-delay: 0.5s;
}
.top-intro-img-block-03 img {
  aspect-ratio: 1.5;
}
@media screen and (max-width: 767px) {
  .top-intro-img-block-03 {
    width: 28%;
    right: 7%;
    top: 10%;
  }
}
.top-intro-img-block-04 {
  width: 23%;
  right: 6%;
  top: 58%;
  transition-delay: 0.8s;
}
.top-intro-img-block-04 img {
  aspect-ratio: 1.5;
}
@media screen and (max-width: 767px) {
  .top-intro-img-block-04 {
    width: 25%;
    right: 1%;
    top: 33%;
  }
  .top-intro-img-block-04 img {
    aspect-ratio: 1.2;
  }
}
.top-intro-img-block-05 {
  width: 14%;
  right: 27%;
  top: 74%;
  transition-delay: 0.8s;
}
.top-intro-img-block-05 img {
  aspect-ratio: 1.6;
}
@media screen and (max-width: 767px) {
  .top-intro-img-block-05 {
    width: 19%;
    right: 13%;
    top: 42%;
  }
  .top-intro-img-block-05 img {
    aspect-ratio: 1.2;
  }
}
.top-intro-block {
  position: relative;
  width: 100%;
}
.top-intro-block .text-wrap {
  position: relative;
  z-index: 0;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  padding: 22rem 0 30rem;
}
@media screen and (max-width: 767px) {
  .top-intro-block .text-wrap {
    padding: 15rem 0 15rem;
  }
}
.top-intro-block.col2 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
}
.top-intro-block.col2 .img-wrap-col2 {
  width: 50%;
}
.top-intro-block.col2 .text-wrap {
  width: 45%;
}
.top-intro-block .img-wrap-col2 {
  display: flex;
}
.top-intro-block .img-wrap-col2 figure {
  width: 50%;
}
.top-intro-block .img-wrap-col2 figure img {
  aspect-ratio: 1.6;
  width: 100%;
  object-fit: cover;
}
.top-intro-block .img-wrap {
  position: relative;
  width: 100%;
}
.top-intro-block .img-wrap figure {
  aspect-ratio: 0.8;
  width: 100%;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .top-intro-block .img-wrap figure {
    aspect-ratio: 1.5;
  }
}
.top-intro-block .img-wrap figure img {
  transition-delay: 0.6s;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.top-intro-block .top-intro-lead01 {
  position: absolute;
  font-size: 1.8rem;
  letter-spacing: 0.1em;
  font-family: "Marcellus", serif;
  font-weight: 400;
  font-style: normal;
  color: #fff;
  left: 1em;
  top: 1.5em;
  line-height: 1;
  z-index: 1;
  text-transform: uppercase;
}
.top-intro-block .top-intro-lead01::before {
  content: "#";
}
@media screen and (max-width: 767px) {
  .top-intro-block .top-intro-lead01 {
    font-size: 1.6rem;
  }
}
.top-intro-block .top-intro-lead02 {
  position: absolute;
  font-size: 2.2rem;
  writing-mode: vertical-rl;
  color: #fff;
  right: 1em;
  top: 1.5em;
  line-height: 1;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  .top-intro-block .top-intro-lead02 {
    font-size: 2rem;
  }
}
.top-intro-col2 {
  gap: 3rem;
  grid-template-columns: 2fr 1fr;
}
.top-intro-col2:nth-of-type(odd) {
  grid-template-columns: 1fr 2fr;
}
.top-intro-col2:nth-of-type(odd) figure {
  order: 2;
}
.top-intro-title {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 35px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-align: center;
  opacity: 0;
  transition-property: opacity;
  transition-duration: 1.8s;
}
@media screen and (max-width: 1099px) {
  .top-intro-title {
    font-size: 3.15vw;
  }
}
@media screen and (max-width: 767px) {
  .top-intro-title {
    font-size: 7.875vw;
  }
}
@media screen and (max-width: 767px) {
  .top-intro-title {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 28px;
    line-height: 1.8;
    letter-spacing: 0.05em;
    writing-mode: tb-rl;
    margin: 0 auto;
    white-space: nowrap;
    text-align: left;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .top-intro-title {
    font-size: 2.52vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .top-intro-title {
    font-size: 6.3vw;
  }
}
.top-intro-open {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .top-intro-open {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .top-intro-open {
    font-size: 4.5vw;
  }
}
.top-intro-text {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  line-height: 2;
  width: 35%;
  margin-left: auto;
  margin-right: auto;
  text-align: justify;
  opacity: 0;
  transition-property: opacity;
  transition-duration: 1.8s;
  transition-delay: 0.2;
}
@media screen and (max-width: 1099px) {
  .top-intro-text {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .top-intro-text {
    font-size: 3.6vw;
  }
}
@media screen and (max-width: 767px) {
  .top-intro-text {
    text-align: justify;
    width: 70%;
  }
}
.top-intro-slide {
  opacity: 0;
  transition: opacity 0.8s;
  width: 100%;
  overflow: hidden;
  position: relative;
  padding-top: 5%;
  /*.text-wrap{
  	width: auto;
  	text-align: left;
  	 position: absolute;
  	 z-index: 1;
  	 left: 5%;
  	 top: 8%;
  	 padding: 0;
  	 .top-intro-text{
  		text-align: left;
  		color: #fff;	 
  	 }
  }*/
}
.top-intro-slide .swiper-wrapper {
  transition-timing-function: linear;
}
.top-intro-slide.swiper-initialized {
  opacity: 1;
}
.top-intro-slide .top-intro-block {
  width: 18vw !important;
  margin: 0;
}
@media screen and (max-width: 767px) {
  .top-intro-slide .top-intro-block {
    width: 68vw !important;
  }
}
.top-intro-slide .top-intro-slide-button-wrap {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  margin-top: 4rem;
}
.top-intro-slide .top-intro-slide-button-wrap .swiper-button-prev, .top-intro-slide .top-intro-slide-button-wrap .swiper-button-next {
  position: static !important;
  margin-top: 0 !important;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ccc;
  height: 3rem;
  width: 3rem;
  background: rgba(0, 63, 135, 0.1);
  border-radius: 50%;
}
.top-intro-slide .top-intro-slide-button-wrap .swiper-button-prev::after, .top-intro-slide .top-intro-slide-button-wrap .swiper-button-next::after {
  font-size: 1.45rem !important;
}
.top-intro-slide .swiper-pagination {
  position: static;
  width: auto !important;
}
.top-intro-slide .swiper-pagination .swiper-pagination-bullet {
  width: 4px !important;
  height: 4px !important;
  display: inline-block !important;
  border-radius: 50% !important;
  background: #003f87 !important;
  opacity: 0.2 !important;
  margin: 0 1.4rem !important;
  transition: all 0.5s;
}
.top-intro-slide .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  opacity: 0.8 !important;
  transform: scale(1.9);
}
.top-intro-slide .img-wrap {
  z-index: 0;
}
.top-intro-slide .img-wrap figure {
  aspect-ratio: 0.65;
  overflow: hidden;
  position: relative;
}
.top-intro-slide .img-wrap figure::before {
  position: absolute;
  z-index: 1;
  left: 0;
  bottom: 0;
  right: 0;
  display: block;
  width: 100%;
  height: 40%;
  background-image: linear-gradient(to top, rgba(115, 95, 81, 0.7) 0%, rgba(115, 95, 81, 0) 100%);
}
@media screen and (max-width: 767px) {
  .top-intro-slide .img-wrap figure {
    aspect-ratio: 0.6;
  }
}
.top-intro-slide .text-wrap {
  padding: 1rem 0 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 3;
}
.top-intro-slide .text-wrap .top-intro-slide-text {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  line-height: 1.6;
  letter-spacing: 0;
  width: 100%;
  padding: 0 0.5em;
  margin-left: auto;
  margin-right: auto;
  text-align: justify;
}
@media screen and (max-width: 1099px) {
  .top-intro-slide .text-wrap .top-intro-slide-text {
    font-size: 1.08vw;
  }
}
@media screen and (max-width: 767px) {
  .top-intro-slide .text-wrap .top-intro-slide-text {
    font-size: 2.7vw;
  }
}

.show .top-intro-img-block figure {
  opacity: 1;
}
.show .top-intro-title {
  opacity: 1;
}
.show .top-intro-text {
  opacity: 1;
}

.imgBlurIn {
  opacity: 0;
  filter: blur(10px);
  transform: scale(1);
  transition: all 1.8s ease;
  /* アクティブ状態：表示されてぼかしがなくなる */
}
.is-anm .imgBlurIn, .imgBlurIn.is-anm {
  opacity: 1;
  transform: scale(1.03);
  filter: blur(0);
}

.gmap-wrap {
  mix-blend-mode: luminosity;
  width: 100%;
}

.top-reservation {
  text-align: center;
  padding: 10rem 0;
  background: #735F51;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .top-reservation {
    font-size: 1.62vw;
  }
}
@media screen and (max-width: 767px) {
  .top-reservation {
    font-size: 4.05vw;
  }
}
.top-reservation p {
  text-align: center;
  color: #fff;
}
.top-reservation-open {
  font-size: 1.5em;
  margin-bottom: 0.5em;
}
.top-reservation-lead {
  font-size: 1.5em;
  margin-bottom: 1.5em;
}
.top-reservation-link {
  font-size: 1em;
  margin-bottom: 0.5em;
  display: inline-block;
  padding: 0.5em 0;
  width: 80%;
  max-width: 600px;
  border-radius: 30rem;
  border: 1px solid rgba(255, 255, 255, 0.3);
  text-decoration: none;
}
.top-reservation-link, .top-reservation-link:link, .top-reservation-link:visited {
  color: #fff;
}
.top-reservation-link:hover, .top-reservation-link:active {
  text-decoration: none;
  color: #fff;
}
.top-reservation-pet {
  font-size: 1em;
  margin-bottom: 0.5em;
  display: inline-block;
  padding: 0.5em 0;
  width: 80%;
  max-width: 600px;
  border-radius: 30rem;
  background: rgba(255, 255, 255, 0.1);
  text-decoration: none;
}
.top-reservation-pet, .top-reservation-pet:link, .top-reservation-pet:visited {
  color: #fff;
}
.top-reservation-pet:hover, .top-reservation-pet:active {
  text-decoration: none;
  color: #fff;
}

#introMov {
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1400px;
  margin-bottom: 15rem;
}
@media screen and (max-width: 767px) {
  #introMov {
    width: 100%;
  }
}
#introMov video {
  width: 100%;
}

.leadLet {
  font-family: "EB Garamond", serif;
  font-weight: 400;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 30px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #375790;
  letter-spacing: 1.2em;
  line-height: 1;
  text-align: center;
  margin-bottom: 3rem;
  z-index: 1;
}
@media screen and (max-width: 1099px) {
  .leadLet {
    font-size: 2.7vw;
  }
}
@media screen and (max-width: 767px) {
  .leadLet {
    font-size: 6.75vw;
  }
}
@media screen and (max-width: 767px) {
  .leadLet {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 30px;
    line-height: 1.8;
    letter-spacing: 0.05em;
    width: 90%;
    text-align: left;
    margin-bottom: 1.5rem;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .leadLet {
    font-size: 2.7vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .leadLet {
    font-size: 6.75vw;
  }
}

.top-rooms .leadLet {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .top-rooms .leadLet {
    text-align: center;
  }
}

.top-intro-main {
  width: 100%;
  padding-top: 20rem;
  background: url(../img/bg/so-white.png) repeat center center;
}
@media screen and (max-width: 767px) {
  .top-intro-main {
    padding-top: 10rem;
  }
}
.top-intro-main-block {
  position: relative;
  z-index: 0;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  margin-bottom: 15rem;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .top-intro-main-block {
    flex-wrap: wrap;
    margin-bottom: 10rem;
  }
}
.top-intro-main-block-img {
  width: 44%;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .top-intro-main-block-img {
    width: 92%;
    margin-left: auto;
    margin-top: -22rem;
  }
}
.top-intro-main-block-img figure {
  width: 100%;
}
.top-intro-main-block-img img {
  aspect-ratio: 1.1;
  width: 100%;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .top-intro-main-block-img img {
    aspect-ratio: 1.6;
  }
}
.top-intro-main-block-inner {
  width: 55%;
  padding-top: 2%;
  padding-bottom: 5%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
}
@media screen and (max-width: 767px) {
  .top-intro-main-block-inner {
    width: 100%;
  }
}
.top-intro-main-block-title p {
  font-size: 6.5rem;
  letter-spacing: 0.1em;
  margin-left: -0.5em;
  font-family: "Marcellus", serif;
  font-weight: 400;
  font-style: normal;
}
@media screen and (max-width: 767px) {
  .top-intro-main-block-title p {
    font-size: 5.5rem;
    margin-left: -0.1em;
  }
}
.top-intro-main-block-text-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  position: relative;
  padding-top: 5rem;
  padding-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .top-intro-main-block-text-wrap {
    padding-bottom: 25rem;
  }
}
.top-intro-main-block-text {
  position: relative;
}
.top-intro-main-block-text-lead {
  margin-bottom: 3rem;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .top-intro-main-block-text-lead {
    font-size: 2.16vw;
  }
}
@media screen and (max-width: 767px) {
  .top-intro-main-block-text-lead {
    font-size: 5.4vw;
  }
}
.top-intro-main-block-text-text {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .top-intro-main-block-text-text {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .top-intro-main-block-text-text {
    font-size: 3.15vw;
  }
}
@media screen and (max-width: 767px) {
  .top-intro-main-block-text-text {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.8;
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .top-intro-main-block-text-text {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .top-intro-main-block-text-text {
    font-size: 3.15vw;
  }
}
.top-intro-main-block-btn {
  position: absolute;
  right: 0;
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .top-intro-main-block-btn {
    position: static;
    margin-top: 1.5rem;
  }
}
.top-intro-main-block-btn a {
  text-decoration: none;
  display: inline-block;
  padding: 0.5em 2em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Marcellus", serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.1em;
  position: relative;
  transition: all 0.5s !important;
}
.top-intro-main-block-btn a, .top-intro-main-block-btn a:link, .top-intro-main-block-btn a:visited {
  color: #fff;
}
.top-intro-main-block-btn a:hover, .top-intro-main-block-btn a:active {
  text-decoration: none;
  color: #fff;
}
@media screen and (max-width: 1099px) {
  .top-intro-main-block-btn a {
    font-size: 1.08vw;
  }
}
@media screen and (max-width: 767px) {
  .top-intro-main-block-btn a {
    font-size: 2.7vw;
  }
}
.top-intro-main-block-btn a:hover {
  background: #735F51;
  padding: 0.5em 2.3em;
}
.top-intro-main-block-btn a::before, .top-intro-main-block-btn a::after {
  content: "";
  display: block;
  position: absolute;
  height: 1px;
  width: 100%;
  background: rgba(255, 255, 255, 0.4);
}
.top-intro-main-block-btn a::before {
  top: 0;
  left: 0;
}
.top-intro-main-block-btn a::after {
  bottom: 0;
  right: 0;
}

.contents-bnr {
  width: 100%;
}
.contents-bnr-block {
  width: 100%;
  position: relative;
  z-index: 0;
  width: 100%;
  height: 93vh;
  min-height: 650px;
}
.contents-bnr-block::before {
  position: absolute;
  z-index: 1;
  left: 0;
  bottom: 0;
  right: 0;
  display: block;
  width: 100%;
  height: 50%;
  mix-blend-mode: multiply;
  background-image: linear-gradient(to top, rgba(115, 95, 81, 0.7) 0%, rgba(115, 95, 81, 0) 100%);
}
@media screen and (max-width: 767px) {
  .contents-bnr-block {
    height: 85vh;
    min-height: 500px;
  }
}
.contents-bnr-block-img {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
}
.contents-bnr-block-img figure {
  width: 100%;
  height: 100%;
}
.contents-bnr-block-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.contents-bnr-block-inner {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
  padding-top: 7%;
  padding-bottom: 5%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
}
.contents-bnr-block-title p {
  color: #fff;
  font-size: 4rem;
  letter-spacing: 0.1em;
  font-family: "Marcellus", serif;
  font-weight: 400;
  font-style: normal;
}
.contents-bnr-block-text-wrap {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  height: 100%;
  position: relative;
  padding-left: 3rem;
}
@media screen and (max-width: 767px) {
  .contents-bnr-block-text-wrap {
    padding-left: 2rem;
  }
}
.contents-bnr-block-text-wrap::before {
  content: "";
  display: block;
  position: absolute;
  width: 1px;
  height: 95%;
  bottom: 0;
  left: 0;
  background: #fff;
}
.contents-bnr-block-text {
  position: relative;
}
.contents-bnr-block-text-lead {
  color: #fff;
  margin-bottom: 1rem;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .contents-bnr-block-text-lead {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .contents-bnr-block-text-lead {
    font-size: 4.5vw;
  }
}
.contents-bnr-block-text-text {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #fff;
}
@media screen and (max-width: 1099px) {
  .contents-bnr-block-text-text {
    font-size: 1.17vw;
  }
}
@media screen and (max-width: 767px) {
  .contents-bnr-block-text-text {
    font-size: 2.925vw;
  }
}
.contents-bnr-block-btn {
  position: absolute;
  right: 0;
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .contents-bnr-block-btn {
    position: static;
    margin-top: 1.5rem;
  }
}
.contents-bnr-block-btn a {
  text-decoration: none;
  display: inline-block;
  padding: 0.5em 2em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Marcellus", serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.1em;
  position: relative;
  transition: all 0.5s !important;
}
.contents-bnr-block-btn a, .contents-bnr-block-btn a:link, .contents-bnr-block-btn a:visited {
  color: #fff;
}
.contents-bnr-block-btn a:hover, .contents-bnr-block-btn a:active {
  text-decoration: none;
  color: #fff;
}
@media screen and (max-width: 1099px) {
  .contents-bnr-block-btn a {
    font-size: 1.08vw;
  }
}
@media screen and (max-width: 767px) {
  .contents-bnr-block-btn a {
    font-size: 2.7vw;
  }
}
.contents-bnr-block-btn a:hover {
  background: #735F51;
  padding: 0.5em 2.3em;
}
.contents-bnr-block-btn a::before, .contents-bnr-block-btn a::after {
  content: "";
  display: block;
  position: absolute;
  height: 1px;
  width: 100%;
  background: rgba(255, 255, 255, 0.4);
}
.contents-bnr-block-btn a::before {
  top: 0;
  left: 0;
}
.contents-bnr-block-btn a::after {
  bottom: 0;
  right: 0;
}

.movie-block {
  width: 100%;
  min-height: 100%;
  z-index: -1;
  display: flex;
  justify-content: center;
  background: #fff;
}
.movie-block-img {
  width: 100%;
  position: relative;
  display: flex;
  justify-content: center;
  /*display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
   overflow: hidden;
   */
}
.movie-block-img video {
  width: 90%;
  max-width: 1400px;
}
.movie-block.scrollIn .movie-block-img {
  width: 100%;
}

.top-lead {
  background: #fff;
  position: relative;
  z-index: -1;
}
.top-lead-inner {
  display: flex;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}
.top-lead-inner p {
  line-height: 2.5;
}
.top-lead-inner p span {
  opacity: 0;
  display: inline-block;
  transition-property: all;
  transition-duration: 2s;
  transform: translate(0em, 0.2em);
}
.top-lead-inner p span:nth-of-type(1) {
  transition-delay: 0.1s;
}
.top-lead-inner p span:nth-of-type(2) {
  transition-delay: 0.2s;
}
.top-lead-inner p span:nth-of-type(3) {
  transition-delay: 0.3s;
}
.top-lead-inner p span:nth-of-type(4) {
  transition-delay: 0.4s;
}
.top-lead-inner p span:nth-of-type(5) {
  transition-delay: 0.5s;
}
.top-lead-inner p span:nth-of-type(6) {
  transition-delay: 0.6s;
}
.top-lead-inner p span:nth-of-type(7) {
  transition-delay: 0.7s;
}
.top-lead-inner p span:nth-of-type(8) {
  transition-delay: 0.8s;
}
.top-lead-inner p span:nth-of-type(9) {
  transition-delay: 0.9s;
}
.top-lead-inner p span:nth-of-type(10) {
  transition-delay: 1s;
}
.top-lead-inner p span:nth-of-type(11) {
  transition-delay: 1.1s;
}
.top-lead-inner p span:nth-of-type(12) {
  transition-delay: 1.2s;
}
.top-lead-inner p span:nth-of-type(13) {
  transition-delay: 1.3s;
}
.top-lead-inner p span:nth-of-type(14) {
  transition-delay: 1.4s;
}
.top-lead-inner p span:nth-of-type(15) {
  transition-delay: 1.5s;
}
.top-lead-inner p span:nth-of-type(16) {
  transition-delay: 1.6s;
}
.top-lead-inner p span:nth-of-type(17) {
  transition-delay: 1.7s;
}
.top-lead-inner p span:nth-of-type(18) {
  transition-delay: 1.8s;
}
.top-lead-inner p span:nth-of-type(19) {
  transition-delay: 1.9s;
}
.top-lead-inner p span:nth-of-type(20) {
  transition-delay: 2s;
}
.top-lead-inner p span:nth-of-type(21) {
  transition-delay: 2.1s;
}
.top-lead-inner p span:nth-of-type(22) {
  transition-delay: 2.2s;
}
.top-lead-inner p span:nth-of-type(23) {
  transition-delay: 2.3s;
}
.top-lead-inner p span:nth-of-type(24) {
  transition-delay: 2.4s;
}
.top-lead-inner p span:nth-of-type(25) {
  transition-delay: 2.5s;
}
.top-lead-inner p span:nth-of-type(26) {
  transition-delay: 2.6s;
}
.top-lead-inner p span:nth-of-type(27) {
  transition-delay: 2.7s;
}
.top-lead-inner p span:nth-of-type(28) {
  transition-delay: 2.8s;
}
.top-lead-inner p span:nth-of-type(29) {
  transition-delay: 2.9s;
}
.top-lead-inner p span:nth-of-type(30) {
  transition-delay: 3s;
}
.is-anm .top-lead-inner p span {
  opacity: 1;
  transform: translate(0, 0);
}
.top-lead::before {
  content: "";
  display: block;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  opacity: 0;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: -1;
  transition: all 0.9s;
}
.top-lead.scrollIn::before {
  opacity: 1;
}

.contents-bnr a {
  text-decoration: none;
  transition: opacity 0.5s;
  display: flex;
}
@media screen and (max-width: 767px) {
  .contents-bnr a {
    display: inline-block;
  }
}
.contents-bnr a:hover {
  opacity: 0.7;
}
.contents-bnr a .contents-bnr-img {
  width: 70%;
  position: relative;
}
@media screen and (max-width: 767px) {
  .contents-bnr a .contents-bnr-img {
    width: 100%;
  }
}
.contents-bnr a .contents-bnr-text {
  width: 30%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
  align-items: center;
  /*&::before{
   content: '';
   display: block;
   width: 1px;
   height: 8rem;
   opacity: .5;
   background: darken(c.$color-dark,20%) !important;
  }
  &::after{
    content: '';
    display: block;
    width: 1px;
    height: 8rem;
    opacity: .5;
    background: darken(c.$color-dark,20%) !important;
   }*/
}
@media screen and (max-width: 767px) {
  .contents-bnr a .contents-bnr-text {
    width: 100%;
    padding: 0 3rem;
    justify-content: flex-start;
  }
}
@media screen and (max-width: 767px) {
  .contents-bnr a .contents-bnr-text-inner {
    width: 100%;
  }
}
.contents-bnr a .contents-bnr-text-info {
  margin-bottom: 3rem;
}
.contents-bnr a .contents-bnr-text-info dl {
  display: flex;
}
.contents-bnr a .contents-bnr-text-info dl dt, .contents-bnr a .contents-bnr-text-info dl dd {
  color: #735F51;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .contents-bnr a .contents-bnr-text-info dl dt, .contents-bnr a .contents-bnr-text-info dl dd {
    font-size: 1.08vw;
  }
}
@media screen and (max-width: 767px) {
  .contents-bnr a .contents-bnr-text-info dl dt, .contents-bnr a .contents-bnr-text-info dl dd {
    font-size: 2.7vw;
  }
}
.contents-bnr a .contents-bnr-text-info dl dt::after {
  content: "/";
}
.contents-bnr:nth-of-type(even) a .contents-bnr-text {
  order: -1;
}
.contents-bnr-img figure img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 2;
}
@media screen and (max-width: 767px) {
  .contents-bnr-img figure img {
    aspect-ratio: 1.4;
  }
}
.contents-bnr-lead {
  width: 100%;
}
.contents-bnr-lead h4 {
  color: #24334c;
  margin-bottom: 1rem;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 50px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  letter-spacing: 0.1em;
  font-family: "EB Garamond", serif;
  font-weight: 400;
}
@media screen and (max-width: 1099px) {
  .contents-bnr-lead h4 {
    font-size: 4.5vw;
  }
}
@media screen and (max-width: 767px) {
  .contents-bnr-lead h4 {
    font-size: 11.25vw;
  }
}
.contents-bnr-lead h4 small {
  font-size: 0.7em;
}
.contents-bnr-lead p {
  color: #735F51;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .contents-bnr-lead p {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .contents-bnr-lead p {
    font-size: 3.6vw;
  }
}
.contents-bnr .more {
  text-align: right;
  color: #735F51;
  width: 100%;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  margin-top: 3rem;
  letter-spacing: 0.5em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .contents-bnr .more {
    font-size: 1.08vw;
  }
}
@media screen and (max-width: 767px) {
  .contents-bnr .more {
    font-size: 2.7vw;
  }
}
@media screen and (max-width: 767px) {
  .contents-bnr .more {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 10px;
    line-height: 1.8;
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .contents-bnr .more {
    font-size: 0.9vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .contents-bnr .more {
    font-size: 2.25vw;
  }
}
.contents-bnr .more span {
  position: relative;
  display: inline-block;
  padding: 0 0.5em 0.5em;
}
.contents-bnr .more span::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  background: rgba(115, 95, 81, 0.3);
  width: 0;
  height: 1px;
  transition: all 0.5s;
}
.contents-bnr:hover .more span::before {
  width: 100%;
}

.top-rooms .contents-bnr:nth-of-type(odd) .contents-bnr-img {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0.5s;
  transform: translate(-30px, 0);
}
.is-anm .top-rooms .contents-bnr:nth-of-type(odd) .contents-bnr-img, .top-rooms .contents-bnr:nth-of-type(odd) .contents-bnr-img.is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.top-rooms .contents-bnr:nth-of-type(even) .contents-bnr-img {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0.5s;
  transform: translate(30px, 0);
}
.is-anm .top-rooms .contents-bnr:nth-of-type(even) .contents-bnr-img, .top-rooms .contents-bnr:nth-of-type(even) .contents-bnr-img.is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.top-rooms .contents-bnr-inner {
  overflow: hidden;
}
.top-rooms .contents-bnr-inner .more {
  margin-top: 0;
}
.top-rooms .contents-bnr-lead {
  position: relative;
}
.top-rooms .contents-bnr-lead h4 {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 34px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  width: auto;
  font-weight: normal;
  color: #735F51;
}
@media screen and (max-width: 1099px) {
  .top-rooms .contents-bnr-lead h4 {
    font-size: 3.06vw;
  }
}
@media screen and (max-width: 767px) {
  .top-rooms .contents-bnr-lead h4 {
    font-size: 7.65vw;
  }
}
.top-rooms .contents-bnr-lead h4 .main b {
  font-weight: normal;
}
.top-rooms .contents-bnr-lead h4 .sub {
  font-size: 0.7em;
}
@media screen and (max-width: 767px) {
  .top-rooms .contents-bnr-lead h4 {
    width: 100%;
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 28px;
    line-height: 1.8;
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .top-rooms .contents-bnr-lead h4 {
    font-size: 2.52vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .top-rooms .contents-bnr-lead h4 {
    font-size: 6.3vw;
  }
}
.top-rooms .contents-bnr-lead .pet-icon {
  margin-left: 0.5em;
}

.chef-detail-contents .chef-list {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}
.chef-detail-contents .chef-list .chef-list--block {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 6rem;
  background: #f0f0f0;
}
.chef-detail-contents .chef-list .chef-list--block > div {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .chef-detail-contents .chef-list .chef-list--block > div {
    width: 100%;
  }
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-imgMain {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .chef-detail-contents .chef-list .chef-list--block .chef-list--block-imgMain {
    width: 100%;
  }
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-imgMain-01 {
  height: 60%;
  width: 100%;
  width: 100%;
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-imgMain-01 img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-imgMain-02 {
  display: flex;
  height: 40%;
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-imgMain-02 figure {
  width: 50%;
  height: 100%;
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-imgMain-02 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-img {
  display: flex;
  display: none;
  gap: 1rem;
  margin-top: 3em;
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-img figure {
  width: 32%;
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-img figure img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 1.5;
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info {
  width: 50%;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  padding: 5%;
}
@media screen and (max-width: 767px) {
  .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info {
    width: 100%;
  }
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info .chef-list--block-info-lead {
  margin-bottom: 1.5rem;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  align-content: center;
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info .chef-list--block-info-lead figure {
  width: 20%;
}
@media screen and (max-width: 767px) {
  .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info .chef-list--block-info-lead figure {
    width: 40%;
  }
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info .chef-list--block-info-lead figure img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 0.8;
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info .chef-list--block-info-lead > div {
  width: 80%;
}
@media screen and (max-width: 767px) {
  .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info .chef-list--block-info-lead > div {
    width: 60%;
  }
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-genre {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  margin-bottom: 0.3em;
  padding-bottom: 0.5em;
}
@media screen and (max-width: 1099px) {
  .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-genre {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-genre {
    font-size: 3.6vw;
  }
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-name {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 26px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-name {
    font-size: 2.34vw;
  }
}
@media screen and (max-width: 767px) {
  .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-name {
    font-size: 5.85vw;
  }
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-name small {
  font-size: 0.8em;
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-text {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-text {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-text {
    font-size: 3.15vw;
  }
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-text .chef-menu {
  border-top: 1px solid rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  padding: 0.3em 1em;
  display: inline-block;
  margin-bottom: 0.5em;
}
@media screen and (max-width: 767px) {
  .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-text .chef-menu {
    width: 100%;
    text-align: center;
  }
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-link {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  margin-top: 3em;
}
@media screen and (max-width: 1099px) {
  .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-link {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-link {
    font-size: 3.15vw;
  }
}
@media screen and (max-width: 767px) {
  .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-link {
    text-align: center;
    margin-bottom: 1rem;
  }
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-link a {
  text-decoration: none;
  border-radius: 10rem;
  padding: 0.5em 2em;
  border: 1px solid rgba(0, 0, 0, 0.6);
  transition: all 0.5s;
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-link a, .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-link a:link, .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-link a:visited {
  color: #333;
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-link a:hover, .chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-link a:active {
  text-decoration: none;
  color: #333;
}
.chef-detail-contents .chef-list .chef-list--block .chef-list--block-info-link a:hover {
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
}
.chef-detail-contents .chef-list .chef-list--block:nth-of-type(even) .chef-list--block-img {
  order: -1;
}
@media screen and (max-width: 767px) {
  .chef-detail-contents .chef-list .chef-list--block:nth-of-type(even) .chef-list--block-img {
    order: 2;
  }
}

.chef-guide-inner {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
  padding: 3%;
  background: #fff;
  border: 9px solid rgba(0, 0, 0, 0.03);
}
.chef-guide-inner > p {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 22px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  margin-bottom: 1.5em;
}
@media screen and (max-width: 1099px) {
  .chef-guide-inner > p {
    font-size: 1.98vw;
  }
}
@media screen and (max-width: 767px) {
  .chef-guide-inner > p {
    font-size: 4.95vw;
  }
}
.chef-guide-inner p {
  letter-spacing: 0;
}
.chef-guide-flow-block:not(:last-of-type) {
  margin-bottom: 2rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  padding-bottom: 2rem;
}
.chef-guide-flow-block-title {
  display: flex;
  align-items: center;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 17px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  margin-bottom: 0.8em;
}
@media screen and (max-width: 1099px) {
  .chef-guide-flow-block-title {
    font-size: 1.53vw;
  }
}
@media screen and (max-width: 767px) {
  .chef-guide-flow-block-title {
    font-size: 3.825vw;
  }
}
.chef-guide-flow-block-text {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .chef-guide-flow-block-text {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .chef-guide-flow-block-text {
    font-size: 3.15vw;
  }
}
.chef-guide-flow-block-text p {
  line-height: 2;
}
.chef-guide-flow-block-text .ristorante-info {
  display: inline-block;
  margin-top: 1em;
  padding: 0.8em;
  background: #fff;
}
.chef-guide-flow-block-text .ristorante-info b {
  font-weight: normal;
}
.chef-guide-flow-block-text .ristorante-info span {
  font-size: 0.9em;
  line-height: 1.6;
  display: inline-block;
}
@media screen and (max-width: 767px) {
  .chef-guide-flow-block-text .ristorante-info span {
    font-size: 1em;
  }
}
.chef-guide-flow-block:nth-of-type(1) .chef-guide-flow-block-title::before {
  border-right: 1px solid rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  padding: 0.3em;
  line-height: 1;
  font-size: 1.1em;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 1.3em;
  height: 1.3em;
  content: "1";
  color: #333;
  margin-right: 0.5em;
}
.chef-guide-flow-block:nth-of-type(2) .chef-guide-flow-block-title::before {
  border-right: 1px solid rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  padding: 0.3em;
  line-height: 1;
  font-size: 1.1em;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 1.3em;
  height: 1.3em;
  content: "2";
  color: #333;
  margin-right: 0.5em;
}
.chef-guide-flow-block:nth-of-type(3) .chef-guide-flow-block-title::before {
  border-right: 1px solid rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  padding: 0.3em;
  line-height: 1;
  font-size: 1.1em;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 1.3em;
  height: 1.3em;
  content: "3";
  color: #333;
  margin-right: 0.5em;
}
.chef-guide-flow-block:nth-of-type(4) .chef-guide-flow-block-title::before {
  border-right: 1px solid rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  padding: 0.3em;
  line-height: 1;
  font-size: 1.1em;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 1.3em;
  height: 1.3em;
  content: "4";
  color: #333;
  margin-right: 0.5em;
}

.hotspring-imgs {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}

.hotspring-info {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}
.hotspring-info-table tbody tr {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  border: 3px solid #fff;
  background: #fff;
}
@media screen and (max-width: 1099px) {
  .hotspring-info-table tbody tr {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .hotspring-info-table tbody tr {
    font-size: 3.15vw;
  }
}
.hotspring-info-table tbody tr th {
  width: 24%;
  background: rgba(0, 63, 135, 0.1);
  text-align: center;
  padding: 19px;
}
.hotspring-info-table tbody tr td {
  padding: 19px;
  background: #f6f7f8;
}

html {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  background: #fff;
}

body {
  -webkit-print-color-adjust: exact;
  background: url(../img/bg/so-white.png) repeat center center;
  position: relative;
  z-index: 0;
  color: #735F51;
}
body:not(.bg-white)::before {
  position: fixed;
  background-image: linear-gradient(120deg, #f7f7f7 0%, #e4e4e4 100%);
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
}

header {
  position: fixed;
}

.home header {
  position: fixed;
  transition: all 0.5s ease-out 0.2s;
}
@media screen and (max-width: 767px) {
  .home header {
    transition: opacity 0.5s ease-out 0.2s;
  }
}
.home.scrolled header {
  opacity: 1;
  background: rgba(255, 255, 255, 0.9);
}
@media screen and (max-width: 767px) {
  .home.scrolled header {
    background: none;
  }
}

p {
  line-height: 1.5;
}

header {
  top: 0;
  width: 100%;
  left: 0;
  z-index: 2;
  transition: background-color 1s;
  background-color: white;
}
@media screen and (max-width: 767px) {
  header {
    background-color: transparent;
  }
}
header .header-inner {
  width: 100%;
  text-align: center;
  display: flex;
  align-content: center;
  align-items: stretch;
  position: relative;
}
@media screen and (max-width: 767px) {
  header .header-inner {
    justify-content: center;
  }
}
header .header-logo {
  padding: 2rem 1rem 1rem 1rem;
}
@media screen and (max-width: 767px) {
  header .header-logo {
    opacity: 1;
  }
}
header .header-logo a {
  text-decoration: none;
  text-decoration: none;
}
header .header-logo a, header .header-logo a:link, header .header-logo a:visited {
  color: #000;
}
header .header-logo a:hover, header .header-logo a:active {
  text-decoration: none;
  color: #000;
}
header .header-logo a span {
  color: #003f87;
  margin-top: 0.5em;
  white-space: nowrap;
  letter-spacing: 0;
  display: block;
  font-size: 8px;
}
@media screen and (max-width: 767px) {
  header .header-logo a span {
    color: #fff;
  }
}
header .header-logo a img {
  width: 70px;
  transition: all 0.5s;
}
@media screen and (max-width: 767px) {
  header .header-logo a img {
    width: 70px;
  }
}
.scrolled header .header-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
}
@media screen and (max-width: 767px) {
  .scrolled header .header-logo {
    display: none;
  }
}
header .header-nav-g {
  margin-left: auto;
  padding: 0.8% 2%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
  header .header-nav-g {
    transform: translateY(0);
    display: none;
  }
}
@media screen and (max-width: 767px) {
  header .header-nav-g {
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    top: auto;
    z-index: 999;
  }
}
header .header-nav-g ul {
  display: flex;
}
header .header-nav-g ul li {
  margin-right: 2.3em;
}
@media screen and (max-width: 767px) {
  header .header-nav-g ul li {
    width: 100%;
    margin-right: 0;
  }
}
header .header-nav-g ul li:last-of-type {
  margin-right: 0;
  display: inline-flex;
  align-items: center;
}
header .header-nav-g ul li.nav-to-portal {
  padding-left: 1em;
  border-left: 1px solid rgba(255, 255, 255, 0.3);
}
@media screen and (max-width: 767px) {
  header .header-nav-g ul li.nav-to-portal {
    padding-left: 0;
    margin-left: 0;
    border-left: none;
  }
}
header .header-nav-g ul li a {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  display: inline-block;
  text-decoration: none;
}
@media screen and (max-width: 1099px) {
  header .header-nav-g ul li a {
    font-size: 1.17vw;
  }
}
@media screen and (max-width: 767px) {
  header .header-nav-g ul li a {
    font-size: 2.925vw;
  }
}
header .header-nav-g ul li a, header .header-nav-g ul li a:link, header .header-nav-g ul li a:visited {
  color: #735F51;
}
header .header-nav-g ul li a:hover, header .header-nav-g ul li a:active {
  text-decoration: none;
  color: #735F51;
}
header .header-nav-g ul li a:hover {
  opacity: 0.5;
}
header .header-nav-g ul li a span {
  padding-left: 1.5em;
  position: relative;
}
@media screen and (max-width: 767px) {
  header .header-nav-g ul li a {
    width: 100%;
    text-align: center;
  }
}
header .header-nav-g ul li.instagram a {
  display: inline-flex;
  align-items: center;
}
header .header-nav-g ul li.instagram img {
  width: 1.3em;
}
header .header-nav-g a {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  text-decoration: none;
}
header .header-nav-g a, header .header-nav-g a:link, header .header-nav-g a:visited {
  color: #fff;
}
header .header-nav-g a:hover, header .header-nav-g a:active {
  text-decoration: none;
  color: #fff;
}
header .header-nav-g.light a {
  text-decoration: none;
}
header .header-nav-g.light a, header .header-nav-g.light a:link, header .header-nav-g.light a:visited {
  color: #333;
}
header .header-nav-g.light a:hover, header .header-nav-g.light a:active {
  text-decoration: none;
  color: #333;
}
@media screen and (max-width: 767px) {
  header .header-nav {
    display: none;
  }
}
header .header-nav nav {
  height: 100%;
}
header .header-nav ul {
  display: flex;
  align-items: center;
  height: 100%;
}
header .header-nav ul li {
  height: 100%;
}
@media screen and (max-width: 767px) {
  header .header-nav ul li {
    width: 100%;
    margin-right: 0;
  }
}
header .header-nav ul li:last-of-type {
  margin-right: 0;
}
header .header-nav ul li a {
  background: #696e74;
  text-decoration: none;
  display: flex;
  align-items: center;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  letter-spacing: 0.1em;
  padding: 0.8em 1.5em;
  transition: opacity 0.5s;
}
header .header-nav ul li a, header .header-nav ul li a:link, header .header-nav ul li a:visited {
  color: #fff;
}
header .header-nav ul li a:hover, header .header-nav ul li a:active {
  text-decoration: none;
  color: #fff;
}
@media screen and (max-width: 1099px) {
  header .header-nav ul li a {
    font-size: 1.17vw;
  }
}
@media screen and (max-width: 767px) {
  header .header-nav ul li a {
    font-size: 2.925vw;
  }
}
header .header-nav ul li a:hover {
  opacity: 0.7;
}
header .header-nav ul li a span {
  position: relative;
}
@media screen and (max-width: 767px) {
  header .header-nav ul li a {
    width: 100%;
    text-align: center;
  }
}
header .header-nav ul li.nav-item-reserve {
  display: flex;
  justify-content: center;
  align-items: center;
}
header .header-nav ul li.nav-item-reserve a {
  background: #372e27 !important;
  height: 100%;
  color: #fff !important;
  padding: 1em 1em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
header .header-nav ul li.nav-item-reserve a::before {
  display: inline-block;
  width: 1.3em;
  height: 1.3em;
  background: url(../img/cmn/icon-cal-white.svg) no-repeat center center/contain;
  margin-right: 0.2em;
}
header .header-nav a {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  text-decoration: none;
}
header .header-nav a, header .header-nav a:link, header .header-nav a:visited {
  color: #735F51;
}
header .header-nav a:hover, header .header-nav a:active {
  text-decoration: none;
  color: #735F51;
}
.reserve-btn-left a {
  background: #735F51;
  transition: all 0.5s;
}
.reserve-btn-left a:hover {
  background: #735F51;
  opacity: 0.7;
}

.nav-sp-content li a {
  border-bottom: 1px solid rgba(0, 0, 0, 0.2) !important;
}

.nav-sp-content {
  background: #fff !important;
}
.nav-sp-content-contact {
  width: 100%;
}
.nav-sp-content-contact a {
  color: #333;
  text-decoration: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-end;
  font-size: 1.6rem;
}
.nav-sp-content-contact a span {
  display: inline-block;
}
.nav-sp-content-contact a span.nav-sp-content-contact-02 {
  font-size: 1.3em;
  margin: 0 0.1em 0 0.3em;
}
.nav-sp-content-contact a span.nav-sp-content-contact-03 {
  font-size: 0.8em;
}
.nav-sp-content-bnr {
  width: 100%;
  padding-top: 10%;
}
.nav-sp-content-bnr h3 {
  color: #24334c;
  text-align: center;
  font-size: 1.4rem;
  padding: 0.5em 0 0.5em 0;
}
.nav-sp-content-sns p {
  font-size: 1.6rem;
  display: inline-block;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
}
.nav-sp-content-sns p a {
  text-decoration: none;
  text-decoration: none;
}
.nav-sp-content-sns p a, .nav-sp-content-sns p a:link, .nav-sp-content-sns p a:visited {
  color: #000;
}
.nav-sp-content-sns p a:hover, .nav-sp-content-sns p a:active {
  text-decoration: none;
  color: #000;
}
.nav-sp-content-sns p img {
  width: 1.2em;
  margin-right: 0.3em;
}

.fixed-nav ul:not(.nav-sp-content-list) li {
  background: #735F51 !important;
  border-right: 1px solid rgba(255, 255, 255, 0.3) !important;
}
.fixed-nav ul:not(.nav-sp-content-list) li:nth-of-type(4) {
  border-right: none !important;
}
.fixed-nav ul.nav-sp-content-list li {
  background: none !important;
}
.fixed-nav ul.nav-sp-content-list li a {
  text-decoration: none;
}
.fixed-nav ul.nav-sp-content-list li a, .fixed-nav ul.nav-sp-content-list li a:link, .fixed-nav ul.nav-sp-content-list li a:visited {
  color: #333;
}
.fixed-nav ul.nav-sp-content-list li a:hover, .fixed-nav ul.nav-sp-content-list li a:active {
  text-decoration: none;
  color: #333;
}

.home:not(.scrolled) .header-nav .nav li:not(.nav-item-reserve) {
  border-left: 1px solid rgba(255, 255, 255, 0.2);
}
.header-logo a {
  width: 140px;
  object-fit: cover;
  aspect-ratio: 140/32;
  display: inline-block;
  transition: all 0.5s;
}

.header-nav-g .instagram a {
  opacity: 0.8;
  object-fit: cover;
  aspect-ratio: 1;
  display: inline-block;
  transition: all 0.5s;
}

footer .footer-logo-wrap {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 30px;
}
footer .footer-logo-wrap .footer-logo-resortlife {
  text-align: center;
  font-size: 1.3rem;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
footer .footer-logo-wrap .footer-logo-resortlife a {
  display: inline-block;
  width: 70%;
  max-width: 240px;
}
footer .footer-logo-wrap .footer-logo-resortlife img {
  width: 100%;
}
footer .footer-logo-wrap .footer-logo-resortlife .address {
  margin-top: 0.5em;
}
footer .copyright-container {
  width: 100%;
  text-align: center;
  font-size: 12px;
  padding: 0.5em 0 3rem;
  margin-top: 1rem;
}

.basic-title {
  font-size: 3rem;
}
.basic-title h3 {
  font-size: 1em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  margin-bottom: 0.5em;
}
.basic-title p.ja {
  font-size: 0.6em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
.basic-title p.en {
  font-size: 0.6em;
  font-family: "EB Garamond", serif;
  font-weight: 400;
}
.mv-text {
  /*position: absolute;
  top: 0;
  left: 0;
  right: 0;*/
  width: 100%;
  height: 100vh;
  min-height: 500px;
  position: relative;
  text-align: center;
  /*&-01{
   @include c.sans();
   font-size: 10vw;	
   text-align: justify;
   color: #fff;

  }
  &-02{
   @include c.sans();
   font-size: 5vw;
   text-align: justify;
   color: #fff;
  }*/
}
@media screen and (max-width: 767px) {
  .mv-text {
    height: 95vh;
  }
}
.mv-text-logo {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: inline-block;
  text-align: center;
  top: 5%;
}
.mv-text-logo figure {
  width: 10rem;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .mv-text-logo figure {
    width: 6rem;
  }
}
.mv-text-logo span {
  color: #fff;
  margin-top: 0.8em;
  line-height: 1.5;
  display: inline-block;
}
.mv-text-copy {
  position: absolute;
  left: 5%;
  text-align: left;
  color: #fff;
  bottom: 10%;
  font-size: 4rem;
}
@media screen and (max-width: 767px) {
  .mv-text-copy {
    top: auto;
    bottom: 20%;
    font-size: 2.8rem;
  }
}
.mv-text-copy span {
  display: block;
}
.mv-text-copy span.main {
  line-height: 1.7;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
.mv-text-copy span.sub {
  font-size: 0.3em;
  margin-top: 1em;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  letter-spacing: 0.1em;
}
.mv-text-en {
  position: absolute;
  width: 100%;
  bottom: 2%;
  font-size: 5vw;
  left: 50%;
  transform: translateX(-50%);
  letter-spacing: 0.1em;
  color: #fff;
  font-family: "EB Garamond", serif;
  font-weight: 400;
}
.mv-text-main {
  width: 90%;
  margin: 3rem 5% 0;
  padding-bottom: 2.5em;
  position: relative;
}
.mv-text-main::before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background: #fff;
  opacity: 0.7;
  bottom: 0;
  left: 0;
  right: 0;
  position: absolute;
}
.mv-text-main img {
  width: 100%;
}
.mv-text-sub {
  width: 90%;
  margin: 1.5rem 5% 0;
  position: relative;
  text-align: right;
  font-size: 2.6rem;
  color: #fff;
  font-family: "Marcellus", serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 767px) {
  .mv-text-sub {
    font-size: 2rem;
    margin: 1.5rem 5% 0;
  }
}

.home main {
  position: relative;
  /* &::before{
  	content: '';
  	 display: block;
  	 width: 100%;
  	 height: 100%;
  	 //background: #fff;
  	 z-index: 0;
  	 position: absolute;
  	 opacity: 0;
  	 transition: all 1s;
  	 backdrop-filter:blur(10px);
  	 top: -5rem;
  	 left:0;
  	 right: 0;
  	 bottom: 0;
   }*/
}
.home main::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  z-index: -1;
  position: absolute;
  transition: all 1s;
  background: url(../img/bg/so-white.png) repeat center center;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.home main::before {
  content: "";
  display: block;
  width: 100%;
  z-index: -1;
  position: absolute;
  opacity: 0;
  transition: all 1s;
  top: 0;
  height: 15rem;
}
.mv {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
}
.mv .mv-slide .slide-block {
  width: 100%;
  height: 100vh;
  min-height: 600px;
  overflow: hidden;
}
.mv .mv-slide .slide {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  /*position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;*/
}
.mv-inner {
  position: relative;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .mv-inner {
    padding-bottom: 0;
  }
}
.mv .mv-bg {
  min-width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  overflow: hidden;
  position: relative;
  min-height: 550px;
}
@media screen and (max-width: 767px) {
  .mv .mv-bg {
    height: 75vh;
  }
}
.mv .mv-bg video {
  min-width: 100%;
  min-height: 100%;
}
@media screen and (max-width: 767px) {
  .mv .mv-bg video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 0;
    height: 100%;
  }
}
.mv .mv-copy-wrap {
  position: absolute;
  color: #fff;
  text-align: left;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 1;
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
}
.mv .mv-copy {
  color: #fff;
  width: 100%;
  line-height: 1;
  letter-spacing: 0.05em;
  margin-top: 1em;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  margin-bottom: 0.2em;
  display: inline-block;
  font-size: 2.6em;
  letter-spacing: 0.4em;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .mv .mv-copy {
    font-size: 1.2em;
  }
}
.mv .mv-copy:nth-of-type(1) {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
.mv .mv-pre {
  font-size: 2.6rem;
  margin-top: 1em;
  color: #fff;
  width: 100%;
  line-height: 1.8;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  letter-spacing: 0.2em;
}
@media screen and (max-width: 767px) {
  .mv .mv-pre {
    font-size: 4.3vw;
  }
}

.mv-copy-logo {
  width: 60%;
  max-width: 600px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.mv-copy-logo span {
  display: inline-block;
  width: 100%;
}
.mv-copy-logo span img {
  width: 100%;
  max-width: 160px;
}
.mv-copy-logo span span {
  color: #fff;
  font-size: 1.2rem;
  margin-top: 1em;
}

.mv-copy-logo span, .mv-copy, .mv-pre {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transform: translate(0, 1em);
}

/*.mv-copy-logo::after{
	content: "";
	display: inline-block;
	background-color: #fff;
	transform-origin: center center;
	width: 0;
	opacity: 0;
	transition: all 1.2s;
	height: 1px;
}*/
.is-anm {
  /*.mv-copy-logo::after{
  	opacity: .7;
  	width: 100%;
  }	*/
}
.is-anm .mv-copy-logo span, .is-anm .mv-copy, .is-anm .mv-pre {
  opacity: 1;
  transform: translate(0, 0);
}

.mv-copy-logo span {
  transition-delay: 0.8s;
}

.mv-copy, .mv-pre {
  transition-delay: 1s;
}

.section-title-en {
  font-family: "EB Garamond", serif;
  font-weight: 400;
  color: #BAB8A0;
  font-size: 70px;
  opacity: 0.5;
  overflow: hidden;
}
@media screen and (max-width: 1099px) {
  .section-title-en {
    font-size: 5vw;
  }
}
@media screen and (max-width: 767px) {
  .section-title-en {
    font-size: 9vw;
  }
}
.section-title-en span {
  letter-spacing: 0;
}

.section-title {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 30px;
  line-height: 1.5;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 1099px) {
  .section-title {
    font-size: 2vw;
  }
}
@media screen and (max-width: 767px) {
  .section-title {
    font-size: 5vw;
  }
}
.text-block .section-title {
  margin-bottom: 0.5em;
}

.section-lead-wrap {
  padding: 5em 0;
  width: 100%;
  text-align: center;
}
.section-lead {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .section-lead {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .section-lead {
    font-size: 3.6vw;
  }
}

section.movie, section.shirahama, section.fireworks, section.aws, section.cafe, section.nav-banner, section.floor-plan {
  margin-bottom: 5%;
}

.topic {
  width: 100%;
  margin: 4% 0;
}
@media screen and (max-width: 767px) {
  .topic {
    margin: 6% 0;
  }
}
.topic .inner {
  width: 92%;
  max-width: 1000px;
  margin: 0 auto;
  display: flex;
}
.topic p {
  padding: 1em;
  font-size: 1.1vw;
}
@media screen and (max-width: 767px) {
  .topic p {
    font-size: 12px;
  }
}
.topic p:first-of-type {
  background-color: rgba(186, 184, 160, 0.15);
  color: #BAB8A0;
}
.about-imgya {
  width: 94%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 8%;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .about-imgya {
    width: 80%;
  }
}
.about-imgya-img {
  width: 50%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 0;
  padding-bottom: 50%;
}
@media screen and (max-width: 767px) {
  .about-imgya-img {
    width: 100%;
  }
}
.about-imgya-text {
  margin-top: 5em;
  order: -1;
  width: 43%;
  padding-top: 2em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  text-align: justify;
}
@media screen and (max-width: 767px) {
  .about-imgya-text {
    order: unset;
    width: 100%;
    margin-top: 0;
  }
}
.about-imgya-text .subtitle {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  margin-bottom: 0.5em;
  line-height: 1.5;
}
@media screen and (max-width: 1099px) {
  .about-imgya-text .subtitle {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .about-imgya-text .subtitle {
    font-size: 3.15vw;
  }
}
.about-imgya-text h2 {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 26px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  margin-bottom: 0.8em;
  line-height: 1.5;
}
@media screen and (max-width: 1099px) {
  .about-imgya-text h2 {
    font-size: 2.34vw;
  }
}
@media screen and (max-width: 767px) {
  .about-imgya-text h2 {
    font-size: 5.85vw;
  }
}
.about-imgya-text h2 small {
  font-size: 0.7em;
}
.about-imgya-text .text {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  line-height: 1.8;
}
@media screen and (max-width: 1099px) {
  .about-imgya-text .text {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .about-imgya-text .text {
    font-size: 3.6vw;
  }
}

.movie .inner {
  width: 100%;
  text-align: center;
}
.movie .inner video {
  width: 100%;
}

.reservation {
  margin-bottom: 7%;
}
.reservation .inner {
  width: 96%;
  max-width: 1000px;
  padding: 3% 0;
  margin: 0 auto;
}
.reservation-title {
  text-align: center;
  width: 100%;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 28px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  margin-bottom: 1em;
  color: #002754;
}
@media screen and (max-width: 1099px) {
  .reservation-title {
    font-size: 2.52vw;
  }
}
@media screen and (max-width: 767px) {
  .reservation-title {
    font-size: 6.3vw;
  }
}
.reservation .title {
  text-align: center;
  margin-bottom: 1em;
}
@media screen and (max-width: 767px) {
  .reservation .title {
    margin-top: 2em;
  }
}
.reservation .title h3 {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 22px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  background: #002754;
  color: #fff;
  line-height: 1;
  margin-bottom: 0.1em;
  padding: 0.5em 0;
}
@media screen and (max-width: 1099px) {
  .reservation .title h3 {
    font-size: 1.98vw;
  }
}
@media screen and (max-width: 767px) {
  .reservation .title h3 {
    font-size: 4.95vw;
  }
}
.reservation .title h4 {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 22px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  background: #002754;
  color: #fff;
  line-height: 1;
  padding: 0.5em 0;
  margin-bottom: 1em;
}
@media screen and (max-width: 1099px) {
  .reservation .title h4 {
    font-size: 1.98vw;
  }
}
@media screen and (max-width: 767px) {
  .reservation .title h4 {
    font-size: 4.95vw;
  }
}
.reservation .title p {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .reservation .title p {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .reservation .title p {
    font-size: 3.6vw;
  }
}
.reservation .calender {
  margin-top: 30px;
}

.shirahama .inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.shirahama .inner > div {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .shirahama .inner > div {
    width: 100%;
  }
}
.shirahama .inner .img-block {
  display: flex;
  padding: 5%;
}
.shirahama .inner .img-block figure:nth-of-type(1) {
  width: 60%;
  transition-delay: 0.2s;
}
.shirahama .inner .img-block figure:nth-of-type(2) {
  width: 40%;
  transition-delay: 0.5s;
  margin-left: -5%;
  margin-top: 30%;
}
.shirahama .inner .text-block {
  padding: 1%;
}

.fireworks {
  width: 100%;
  position: relative;
  z-index: 0;
  overflow: hidden;
}
.fireworks .inner {
  width: 100%;
}
.fireworks .text-block {
  color: #fff;
  position: absolute;
  right: 3%;
  top: 15%;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .fireworks .text-block {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .fireworks .text-block {
    font-size: 3.15vw;
  }
}
@media screen and (max-width: 767px) {
  .fireworks .text-block {
    position: static;
    width: 100%;
    text-align: center;
    padding: 1em 0;
    color: #000;
  }
}
.fireworks .fireworks-info {
  position: absolute;
  left: 2%;
  bottom: 2%;
  color: #fff;
  margin-top: 3%;
  padding: 1em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  background-color: rgba(0, 0, 0, 0.5);
}
@media screen and (max-width: 1099px) {
  .fireworks .fireworks-info {
    font-size: 1.08vw;
  }
}
@media screen and (max-width: 767px) {
  .fireworks .fireworks-info {
    font-size: 2.7vw;
  }
}
.fireworks .fireworks-info p:first-child {
  font-size: 1.2em;
  margin-bottom: 0.5em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
@media screen and (max-width: 767px) {
  .fireworks .fireworks-info p:first-child {
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
  }
}
@media screen and (max-width: 767px) {
  .fireworks .fireworks-info {
    background-color: transparent;
    position: static;
    width: 80%;
    margin: 0 auto;
    text-align: center;
    padding: 1em 0;
    color: #000;
  }
}
.fireworks .fireworks-img {
  background: url(../img/fireworks.jpg) no-repeat center center/cover;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 0;
  padding-bottom: 50%;
  transition: all 1.5s;
  opacity: 0;
}
.fireworks .fireworks-img.is-anm {
  opacity: 1;
}
@media screen and (max-width: 767px) {
  .fireworks .fireworks-img {
    position: static;
    height: 0;
    padding-bottom: 50%;
  }
}

.aws .inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
.aws .inner > div {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .aws .inner > div {
    width: 100%;
  }
}
.aws .inner .img-block {
  display: flex;
  padding: 3%;
}
.aws .inner .img-block figure img {
  width: 100%;
}
.aws .inner .text-block {
  padding: 3%;
}

.nav-banner .inner {
  width: 100%;
  text-align: center;
}
.nav-banner a {
  display: inline-block;
  background: url(../img/cmn/nav-banner-bg.jpg) no-repeat center center/cover;
  padding: 5% 0;
  margin: 0 auto;
  width: 90%;
  max-width: 1000px;
  text-align: center;
  text-decoration: none;
  transition: all 0.5s;
}
.nav-banner a, .nav-banner a:link, .nav-banner a:visited {
  color: #000;
}
.nav-banner a:hover, .nav-banner a:active {
  text-decoration: none;
  color: #000;
}
.nav-banner a:hover {
  opacity: 0.7;
}
.nav-banner a .nav-banner-title-en {
  font-family: "EB Garamond", serif;
  font-weight: 400;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 38px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #BAB8A0;
  line-height: 1;
  text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff;
}
@media screen and (max-width: 1099px) {
  .nav-banner a .nav-banner-title-en {
    font-size: 3.42vw;
  }
}
@media screen and (max-width: 767px) {
  .nav-banner a .nav-banner-title-en {
    font-size: 8.55vw;
  }
}
.nav-banner a .nav-banner-title-ja {
  display: inline-block;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  background-color: #BAB8A0;
  color: #fff;
  padding: 0.25em 2em;
  margin-top: 1em;
}
@media screen and (max-width: 1099px) {
  .nav-banner a .nav-banner-title-ja {
    font-size: 2.16vw;
  }
}
@media screen and (max-width: 767px) {
  .nav-banner a .nav-banner-title-ja {
    font-size: 5.4vw;
  }
}

.page-floor-plan .page-title {
  background: url(../img/plans/plan-head-bg.jpg) no-repeat center center/cover;
}
.page-floor-plan .page-title .inner {
  padding: 8% 0;
  width: 100%;
  text-align: center;
}
.page-floor-plan .page-title h2 {
  font-size: 30px;
  color: #BAB8A0;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 1099px) {
  .page-floor-plan .page-title h2 {
    font-size: 3vw;
  }
}
@media screen and (max-width: 767px) {
  .page-floor-plan .page-title h2 {
    font-size: 5vw;
  }
}
.page-floor-plan .page-lead {
  text-align: center;
}
.page-floor-plan .page-lead h3 {
  font-size: 26px;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  margin-bottom: 0.5em;
  line-height: 1.5;
}
@media screen and (max-width: 1099px) {
  .page-floor-plan .page-lead h3 {
    font-size: 2.6vw;
  }
}
@media screen and (max-width: 767px) {
  .page-floor-plan .page-lead h3 {
    font-size: 5.1vw;
  }
}
.page-floor-plan .page-lead p {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .page-floor-plan .page-lead p {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .page-floor-plan .page-lead p {
    font-size: 3.6vw;
  }
}

.floor-plan-block-list {
  width: 96%;
  margin: 0 auto;
  max-width: 1100px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.floor-plan-block {
  width: 49%;
  margin-bottom: 10px;
}
@media screen and (max-width: 767px) {
  .floor-plan-block {
    width: 100%;
  }
}

.floor-plan-info {
  padding: 5% 3%;
}
.floor-plan-info .floor-plan-title-en {
  font-family: "EB Garamond", serif;
  font-weight: 400;
  margin-bottom: 0.3em;
  text-align: center;
  font-size: 26px;
  letter-spacing: 0.1em;
  color: #BAB8A0;
}
@media screen and (max-width: 1099px) {
  .floor-plan-info .floor-plan-title-en {
    font-size: 2.6vw;
  }
}
@media screen and (max-width: 767px) {
  .floor-plan-info .floor-plan-title-en {
    font-size: 5vw;
  }
}
.floor-plan-info .floor-plan-title-ja {
  margin-bottom: 0.8em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  text-align: center;
  font-size: 16px;
}
@media screen and (max-width: 1099px) {
  .floor-plan-info .floor-plan-title-ja {
    font-size: 2vw;
  }
}
@media screen and (max-width: 767px) {
  .floor-plan-info .floor-plan-title-ja {
    font-size: 3vw;
  }
}
.floor-plan-info .floor-plan-text {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-align: center;
}
@media screen and (max-width: 1099px) {
  .floor-plan-info .floor-plan-text {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .floor-plan-info .floor-plan-text {
    font-size: 3.15vw;
  }
}

.banner {
  width: 100%;
  padding: 3% 0;
}
.banner .inner {
  width: 96%;
  max-width: 1000px;
  margin: 0 auto;
}

.privacy {
  margin-top: 1em;
}
.privacy a {
  text-decoration: none;
}
.privacy a, .privacy a:link, .privacy a:visited {
  color: #000;
}
.privacy a:hover, .privacy a:active {
  text-decoration: none;
  color: #000;
}

.page-lead {
  position: relative;
}
@media screen and (max-width: 767px) {
  .page-lead {
    margin-top: 0;
  }
}
.page-lead--copy {
  text-align: center;
}
.page-lead a {
  text-decoration: none;
  color: #000;
  font-size: 1.2rem;
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
}
.page-lead a span {
  display: inline-block;
  width: 100%;
  text-align: center;
}
.page-lead a::before {
  content: "";
  display: block;
  width: 1px;
  height: 5em;
  margin-bottom: 0.5em;
  opacity: 0.2;
  background: #000;
}
.page-lead--main {
  writing-mode: vertical-rl;
  text-align: left;
  margin: 0 auto 3em;
}
.page-lead--main span {
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  .page-lead--main {
    writing-mode: inherit;
    text-align: center;
    margin: 0 auto 1em;
  }
}
.page-lead.page-lead-home {
  margin-top: 8%;
}
@media screen and (max-width: 767px) {
  .page-lead.page-lead-home {
    margin-top: 1rem;
  }
}
.page-lead.page-lead-home::before {
  position: absolute;
  content: "";
  display: block;
  z-index: -2;
  width: 60%;
  height: 100%;
  background: url(../img/top/lead-bg.jpg) no-repeat center center/cover;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
@media screen and (max-width: 767px) {
  .page-lead.page-lead-home::before {
    position: static;
    height: 300px;
    width: 100%;
    margin-bottom: 0;
  }
}
.page-lead::after {
  position: absolute;
  display: none;
  z-index: -1;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, white 0%, rgba(255, 255, 255, 0) 40%);
  opacity: 0.8;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.page-lead-textblock {
  width: 35%;
  margin-left: auto;
  margin-right: 2%;
  padding: 5% 0 5% 0;
}
@media screen and (max-width: 767px) {
  .page-lead-textblock {
    padding: 2em 0 2em 0;
    width: 100%;
  }
}

.page-lead--img {
  display: flex;
  justify-content: center;
  padding: 2em 0;
  margin: 0 auto;
  width: 80%;
  max-width: 800px;
}
.page-lead--img figure {
  margin: 0 3px;
}

#googlemaps {
  width: 100%;
  min-height: 500px;
}

.rooms-floor-list--block--title {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 34px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  line-height: 1.3;
  margin-bottom: 0.3em;
}
@media screen and (max-width: 1099px) {
  .rooms-floor-list--block--title {
    font-size: 3.06vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-floor-list--block--title {
    font-size: 7.65vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-floor-list--block--title {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 26px;
    line-height: 1.8;
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .rooms-floor-list--block--title {
    font-size: 2.34vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .rooms-floor-list--block--title {
    font-size: 5.85vw;
  }
}
.rooms-floor-list--block--title small {
  font-size: 0.7em;
}
.rooms-floor-list--block--title-des {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 35px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  line-height: 1;
  left: 0;
  top: 0;
  opacity: 0.8;
  margin-bottom: 0.5em;
  text-shadow: 0 0 0.5em black;
  /*&::after{
  	content: 'type';
  	margin-left: .3em;
  	font-size: .7em;

  }*/
}
@media screen and (max-width: 1099px) {
  .rooms-floor-list--block--title-des {
    font-size: 3.15vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-floor-list--block--title-des {
    font-size: 7.875vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-floor-list--block--title-des {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 30px;
    line-height: 1.8;
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .rooms-floor-list--block--title-des {
    font-size: 2.7vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .rooms-floor-list--block--title-des {
    font-size: 6.75vw;
  }
}
.rooms-floor-list--block--lead {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-shadow: 0 0 0.5em black;
  line-height: 1.3;
}
@media screen and (max-width: 1099px) {
  .rooms-floor-list--block--lead {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-floor-list--block--lead {
    font-size: 3.6vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-floor-list--block--lead {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.8;
    letter-spacing: 0.05em;
    text-shadow: none;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .rooms-floor-list--block--lead {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .rooms-floor-list--block--lead {
    font-size: 3.15vw;
  }
}

.plans {
  background-color: rgba(184, 191, 209, 0.1);
  margin-top: 5%;
}

.slick-dots {
  bottom: -40px;
}

.rooms-type-head-hr {
  font-family: "EB Garamond", serif;
  font-weight: 400;
  color: #333;
  margin-bottom: 1rem;
  font-size: 1.1rem;
  text-transform: uppercase;
  letter-spacing: 0.7em;
  width: 100%;
  text-align: center;
}
.rooms-type-head-hr br {
  display: none;
}

.contents-title {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #003f87;
  line-height: 1 !important;
  text-align: center;
  margin: 0 auto 0.5em;
}
@media screen and (max-width: 1099px) {
  .contents-title {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .contents-title {
    font-size: 4.5vw;
  }
}
@media screen and (max-width: 767px) {
  .contents-title {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.8;
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .contents-title {
    font-size: 1.62vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .contents-title {
    font-size: 4.05vw;
  }
}
.contents-title span {
  display: inline-block;
  white-space: nowrap;
  width: 100%;
}
.contents-title span.en {
  font-family: "EB Garamond", serif;
  font-weight: 400;
}
.contents-title span.ja {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
.contents-title span:nth-of-type(1) {
  font-size: 1.8em;
  letter-spacing: 0.1em;
}
.contents-title span:nth-of-type(1) small {
  color: #24334c;
  opacity: 0.9;
  font-size: 0.6em;
}
.contents-title span:nth-of-type(2) {
  font-size: 0.7em;
}

.page-lead .page-lead-01 {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 26px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #735F51;
  text-align: left;
  width: 100%;
  margin-bottom: 1em;
}
@media screen and (max-width: 1099px) {
  .page-lead .page-lead-01 {
    font-size: 2.34vw;
  }
}
@media screen and (max-width: 767px) {
  .page-lead .page-lead-01 {
    font-size: 5.85vw;
  }
}
.page-lead .page-lead-02 {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #735F51;
  text-align: left;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 1099px) {
  .page-lead .page-lead-02 {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .page-lead .page-lead-02 {
    font-size: 3.6vw;
  }
}
.floor-list .rooms-floor-list--block {
  width: 25%;
}
@media screen and (max-width: 1099px) {
  .floor-list .rooms-floor-list--block {
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  .floor-list .rooms-floor-list--block {
    width: 100%;
  }
}

/*****room*****/
.rooms {
  margin: 30px 0;
}

@media screen and (max-width: 767px) {
  .rooms {
    margin: 0 0 80px;
  }
}
.rooms .title {
  padding: 3% 0;
}
@media screen and (max-width: 767px) {
  .rooms .title {
    padding: 3% 0;
  }
}
.rooms .title h3, .rooms .title p {
  color: #735F51;
  text-align: center;
  width: 100%;
}
.rooms-container {
  padding-top: 5%;
  width: 100%;
}
.rooms-floor--container {
  width: 100%;
  margin: 0 auto;
}
.rooms-floor {
  width: 100%;
  margin-top: 5em;
  margin-bottom: 2em;
}
.rooms-floor--title {
  width: 100%;
  display: flex;
  align-items: center;
  margin-bottom: 1em;
}
@media screen and (max-width: 767px) {
  .rooms-floor--title {
    flex-wrap: wrap;
  }
}
.rooms-floor--title h4, .rooms-floor--title p {
  display: inline-block;
}
.rooms-floor--title h4 {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 38px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  letter-spacing: 0.1em !important;
  white-space: nowrap;
  margin-right: 2em;
}
@media screen and (max-width: 1099px) {
  .rooms-floor--title h4 {
    font-size: 3.42vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-floor--title h4 {
    font-size: 8.55vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-floor--title h4 {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 28px;
    line-height: 1.8;
    letter-spacing: 0.05em;
    line-height: 1;
    margin-bottom: 0.5em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .rooms-floor--title h4 {
    font-size: 2.52vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .rooms-floor--title h4 {
    font-size: 6.3vw;
  }
}
.rooms-floor--title h4 .en {
  font-family: "EB Garamond", serif;
  font-weight: 400;
}
.rooms-floor--title h4 .ja {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 0.4em;
  margin-left: 1em;
}
@media screen and (max-width: 767px) {
  .rooms-floor--title h4 .ja {
    margin-left: 0;
    font-size: 0.6em;
  }
}
.rooms-floor--title p {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
@media screen and (max-width: 1099px) {
  .rooms-floor--title p {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-floor--title p {
    font-size: 3.15vw;
  }
}
.rooms-floor-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.rooms-floor-list a {
  width: 100%;
  height: 100%;
  padding: 20% 4%;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  position: relative;
  overflow: hidden;
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  .rooms-floor-list a {
    padding: 11% 5% 8% 5%;
  }
}
.rooms-floor-list a, .rooms-floor-list a:link, .rooms-floor-list a:visited {
  color: #fff;
}
.rooms-floor-list a:hover, .rooms-floor-list a:active {
  text-decoration: none;
  color: #fff;
}
.rooms-floor-list a::before {
  display: inline-block;
  content: "";
  width: 100%;
  height: auto;
  position: absolute;
  right: 0;
  top: 0;
  left: 0;
  bottom: 0;
}
.rooms-floor-list a::before {
  z-index: -1;
  background: #000;
  opacity: 0;
}
@media screen and (max-width: 767px) {
  .rooms-floor-list a::before {
    display: none;
  }
}
.rooms-floor-list a .rooms-floor-list--block-bg {
  background-position: center center;
  background-size: cover;
  z-index: -2;
  transition: all 0.8s;
  transform-origin: center, center;
  display: inline-block;
  width: 100%;
  height: auto;
  position: absolute;
  right: 0;
  top: 0;
  left: 0;
  bottom: 0;
}
.rooms-floor-list a p {
  width: 100%;
}
.rooms-floor-list a:hover .rooms-floor-list--block-bg {
  transform: scale(1.05);
}
.rooms-floor-list--block {
  font-size: 1.8rem;
  width: 50%;
}
@media screen and (max-width: 767px) {
  .rooms-floor-list--block {
    width: 100%;
    height: auto;
  }
}
.rooms-floor-list--block.col3 {
  width: 33.3333333333%;
}
@media screen and (max-width: 767px) {
  .rooms-floor-list--block.col3 {
    width: 100%;
  }
}
.rooms-floor-list--block.col3 a {
  padding: 50% 4%;
}
@media screen and (max-width: 767px) {
  .rooms-floor-list--block.col3 a {
    padding: 11% 5% 8% 5%;
  }
}
.rooms-floor-list--block.col2 {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .rooms-floor-list--block.col2 {
    width: 50%;
  }
}
.rooms-floor-list--block.col2 a {
  padding: 60% 4% 0;
}
@media screen and (max-width: 767px) {
  .rooms-floor-list--block.col2 a {
    padding: 2% 0 1.5em;
    display: flex;
    flex-wrap: wrap;
    color: #000;
  }
  .rooms-floor-list--block.col2 a .rooms-floor-list--block-bg {
    order: -1;
    position: static;
    height: 130px;
  }
}
.rooms-floor-list--block-title {
  font-size: 1.4em;
  text-align: center;
}
.rooms-floor-list--block-title--sub {
  font-size: 1em;
  text-align: center;
}
.rooms-floor-list--block-info {
  font-size: 0.8em;
  margin-top: 0.5em;
  text-align: center;
}
.rooms-floor-list--block-info em {
  font-style: normal;
  font-weight: normal;
  display: inline-block;
  padding: 0 1em;
  position: relative;
}
.rooms-floor-list--block-info em::before {
  content: "";
  display: inline-block;
  height: 1px;
  width: 0.9em;
  background: rgba(255, 255, 255, 0.3);
  position: absolute;
  left: 0;
  top: 50%;
}
.rooms-floor-list--block-info em::after {
  content: "";
  display: inline-block;
  height: 1px;
  width: 0.9em;
  background: rgba(255, 255, 255, 0.3);
  position: absolute;
  right: 0;
  top: 50%;
}
@media screen and (max-width: 767px) {
  .rooms-floor-list--block-info span {
    display: inline-block;
    width: 100%;
  }
}
.rooms-floor-list--block-more {
  font-size: 0.9em;
  display: inline-block;
  margin-top: 2em;
  width: auto !important;
  position: absolute;
  right: 1em;
  bottom: 1em;
}
@media screen and (max-width: 767px) {
  .rooms-floor-list--block-more {
    position: static;
    margin-top: 0.5em;
    margin-left: auto;
    margin-right: 0.5em;
    font-size: 0.7em;
  }
}
.rooms-floor-list--block-more span {
  display: inline-block;
  position: relative;
  padding-left: 1.5em;
}
.rooms-floor-list--block-more span::before {
  content: "";
  display: inline-block;
  width: 1.2em;
  height: 1px;
  background: #fff;
  position: absolute;
  left: 0;
  top: 50%;
}

.room-page-nav {
  width: 100%;
}
.room-page-nav ul {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .room-page-nav ul {
    justify-content: flex-start;
  }
}
.room-page-nav ul li {
  border-left: 1px solid #eee;
  margin: 0.5em 0;
}
.room-page-nav ul li:first-of-type {
  border-left: none;
}
@media screen and (max-width: 767px) {
  .room-page-nav ul li {
    width: 50%;
    border-left: none;
  }
  .room-page-nav ul li:nth-of-type(odd) {
    border-right: 1px solid #eee;
  }
}
.room-page-nav ul li a {
  padding: 0 1.5em;
  display: inline-block;
  text-decoration: none;
  text-decoration: none;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "EB Garamond", serif;
  font-weight: 400;
}
.room-page-nav ul li a, .room-page-nav ul li a:link, .room-page-nav ul li a:visited {
  color: #333;
}
.room-page-nav ul li a:hover, .room-page-nav ul li a:active {
  text-decoration: none;
  color: #333;
}
@media screen and (max-width: 1099px) {
  .room-page-nav ul li a {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .room-page-nav ul li a {
    font-size: 3.6vw;
  }
}
@media screen and (max-width: 767px) {
  .room-page-nav ul li a {
    width: 100%;
    text-align: center;
  }
}

.rooms-listBtn {
  margin-bottom: 7rem;
}

.rooms-listBtn-list {
  width: 96%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  display: flex;
  justify-content: center;
  gap: 1.5rem;
}
@media screen and (max-width: 767px) {
  .rooms-listBtn-list {
    width: 100%;
    gap: 0.5rem;
    flex-wrap: wrap;
  }
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(1) {
  transition-delay: 0.89s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(2) {
  transition-delay: 0.98s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(3) {
  transition-delay: 1.07s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(4) {
  transition-delay: 1.16s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(5) {
  transition-delay: 1.25s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(6) {
  transition-delay: 1.34s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(7) {
  transition-delay: 1.43s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(8) {
  transition-delay: 1.52s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(9) {
  transition-delay: 1.61s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(10) {
  transition-delay: 1.7s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(11) {
  transition-delay: 1.79s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(12) {
  transition-delay: 1.88s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(13) {
  transition-delay: 1.97s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(14) {
  transition-delay: 2.06s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(15) {
  transition-delay: 2.15s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(16) {
  transition-delay: 2.24s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(17) {
  transition-delay: 2.33s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(18) {
  transition-delay: 2.42s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(19) {
  transition-delay: 2.51s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content-block:nth-of-type(20) {
  transition-delay: 2.6s;
  transition-duration: 1.5s !important;
}
.rooms-listBtn-list .rooms-listBtn-content a {
  display: inline-block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  overflow: hidden;
  border: 1px solid #dedede;
  border-radius: 30rem;
  transition: all 0.8s;
  padding: 1em 1.5em;
}
.rooms-listBtn-list .rooms-listBtn-content a:hover {
  border: 1px solid #888;
}
.rooms-listBtn-list .rooms-listBtn-content .inner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  height: 100%;
  width: 100%;
  z-index: 0;
}
.rooms-listBtn-list .rooms-listBtn-content .inner::after {
  display: block;
  position: absolute;
  left: calc(50% - 0.25rem);
  bottom: 1rem;
  width: 0.5rem;
  height: 0.5rem;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  transform: translateX(0rem) rotate(45deg);
  opacity: 0.2;
}
.rooms-listBtn-list .rooms-listBtn-content .rooms-listBtn-img {
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0.4;
  transition: all 0.8s;
}
.rooms-listBtn-list .rooms-listBtn-content .rooms-listBtn-img figure {
  width: 100%;
  height: 100%;
}
.rooms-listBtn-list .rooms-listBtn-content .rooms-listBtn-img figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.rooms-listBtn-list .rooms-listBtn-content a:hover .rooms-listBtn-img {
  transform: scale(1.06);
}

.rooms-listBtn-title {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #735F51;
  line-height: 1 !important;
  text-align: center;
  margin: 0 auto;
  display: flex;
}
@media screen and (max-width: 1099px) {
  .rooms-listBtn-title {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-listBtn-title {
    font-size: 3.15vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-listBtn-title {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.8;
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .rooms-listBtn-title {
    font-size: 1.62vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .rooms-listBtn-title {
    font-size: 4.05vw;
  }
}
.rooms-listBtn-title span {
  white-space: nowrap;
  width: 100%;
}
.rooms-listBtn-title span.en {
  font-family: "EB Garamond", serif;
  font-weight: 400;
}
.rooms-listBtn-title span.ja {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
.rooms-listBtn-title span:nth-of-type(1) small {
  color: #fff;
  opacity: 0.9;
}
.rooms-detail-content-block {
  width: 100%;
  padding-bottom: 13rem;
  position: relative;
  /*
  &::before{
  	content: '';
  	display: block;
  	width: 70%;
  	height: 100%;
  	position: absolute;
  	z-index: -1;
  	top: -3%;
  	right: 0;
  	background: lighten(c.$color-dark,10%);
  }
  &:nth-of-type(even){
  	&::before{
  		top: -3%;
  		left: 0;
  		right: auto;
  	}
  }*/
}
.rooms-detail-content-block:not(:first-of-type)::before {
  display: block;
  width: 80%;
  height: 1px;
  position: absolute;
  z-index: -1;
  top: 0;
  right: 10%;
  background: rgba(115, 95, 81, 0.1);
}

.rooms-detail .page-lead {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}
.rooms-detail-content .inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .rooms-detail-content .inner {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-content .inner .rooms-detail-mv {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-content .inner .rooms-detail-info {
    width: 90%;
    margin: 0 auto;
    padding: 2rem 0 0 0;
  }
}
.rooms-detail .title {
  padding: 13% 0;
  color: #fff;
  text-align: left;
  width: 100%;
  position: relative;
}
@media screen and (max-width: 767px) {
  .rooms-detail .title {
    padding: 30% 0;
  }
}
.rooms-detail .title::before, .rooms-detail .title::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
}
.rooms-detail .title::before {
  z-index: -2;
  background: url(../img/rooms/rooms-title-bg.jpg) no-repeat center bottom 30%/cover;
}
.rooms-detail .title::after {
  z-index: -1;
}
.rooms-detail-title-hr {
  font-family: "EB Garamond", serif;
  font-weight: 400;
  margin-bottom: 1.5rem;
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 0.9em;
  width: 100%;
  opacity: 0.4;
}
.rooms-detail-title-hr br {
  display: none;
}
.rooms-detail-title {
  padding-bottom: 3%;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 85px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .rooms-detail-title {
    font-size: 7.65vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-title {
    font-size: 19.125vw;
  }
}
.rooms-detail-title .main {
  display: flex;
  align-items: center;
}
.rooms-detail-title small {
  font-size: 0.3em;
  margin-right: 0.5em;
  line-height: 1;
  margin-top: 0.4em;
  letter-spacing: 0.1em;
}
.rooms-detail-title b {
  line-height: 1;
  color: rgba(115, 95, 81, 0.7);
  font-weight: normal;
}
.rooms-detail-img-main {
  display: flex;
}
@media screen and (max-width: 767px) {
  .rooms-detail-img-main {
    flex-wrap: wrap;
  }
}
.rooms-detail-img-main > div:nth-of-type(1) {
  width: 50%;
  transition-delay: 0.5s !important;
}
@media screen and (max-width: 767px) {
  .rooms-detail-img-main > div:nth-of-type(1) {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-img-main > div:nth-of-type(1) figure {
    width: 78%;
    margin: -8% 0 5% 22%;
    z-index: 1;
    position: relative;
  }
}
.rooms-detail-img-main > div:nth-of-type(2) {
  width: 40%;
  margin: 0 0 0 5%;
  transition-delay: 0.4s !important;
}
@media screen and (max-width: 767px) {
  .rooms-detail-img-main > div:nth-of-type(2) {
    order: -1;
    width: 100%;
    margin: 0 0 1rem 0;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-img-main > div:nth-of-type(2) figure {
    width: 85%;
  }
}
.rooms-detail-img-main > div figure {
  width: 100%;
}
.rooms-detail-img-main > div .rooms-detail--lead {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  margin-bottom: 2em;
}
@media screen and (max-width: 1099px) {
  .rooms-detail-img-main > div .rooms-detail--lead {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-img-main > div .rooms-detail--lead {
    font-size: 3.15vw;
  }
}
.rooms-detail-slide {
  width: 100%;
  margin: 0% auto 2%;
  padding-bottom: 3%;
  position: relative;
  z-index: 0;
}
@media screen and (max-width: 767px) {
  .rooms-detail-slide {
    /*margin-left: -10%;
    margin-right: -10%;
    width: 120%;*/
  }
}
.rooms-detail-slide-slide {
  width: 100%;
  overflow: hidden;
  position: relative;
  opacity: 0;
  transition: all 0.7s;
}
.rooms-detail-slide-slide.swiper-initialized {
  opacity: 1;
}
.rooms-detail-slide-slide .swiper-button-prev, .rooms-detail-slide-slide .swiper-button-next {
  opacity: 0.5;
  transition: all 0.7s;
}
.rooms-detail-slide-slide:hover .swiper-button-prev, .rooms-detail-slide-slide:hover .swiper-button-next {
  opacity: 9;
}
.rooms-detail-slide img {
  aspect-ratio: 1.8;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .rooms-detail-slide img {
    aspect-ratio: 1.5;
  }
}
.rooms-detail-slide .rooms-detail-slide-nav {
  display: flex;
  gap: 1rem;
  align-items: center;
  margin-top: 1rem;
}
.rooms-detail-slide .rooms-detail-slide-nav > div {
  display: flex;
  justify-content: center;
}
.rooms-detail-slide .swiper-button-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.rooms-detail-slide .swiper-button-wrap .swiper-button-next, .rooms-detail-slide .swiper-button-wrap .swiper-button-prev {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: #735F51;
  width: 3.8rem;
  height: 3.8rem;
  margin-top: 0 !important;
}
@media screen and (max-width: 767px) {
  .rooms-detail-slide .swiper-button-wrap .swiper-button-next, .rooms-detail-slide .swiper-button-wrap .swiper-button-prev {
    width: 3rem;
    height: 3rem;
  }
}
.rooms-detail-slide .swiper-button-wrap .swiper-button-next::after, .rooms-detail-slide .swiper-button-wrap .swiper-button-prev::after {
  font-size: 1.8rem !important;
  color: #fff;
}
.rooms-detail-slide .swiper-button-wrap .swiper-button-next {
  right: 0;
}
.rooms-detail-slide .swiper-button-wrap .swiper-button-prev {
  left: 0;
}
.rooms-detail-slide .rooms-detail-slide-pagenation {
  width: auto;
}
.rooms-detail-slide .rooms-detail-slide-pagenation span {
  width: 6px !important;
  height: 6px !important;
  opacity: 0.1 !important;
}
.rooms-detail-slide .rooms-detail-slide-pagenation span.swiper-pagination-bullet-active {
  background: #333 !important;
  opacity: 1 !important;
}
.rooms-detail-info {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.rooms-detail-info-inner:nth-of-type(1) {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .rooms-detail-info-inner:nth-of-type(1) {
    width: 100%;
  }
}
.rooms-detail-info-inner:nth-of-type(2) {
  width: 34%;
}
@media screen and (max-width: 767px) {
  .rooms-detail-info-inner:nth-of-type(2) {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-info {
    margin-top: 10%;
  }
}
.rooms-detail-info p, .rooms-detail-info dt, .rooms-detail-info dd {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
.rooms-detail-info--text {
  text-align: left;
  margin-bottom: 3rem;
}
.rooms-detail-info--text h4 {
  text-align: left;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #735F51;
  line-height: 1 !important;
  margin: 0 auto 1.5em;
  display: flex;
  align-items: baseline;
}
@media screen and (max-width: 1099px) {
  .rooms-detail-info--text h4 {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-info--text h4 {
    font-size: 4.5vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-info--text h4 {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.8;
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .rooms-detail-info--text h4 {
    font-size: 1.62vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .rooms-detail-info--text h4 {
    font-size: 4.05vw;
  }
}
.rooms-detail-info--text h4 span {
  display: inline-block;
  white-space: nowrap;
}
.rooms-detail-info--text h4 span.en {
  font-family: "EB Garamond", serif;
  font-weight: 400;
}
.rooms-detail-info--text h4 span.ja {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
.rooms-detail-info--text h4 span:nth-of-type(1) {
  font-size: 1.6em;
  letter-spacing: 0.1em;
  display: flex;
  align-items: baseline;
  margin-right: 0.5em;
}
.rooms-detail-info--text h4 span:nth-of-type(1) b {
  font-weight: normal;
  display: inline-block;
  font-size: 1.5em;
}
.rooms-detail-info--text h4 span:nth-of-type(1) small {
  font-size: 0.7em;
}
.rooms-detail-info--text h4 span:nth-of-type(2) {
  font-size: 1.5em;
}
.rooms-detail-info--text h4 small {
  font-size: 0.8em;
}
@media screen and (max-width: 767px) {
  .rooms-detail-info--text, .rooms-detail-info--planning {
    width: 100%;
    margin-bottom: 3em;
  }
}
.rooms-detail-info figure {
  margin-bottom: 10px;
}
.rooms-detail-info--planning-col2 {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.rooms-detail-info--planning-col2 figure {
  width: 48%;
}
@media screen and (max-width: 767px) {
  .rooms-detail-info--planning-col2 figure {
    width: 100%;
  }
}
.rooms-detail-info--planning-col3 {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.rooms-detail-info--planning-col3 figure {
  width: 32%;
}
@media screen and (max-width: 767px) {
  .rooms-detail-info--planning-col3 figure {
    width: 100%;
  }
}
.notext .rooms-detail-info--spc {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: flex-start;
  align-items: flex-start;
}
.notext .rooms-detail-info--spc dl {
  width: 48%;
}
@media screen and (max-width: 767px) {
  .notext .rooms-detail-info--spc dl {
    width: 100%;
  }
}
.rooms-detail-info--spc::before {
  width: 100%;
  display: inline-block;
  content: "Information";
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  text-align: left;
  letter-spacing: 0.2em;
  margin-bottom: 1em;
}
@media screen and (max-width: 1099px) {
  .rooms-detail-info--spc::before {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-info--spc::before {
    font-size: 3.15vw;
  }
}
.rooms-detail-info--spc p, .rooms-detail-info--spc dt, .rooms-detail-info--spc dd {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  line-height: 1.5;
}
@media screen and (max-width: 1099px) {
  .rooms-detail-info--spc p, .rooms-detail-info--spc dt, .rooms-detail-info--spc dd {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-info--spc p, .rooms-detail-info--spc dt, .rooms-detail-info--spc dd {
    font-size: 3.15vw;
  }
}
.rooms-detail-info--spc dl {
  display: flex;
  flex-wrap: wrap;
}
.rooms-detail-info--spc dl dt, .rooms-detail-info--spc dl dd {
  margin-bottom: 0.8em;
}
.rooms-detail-info--spc dl dt {
  width: 15%;
}
.rooms-detail-info--spc dl dt::after {
  content: "／";
  opacity: 0.3;
  margin-left: 1em;
}
@media screen and (max-width: 767px) {
  .rooms-detail-info--spc dl dt {
    width: 20%;
  }
}
.rooms-detail-info--spc dl dd {
  width: 80%;
}
@media screen and (max-width: 767px) {
  .rooms-detail-info--spc dl dd {
    width: 80%;
  }
}
.rooms-detail-info--spc .sub-group {
  padding-bottom: 1em;
}
.rooms-detail-info--spc .sub-group > p {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  margin-bottom: 0.5em;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 1099px) {
  .rooms-detail-info--spc .sub-group > p {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-info--spc .sub-group > p {
    font-size: 3.6vw;
  }
}
.rooms-detail-dsc {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 300;
  width: 96%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1400px;
  padding: 4%;
  background-color: #f9f9f9;
  margin-top: 5%;
  margin-bottom: 8%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  /*&-eq-pic{
  	width: 100%;
  	display: flex;
  	margin-bottom: 1rem;
  	figure{
  		width: 50%;
  		img{
  			aspect-ratio:2.4;
  			width: 100%;
  			object-fit: cover;

  		}
  	}
  }*/
}
@media screen and (max-width: 1099px) {
  .rooms-detail-dsc {
    font-size: 1.17vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-dsc {
    font-size: 2.925vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-dsc {
    padding: 3rem 4%;
  }
}
.rooms-detail-dsc p:not(.rooms-detail-dsc-subtitle), .rooms-detail-dsc dd {
  font-size: 1em;
}
.rooms-detail-dsc p:not(.rooms-detail-dsc-subtitle), .rooms-detail-dsc dt, .rooms-detail-dsc dd {
  line-height: 1.5;
  letter-spacing: 0;
}
.rooms-detail-dsc-eq, .rooms-detail-dsc-atn {
  width: 100%;
  margin-bottom: 3%;
}
@media screen and (max-width: 767px) {
  .rooms-detail-dsc-eq, .rooms-detail-dsc-atn {
    width: 100%;
  }
}
.rooms-detail-dsc-subtitle {
  width: 100%;
  text-align: center;
  color: #24334c;
  margin-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .rooms-detail-dsc-subtitle {
    margin-bottom: 3rem;
  }
}
.rooms-detail-dsc-eq {
  width: 100%;
  margin-bottom: 5rem;
  /*&.amenity{
  	display: flex;
  	justify-content: space-between;
  	flex-wrap: wrap;

  	.rooms-detail-dsc-eq-pic{
  		width: 48%;
  		//display: flex;
  		//margin-bottom: 1rem;
  		@include c.mq(){
  			width: 100%;
  		}
  		figure{
  			width: 100%;
  			img{
  				aspect-ratio:2;
  				width: 100%;
  				object-fit: cover;

  			}
  		}
  	}
  	.rooms-detail-dsc-eq-contents{
  		width: 48%;
  		@include c.mq(){
  			width: 100%;
  		}
  	}

  }*/
}
@media screen and (max-width: 767px) {
  .rooms-detail-dsc-eq {
    width: 100%;
  }
}
.rooms-detail-dsc-eq.other, .rooms-detail-dsc-eq.amenity {
  width: 100%;
}
.rooms-detail-dsc-eq.other p, .rooms-detail-dsc-eq.amenity p {
  width: 100%;
  text-align: center;
}
.rooms-detail-dsc-eq.other dl, .rooms-detail-dsc-eq.amenity dl {
  width: 49%;
}
@media screen and (max-width: 767px) {
  .rooms-detail-dsc-eq.other dl, .rooms-detail-dsc-eq.amenity dl {
    width: 100%;
  }
}
.rooms-detail-dsc-eq.other .rooms-detail-dsc-eq--content, .rooms-detail-dsc-eq.amenity .rooms-detail-dsc-eq--content {
  width: 100%;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
  .rooms-detail-dsc-eq.other .rooms-detail-dsc-eq--content, .rooms-detail-dsc-eq.amenity .rooms-detail-dsc-eq--content {
    width: 100%;
  }
}
.rooms-detail-dsc-eq.amenity .rooms-detail-dsc-eq-pic {
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .rooms-detail-dsc-eq.amenity .rooms-detail-dsc-eq-pic {
    width: 100%;
  }
}
.rooms-detail-dsc-eq.amenity .rooms-detail-dsc-eq-pic figure {
  width: 49%;
}
.rooms-detail-dsc-eq.amenity .rooms-detail-dsc-eq-pic figure img {
  aspect-ratio: 2;
  width: 100%;
  object-fit: cover;
}
.rooms-detail-dsc-eq dl dt {
  margin-bottom: 0.5em;
  padding: 0.2em;
  font-size: 1.4em;
  border-bottom: 1px solid rgba(115, 95, 81, 0.6);
  display: flex;
  align-items: center;
  gap: 0.5em;
}
.rooms-detail-dsc-eq dl dt::before {
  content: "";
  display: block;
  width: 0.5em;
  height: 0.5em;
  background: #735F51;
  border-radius: 50%;
}
.rooms-detail-dsc-eq dl dd {
  margin-bottom: 1em;
}
.rooms-detail-dsc-eq dl dd small {
  font-size: 0.6em;
}
.rooms-detail-dsc-eq dl .room-guide-pet {
  text-align: center;
  margin: 1rem auto 0;
  position: relative;
}
@media screen and (max-width: 767px) {
  .rooms-detail-dsc-eq dl .room-guide-pet {
    padding: 1em 0 0;
    margin-top: 0;
  }
}
.rooms-detail-dsc-eq dl .room-guide-pet a {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-align: center;
  text-decoration: none;
  padding: 0.5em;
  display: inline-block;
  width: 100%;
  border: 1px solid #735F51;
  background: #fff;
  transition: opacity 0.5s;
  margin-bottom: 10px;
}
@media screen and (max-width: 1099px) {
  .rooms-detail-dsc-eq dl .room-guide-pet a {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-dsc-eq dl .room-guide-pet a {
    font-size: 3.15vw;
  }
}
.rooms-detail-dsc-eq dl .room-guide-pet a, .rooms-detail-dsc-eq dl .room-guide-pet a:link, .rooms-detail-dsc-eq dl .room-guide-pet a:visited {
  color: #735F51;
}
.rooms-detail-dsc-eq dl .room-guide-pet a:hover, .rooms-detail-dsc-eq dl .room-guide-pet a:active {
  text-decoration: none;
  color: #735F51;
}
.rooms-detail-dsc-eq dl .room-guide-pet a:hover {
  opacity: 0.6;
}
.rooms-detail-dsc-atn dl {
  display: flex;
  flex-wrap: wrap;
}
.rooms-detail-dsc-atn dl dt, .rooms-detail-dsc-atn dl dd {
  margin-bottom: 0.8em;
}
.rooms-detail-dsc-atn dl dt {
  width: 20%;
  opacity: 0.6;
}
.rooms-detail-dsc-atn dl dd {
  width: 80%;
}
.rooms-detail-dsc .rooms-detail-dsc-title {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 300;
  font-size: 1.4em !important;
  padding-bottom: 0.5em;
  margin-bottom: 0.5em;
}
.rooms-detail-dsc .rooms-detail-dsc-title small {
  font-size: 0.8em;
  margin-left: 1em;
}
.rooms-detail-dsc-ann {
  width: 100%;
  border-top: 1px solid #aaa;
  padding-top: 1em;
}
.rooms-detail-reserve-bo {
  text-align: center;
  margin: 2rem auto 0;
  position: relative;
}
@media screen and (max-width: 767px) {
  .rooms-detail-reserve-bo {
    padding: 1em 0 0;
    margin-top: 0;
  }
}
.rooms-detail-reserve-bo::before {
  display: block;
  width: 1px;
  height: 7rem;
  position: absolute;
  left: 50%;
  top: 0;
  background: rgba(0, 0, 0, 0.1);
}
@media screen and (max-width: 767px) {
  .rooms-detail-reserve-bo::before {
    content: none;
  }
}
.rooms-detail-reserve-bo a {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-align: center;
  text-decoration: none;
  border: 1px solid rgba(115, 95, 81, 0.3);
  padding: 0.5em;
  display: inline-block;
  width: 100%;
  transition: opacity 0.5s;
  margin-bottom: 10px;
}
@media screen and (max-width: 1099px) {
  .rooms-detail-reserve-bo a {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail-reserve-bo a {
    font-size: 3.6vw;
  }
}
.rooms-detail-reserve-bo a, .rooms-detail-reserve-bo a:link, .rooms-detail-reserve-bo a:visited {
  color: #735F51;
}
.rooms-detail-reserve-bo a:hover, .rooms-detail-reserve-bo a:active {
  text-decoration: none;
  color: #735F51;
}
.rooms-detail-reserve-bo a:hover {
  opacity: 0.6;
}
.rooms-detail .petOath {
  text-align: center;
  margin: 2rem auto 0;
  max-width: 500px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .rooms-detail .petOath {
    padding: 1em 0 0;
    margin-top: 0;
  }
}
.rooms-detail .petOath::before {
  display: block;
  width: 1px;
  height: 7rem;
  position: absolute;
  left: 50%;
  top: 0;
  background: rgba(0, 0, 0, 0.1);
}
@media screen and (max-width: 767px) {
  .rooms-detail .petOath::before {
    content: none;
  }
}
.rooms-detail .petOath a {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-align: center;
  text-decoration: none;
  padding: 0.5em;
  display: inline-block;
  width: 100%;
  border: 1px solid #735F51;
  background: #fff;
  transition: opacity 0.5s;
  margin-bottom: 10px;
}
@media screen and (max-width: 1099px) {
  .rooms-detail .petOath a {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-detail .petOath a {
    font-size: 3.6vw;
  }
}
.rooms-detail .petOath a, .rooms-detail .petOath a:link, .rooms-detail .petOath a:visited {
  color: #735F51;
}
.rooms-detail .petOath a:hover, .rooms-detail .petOath a:active {
  text-decoration: none;
  color: #735F51;
}
.rooms-detail .petOath a:hover {
  opacity: 0.6;
}
.rooms-detail .madori {
  margin: 2rem auto 0;
}
.rooms-detail .madori button {
  margin-bottom: 10px;
}
.rooms-detail .rooms-floor-list--block {
  width: 100%;
}
.rooms-detail .rooms-floor-list--block.col3 {
  width: 100%;
}
.rooms-detail .rooms-floor-list--block a {
  padding: 18% 4%;
}

.swiper-button-wrap {
  position: absolute;
  bottom: 0;
  right: 0.5rem;
  display: inline-flex;
}
.swiper-button-wrap > div {
  position: static;
}

.rooms-detail-mv-slide {
  overflow: hidden;
  position: relative;
}
.rooms-detail-mv-slide.slide-main img {
  aspect-ratio: 2.2;
  object-fit: cover;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .rooms-detail-mv-slide.slide-main img {
    aspect-ratio: 1.8;
  }
}
.rooms-detail-mv-slide.slide-thumb {
  margin-top: 1.5rem;
  width: 60%;
}
@media screen and (max-width: 767px) {
  .rooms-detail-mv-slide.slide-thumb {
    width: 100%;
    padding-left: 4%;
    padding-right: 4%;
    padding-top: 1rem;
  }
}
.rooms-detail-mv-slide.slide-thumb .slide-block {
  cursor: pointer;
  transition: opacity 0.5s;
  visibility: hidden;
  opacity: 0.5;
}
@media screen and (max-width: 767px) {
  .rooms-detail-mv-slide.slide-thumb .slide-block {
    opacity: 0.5;
    visibility: visible;
  }
}
.rooms-detail-mv-slide.slide-thumb .slide-block.swiper-slide-thumb-active {
  opacity: 1;
}
.rooms-detail-mv-slide.slide-thumb .swiper-slide-visible {
  visibility: visible;
  opacity: 0.5;
}
.rooms-detail-mv-slide.slide-thumb .swiper-slide-visible.swiper-slide-thumb-active {
  opacity: 1;
}
.rooms-detail-mv-slide.slide-thumb img {
  aspect-ratio: 4;
  object-fit: cover;
  width: 100%;
}
.rooms-detail-mv-slide .swiper-button-next, .rooms-detail-mv-slide .swiper-button-prev {
  color: #fff;
}
.rooms-detail-mv-slide .swiper-button-next::after, .rooms-detail-mv-slide .swiper-button-prev::after {
  font-size: 2rem;
}

.guide-file {
  padding: 3% 0 0;
  text-align: center;
  width: 96%;
  margin: 0 auto;
  max-width: 500px;
}
@media screen and (max-width: 767px) {
  .guide-file {
    padding: 3em 0;
  }
}
.guide-file a {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-align: center;
  text-decoration: none;
  padding: 0.5em;
  display: inline-block;
  width: 100%;
  border: 1px solid #735F51;
  transition: opacity 0.5s;
}
@media screen and (max-width: 1099px) {
  .guide-file a {
    font-size: 1.62vw;
  }
}
@media screen and (max-width: 767px) {
  .guide-file a {
    font-size: 4.05vw;
  }
}
.guide-file a, .guide-file a:link, .guide-file a:visited {
  color: #735F51;
}
.guide-file a:hover, .guide-file a:active {
  text-decoration: none;
  color: #735F51;
}
.guide-file a:hover {
  opacity: 0.6;
}

.rooms-equipment-wrap {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
  margin-top: 8%;
}
@media screen and (max-width: 767px) {
  .rooms-equipment-wrap {
    margin-top: 10%;
  }
}

.rooms-equipment {
  width: 100%;
  margin-bottom: 5rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}
.rooms-equipment > div {
  width: 31%;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .rooms-equipment > div {
    width: 100%;
  }
}
.rooms-equipment figure {
  display: inline-block;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .rooms-equipment figure {
    width: 100%;
    text-align: center;
  }
}
.rooms-equipment figure img {
  aspect-ratio: 2;
  object-fit: cover;
  width: 100%;
}
.rooms-equipment p {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  width: 100%;
  padding: 0.5rem 0 0;
  letter-spacing: 0.15em;
  text-align: justify;
}
@media screen and (max-width: 1099px) {
  .rooms-equipment p {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-equipment p {
    font-size: 3.6vw;
  }
}
@media screen and (max-width: 767px) {
  .rooms-equipment p {
    width: 100%;
  }
}

.refa {
  margin: 0 0 4rem 0;
  padding: 2rem 3rem;
  background: rgba(229, 232, 234, 0.5);
}
@media screen and (max-width: 767px) {
  .refa {
    padding: 1rem 1.5rem;
  }
}
.refa > p {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  margin-bottom: 0.8em;
}
@media screen and (max-width: 1099px) {
  .refa > p {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .refa > p {
    font-size: 3.6vw;
  }
}
.refa .items-list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
@media screen and (max-width: 767px) {
  .refa .items-list {
    grid-template-columns: 1fr 1fr;
  }
}
.refa .items-list figure img {
  aspect-ratio: 1;
  object-fit: cover;
  width: 100%;
}
.refa .items-list figure figcaption {
  text-align: left;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  margin-top: 0.1em;
}
@media screen and (max-width: 1099px) {
  .refa .items-list figure figcaption {
    font-size: 1.08vw;
  }
}
@media screen and (max-width: 767px) {
  .refa .items-list figure figcaption {
    font-size: 2.7vw;
  }
}
.floor-list {
  width: 90%;
  margin: 0 auto;
}
.floor-list > p {
  width: 100%;
  text-align: center;
  margin-top: 3em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 26px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  line-height: 1.3;
}
@media screen and (max-width: 1099px) {
  .floor-list > p {
    font-size: 2.34vw;
  }
}
@media screen and (max-width: 767px) {
  .floor-list > p {
    font-size: 5.85vw;
  }
}
@media screen and (max-width: 767px) {
  .floor-list > p {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 22px;
    line-height: 1.8;
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .floor-list > p {
    font-size: 1.98vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .floor-list > p {
    font-size: 4.95vw;
  }
}

.add-info {
  position: absolute;
  right: 0.5em;
  top: 0.5em;
}
.add-info > p {
  padding: 0.5em 1em;
  font-size: 14px;
  line-height: 1;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  background: rgba(255, 255, 255, 0.5);
}
.add-info-smoke {
  color: #333;
}
.add-info-oceanview {
  color: #003f87;
}

.checktime {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
  margin-bottom: 1em;
  font-size: 2.2rem;
}
@media screen and (max-width: 767px) {
  .checktime {
    font-size: 1.6rem;
  }
}
.checktime p:nth-of-type(1) {
  margin-right: 1.5em;
}
@media screen and (max-width: 767px) {
  .checktime p:nth-of-type(1) {
    margin-right: 0;
  }
}
@media screen and (max-width: 767px) {
  .checktime p {
    width: 100%;
    text-align: center;
    margin-bottom: 0.5em;
  }
}
.checktime p span {
  color: #735F51;
  font-size: 1.2em;
}
.checktime .mini {
  display: inline-block;
  font-size: 0.7em;
}
.checktime-info {
  width: 100%;
  text-align: center;
  padding: 1em 0 0;
  font-size: 1.4rem !important;
  line-height: 1.5 !important;
}
@media screen and (max-width: 767px) {
  .checktime-info {
    font-size: 1.2rem !important;
  }
}
.checktime-info a {
  text-decoration: none;
  text-decoration: underline;
}
.checktime-info a, .checktime-info a:link, .checktime-info a:visited {
  color: #333;
}
.checktime-info a:hover, .checktime-info a:active {
  text-decoration: none;
  color: #333;
}

.check-loc {
  width: 100%;
  padding: 1em;
  text-align: center;
  border: 1px solid #888;
  margin-bottom: 2em;
}
.check-loc dl {
  text-align: center;
}
.check-loc dl dt {
  margin-bottom: 0.7em;
  width: 100%;
}

.movie {
  width: 100%;
}
.movie video {
  width: 100%;
}

.plan-link {
  width: 100%;
  text-align: center;
}
.plan-link .inner {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 5% 0;
}
@media screen and (max-width: 767px) {
  .plan-link .inner {
    padding: 10% 0;
  }
}
.plan-link a {
  display: inline-block;
  padding: 0.3em 5em;
  font-size: 2.5rem;
  text-decoration: none;
  border-bottom: 1px solid rgba(51, 51, 51, 0.5);
  text-align: center;
  text-decoration: none;
  transition: opacity 0.5s;
}
.plan-link a, .plan-link a:link, .plan-link a:visited {
  color: #333;
}
.plan-link a:hover, .plan-link a:active {
  text-decoration: none;
  color: #333;
}
@media screen and (max-width: 767px) {
  .plan-link a {
    padding: 0.3em 2em;
  }
}
.plan-link a:hover {
  opacity: 0.6;
}

.bnr-mv-wrap a {
  text-decoration: none;
}
.bnr-mv-wrap a, .bnr-mv-wrap a:link, .bnr-mv-wrap a:visited {
  color: #000;
}
.bnr-mv-wrap a:hover, .bnr-mv-wrap a:active {
  text-decoration: none;
  color: #000;
}

.bnr-mv {
  position: absolute;
  right: 3%;
  bottom: 3%;
  display: inline-flex;
  align-items: center;
  z-index: 10;
  padding: 10px;
  background-color: #fff;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
}
@media screen and (max-width: 767px) {
  .bnr-mv {
    position: static;
    box-shadow: none;
    padding: 5%;
  }
}
.bnr-mv figure {
  width: 10vw;
  max-width: 300px;
  margin-right: 3%;
}
@media screen and (max-width: 767px) {
  .bnr-mv figure {
    width: 35%;
    margin-right: 0;
  }
}
.bnr-mv .text {
  display: inline-block;
  width: auto;
  /*a{
  	display: inline-block;
  	@include c.baseText(12);
  	@include c.shipporiR();
  	@include c.aset(#000,#000);
  	position: relative;
  	padding-left: 1em;
  	&::before{
  		content: '';
  		display: inline-block;
  		width: .3em;
  		height: .3em;
  		border-top: 1px solid #333;
  		border-right: 1px solid #333;
  		position: absolute;
  		left: 0;
  		top: 50%;
  		transform: rotate(45deg) translateY(-50%);

  	}
  	}	*/
}
@media screen and (max-width: 767px) {
  .bnr-mv .text {
    padding: 1.5em;
  }
}
.bnr-mv .text p {
  display: inline-block;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  padding-top: 1em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  margin-bottom: 0.5em;
  white-space: nowrap;
}
@media screen and (max-width: 1099px) {
  .bnr-mv .text p {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .bnr-mv .text p {
    font-size: 3.15vw;
  }
}
@media screen and (max-width: 767px) {
  .bnr-mv .text p {
    width: 100%;
  }
}
.bnr-mv .text p small {
  font-size: 0.8em;
  margin-top: 0.5em;
  position: relative;
  padding-left: 2.5em;
}
.bnr-mv .text p small::before {
  content: "";
  display: inline-block;
  width: 1.5em;
  height: 1px;
  background: rgba(0, 0, 0, 0.3);
  position: absolute;
  left: 0;
  top: 50%;
}

.reserve-widget {
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
  padding: 3rem 0 0 0;
}

.pre-info {
  padding: 8rem 1rem;
  text-align: center;
}
.pre-info a {
  font-size: 2rem;
  color: #333;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
.pre-info a img {
  width: 2em;
  margin-right: 0.5em;
}

.intro {
  width: 96%;
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 3rem;
  text-align: justify;
}
.intro br {
  display: none;
}

.access-gmap {
  margin: 0.5em 0;
}
.access-gmap a {
  display: inline-block;
  padding: 0.5em 2.5em;
  text-decoration: none;
  color: #333;
  font-size: 0.8em;
  border: 1px solid #333;
  transition: all 0.5s;
  position: relative;
  line-height: 1;
}
.access-gmap a:hover {
  opacity: 0.7;
}

.access-detail-copy {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
  margin: 8rem auto;
}
.access-detail-copy p {
  text-align: center;
  font-size: 1.6rem;
  line-height: 2;
}
@media screen and (max-width: 767px) {
  .access-detail-copy p {
    text-align: justify;
  }
}

.access-detail-map {
  padding: 7rem 0;
  background: #eff3f4;
  overflow: hidden;
  position: relative;
}
@media screen and (max-width: 767px) {
  .access-detail-map {
    padding: 5rem 0 7rem;
  }
}
.access-detail-map-inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 90%;
  margin: 0 auto;
  max-width: 1000px;
}
.access-detail-map .map {
  width: 60%;
  max-width: 500px;
}
@media screen and (max-width: 767px) {
  .access-detail-map .map {
    width: 90%;
    max-width: none;
  }
}
.access-detail-map .map figure, .access-detail-map .map img {
  width: 100%;
}
.access-detail-map .access-info {
  width: 45%;
  text-align: left;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
}
@media screen and (max-width: 767px) {
  .access-detail-map .access-info {
    width: 100%;
  }
}
.access-detail-map .access-info p {
  text-align: left;
  font-size: 1.4rem;
  display: inline-flex;
  margin-bottom: 0.8em;
  flex-wrap: wrap;
}
.access-detail-map .access-info p span {
  display: inline-block;
}
@media screen and (max-width: 767px) {
  .access-detail-map .access-info p span.sp-full {
    width: 100%;
  }
}
.access-detail-map .access-info-title-container {
  margin-bottom: 1rem;
}
.access-detail-map .access-info-title-container .access-info-title {
  font-size: 3.2rem;
  margin-bottom: 0.3em;
}
.access-detail-map .access-info-title-container .access-info-text {
  font-size: 1.6rem;
}

.access-detail-contents {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  padding: 10rem 0;
}
.access-detail-contents h4 {
  width: 100%;
}

/*
.top-lead{
	position: relative;
	@include c.mq{
		padding: 5rem 0 8rem;
	}
	&-inner{
		@include c.ca(90%,1000px);	
	}
	p{
		text-align: center;
		line-height: 1.8;

		//line-height: 2.8;
		letter-spacing: .2em;
		@include c.mq{
			text-align: center;
		}
		&:nth-of-type(1){
			//text-align: center;
			//margin-bottom: 2rem;
		}
		&:nth-of-type(2){
			//text-align: center;
			//line-height: 2.8;
			line-height: 1.8;
			//margin-top: .5em;
			@include c.mq{
				//text-align: justify;
			}
		}
	}
}*/
.top-sightseeing {
  width: 100%;
  padding: 8rem 0;
  display: flex;
  flex-wrap: wrap;
  color: #fff;
  position: relative;
  z-index: 0;
}
.top-sightseeing-inner {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.top-sightseeing::before {
  content: "";
  display: block;
  width: 60%;
  position: absolute;
  z-index: -2;
  height: 100%;
  top: 0;
  left: 0;
  background: #24334c;
}
@media screen and (max-width: 767px) {
  .top-sightseeing::before {
    width: 90%;
  }
}
.top-sightseeing::after {
  content: "";
  display: block;
  width: 17%;
  mix-blend-mode: multiply;
  position: absolute;
  z-index: -1;
  bottom: 0;
  left: -2%;
  background: url(../img/top/leaf_col.png) no-repeat left bottom/contain;
  aspect-ratio: 619/1020;
}
@media screen and (max-width: 767px) {
  .top-sightseeing::after {
    width: 50%;
  }
}
.top-sightseeing .top-sightseeing-lead {
  color: #fff;
  text-align: left;
  width: 40%;
  padding-left: 8%;
  flex-wrap: wrap;
  display: inline-flex;
  align-items: center;
  align-content: center;
}
@media screen and (max-width: 767px) {
  .top-sightseeing .top-sightseeing-lead {
    width: 80%;
    margin-bottom: 3rem;
  }
}
.top-sightseeing .top-sightseeing-lead h4, .top-sightseeing .top-sightseeing-lead p {
  color: #fff;
}
.top-sightseeing .top-sightseeing-lead h4 {
  text-align: left;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 30px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  margin-bottom: 1rem;
  font-family: "EB Garamond", serif;
  font-weight: 400;
}
@media screen and (max-width: 1099px) {
  .top-sightseeing .top-sightseeing-lead h4 {
    font-size: 2.7vw;
  }
}
@media screen and (max-width: 767px) {
  .top-sightseeing .top-sightseeing-lead h4 {
    font-size: 6.75vw;
  }
}
.top-sightseeing .top-sightseeing-lead p {
  margin-top: 0.5rem;
}
@media screen and (max-width: 767px) {
  .top-sightseeing .top-sightseeing-lead p {
    text-align: justify;
    margin-top: 0;
  }
}
.top-sightseeing .top-sightseeing-container {
  width: 55%;
}
@media screen and (max-width: 767px) {
  .top-sightseeing .top-sightseeing-container {
    width: 100%;
  }
}
.top-sightseeing .top-sightseeing-block-wrap {
  margin-left: auto;
}
.top-sightseeing .top-sightseeing-block-wrap .top-sightseeing-block-text {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .top-sightseeing .top-sightseeing-block-wrap .top-sightseeing-block-text {
    width: 100%;
  }
}
.top-sightseeing .top-sightseeing-block-wrap .top-sightseeing-block-text p {
  color: #333;
  font-size: 1.4rem;
}
.top-sightseeing .top-sightseeing-block-wrap .top-sightseeing-block-img {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .top-sightseeing .top-sightseeing-block-wrap .top-sightseeing-block-img {
    width: 100%;
  }
}
.top-sightseeing .top-sightseeing-block-wrap .top-sightseeing-block-img img {
  border-radius: 5px;
  aspect-ratio: 0.7;
  object-fit: cover;
  width: 100%;
}
.top-sightseeing .top-sightseeing-map {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 600px;
}
@media screen and (max-width: 767px) {
  .top-sightseeing .top-sightseeing-map {
    width: 100%;
  }
}
.top-sightseeing .more {
  display: flex;
  justify-content: center;
  text-align: right;
  width: 100%;
  margin-top: 5rem;
}
.top-sightseeing .more a {
  display: inline-flex;
  align-items: center;
  color: #fff;
  position: relative;
  padding: 0 0.5em 0.5em;
  font-size: 1.8rem;
  text-decoration: none;
}
.top-sightseeing .more a::before {
  content: "";
  display: block;
  height: 3px;
  width: 3px;
  border-left: 1px solid rgba(255, 255, 255, 0.5);
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  transform: rotate(-135deg);
  margin-right: 0.5em;
}
.top-sightseeing .more a::after {
  content: "";
  display: block;
  height: 1px;
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(255, 255, 255, 0.5);
}
.top-sightseeing .more a, .top-sightseeing .more a:link, .top-sightseeing .more a:visited {
  color: #fff;
}
.top-sightseeing .more a:hover, .top-sightseeing .more a:active {
  text-decoration: none;
  color: #fff;
}

.hotel-footer {
  width: 100%;
  padding: 5% 0;
  background: #372e27 !important;
}
.hotel-footer-inner {
  display: flex;
  justify-content: space-between;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}
@media screen and (max-width: 767px) {
  .hotel-footer-inner {
    flex-wrap: wrap;
    justify-content: center;
  }
}
.hotel-footer-inner > div:not(:first-of-type) {
  margin-left: 2rem;
}
@media screen and (max-width: 767px) {
  .hotel-footer-inner > div:not(:first-of-type) {
    margin-left: 0;
  }
}
.hotel-footer a {
  text-decoration: none;
}
.hotel-footer a, .hotel-footer a:link, .hotel-footer a:visited {
  color: #735F51;
}
.hotel-footer a:hover, .hotel-footer a:active {
  text-decoration: none;
  color: #735F51;
}

.hotel-footer-info .inner {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}
.hotel-footer-info h1 {
  width: 100%;
  margin: 0 auto 0;
  text-align: center;
}
.hotel-footer-info h1 img {
  max-width: 100px;
  width: 100%;
}
.hotel-footer-info h1 span {
  color: #fff;
  margin-top: 0.5em;
  white-space: nowrap;
  letter-spacing: 0;
  display: block;
}
.hotel-footer-info-content {
  width: 100%;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  letter-spacing: 0;
}
@media screen and (max-width: 1099px) {
  .hotel-footer-info-content {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .hotel-footer-info-content {
    font-size: 3.6vw;
  }
}
.hotel-footer-info-content-contact {
  width: 100%;
  color: #fff;
}
.hotel-footer-info-content-contact a {
  line-height: 1;
  text-decoration: none;
  text-decoration: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-end;
  font-size: 1.6rem;
}
.hotel-footer-info-content-contact a, .hotel-footer-info-content-contact a:link, .hotel-footer-info-content-contact a:visited {
  color: #fff;
}
.hotel-footer-info-content-contact a:hover, .hotel-footer-info-content-contact a:active {
  text-decoration: none;
  color: #fff;
}
.hotel-footer-info-content-contact a span {
  display: inline-block;
}
.hotel-footer-info-content-contact a span.hotel-info-content-contact-02 {
  font-size: 1.3em;
  margin: 0 0.1em 0 0.3em;
}
.hotel-footer-info-content-contact a span.hotel-info-content-contact-03 {
  font-size: 0.8em;
}
.hotel-footer-info-content-contact-address {
  width: 100%;
  text-align: center;
  margin-bottom: 0.5em;
}
.hotel-footer-info-content-contact-address p {
  width: 100%;
  text-align: center;
}
.hotel-footer-info-content-contact-sns {
  display: flex;
  justify-content: center;
  margin-top: 3rem;
}
.hotel-footer-info-content-contact-sns > a {
  margin: 0 10px;
  display: inline-block;
  width: 30px;
}

@media screen and (max-width: 767px) {
  .hotel-footer-nav {
    display: none;
  }
}
.hotel-footer-nav ul {
  list-style: none;
  margin-bottom: 0.5em;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0.5em 1em;
}
@media screen and (max-width: 767px) {
  .hotel-footer-nav ul li {
    width: 100%;
    margin-right: 0;
  }
}
.hotel-footer-nav ul li:last-of-type {
  margin-right: 0;
}
.hotel-footer-nav ul li.nav-to-portal {
  padding-left: 1em;
  border-left: 1px solid rgba(255, 255, 255, 0.3);
}
@media screen and (max-width: 767px) {
  .hotel-footer-nav ul li.nav-to-portal {
    padding-left: 0;
    margin-left: 0;
    border-left: none;
  }
}
.hotel-footer-nav ul li a {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}
@media screen and (max-width: 1099px) {
  .hotel-footer-nav ul li a {
    font-size: 1.26vw;
  }
}
@media screen and (max-width: 767px) {
  .hotel-footer-nav ul li a {
    font-size: 3.15vw;
  }
}
.hotel-footer-nav ul li a, .hotel-footer-nav ul li a:link, .hotel-footer-nav ul li a:visited {
  color: #fff;
}
.hotel-footer-nav ul li a:hover, .hotel-footer-nav ul li a:active {
  text-decoration: none;
  color: #fff;
}
.hotel-footer-nav ul li a:hover {
  opacity: 0.5;
}
.hotel-footer-nav ul li a span {
  padding-left: 1.5em;
  position: relative;
}
@media screen and (max-width: 767px) {
  .hotel-footer-nav ul li a {
    width: 100%;
    text-align: center;
  }
}
.hotel-footer-nav ul li.instagram a {
  display: inline-flex;
  align-items: center;
}
.hotel-footer-nav ul li.instagram img {
  width: 1.6em;
}
.hotel-footer-nav ul li:not(.instagram) a::before {
  content: "";
  display: block;
  height: 3px;
  width: 3px;
  border-left: 1px solid rgba(255, 255, 255, 0.5);
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  transform: rotate(-135deg);
  margin-right: 0.5em;
}
.hotel-footer-nav a {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  text-decoration: none;
}
.hotel-footer-nav a, .hotel-footer-nav a:link, .hotel-footer-nav a:visited {
  color: #735F51;
}
.hotel-footer-nav a:hover, .hotel-footer-nav a:active {
  text-decoration: none;
  color: #735F51;
}

.search-widget-search-container-bf1818 {
  font-family: Muli, Helvetica Neue, Arial, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0 auto;
  width: 100%;
  background: #eee !important;
  padding: 15px 25px 10px;
  box-shadow: none !important;
  border-radius: 4px;
  box-sizing: border-box;
  color: #141617;
  display: inline-flex;
  justify-content: center;
  align-items: flex-end;
}
@media screen and (max-width: 767px) {
  .search-widget-search-container-bf1818 {
    display: block;
  }
}

.top-retreat {
  background: url(../img/cmn/bg-ptn.jpg) repeat center center;
  padding: 10rem 0 10rem;
  position: relative;
  z-index: 0;
  overflow: hidden;
}
.top-retreat::before, .top-retreat::after {
  content: "";
  display: block;
  width: 32%;
  aspect-ratio: 212/200;
  position: absolute;
  top: 50%;
  mix-blend-mode: darken;
  z-index: 0;
  opacity: 0.7;
}
@media screen and (max-width: 767px) {
  .top-retreat::before, .top-retreat::after {
    width: 50%;
    top: 26%;
  }
}
.top-retreat::before {
  left: -8%;
  background: url(../img/top/leaf_01.png) no-repeat center center/contain;
}
@media screen and (max-width: 767px) {
  .top-retreat::before {
    left: -22%;
  }
}
.top-retreat::after {
  right: -8%;
  background: url(../img/top/leaf_02.png) no-repeat center center/contain;
}
@media screen and (max-width: 767px) {
  .top-retreat::after {
    right: -22%;
  }
}
@media screen and (max-width: 767px) {
  .top-retreat {
    padding: 5rem 0 5rem;
  }
}
.top-retreat-img {
  width: 100%;
}
.top-retreat-img-block {
  width: 100%;
  text-align: center;
  justify-content: center;
  display: flex;
  margin-bottom: 10rem;
}
@media screen and (max-width: 767px) {
  .top-retreat-img-block {
    margin-bottom: 6rem;
  }
}
.top-retreat-img-block figure {
  width: 15%;
  margin: 0 1%;
}
@media screen and (max-width: 767px) {
  .top-retreat-img-block figure {
    width: 20%;
  }
}
.top-retreat-img-block figure:nth-of-type(odd) {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0s;
  transform: translate(0, 1em);
}
.is-anm .top-retreat-img-block figure:nth-of-type(odd), .top-retreat-img-block figure:nth-of-type(odd).is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.top-retreat-img-block figure:nth-of-type(even) {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0s;
  transform: translate(0, -1em);
}
.is-anm .top-retreat-img-block figure:nth-of-type(even), .top-retreat-img-block figure:nth-of-type(even).is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.top-retreat-img-block figure:nth-of-type(1) {
  transition-delay: calc(300ms + (150ms * 1));
}
.top-retreat-img-block figure:nth-of-type(2) {
  transition-delay: calc(300ms + (150ms * 2));
}
.top-retreat-img-block figure:nth-of-type(3) {
  transition-delay: calc(300ms + (150ms * 3));
}
.top-retreat-img-block figure:nth-of-type(4) {
  transition-delay: calc(300ms + (150ms * 4));
}
.top-retreat-img-block figure:nth-of-type(5) {
  transition-delay: calc(300ms + (150ms * 5));
}
.top-retreat-img-block figure:nth-of-type(6) {
  transition-delay: calc(300ms + (150ms * 6));
}
.top-retreat-img-block figure:nth-of-type(7) {
  transition-delay: calc(300ms + (150ms * 7));
}
.top-retreat-img-block figure:nth-of-type(8) {
  transition-delay: calc(300ms + (150ms * 8));
}
.top-retreat-img-block figure:nth-of-type(9) {
  transition-delay: calc(300ms + (150ms * 9));
}
.top-retreat-img-block figure:nth-of-type(10) {
  transition-delay: calc(300ms + (150ms * 10));
}
.top-retreat-img-block figure:nth-of-type(11) {
  transition-delay: calc(300ms + (150ms * 11));
}
.top-retreat-img-block figure:nth-of-type(12) {
  transition-delay: calc(300ms + (150ms * 12));
}
.top-retreat-img-block figure:nth-of-type(13) {
  transition-delay: calc(300ms + (150ms * 13));
}
.top-retreat-img-block figure:nth-of-type(14) {
  transition-delay: calc(300ms + (150ms * 14));
}
.top-retreat-img-block figure:nth-of-type(15) {
  transition-delay: calc(300ms + (150ms * 15));
}
.top-retreat-img-block figure:nth-of-type(2) {
  padding-top: 2%;
}
.top-retreat-img-block figure:nth-of-type(4) {
  padding-top: 3%;
}
.top-retreat-img-block img {
  width: 100%;
  aspect-ratio: 0.5;
  object-fit: cover;
}
.top-retreat-text {
  width: 86%;
  margin: 0 auto;
}
.top-retreat-text .top-retreat-title {
  color: #24334c;
  text-align: center;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 36px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  letter-spacing: 0.5em;
  margin-bottom: 2rem;
  font-family: "EB Garamond", serif;
  font-weight: 400;
}
@media screen and (max-width: 1099px) {
  .top-retreat-text .top-retreat-title {
    font-size: 3.24vw;
  }
}
@media screen and (max-width: 767px) {
  .top-retreat-text .top-retreat-title {
    font-size: 8.1vw;
  }
}
.top-retreat-text .lead-main {
  text-align: center;
  margin-bottom: 2rem;
  font-size: 2rem;
  color: #735F51;
  font-weight: normal;
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  .top-retreat-text .lead-main {
    font-size: 2rem;
  }
}
.top-retreat-text .lead-text {
  text-align: center;
  line-height: 2;
}
@media screen and (max-width: 767px) {
  .top-retreat-text .lead-text {
    text-align: justify;
  }
}

.swiper {
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.5s;
}
.swiper.swiper-initialized {
  visibility: visible;
  opacity: 1;
}

.groups {
  background: #e0e0e0;
}
.groups .title h3 {
  color: #003f87;
  margin-bottom: 1.7em;
}

/*
.contents-bnr{
	&-inner{
	}

	a{
		text-decoration: none;
		//display: inline-block;
		transition: opacity .5s;
		display: flex;
		@include c.mq(){
		}
		&:hover{
			opacity: .7;
		}
		.contents-bnr-img{
			width: 70%;
			position: relative;
			@include c.mq(){
			}
		}
		.contents-bnr-text{
			width: 30%;
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			align-content: center;
			align-items: center;
			@include c.mq(){
			}

		}
	}
	&:nth-of-type(even){
		a{
			.contents-bnr-text{
				order: -1;
				@include c.mq(){
				}
			}
		}
	}
	&:nth-of-type(odd){
		a{
			.contents-bnr-text{
				@include c.mq(){
				}
			}
		}
	}
	&-img{
		figure{
			img{
				width: 100%;
				object-fit: cover;
				aspect-ratio:2;
				@include c.mq(){
					aspect-ratio:1.4;	
				}
			}
		}
	}
	&-lead{
		width: 100%;
		h4{
			width: 100%;
			text-align: center;
			color: #fff;
			margin-bottom: 1rem;
			 @include c.baseText(50);
			 letter-spacing: .1em;
			 @include c.fontEn();
			 small{
				 font-size: .7em;
			 }

		}
		p{
			text-align: center;
			color: c.$color-black;
			@include c.baseText(16);
		}

	}
	.more{
		text-align: center;
		color: #fff;
		@include c.fontEn();
		margin-top: 3rem;
		letter-spacing: .3em;
		@include c.baseText(14);
		@include c.mq(){
			@include c.baseText(10);
		}
		span{
			position: relative;
			display: inline-block;
			padding: 0 .5em .5em;	
			&::before{
				content: '';
				display: block;
				position: absolute;
				left: 0;
				bottom: 0;
				background: rgba(#fff,.3);
				width: 0;
				height: 1px;
				transition: all .5s;
			}
		}


	}
	&:hover{
		.more{
			span{
				&::before{
					width: 100%;
				}
			}	
		}
	}

}
*/
/*
.top-rooms{
	.contents-bnr{
		&:nth-of-type(odd){
			.contents-bnr-img{
				@include c.fadeIn($trx:-30px,$try:0,$delay:.5s);
			}
		}
		&:nth-of-type(even){
			.contents-bnr-img{
				@include c.fadeIn($trx:30px,$try:0,$delay:.5s);
			}
		}
	}
	.contents-bnr-inner{
		overflow: hidden;
	}
	.contents-bnr-img{
		//position: relative;
	}
	.contents-bnr-inner{
		.more{
			margin-top: 0;
		}
	}
	.contents-bnr-lead{
		position: relative;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		h4{
			@include c.baseText(40);
			width: auto;
			@include c.mq(){
				width: 100%;
				@include c.baseText(30);
			}
		}
		.pet-icon{
			margin-left: .5em;
		}
	}
}*/
.pet-icon {
  position: absolute;
  display: inline-flex;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  justify-content: center;
  border-radius: 20rem;
  padding: 0.1em;
  background: #404c4f;
  z-index: 3;
  left: 2%;
  top: 2%;
  width: 7rem;
  height: 7rem;
  aspect-ratio: 1;
}
@media screen and (max-width: 767px) {
  .pet-icon {
    transform: scale(0.7) !important;
  }
}
.pet-icon img {
  width: 2rem !important;
  aspect-ratio: auto !important;
}
@media screen and (max-width: 767px) {
  .pet-icon img {
    width: 2rem;
  }
}
.pet-icon span {
  margin-top: 0.5em;
  width: 100%;
  font-size: 1rem;
  display: block;
  text-align: center;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .pet-icon span {
    font-size: 1rem;
  }
}

.plan {
  padding: 8rem 0;
  margin: 8rem 0;
}
.plan-inner {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}
.plan h4 {
  text-align: center;
  color: #24334c;
  margin-bottom: 1rem;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  letter-spacing: 0.1em;
  font-family: "EB Garamond", serif;
  font-weight: 400;
}
@media screen and (max-width: 1099px) {
  .plan h4 {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .plan h4 {
    font-size: 4.5vw;
  }
}
.plan .plan-list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 4rem;
  /*display: flex;
  flex-wrap: wrap;
  */
}
@media screen and (max-width: 767px) {
  .plan .plan-list {
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }
}
.plan .plan-block {
  /*width: calc( ( 100% - 20px ) / 3 );
  @include c.mq(){
  	width: calc( ( 100% - 10px ) / 2 );
  }
  &:not(:nth-of-type(3n)){
  	margin-right: 10px;
  	@include c.mq(){
  		margin-right: 0;
  	}
  }
  &:nth-of-type(odd){
  	@include c.mq(){
  		margin-right: 10px;
  	}
  }
  */
}
.plan .plan-block a {
  display: inline-block;
  width: 100%;
  transition: opacity 0.5s;
  text-decoration: none;
  color: #735F51;
}
.plan .plan-block a:hover {
  opacity: 0.8;
}
.plan .plan-block a p {
  margin-top: 0.5em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  line-height: 1.3;
  letter-spacing: 0;
}
@media screen and (max-width: 1099px) {
  .plan .plan-block a p {
    font-size: 1.35vw;
  }
}
@media screen and (max-width: 767px) {
  .plan .plan-block a p {
    font-size: 3.375vw;
  }
}
@media screen and (max-width: 767px) {
  .plan .plan-block a p {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 1.8;
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .plan .plan-block a p {
    font-size: 1.08vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .plan .plan-block a p {
    font-size: 2.7vw;
  }
}
.plan .plan-block img {
  width: 100%;
}

.sightseeing-container {
  width: 96%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1300px;
  padding-top: 5rem;
}

.sightseeing-group:not(:last-of-type) {
  margin-bottom: 3rem;
}
.sightseeing-group > figure {
  margin-bottom: 3rem;
}
.sightseeing-group > figure img {
  aspect-ratio: 3;
  object-fit: cover;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .sightseeing-group > figure img {
    aspect-ratio: 1.2;
  }
}
.sightseeing-group .sightseeing-lead {
  margin-bottom: 8rem;
  text-align: center;
}
.sightseeing-group .sightseeing-lead h4 {
  margin-bottom: 1rem;
}
.sightseeing-group .sightseeing-block-wrap {
  display: flex;
  flex-wrap: wrap;
  padding: 5rem 0;
}
@media screen and (max-width: 767px) {
  .sightseeing-group .sightseeing-block-wrap {
    padding: 5rem 0;
  }
}
.sightseeing-group .sightseeing-block-wrap .sightseeing-block {
  width: calc((100% - 10rem) / 3);
  margin-bottom: 5rem;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  justify-content: space-between;
}
.sightseeing-group .sightseeing-block-wrap .sightseeing-block:not(:nth-of-type(3n)) {
  margin-right: 5rem;
}
@media screen and (max-width: 767px) {
  .sightseeing-group .sightseeing-block-wrap .sightseeing-block:not(:nth-of-type(3n)) {
    margin-right: 0;
  }
}
@media screen and (max-width: 767px) {
  .sightseeing-group .sightseeing-block-wrap .sightseeing-block {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .sightseeing-group .sightseeing-block-wrap .sightseeing-block-text {
    width: 100%;
  }
}
.sightseeing-group .sightseeing-block-wrap .sightseeing-block-text p:nth-of-type(1) {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
  font-weight: bold;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .sightseeing-group .sightseeing-block-wrap .sightseeing-block-img {
    width: 100%;
    order: -1;
    margin-bottom: 1rem;
  }
}
.sightseeing-group .sightseeing-block-wrap .sightseeing-block-img img {
  object-fit: cover;
  width: 100%;
  aspect-ratio: 1.6;
}
@media screen and (max-width: 767px) {
  .sightseeing-group .sightseeing-block-wrap .sightseeing-block-img img {
    aspect-ratio: 2;
  }
}

.sightseeing-map {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 700px;
  margin-bottom: 5rem;
  margin-top: 3rem;
}

.sightseeing-map {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0.8s;
  transform: translate(0, 0.5em);
}
.is-anm .sightseeing-map, .sightseeing-map.is-anm {
  opacity: 1;
  transform: translate(0, 0);
}

.sightseeing-group > figure {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0.8s;
  transform: translate(0, 0.5em);
}
.is-anm .sightseeing-group > figure, .sightseeing-group > figure.is-anm {
  opacity: 1;
  transform: translate(0, 0);
}

.sightseeing-lead h4 {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0.8s;
  transform: translate(0, 0.5em);
}
.is-anm .sightseeing-lead h4, .sightseeing-lead h4.is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.sightseeing-lead p {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0.8s;
  transform: translate(0, 0.5em);
}
.is-anm .sightseeing-lead p, .sightseeing-lead p.is-anm {
  opacity: 1;
  transform: translate(0, 0);
}

.sightseeing-block-text {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 0.8s;
  transform: translate(0, 0.5em);
}
.is-anm .sightseeing-block-text, .sightseeing-block-text.is-anm {
  opacity: 1;
  transform: translate(0, 0);
}
.sightseeing-block-img {
  opacity: 0;
  transition-property: all;
  transition-duration: 1s;
  transition-delay: 1s;
  transform: translate(0, 0.5em);
}
.is-anm .sightseeing-block-img, .sightseeing-block-img.is-anm {
  opacity: 1;
  transform: translate(0, 0);
}

.rooms-detail .lead-group {
  width: 100%;
  max-width: none;
  position: relative;
  z-index: 0;
  overflow: hidden;
}
.rooms-detail .lead-group::before {
  position: absolute;
  opacity: 0.5;
  display: block;
  z-index: -1;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(135deg, #fff 0%, #fff 40%, #90ccdd 100%);
  mix-blend-mode: multiply;
}
.rooms-detail .lead-group .lead-en {
  color: #24334c;
  font-size: 2.2rem;
  display: inline-block;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.3em;
  margin-bottom: 4rem;
  color: #57bad8;
  width: 100%;
  text-align: center;
  width: 100%;
}

.car-pdf {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 5rem;
}
.car-pdf a {
  display: inline-block;
  border: 1px solid #24334c;
  color: #24334c;
  text-align: center;
  padding: 0.5em 2em;
  margin: 0 0.5em 0.5em;
  text-decoration: none;
  transition: opacity 0.5s;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 1099px) {
  .car-pdf a {
    font-size: 1.62vw;
  }
}
@media screen and (max-width: 767px) {
  .car-pdf a {
    font-size: 4.05vw;
  }
}
.car-pdf a:hover {
  opacity: 0.5;
}
@media screen and (max-width: 767px) {
  .car-pdf a {
    width: 100%;
  }
}

.slideF .swiper-slide {
  width: 34vw !important;
}
@media screen and (max-width: 767px) {
  .slideF .swiper-slide {
    width: 60vw !important;
  }
}
.slideF .swiper-wrapper {
  transition-timing-function: linear;
}

.contentsBnr {
  width: 96%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
}
.contentsBnr .contentsBnr-wrapper {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(2, 1fr);
  grid-column-gap: 5px;
  grid-row-gap: 5px;
}
.contentsBnr .contentsBnr-wrapper > div {
  position: relative;
  overflow: hidden;
  z-index: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  align-content: center;
}
.contentsBnr .contentsBnr-wrapper > div:nth-of-type(1) {
  grid-area: 1/1/3/3;
}
.contentsBnr .contentsBnr-wrapper > div:nth-of-type(2) {
  grid-area: 1/3/2/5;
}
.contentsBnr .contentsBnr-wrapper > div:nth-of-type(3) {
  grid-area: 2/3/3/4;
}
.contentsBnr .contentsBnr-wrapper > div:nth-of-type(4) {
  grid-area: 2/4/3/5;
}
.contentsBnr .bg {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
}
.contentsBnr .c {
  padding: 2em 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  align-content: center;
}
.contentsBnr .c .contentsBnr-text p {
  color: #fff;
}

.imgBlockCol3 {
  display: flex;
  justify-content: space-between;
}
.imgBlockCol3-block {
  width: 32%;
}
.imgBlockCol3-block img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 1.3;
}
@media screen and (max-width: 767px) {
  .imgBlockCol3-block:nth-of-type(1) {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .imgBlockCol3-block:nth-of-type(2), .imgBlockCol3-block:nth-of-type(3) {
    width: 49%;
  }
}

.leadD {
  color: #dadada;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  font-size: 4vw;
  letter-spacing: 0.2em;
  position: absolute;
  line-height: 1 !important;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .leadD {
    font-size: 8vw;
  }
}
.leadD span {
  color: #d1d1d1;
}
.leadD::before {
  content: "";
  display: block;
  width: 0;
  transition: all 2s ease-out;
  position: absolute;
  bottom: -0.5rem;
  left: 50%;
  height: 1px;
  background: rgba(0, 0, 0, 0.15);
  transform: translateX(-50%);
}
.is-anm .leadD::before {
  width: 80%;
}

.sightseeing_map {
  width: 50%;
  margin: 0 auto 10%;
}
@media screen and (max-width: 767px) {
  .sightseeing_map {
    width: 90%;
  }
}

.commingsoon {
  bottom: -3em;
  width: 100%;
  text-align: center !important;
  margin-bottom: 5rem;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  color: #555;
}
@media screen and (max-width: 1099px) {
  .commingsoon {
    font-size: 2.16vw;
  }
}
@media screen and (max-width: 767px) {
  .commingsoon {
    font-size: 5.4vw;
  }
}
.commingsoon span {
  display: inline-block;
  opacity: 0;
  transform: translateY(0.5em);
}
.is-anm .commingsoon span {
  transition: all 0.8s;
  transform: translateY(0);
  opacity: 1;
}
.is-anm .commingsoon span:nth-of-type(1) {
  transition-delay: 0.87s;
}
.is-anm .commingsoon span:nth-of-type(2) {
  transition-delay: 0.94s;
}
.is-anm .commingsoon span:nth-of-type(3) {
  transition-delay: 1.01s;
}
.is-anm .commingsoon span:nth-of-type(4) {
  transition-delay: 1.08s;
}
.is-anm .commingsoon span:nth-of-type(5) {
  transition-delay: 1.15s;
}
.is-anm .commingsoon span:nth-of-type(6) {
  transition-delay: 1.22s;
}
.is-anm .commingsoon span:nth-of-type(7) {
  transition-delay: 1.29s;
}
.is-anm .commingsoon span:nth-of-type(8) {
  transition-delay: 1.36s;
}
.is-anm .commingsoon span:nth-of-type(9) {
  transition-delay: 1.43s;
}
.is-anm .commingsoon span:nth-of-type(10) {
  transition-delay: 1.5s;
}
.is-anm .commingsoon span:nth-of-type(11) {
  transition-delay: 1.57s;
}
.is-anm .commingsoon span:nth-of-type(12) {
  transition-delay: 1.64s;
}
.is-anm .commingsoon span:nth-of-type(13) {
  transition-delay: 1.71s;
}
.is-anm .commingsoon span:nth-of-type(14) {
  transition-delay: 1.78s;
}
.is-anm .commingsoon span:nth-of-type(15) {
  transition-delay: 1.85s;
}
.is-anm .commingsoon span:nth-of-type(16) {
  transition-delay: 1.92s;
}
.is-anm .commingsoon span:nth-of-type(17) {
  transition-delay: 1.99s;
}
.is-anm .commingsoon span:nth-of-type(18) {
  transition-delay: 2.06s;
}
.is-anm .commingsoon span:nth-of-type(19) {
  transition-delay: 2.13s;
}
.is-anm .commingsoon span:nth-of-type(20) {
  transition-delay: 2.2s;
}
.is-anm .commingsoon span:nth-of-type(21) {
  transition-delay: 2.27s;
}
.is-anm .commingsoon span:nth-of-type(22) {
  transition-delay: 2.34s;
}
.is-anm .commingsoon span:nth-of-type(23) {
  transition-delay: 2.41s;
}
.is-anm .commingsoon span:nth-of-type(24) {
  transition-delay: 2.48s;
}
.is-anm .commingsoon span:nth-of-type(25) {
  transition-delay: 2.55s;
}
.is-anm .commingsoon span:nth-of-type(26) {
  transition-delay: 2.62s;
}
.is-anm .commingsoon span:nth-of-type(27) {
  transition-delay: 2.69s;
}
.is-anm .commingsoon span:nth-of-type(28) {
  transition-delay: 2.76s;
}
.is-anm .commingsoon span:nth-of-type(29) {
  transition-delay: 2.83s;
}
.is-anm .commingsoon span:nth-of-type(30) {
  transition-delay: 2.9s;
}
.is-anm .commingsoon span:nth-of-type(31) {
  transition-delay: 2.97s;
}
.is-anm .commingsoon span:nth-of-type(32) {
  transition-delay: 3.04s;
}
.is-anm .commingsoon span:nth-of-type(33) {
  transition-delay: 3.11s;
}
.is-anm .commingsoon span:nth-of-type(34) {
  transition-delay: 3.18s;
}
.is-anm .commingsoon span:nth-of-type(35) {
  transition-delay: 3.25s;
}
.is-anm .commingsoon span:nth-of-type(36) {
  transition-delay: 3.32s;
}
.is-anm .commingsoon span:nth-of-type(37) {
  transition-delay: 3.39s;
}
.is-anm .commingsoon span:nth-of-type(38) {
  transition-delay: 3.46s;
}
.is-anm .commingsoon span:nth-of-type(39) {
  transition-delay: 3.53s;
}
.is-anm .commingsoon span:nth-of-type(40) {
  transition-delay: 3.6s;
}

.leadD_pre {
  color: #555;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 28px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  letter-spacing: 0.2em;
  line-height: 1 !important;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  text-align: center;
}
@media screen and (max-width: 1099px) {
  .leadD_pre {
    font-size: 2.52vw;
  }
}
@media screen and (max-width: 767px) {
  .leadD_pre {
    font-size: 6.3vw;
  }
}
@media screen and (max-width: 767px) {
  .leadD_pre {
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-size: 22px;
    line-height: 1.8;
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1099px) {
  .leadD_pre {
    font-size: 1.98vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .leadD_pre {
    font-size: 4.95vw;
  }
}
.leadD_pre::before {
  display: block;
  width: 0;
  transition: all 2s ease-out;
  position: absolute;
  bottom: -0.5rem;
  left: 50%;
  height: 1px;
  background: rgba(0, 0, 0, 0.15);
  transform: translateX(-50%);
}
.is-anm .leadD_pre::before {
  width: 80%;
}

.preopen-bnr {
  display: block;
  text-align: center;
}
.preopen-bnr a {
  display: inline-block;
  text-decoration: none;
  width: 90%;
  background: #fff;
  max-width: 800px;
  transition: all 0.5s;
}
.preopen-bnr a p {
  text-align: center;
  background: #d2d2d2;
  line-height: 1.1;
  transition: all 0.5s;
}
.preopen-bnr a p span {
  display: inline-block;
}
.preopen-bnr a p:nth-of-type(1) {
  color: #003f87;
  padding: 1.5rem 0;
}
.preopen-bnr a p:nth-of-type(1) span:nth-of-type(1) {
  font-family: "EB Garamond", serif;
  font-weight: 400;
  font-size: 2.8rem;
  margin-bottom: 0.1rem;
}
.preopen-bnr a p:nth-of-type(1) span:nth-of-type(2) {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 1.4rem;
}
.preopen-bnr a p:nth-of-type(2) {
  color: #003f87;
  background: #f3f3f3;
  line-height: 2;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 1.4rem;
}
.preopen-bnr a:hover p:nth-of-type(1) {
  color: #fff;
  background: #003f87;
}
.preopen-bnr a:hover p:nth-of-type(2) {
  background: rgba(0, 63, 135, 0.2);
}

.news-list a {
  text-decoration: none;
  text-decoration: underline;
}
.news-list a, .news-list a:link, .news-list a:visited {
  color: #735F51;
}
.news-list a:hover, .news-list a:active {
  text-decoration: none;
  color: #735F51;
}

.checkin-info-wrap {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.checkin-info-wrap > div {
  width: 48%;
}
@media screen and (max-width: 767px) {
  .checkin-info-wrap > div {
    width: 100%;
  }
}

.checkin-info {
  background: #f0f0f0;
  color: #735F51;
}
.checkin-info:nth-of-type(1) .access-checkin .checkin-img {
  width: 80%;
  margin-top: 1rem;
}
.checkin-info:nth-of-type(1) .access-checkin .checkin-img img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 2.5;
}
.checkin-info:nth-of-type(2) .access-checkin .checkin-img {
  width: 80%;
  margin-top: 1rem;
}
.checkin-info:nth-of-type(2) .access-checkin .checkin-img img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 1.4;
}

.access-checkin {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  max-width: 600px;
  font-size: 1.4rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 1.5rem 1.5rem 1.5rem 1.5rem;
}
.access-checkin > * {
  width: 100%;
}
.access-checkin p.access-checkin-title {
  font-size: 1.5em;
  margin-bottom: 0.5em;
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 1.5em 0 0.8em;
}
.access-checkin p.access-checkin-title span {
  display: block;
  text-align: center;
  width: 100%;
}
.access-checkin p.access-checkin-title::before {
  display: block;
  width: 1px;
  height: 5rem;
  background: rgba(0, 0, 0, 0.15);
}
.access-checkin p {
  margin-bottom: 0.5rem;
}
.access-checkin p:not(.access-checkin-title) {
  line-height: 1.5;
  letter-spacing: 0;
}
.access-checkin p:not(.access-checkin-title) small {
  font-size: 0.8em;
  line-height: 1.3;
  display: inline-block;
}
.access-checkin .access-checkin-place-title {
  font-size: 1.2em;
  margin-top: 1em;
}
.access-checkin .access-checkin-place-tel b {
  margin-left: 0.5em;
  font-size: 1.1em;
  font-weight: normal;
}
.access-checkin .nowrap {
  display: inline-block;
}
.access-checkin .t-center {
  text-align: center;
}
.access-checkin dl {
  display: flex;
  flex-wrap: wrap;
  margin-top: 1rem;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  padding-top: 1rem;
  width: 80%;
}
@media screen and (max-width: 767px) {
  .access-checkin dl {
    width: 90%;
  }
}
.access-checkin dl dt, .access-checkin dl dd {
  text-align: left;
  margin-bottom: 0.8em;
  line-height: 1.3;
}
.access-checkin dl dt small, .access-checkin dl dd small {
  font-size: 0.8em;
  display: inline-block;
}
.access-checkin dl dt span, .access-checkin dl dd span {
  display: inline-block;
}
.access-checkin dl dt {
  flex-basis: 8em;
}
.access-checkin dl dd {
  flex-basis: calc(100% - 8em);
  font-size: 1.2em;
}
.home .access-checkin {
  margin-top: 5rem;
  padding: 2rem 0;
  background: #fff;
  width: 85%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
}

.access-map-contents-wrap.border-top {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  padding-top: 5em;
  margin-top: 4em;
}
.access-map-contents-wrap h3 {
  text-align: center;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 28px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  line-height: 1.5;
  margin-bottom: 1em;
}
@media screen and (max-width: 1099px) {
  .access-map-contents-wrap h3 {
    font-size: 2.52vw;
  }
}
@media screen and (max-width: 767px) {
  .access-map-contents-wrap h3 {
    font-size: 6.3vw;
  }
}
.access-map-contents {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
}
.access-map-contents.center {
  justify-content: center;
}
.access-map-block {
  width: 48%;
  /*display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  align-items: flex-start;*/
  margin-bottom: 5%;
}
.access-map-block.w100 {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .access-map-block {
    width: 100%;
  }
}
.access-map-block--text {
  width: 100%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  align-content: center;
  margin-top: 1.5rem;
}
@media screen and (max-width: 767px) {
  .access-map-block--text {
    width: 100%;
  }
}
.access-map-block--text h4 {
  width: 100%;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-align: center;
  line-height: 1.5;
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 1099px) {
  .access-map-block--text h4 {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .access-map-block--text h4 {
    font-size: 4.5vw;
  }
}
.access-map-block--text h4::before {
  content: "【";
}
.access-map-block--text h4::after {
  content: "】";
}
.access-map-block--text .access-route ul {
  list-style: none;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  letter-spacing: 0;
  padding-left: 1em;
  padding-top: 0.5em;
}
@media screen and (max-width: 1099px) {
  .access-map-block--text .access-route ul {
    font-size: 1.44vw;
  }
}
@media screen and (max-width: 767px) {
  .access-map-block--text .access-route ul {
    font-size: 3.6vw;
  }
}
.access-map-block--text .access-route ul li {
  font-size: 1.4rem;
  text-indent: -1em;
  line-height: 1.5em;
  margin-bottom: 0.7em;
}
.access-map-block--text .access-route ul li::before {
  content: "・";
}
.access-map-block--map {
  width: 100%;
}
.access-map-block--map iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 2;
}
.fixed-bnr {
  transition: all 0.5s;
  /*body.scrolled &{
  	opacity: 1;
  	pointer-events: all;
  	transition-delay: .6s;
  }*/
}

.fixed-bnr {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  width: 70%;
  max-width: 400px;
  z-index: 10;
}
@media screen and (max-width: 767px) {
  .fixed-bnr {
    width: 60%;
  }
}
.fixed-bnr .close {
  position: absolute;
  right: -0.5rem;
  top: -1rem;
  width: 6%;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  .fixed-bnr {
    bottom: 10rem;
  }
}
.fixed-bnr img {
  height: auto;
}

.pet-i {
  display: inline-flex;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  justify-content: center;
  border-radius: 20rem;
  position: absolute;
  padding: 0.1em;
  background: #404c4f;
  z-index: 3;
  left: 2%;
  top: 2%;
  width: 10rem;
  aspect-ratio: 1;
}
@media screen and (max-width: 767px) {
  .pet-i {
    width: 8rem;
    top: -8.5rem;
    left: 0;
  }
}
.pet-i img {
  width: 3.5rem;
}
@media screen and (max-width: 767px) {
  .pet-i img {
    width: 2.5rem;
  }
}
.pet-i span {
  margin-top: 0.5em;
  width: 100%;
  font-size: 1.2rem;
  display: block;
  text-align: center;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .pet-i span {
    font-size: 1rem;
  }
}

.bnr-list {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}
.bnr-list > a {
  display: block;
  width: 32%;
  transition: opacity 0.5s;
}
.bnr-list > a:not(:last-of-type) {
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .bnr-list > a {
    width: 100%;
  }
}
.bnr-list > a:hover {
  opacity: 0.5;
}

.bbq-rental {
  margin-bottom: 5rem;
  width: 100%;
}
.bbq-rental-title h4 {
  margin-bottom: 0.5em;
  padding: 0.2em;
  font-size: 1.4em;
  border-bottom: 1px solid rgba(115, 95, 81, 0.6);
  display: flex;
  align-items: center;
  font-weight: normal;
  gap: 0.5em;
}
.bbq-rental-title h4::before {
  content: "";
  display: block;
  width: 0.5em;
  height: 0.5em;
  background: #735F51;
  border-radius: 50%;
}
.bbq-rental-title p.price {
  font-size: 1.3em;
}
.bbq-rental-title p.price .tax {
  font-size: 0.8em;
}
.bbq-rental ul.menu-set {
  font-size: 1.1em;
  margin-top: 1rem;
  list-style: none;
  column-count: 3;
  line-height: 1.2;
  padding: 1em;
  background: rgba(115, 95, 81, 0.1);
}
@media screen and (max-width: 767px) {
  .bbq-rental ul.menu-set {
    column-count: 2;
  }
}
.bbq-rental ul.menu-set li {
  margin-bottom: 0.5em;
}
.bbq-rental ul.menu-set li::before {
  content: "・";
}

.more {
  text-align: center;
}
.more a {
  display: inline-block;
  text-decoration: none;
  position: relative;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.05em;
  padding-bottom: 0.3em 1em;
}
.more a, .more a:link, .more a:visited {
  color: #333;
}
.more a:hover, .more a:active {
  text-decoration: none;
  color: #333;
}
@media screen and (max-width: 1099px) {
  .more a {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .more a {
    font-size: 4.5vw;
  }
}
.more a::before {
  content: "";
  display: block;
  width: 0;
  opacity: 0;
  transition: all 0.5s;
  position: absolute;
  left: 0;
  bottom: 0;
  height: 1px;
  background: black;
}
.more a::after {
  content: "";
  display: block;
  width: 100%;
  transition: all 0.5s;
  position: absolute;
  left: 0;
  bottom: 0;
  height: 1px;
  background: rgba(0, 0, 0, 0.2);
}
.more a:hover::before {
  opacity: 1;
  width: 50%;
}

.groupHotels .areaBnr {
  background: #fff !important;
  color: #735F51 !important;
  padding-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .groupHotels .areaBnr {
    padding-bottom: 10rem;
  }
}
.groupHotels .areaBnr a {
  color: #735F51 !important;
}
/*# sourceMappingURL=style.css.map */