@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@500&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap");
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 62.5%;
  overflow-x: hidden;
  position: relative;
}

body {
  background: #f1efee;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  overflow-x: hidden;
}

body {
  font-size: 1.4rem;
  color: #72655b;
  letter-spacing: 0.05em;
  overflow-x: hidden;
}
@media (min-width: 751px) {
  body {
    font-size: 1.6rem;
  }
}

a {
  transition: 0.3s;
}
a:hover {
  opacity: 0.7;
}

b {
  font-weight: 700;
}

.holidays {
  font-weight: 400;
  margin-bottom: 12px;
}

.main-container {
  background: #FFF;
  width: 100%;
  margin-top: 92vw;
  position: relative;
  padding-top: 100px;
}
@media (min-width: 751px) {
  .main-container {
    margin-top: 50vw;
  }
}
@media (min-width: 1401px) {
  .main-container {
    margin-top: 700px;
  }
}

.top-page .main-container {
  opacity: 0;
}

.mv-logo-container {
  margin: 0;
  top: 87vw;
  left: 0;
  width: 100%;
  position: absolute;
  z-index: 200;
}
@media (min-width: 751px) {
  .mv-logo-container {
    top: 46vw;
  }
}
@media (min-width: 751px) and (min-width: 1401px) {
  .mv-logo-container {
    top: 644px;
  }
}

.mv-logo-container .mv-logo {
  width: 195px;
  position: absolute;
  left: 50%;
  top: -26px;
  transform: translateX(-50%);
  opacity: 0;
}
@media (min-width: 751px) {
  .mv-logo-container .mv-logo {
    width: 312px;
    top: -44px;
  }
}
.mv-logo-container .logo-circle {
  position: absolute;
  width: 74px;
  height: 74px;
  background: #FFF;
  border-radius: 50%;
  left: 50%;
  top: -37px;
  transform: translateX(-50%);
  opacity: 0;
}
@media (min-width: 751px) {
  .mv-logo-container .logo-circle {
    width: 116px;
    height: 116px;
    top: -58px;
  }
}

.slick {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  opacity: 0;
}

.slick-item {
  background: #FFF;
  width: 100%;
}

.mv-img-container {
  text-align: center;
  width: 100%;
  max-width: 1400px;
  position: relative;
  margin: 0 auto;
}

.mv-img {
  width: 100%;
}

.mv-text {
  position: absolute;
  left: 20vw;
  top: 15vw;
  font-weight: 500;
  color: #72655b;
  font-size: 4vw;
  line-height: 2;
  text-indent: -2em;
  font-family: 'Noto Serif JP', serif;
  display: inline-block;
  width: 100%;
  text-align: left;
  opacity: 0;
}
@media (min-width: 751px) {
  .mv-text {
    font-size: 2.3rem;
  }
}

.mv-text.white {
  color: #FFF;
}

#mv-wave-container {
  position: absolute;
  width: 100%;
  left: 0;
  top: 92vw;
}
@media (min-width: 751px) {
  #mv-wave-container {
    top: 45vw;
  }
}
@media (min-width: 751px) and (min-width: 1401px) {
  #mv-wave-container {
    top: 630px;
  }
}

.top-page #mv-wave-container {
  opacity: 0;
}

.mv-wave {
  position: absolute;
  width: 100%;
  left: 0;
  top: 1px;
  transform: translateY(-100%);
}
@media (min-width: 751px) {
  .mv-wave {
    transform: translateY(-37.5%);
  }
}

.mv-wave-bottom {
  position: absolute;
  width: 100%;
  height: 100vh;
  background: #FFF;
  top: 0;
  left: 0;
}
@media (min-width: 751px) {
  .mv-wave-bottom {
    top: 4vw;
  }
}

.welcome-message {
  text-align: center;
  color: #72655b;
  font-size: 1.3rem;
  line-height: 2.4rem;
  opacity: 0;
  background-image: url("../img/flowers.png"), url("../img/leaf_1.png");
  background-size: 39px, 26px;
  background-position: left 10px top, right 10px bottom;
  background-repeat: no-repeat, no-repeat;
  margin-bottom: 50px;
  margin: 0 auto 50px;
  padding: 0 20px;
  max-width: 375px;
}
@media (min-width: 751px) {
  .welcome-message {
    padding: 35px 0 15px;
    font-size: 1.8rem;
    line-height: 3.4rem;
    max-width: 720px;
    background-size: 62px, 41px;
    background-position: left top, right 20px bottom;
  }
}

h2 {
  font-size: 2rem;
  color: #72655b;
  line-height: 2.6rem;
  letter-spacing: 0.1em;
  margin-bottom: 18px;
}
@media (min-width: 751px) {
  h2 {
    font-size: 2.4rem;
    margin-bottom: 30px;
  }
}
h2 .heading-english {
  font-size: 1.2rem;
  color: #aa9d93;
  font-weight: 400;
  line-height: 2.6rem;
  display: inline-block;
  margin-left: 6px;
}
@media (min-width: 751px) {
  h2 .heading-english {
    font-size: 1.4rem;
  }
}
h2 img {
  margin-right: 12px;
}
@media (min-width: 751px) {
  h2 img {
    width: 37px;
  }
}

.schedule {
  background: #FFF;
  padding: 0 20px 80px;
}
@media (min-width: 751px) {
  .schedule {
    max-width: 1040px;
    margin: 0 auto;
  }
}

@media (min-width: 751px) {
  .schedule-flex-container {
    padding: 0 40px;
    display: flex;
  }
}

@media (min-width: 751px) {
  .schedule-flex-left {
    flex: 0 1 50%;
  }
}

@media (min-width: 751px) {
  .schedule-flex-right {
    flex: 0 1 50%;
    padding-left: 30px;
  }
}

table {
  width: 100%;
  border: solid 2px #72655b;
  border-radius: 6px;
  border-collapse: separate;
  border-spacing: 0;
  text-align: center;
  margin-bottom: 12px;
}
@media (min-width: 751px) {
  table {
    border-radius: 12px;
  }
}
table th, table td {
  padding: 0 8px;
  height: 4.3rem;
  vertical-align: middle;
  border-bottom: solid 1px #72655b;
}
table tr:last-child td, table tr:last-child th {
  border-bottom: none;
}
table tr:first-child > :first-child {
  border-top-left-radius: 6px;
}
table tr:first-child > :last-child {
  border-top-right-radius: 6px;
}
table tr:last-child > :first-child {
  border-bottom-left-radius: 6px;
}
table tr:last-child > :last-child {
  border-bottom-right-radius: 6px;
}
@media (min-width: 751px) {
  table tr:first-child > :first-child {
    border-top-left-radius: 12px;
  }
  table tr:first-child > :last-child {
    border-top-right-radius: 12px;
  }
  table tr:last-child > :first-child {
    border-bottom-left-radius: 12px;
  }
  table tr:last-child > :last-child {
    border-bottom-right-radius: 12px;
  }
}

.schedule-table th, .schedule-table td {
  background: #FFF;
}
.schedule-table th:nth-child(even), .schedule-table td:nth-child(even) {
  background: #f1efee;
}

.notice-container {
  background: #f1efee;
  padding: 15px 15px;
  text-align: center;
  border-radius: 6px;
  margin-bottom: 15px;
}
@media (min-width: 751px) {
  .notice-container {
    border-radius: 12px;
  }
}
.notice-container .notice-area {
  background: #FFF;
  padding: 15px;
  line-height: 2.6rem;
  text-align: left;
  margin-top: 10px;
  border-radius: 6px;
  font-weight: 400;
}
@media (min-width: 751px) {
  .notice-container .notice-area {
    border-radius: 12px;
  }
}

.anchor-link-container {
  text-align: right;
}

.anchor-link {
  display: inline-block;
  line-height: 2.6rem;
  height: 2.6rem;
  text-decoration: none;
  color: #72655b;
  font-weight: 400;
  border-bottom: solid 0.5px #72655b;
  position: relative;
}
.anchor-link .anchor-link-img {
  position: absolute;
  left: -8px;
  top: 50%;
  transform: translate(-100%, -50%);
}
.anchor-link .arrow-right {
  width: 7px;
  margin-bottom: 3px;
  margin-left: 4px;
}

.wave-beige {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  transform: translateY(-98%);
}

.contact {
  background: #f1efee;
  padding: 20px 30px;
  position: relative;
  font-size: 1.7rem;
  text-align: center;
  background-image: url("../img/swirl-left.png"), url("../img/swirl-right.png");
  background-position: left top 8px, right top 80px;
  background-size: 109px, 89px;
  background-repeat: no-repeat, no-repeat;
  padding-bottom: 30px;
}
@media (min-width: 751px) {
  .contact {
    font-size: 2rem;
    background-size: 194px, 194px;
  }
}
.contact .about-phone-link {
  display: inline-block;
  color: #5ac3cc;
  text-decoration: none;
  border-bottom: 1px solid #5ac3cc;
  height: 33px;
  line-height: 33px;
  margin-top: 12px;
  margin-bottom: 20px;
  position: relative;
  margin-right: 20px;
}
@media (min-width: 751px) {
  .contact .about-phone-link {
    margin-top: 24px;
    margin-bottom: 30px;
  }
}
.contact .about-phone-link .popout-img {
  position: absolute;
  right: -8px;
  top: 56%;
  transform: translate(100%, -50%);
  width: 15px;
}

@media (min-width: 751px) {
  .contact-flex-container {
    display: flex;
    justify-content: center;
  }
  .contact-flex-container .web-reservation-button {
    margin-right: 30px;
  }
}

.big-button {
  display: inline-block;
  width: 100%;
  max-width: 350px;
  background: #5ac3cc;
  border-radius: 18px;
  color: #FFF;
  height: 6rem;
  line-height: 5.4rem;
  font-size: 2.4rem;
  text-decoration: none;
  letter-spacing: 0.1em;
  margin-bottom: 15px;
  -moz-box-shadow: inset 0 -6px 0 #4fabb3;
  -webkit-box-shadow: inset 0 -6px 0 #4fabb3;
  box-shadow: inset 0 -6px 0 #4fabb3;
}
@media (min-width: 751px) {
  .big-button {
    max-width: 400px;
    font-size: 3rem;
    height: 7.6rem;
    line-height: 6.8rem;
    -moz-box-shadow: inset 0 -8px 0 #4fabb3;
    -webkit-box-shadow: inset 0 -8px 0 #4fabb3;
    box-shadow: inset 0 -8px 0 #4fabb3;
  }
}
.big-button img {
  margin-right: 1.8rem;
  margin-bottom: 0.3rem;
}
@media (min-width: 751px) {
  .big-button img {
    width: 35px;
  }
}
.big-button:hover {
  height: 5.4rem;
  box-shadow: none;
  margin-top: 0.6rem;
  opacity: 1;
}
@media (min-width: 751px) {
  .big-button:hover {
    height: 6.8rem;
    margin-top: 0.8rem;
  }
}

.web-reservation-button {
  font-size: 2rem;
}
@media (min-width: 751px) {
  .web-reservation-button {
    font-size: 2.6rem;
  }
}

#scroller {
  background: #72655b;
}

.information {
  padding: 50px 20px;
}
@media (min-width: 751px) {
  .information {
    max-width: 1040px;
    margin: 0 auto;
  }
}

@media (min-width: 751px) {
  .information-inner {
    padding: 0 40px;
  }
}

.information-list {
  padding: 24px 8px 0;
  border-top: 2px dotted #aa9d93;
  border-bottom: 2px dotted #aa9d93;
  margin-bottom: 20px;
}
@media (min-width: 751px) {
  .information-list {
    padding: 40px 30px 0;
    border-top: 3px dotted #aa9d93;
    border-bottom: 3px dotted #aa9d93;
  }
}
.information-list li {
  list-style: none;
  margin-bottom: 24px;
}
@media (min-width: 751px) {
  .information-list li {
    display: flex;
  }
}
.information-list li .date {
  display: block;
  color: #f38b8b;
  font-weight: 400;
}
@media (min-width: 751px) {
  .information-list li .date {
    display: inline-block;
    flex: 0 1 15%;
  }
}
.information-list li .summary {
  line-height: 2.6rem;
}
@media (min-width: 751px) {
  .information-list li .summary {
    flex: 0 1 85%;
  }
}
.information-list li a {
  color: #72655b;
  text-decoration: none;
  border-bottom: 1px solid #72655b;
}

.menu {
  background: #FFF;
  padding: 0 20px;
  margin-bottom: 80px;
}
@media (min-width: 751px) {
  .menu {
    max-width: 1040px;
    margin: 0 auto 80px;
    padding: 0 0 0 20px;
  }
}

.buttons-container {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  max-width: 335px;
  margin: 0 auto;
}
@media (min-width: 751px) {
  .buttons-container {
    max-width: none;
  }
}

.menu-button {
  display: inline-block;
  background-color: #f38b8b;
  text-align: center;
  flex: 0 1 48%;
  color: #FFF;
  font-size: 1.7rem;
  letter-spacing: 0.1em;
  text-decoration: none;
  margin-bottom: 4%;
  padding: 25px 5px 25px;
  border-radius: 18px;
  -moz-box-shadow: inset 0 -6px 0 rgba(0, 0, 0, 0.12);
  -webkit-box-shadow: inset 0 -6px 0 rgba(0, 0, 0, 0.12);
  box-shadow: inset 0 -6px 0 rgba(0, 0, 0, 0.12);
  transition: all 300ms;
}
.menu-button:nth-child(odd) {
  margin-right: 4%;
}
@media (min-width: 751px) {
  .menu-button:nth-child(odd) {
    margin-right: 20px;
  }
}
@media (min-width: 751px) {
  .menu-button {
    flex: 0 1 182px;
    font-size: 2rem;
    margin-right: 20px;
    margin-bottom: 20px;
    -moz-box-shadow: inset 0 -8px 0 rgba(0, 0, 0, 0.12);
    -webkit-box-shadow: inset 0 -8px 0 rgba(0, 0, 0, 0.12);
    box-shadow: inset 0 -8px 0 rgba(0, 0, 0, 0.12);
  }
}
.menu-button .button-english {
  margin-top: 1px;
  display: block;
  opacity: 0.7;
  font-size: 1.2rem;
  font-weight: 400;
}
@media (min-width: 751px) {
  .menu-button .button-english {
    font-size: 1.4rem;
    margin-top: 3px;
  }
}
.menu-button:hover {
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  padding-bottom: 19px;
  margin-top: 6px;
  opacity: 1;
}
@media (min-width: 751px) {
  .menu-button:hover {
    margin-top: 8px;
    padding-bottom: 17px;
  }
}

.medical-info-button {
  background-image: url("../img/record.png");
  background-position: right 9px bottom -6px;
  background-size: 54px;
  background-repeat: no-repeat;
}
.medical-info-button:hover {
  background-position: right 9px bottom -13px;
}

.staff-button {
  background-image: url("../img/staff.png");
  background-position: right 9px bottom -10px;
  background-size: 74px;
  background-repeat: no-repeat;
}
.staff-button:hover {
  background-position: right 9px bottom -17px;
}

.facilities-button {
  background-image: url("../img/hospital.png");
  background-position: right 9px bottom -1px;
  background-size: 52px;
  background-repeat: no-repeat;
}
.facilities-button:hover {
  background-position: right 9px bottom -8px;
}

.access-button {
  background-image: url("../img/map.png");
  background-position: right 9px bottom -2px;
  background-size: 36px;
  background-repeat: no-repeat;
}
.access-button:hover {
  background-position: right 9px bottom -9px;
}

.blog-button {
  background-image: url("../img/blog.png");
  background-position: right 6px bottom 0px;
  background-size: 54px;
  background-repeat: no-repeat;
}
.blog-button:hover {
  background-position: right 9px bottom -7px;
}

.recruit-button {
  background-image: url("../img/recruit.png");
  background-position: right -2px bottom 0px;
  background-size: 54px;
  background-repeat: no-repeat;
}
.recruit-button:hover {
  background-position: right 9px bottom -7px;
}

.features {
  text-align: center;
  background-color: #f1efee;
  position: relative;
  padding-top: 15px;
  background-image: url("../img/swirl-left.png"), url("../img/swirl-right.png");
  background-position: left top 0px, right top 10px;
  background-size: 109px, 89px;
  background-repeat: no-repeat, no-repeat;
}
@media (min-width: 751px) {
  .features {
    background-size: 194px, 194px;
    background-position: left top 292px, right top 370px;
  }
  .features h2 {
    font-size: 2.8rem;
    letter-spacing: 0.08;
  }
}

.four {
  color: #5ac3cc;
  font-size: 4.3rem;
  font-style: italic;
}
@media (min-width: 751px) {
  .four {
    font-size: 6rem;
  }
}

.features-container {
  display: flex;
  flex-flow: row wrap;
  position: relative;
  text-align: center;
}
@media (min-width: 751px) {
  .features-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
    justify-content: space-between;
  }
}

.feature {
  background-size: cover;
  background-position: center;
  flex: 0 1 100%;
  padding: 30px 30px 20px;
  color: #FFF;
  font-size: 1.7rem;
  line-height: 2.4rem;
  margin-bottom: 2px;
}
@media (min-width: 751px) {
  .feature {
    flex: 0 1 49.5%;
    margin-bottom: 1%;
    height: 230px;
    font-size: 2rem;
    line-height: 3rem;
    padding: 50px 30px 20px;
  }
}
.feature h3 {
  margin-bottom: 5px;
}
.feature p {
  margin-bottom: 10px;
}

.feature1 {
  background-image: url("../img/feature1-bg.jpg");
}

.feature2 {
  background-image: url("../img/feature2-bg.jpg");
}

.feature3 {
  background-image: url("../img/feature3-bg.jpg");
}

.feature4 {
  background-image: url("../img/feature4-bg.jpg");
}
@media (min-width: 751px) {
  .feature4 {
    padding: 30px 30px 20px;
  }
  .feature4 .contact-button {
    height: 6rem;
    width: 100%;
    max-width: 330px;
    line-height: 5.2rem;
  }
  .feature4 .contact-button:hover {
    height: 5.2rem;
  }
}

.point-img {
  width: 84px;
}

.contact-button {
  font-size: 1.7rem;
  background: #f38b8b;
  -moz-box-shadow: inset 0 -6px 0 #d57a7a;
  -webkit-box-shadow: inset 0 -6px 0 #d57a7a;
  box-shadow: inset 0 -6px 0 #d57a7a;
  margin-bottom: 0;
}
@media (min-width: 751px) {
  .contact-button {
    -moz-box-shadow: inset 0 -8px 0 #d57a7a;
    -webkit-box-shadow: inset 0 -8px 0 #d57a7a;
    box-shadow: inset 0 -8px 0 #d57a7a;
  }
}

.other-point {
  text-align: center;
  padding: 30px 20px;
}
@media (min-width: 751px) {
  .other-point {
    padding: 60px 20px;
    background: #f1efee;
  }
}
.other-point h3 {
  text-transform: uppercase;
  font-size: 1.4rem;
  margin-bottom: 20px;
}
@media (min-width: 751px) {
  .other-point h3 {
    font-size: 2rem;
    margin-bottom: 40px;
  }
}

.other-points-container {
  display: flex;
  flex-flow: row wrap;
  max-width: 335px;
  margin: 0 auto;
  padding-left: 11px;
}
@media (min-width: 751px) {
  .other-points-container {
    max-width: 960px;
    margin: 0 auto;
    justify-content: space-between;
    padding-left: 15px;
  }
}
.other-points-container li {
  display: inline-block;
  flex: 0 1 46%;
  color: #72655b;
  font-size: 1.7rem;
  margin-bottom: 8%;
  padding-top: 15px;
  padding-right: 11px;
  padding-bottom: 26px;
  border-radius: 6px;
  text-align: center;
  background: #f1efee;
  position: relative;
  z-index: 100;
}
@media (min-width: 751px) {
  .other-points-container li {
    background: #FFF;
    flex: 0 1 22%;
    font-size: 2rem;
    margin-bottom: 0;
    padding-top: 18px;
    padding-bottom: 32px;
    padding-right: 15px;
  }
}
.other-points-container li:nth-child(odd) {
  margin-right: 8%;
}
@media (min-width: 751px) {
  .other-points-container li:nth-child(odd) {
    margin-right: 0;
  }
}
.other-points-container li:after {
  content: "";
  display: inline-block;
  position: absolute;
  left: -11px;
  top: -11px;
  height: 100%;
  width: 100%;
  border-radius: 6px;
  border: dotted 2px #aa9d93;
  z-index: 50;
  pointer-events: none;
}
@media (min-width: 751px) {
  .other-points-container li:after {
    border: dotted 3px #aa9d93;
    left: -15px;
    top: -15px;
  }
}
.other-points-container li img {
  display: block;
}

.holiday-img {
  width: 35px;
  margin: 4px auto;
}
@media (min-width: 751px) {
  .holiday-img {
    margin: 15px auto;
    width: 48px;
  }
}

.car-img {
  width: 46px;
  margin: 9px auto;
}
@media (min-width: 751px) {
  .car-img {
    margin: 21px auto;
    width: 66px;
  }
}

.stethoscope-img {
  width: 32px;
  margin: 4px auto;
}
@media (min-width: 751px) {
  .stethoscope-img {
    margin: 13px auto;
    width: 45px;
  }
}

.hotel-img {
  width: 49px;
  margin: 4px auto;
}
@media (min-width: 751px) {
  .hotel-img {
    margin: 14px auto;
    width: 68px;
  }
}

.calendar-section {
  padding: 0 20px 50px;
}
@media (min-width: 751px) {
  .calendar-section {
    max-width: 1040px;
    margin: 0 auto;
    padding: 80px 20px;
  }
}

.calendar-icon {
  width: 28px;
}
@media (min-width: 751px) {
  .calendar-icon {
    width: 39px;
  }
}

@media (min-width: 751px) {
  .calendar-inner {
    padding: 0 40px;
  }
}

.calendar {
  width: 100%;
  height: 500px;
  background-color: #aa9d93;
}
@media (min-width: 751px) {
  .calendar {
    height: 580px;
  }
}

.access {
  padding: 0 20px;
  margin-bottom: 50px;
}
@media (min-width: 751px) {
  .access {
    max-width: 1040px;
    margin: 0 auto;
  }
}

.access-icon {
  width: 20px;
}
@media (min-width: 751px) {
  .access-icon {
    width: 28px;
  }
}

@media (min-width: 751px) {
  .access-inner {
    padding: 0 40px;
  }
}
.access-inner dl {
  display: flex;
  flex-flow: row wrap;
  line-height: 2.2rem;
  border-top: dotted 2px #aa9d93;
  padding: 18px 0;
}
@media (min-width: 751px) {
  .access-inner dl {
    padding: 40px 30px 0;
    line-height: 2.8rem;
    border-top: dotted 3px #aa9d93;
  }
}
.access-inner dl dt {
  color: #f38b8b;
  display: inline-block;
  flex: 0 1 27%;
  margin-bottom: 1.5rem;
}
@media (min-width: 751px) {
  .access-inner dl dt {
    flex: 0 1 12%;
    margin-bottom: 2.2rem;
  }
}
.access-inner dl dd {
  font-weight: 400;
  display: inline-block;
  flex: 0 1 73%;
  margin-bottom: 1.5rem;
}
@media (min-width: 751px) {
  .access-inner dl dd {
    flex: 0 1 88%;
    margin-bottom: 2.2rem;
  }
}

.map-container {
  padding-bottom: 50px;
  border-bottom: dotted 2px #aa9d93;
}
@media (min-width: 751px) {
  .map-container {
    border-bottom: dotted 3px #aa9d93;
    padding-bottom: 40px;
  }
}

.map {
  width: 100%;
  height: 400px;
  background: gray;
}
@media (min-width: 751px) {
  .map {
    height: 400px;
  }
}

.social {
  padding: 0 20px;
  margin-bottom: 100px;
}
@media (min-width: 751px) {
  .social {
    max-width: 1040px;
    margin: 80px auto;
    padding: 0 100px;
    display: flex;
    justify-content: space-between;
  }
}

.facebook-container {
  width: 100%;
  height: 400px;
  background: gray;
  margin-bottom: 54px;
}
@media (min-width: 751px) {
  .facebook-container {
    width: auto;
    flex: 0 1 464px;
    margin-right: 30px;
    height: 484px;
  }
}

.banner-container {
  padding-top: 50px;
  border-top: dotted 2px #aa9d93;
  text-align: center;
  font-weight: 400;
}
@media (min-width: 751px) {
  .banner-container {
    border-top: none;
    flex: 0 1 40%;
    padding-top: 0;
  }
}
.banner-container p {
  margin-bottom: 20px;
}
@media (min-width: 751px) {
  .banner-container p {
    font-size: 1.4rem;
  }
}

.banner {
  display: block;
  margin: 0 auto 10px;
  border: solid 2px #c6bdb7;
  max-width: 100%;
}

a .banner:hover {
  opacity: 0.7;
  transition: all 0.3s;
}

.banner-320-100 {
  max-width: 320px;
  height: 100px;
  margin-bottom: 20px;
  width: 100%;
}

.banner234-60 {
  max-width: 234px;
  height: 60px;
  width: 100%;
}

footer {
  background: #f1efee;
  position: relative;
  padding: 20px 0 0;
}
footer section {
  padding: 20px 0;
  border-bottom: dotted 2px #aa9d93;
}
@media (min-width: 751px) {
  footer section {
    border-bottom: dotted 3px #aa9d93;
  }
  footer section:last-child {
    border-bottom: none;
  }
}
footer section h3 {
  font-weight: 500;
  font-size: 1.4rem;
  margin-bottom: 12px;
  text-align: center;
}
@media (min-width: 751px) {
  footer section h3 {
    font-size: 1.6rem;
  }
}
footer section p {
  line-height: 2.4rem;
  font-weight: 400;
}
footer section table {
  margin-top: 12px;
}
footer .contact {
  background: none;
  padding: 20px 10px 30px;
  border-bottom: none;
}
@media (min-width: 751px) {
  footer .contact {
    flex: 0 1 400px;
    padding: 20px 0;
    margin: 0 0 0 20px;
  }
}
footer .contact p {
  font-weight: 500;
  margin-bottom: 18px;
  margin-top: 15px;
}
@media (min-width: 751px) {
  footer .contact .contact-button {
    font-size: 2.4rem;
  }
}

@media (min-width: 751px) {
  .footer-logo-section {
    border-bottom: none;
  }
}

.footer-logo {
  width: 267px;
  display: block;
  margin: 0 auto;
}
@media (min-width: 751px) {
  .footer-logo {
    width: 430px;
  }
}

@media (min-width: 751px) {
  .footer-flex-container {
    display: flex;
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 40px 40px;
    justify-content: space-between;
  }
}

@media (min-width: 751px) {
  .footer-flex-left {
    flex: 0 1 466px;
  }
}

.copyright {
  background: #72655b;
  color: #FFF;
  font-size: 1rem;
  text-align: center;
  padding: 10px;
  border-bottom: none;
}

.footer-inner {
  padding: 0 20px;
}
@media (min-width: 751px) {
  .footer-inner {
    width: 100%;
    max-width: 1040px;
    margin: 0 auto;
    position: relative;
  }
}

.top-button {
  display: inline-block;
  position: absolute;
  right: -4px;
  top: -70px;
  width: 79px;
  height: 79px;
  border-radius: 100%;
  background-color: #f1efee;
  background-image: url("../img/arrow-top.png");
  background-repeat: no-repeat;
  background-size: 15px;
  background-position: center top 17px;
  text-align: center;
  color: #72655b;
  text-decoration: none;
  font-weight: 500;
  font-size: 1.4rem;
  line-height: 79px;
  padding-left: 3px;
  padding-top: 3px;
}
@media (min-width: 751px) {
  .top-button {
    background-size: 20px;
    background-position: center top 27px;
    right: 0;
    top: -130px;
    width: 110px;
    height: 110px;
    font-size: 2rem;
    line-height: 110px;
  }
}

#modal-window-container {
  background: rgba(114, 101, 91, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  overflow: scroll;
  padding: 20px 20px 30px;
  display: none;
  z-index: 1000;
}

.modal {
  background: #FFF;
  padding: 50px 20px;
  line-height: 2.6rem;
  font-weight: 400;
  position: relative;
  margin: 40px auto 0;
  max-width: 600px;
}
.modal h2 {
  font-size: 1.7rem;
  text-align: center;
  color: #5ac3cc;
  position: relative;
  padding-bottom: 10px;
}
.modal h2:after {
  content: "";
  display: inline-block;
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 225px;
  height: 3px;
  transform: translateX(-50%);
  background: #5ac3cc;
}
.modal p {
  margin-bottom: 2.6rem;
}
.modal strong {
  font-weight: 500;
  color: #5ac3cc;
}
.modal ul {
  margin-bottom: 2.6rem;
}
.modal ul li {
  position: relative;
  list-style: none;
  margin-left: 1em;
}
.modal .ul-stars li:before {
  content: '★';
  position: absolute;
  left: -1em;
  top: 0;
}
.modal .ul-dots li:before {
  content: '●';
  position: absolute;
  left: -1em;
  top: 0;
}

.close-button {
  position: absolute;
  right: 0;
  top: -40px;
  width: 25px;
  height: 25px;
  background-image: url("../img/close-button.png");
  background-repeat: no-repeat;
  background-size: contain;
}

.footnote {
  font-size: 1.2rem;
  line-height: 2rem;
  margin-left: 1rem;
  text-indent: -1rem;
}

.phone-table th {
  background: #f1efee;
}
.phone-table td, .phone-table th {
  padding: 10px 15px;
  font-weight: 500;
  text-align: left;
}

hr {
  border-top: 2px dotted #aa9d93;
  margin: 28px 0;
}

.close-button-2 {
  display: block;
  margin: 0 auto;
  text-decoration: none;
  text-align: center;
  color: #72655b;
  letter-spacing: 0.1em;
  font-size: 1.7rem;
  font-weight: 500;
  width: 162px;
  height: 50px;
  line-height: 45px;
  border-radius: 18px;
  border: solid 2px #c6bdb7;
  -moz-box-shadow: inset 0 -5px 0 #e0e0e0;
  -webkit-box-shadow: inset 0 -5px 0 #e0e0e0;
  box-shadow: inset 0 -5px 0 #e0e0e0;
  padding-bottom: 5px;
  /*&:hover{
  	-moz-box-shadow:    none;
  	-webkit-box-shadow: none;
  	box-shadow:         none;
  	height: 45px;
  	padding-bottom: 0;
  	margin-top: 10px;
  }*/
}

.illustration-container {
  position: relative;
  width: 100%;
  height: 7.68vw;
}

.wave {
  position: absolute;
  bottom: -1px;
  width: 100%;
  left: 0;
}

#leaf1 {
  transition: all 300ms;
  position: absolute;
  left: 2%;
  bottom: -100%;
  width: calc(57 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #leaf1 {
    width: calc(38 / 1400 * 100%);
    left: calc(778 / 1400 * 100%);
  }
}

#leaf1.inPosition {
  bottom: 50%;
  opacity: 1;
}
@media (min-width: 751px) {
  #leaf1.inPosition {
    bottom: 30%;
  }
}

#leaf2 {
  transition: all 300ms;
  position: absolute;
  left: 9%;
  bottom: -100%;
  width: calc(44 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #leaf2 {
    width: calc(30 / 1400 * 100%);
    left: calc(813 / 1400 * 100%);
  }
}

#leaf2.inPosition {
  bottom: 45%;
  opacity: 1;
}
@media (min-width: 751px) {
  #leaf2.inPosition {
    bottom: 25%;
  }
}

#dog1 {
  transition: all 300ms;
  position: absolute;
  left: 16%;
  bottom: -100%;
  width: calc(119 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #dog1 {
    width: calc(82 / 1400 * 100%);
    left: calc(862 / 1400 * 100%);
  }
}

#dog1.inPosition {
  bottom: 80%;
  opacity: 1;
}
@media (min-width: 751px) {
  #dog1.inPosition {
    bottom: 24%;
  }
}

#leaf3 {
  transition: all 300ms;
  position: absolute;
  right: 30%;
  bottom: -100%;
  width: calc(56 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #leaf3 {
    right: auto;
    width: calc(38 / 1400 * 100%);
    left: calc(1014 / 1400 * 100%);
  }
}

#leaf3.inPosition {
  bottom: -30%;
  opacity: 1;
}
@media (min-width: 751px) {
  #leaf3.inPosition {
    bottom: -5%;
  }
}

#cat1 {
  transition: all 300ms;
  position: absolute;
  right: 6%;
  bottom: -100%;
  width: calc(156 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #cat1 {
    right: auto;
    width: calc(106 / 1400 * 100%);
    left: calc(1082 / 1400 * 100%);
  }
}

#cat1.inPosition {
  bottom: 10%;
  opacity: 1;
}
@media (min-width: 751px) {
  #cat1.inPosition {
    bottom: 12%;
  }
}

#leaf4 {
  transition: all 300ms;
  position: absolute;
  left: 5%;
  bottom: -100%;
  width: calc(53 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #leaf4 {
    right: auto;
    width: calc(38 / 1400 * 100%);
    left: calc(721 / 1400 * 100%);
  }
}

#leaf4.inPosition {
  bottom: 90%;
  opacity: 1;
}
@media (min-width: 751px) {
  #leaf4.inPosition {
    bottom: 46%;
  }
}

#leaf5 {
  transition: all 300ms;
  position: absolute;
  left: 12%;
  bottom: -100%;
  width: calc(54 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #leaf5 {
    right: auto;
    width: calc(38 / 1400 * 100%);
    left: calc(756 / 1400 * 100%);
  }
}

#leaf5.inPosition {
  bottom: 60%;
  opacity: 1;
}
@media (min-width: 751px) {
  #leaf5.inPosition {
    bottom: 30%;
  }
}

#leaf6 {
  transition: all 300ms;
  position: absolute;
  right: 44%;
  bottom: -100%;
  width: calc(56 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #leaf6 {
    right: auto;
    width: calc(40 / 1400 * 100%);
    left: calc(945 / 1400 * 100%);
  }
}

#leaf6.inPosition {
  bottom: -2%;
  opacity: 1;
}
@media (min-width: 751px) {
  #leaf6.inPosition {
    bottom: 3%;
  }
}

#dog2 {
  transition: all 300ms;
  position: absolute;
  right: 26%;
  bottom: -100%;
  width: calc(88 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #dog2 {
    right: auto;
    width: calc(58 / 1400 * 100%);
    left: calc(1031 / 1400 * 100%);
  }
}

#dog2.inPosition {
  bottom: 2%;
  opacity: 1;
}
@media (min-width: 751px) {
  #dog2.inPosition {
    bottom: 9%;
  }
}

#cat2 {
  transition: all 300ms;
  position: absolute;
  right: 3%;
  bottom: -100%;
  width: calc(143 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #cat2 {
    right: auto;
    width: calc(94 / 1400 * 100%);
    left: calc(1106 / 1400 * 100%);
  }
}

#cat2.inPosition {
  bottom: -2%;
  opacity: 1;
}
@media (min-width: 751px) {
  #cat2.inPosition {
    bottom: 10%;
  }
}

#leaf7 {
  transition: all 300ms;
  position: absolute;
  left: 3%;
  bottom: -100%;
  width: calc(53 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #leaf7 {
    right: auto;
    width: calc(35 / 1400 * 100%);
    left: calc(722 / 1400 * 100%);
  }
}

#leaf7.inPosition {
  bottom: 30%;
  opacity: 1;
}
@media (min-width: 751px) {
  #leaf7.inPosition {
    bottom: 30%;
  }
}

#leaf8 {
  transition: all 300ms;
  position: absolute;
  left: 8%;
  bottom: -100%;
  width: calc(54 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #leaf8 {
    right: auto;
    width: calc(39 / 1400 * 100%);
    left: calc(755 / 1400 * 100%);
  }
}

#leaf8.inPosition {
  bottom: 80%;
  opacity: 1;
}
@media (min-width: 751px) {
  #leaf8.inPosition {
    bottom: 40%;
  }
}

#cat3 {
  transition: all 300ms;
  position: absolute;
  left: 8%;
  bottom: -100%;
  width: calc(119 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #cat3 {
    right: auto;
    width: calc(97 / 1400 * 100%);
    left: calc(786 / 1400 * 100%);
  }
}

#cat3.inPosition {
  bottom: 84%;
  opacity: 1;
}
@media (min-width: 751px) {
  #cat3.inPosition {
    bottom: 30%;
  }
}

#dog3 {
  transition: all 300ms;
  position: absolute;
  left: 28%;
  bottom: -100%;
  width: calc(119 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #dog3 {
    right: auto;
    width: calc(104 / 1400 * 100%);
    left: calc(903 / 1400 * 100%);
  }
}

#dog3.inPosition {
  bottom: 68%;
  opacity: 1;
}
@media (min-width: 751px) {
  #dog3.inPosition {
    bottom: 17%;
  }
}

#leaf9 {
  transition: all 300ms;
  position: absolute;
  right: 30%;
  bottom: -100%;
  width: calc(54 / 750 * 100%);
  opacity: 0;
}
@media (min-width: 751px) {
  #leaf9 {
    right: auto;
    width: calc(40 / 1400 * 100%);
    left: calc(1031 / 1400 * 100%);
  }
}

#leaf9.inPosition {
  bottom: -25%;
  opacity: 1;
}
@media (min-width: 751px) {
  #leaf9.inPosition {
    bottom: -5%;
  }
}

.modal-menu-open {
  position: absolute;
  background: #f38b8b;
  background-image: url("../img/menu.png");
  background-repeat: no-repeat;
  background-size: 23px;
  background-position: center top 12px;
  width: 50px;
  height: 50px;
  top: 0;
  right: 0;
  border-radius: 0 0 6px 6px;
  font-size: 9px;
  letter-spacing: 0.1em;
  color: #FFF;
  text-align: center;
  text-decoration: none;
  padding-top: 34px;
  z-index: 900;
}

.btn-telephone {
  position: absolute;
  background: #5ac3cc;
  background-repeat: no-repeat;
  background-size: 21px;
  background-position: center top 10px;
  width: 50px;
  height: 50px;
  top: 0;
  right: 55px;
  border-radius: 0 0 6px 6px;
  font-size: 12px;
  letter-spacing: 0.1em;
  color: #FFF;
  text-align: center;
  text-decoration: none;
  padding-top: 8px;
  z-index: 900;
}

.modal-telephone-open {
  position: absolute;
  background: #5ac3cc;
  background-repeat: no-repeat;
  background-size: 21px;
  background-position: center top 10px;
  width: 50px;
  height: 50px;
  top: 0;
  right: 55px;
  border-radius: 0 0 6px 6px;
  font-size: 12px;
  letter-spacing: 0.1em;
  color: #FFF;
  text-align: center;
  text-decoration: none;
  padding-top: 8px;
  z-index: 900;
}

.modal-telephone-close-button {
  position: fixed;
  background-color: #5ac3cc;
  background-image: url("../img/close-button.png");
  background-repeat: no-repeat;
  background-size: 18px;
  background-position: center top 10px;
  width: 50px;
  height: 50px;
  top: 0;
  right: 55px;
  border-radius: 0 0 6px 6px;
  font-size: 9px;
  letter-spacing: 0.1em;
  color: #FFF;
  text-align: center;
  text-decoration: none;
  padding-top: 34px;
}

.modal-menu-close-button {
  position: fixed;
  background-color: #f38b8b;
  background-image: url("../img/close-button.png");
  background-repeat: no-repeat;
  background-size: 18px;
  background-position: center top 10px;
  width: 50px;
  height: 50px;
  top: 0;
  right: 0;
  border-radius: 0 0 6px 6px;
  font-size: 9px;
  letter-spacing: 0.1em;
  color: #FFF;
  text-align: center;
  text-decoration: none;
  padding-top: 34px;
}

#modal-menu-container, #modal-telephone-container {
  background: rgba(114, 101, 91, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  overflow: scroll;
  z-index: 1000;
  padding-bottom: 92px;
  display: none;
}

.modal-menu {
  background: #f1efee;
  padding: 50px 0 30px;
}
.modal-menu .contact {
  margin: 0 40px;
  background: none;
  font-size: 1.4rem;
  border-top: 2px dotted #aa9d93;
  border-bottom: 2px dotted #aa9d93;
  line-height: 2.5;
}
.modal-menu .contact .big-button {
  max-width: 250px;
  font-size: 1.9rem;
  height: 4.8rem;
  line-height: 4.2rem;
}
.modal-menu .contact .big-button:hover {
  height: 4.2rem;
  box-shadow: none;
  margin-top: 6px;
}
.modal-menu .contact .big-button img {
  height: 1.9rem;
  margin-right: 1rem;
  width: auto;
}
.modal-menu .contact .web-reservation-button {
  font-size: 1.6rem;
}
.modal-menu .contact .contact-button {
  font-size: 1.3rem;
}

.modal-nav {
  display: block;
  width: 100%;
}
.modal-nav ul {
  padding-bottom: 18px;
}
.modal-nav ul li {
  list-style: none;
  display: block;
}
.modal-nav ul li a {
  max-width: 250px;
  margin: 0 auto;
  display: block;
  color: #72655b;
  text-decoration: none;
  padding: 12px 0;
  text-align: center;
  font-size: 1.6rem;
  background-image: url("../img/arrow-right.png");
  background-repeat: no-repeat;
  background-size: 7px;
  background-position: right;
}
.modal-nav ul li .subnav-toggle {
  background-image: url("../img/plus.png");
  background-size: 13px;
}
.modal-nav ul .subnav {
  background-color: #FFF;
  padding-bottom: 0;
  display: none;
}

.modal-address {
  margin-top: 20px;
  text-align: center;
  font-weight: 400;
  line-height: 2.6rem;
}

.modal-telephone {
  background: #f1efee;
  padding: 86px 20px 45px;
  text-align: center;
}
.modal-telephone h2 {
  font-size: 1.7rem;
  margin-bottom: 15px;
}
.modal-telephone .holidays {
  text-align: left;
}
.modal-telephone .schedule-table {
  margin-top: 15px;
}

header {
  display: block;
  position: fixed;
  top: 0px;
  left: 0;
  z-index: 800;
  width: 100%;
  height: 55px;
  transition: 0.3s;
}
@media (min-width: 751px) {
  header {
    background: #FFF;
    height: 130px;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
  }
}

header.slide-out {
  transform: translateY(-100%);
}

#header-logo {
  position: absolute;
  margin: 0;
  top: 9px;
  left: 10px;
  width: 100%;
  line-height: 1;
}
@media (min-width: 751px) {
  #header-logo {
    top: 19px;
    left: 20px;
    display: inline-block;
    width: auto;
    text-align: left;
  }
}

.header-logo-img {
  width: 199px;
}
@media (min-width: 751px) {
  .header-logo-img {
    width: 285px;
  }
}

.fadein {
  opacity: 0.1;
  transform: translate(0, 25px);
  transition: all 300ms;
}

.fadein.scrollin {
  opacity: 1;
  transform: translate(0, 0);
}

.fadein-stagger .fadein:nth-of-type(2) {
  -moz-transition-delay: 150ms;
  -webkit-transition-delay: 150ms;
  -o-transition-delay: 150ms;
  -ms-transition-delay: 150ms;
}
.fadein-stagger .fadein:nth-of-type(3) {
  -moz-transition-delay: 300ms;
  -webkit-transition-delay: 300ms;
  -o-transition-delay: 300ms;
  -ms-transition-delay: 300ms;
}
.fadein-stagger .fadein:nth-of-type(4) {
  -moz-transition-delay: 450ms;
  -webkit-transition-delay: 450ms;
  -o-transition-delay: 450ms;
  -ms-transition-delay: 450ms;
}
.fadein-stagger .fadein:nth-of-type(5) {
  -moz-transition-delay: 600ms;
  -webkit-transition-delay: 600ms;
  -o-transition-delay: 600ms;
  -ms-transition-delay: 600ms;
}

@media (min-width: 751px) {
  .sp-only {
    display: none !important;
  }
}

@media (max-width: 750px) {
  .pc-only {
    display: none !important;
  }
}

.header-inner {
  background: rgba(255, 255, 255, 0.8);
  width: 100%;
  height: 55px;
/*  display: none; */
}
@media (min-width: 751px) {
  .header-inner {
    background: none;
    max-width: 1040px;
    padding: 0 20px;
    margin: 0 auto;
    position: relative;
    height: 100%;
    display: flex;
    justify-content: flex-end;
  }
}

@media (max-width: 750px) {
  .top-page .header-inner {
    display: none;
  }
}

.pc-nav {
  position: absolute;
  top: 90px;
  left: 0;
  width: 100%;
  padding: 0 40px;
}
.pc-nav ul.pc-nav-ul {
  display: flex;
  justify-content: space-between;
}
.pc-nav ul.pc-nav-ul li {
  display: inline-block;
  font-size: 1.8rem;
  /*&:not(:last-child):after{
  	content: "/";
  	color: $pink;
  	display: inline-block;
  	margin-left: 10px;
  }*/
}
.pc-nav ul.pc-nav-ul li a {
  color: #72655b;
  text-decoration: none;
}
.pc-nav ul.pc-nav-ul li a:hover {
  color: #f38b8b;
}
.pc-nav ul.pc-nav-ul li.pc-nav-slash {
  color: #f38b8b;
}
.pc-nav ul.pc-nav-ul li.subnav-li {
  position: relative;
}
.pc-nav ul.pc-nav-ul li.subnav-li .subnav-arrow {
  margin-left: 5px;
}
.pc-nav ul.pc-nav-ul li.subnav-li:hover .subnav-container {
  display: block;
}
.pc-nav ul.pc-nav-ul li.subnav-li .subnav-container {
  display: none;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 50%;
  padding-top: 48px;
  transform: translate(-50%, -15px);
  transition: 0.3s;
}
.pc-nav ul.pc-nav-ul li.subnav-li .subnav-container:hover {
  opacity: 1;
  transform: translate(-50%, 0);
}
.pc-nav ul.pc-nav-ul li.subnav-li .subnav-container ul {
  background: #FFF;
  border-radius: 6px;
  width: 150px;
  text-align: center;
  padding: 8px 0;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
}
.pc-nav ul.pc-nav-ul li.subnav-li .subnav-container ul li {
  display: block;
}
.pc-nav ul.pc-nav-ul li.subnav-li .subnav-container ul li a {
  display: block;
  padding: 10px;
}

.web-reservation-header-button {
  display: inline-block;
  background: #5ac3cc;
  background-image: url("../img/pc.svg");
  background-repeat: no-repeat;
  background-size: 27px;
  background-position: center top 12px;
  width: 90px;
  height: 70px;
  border-radius: 0 0 12px 12px;
  font-size: 14px;
  letter-spacing: 0.1em;
  color: #FFF;
  text-align: center;
  text-decoration: none;
  padding-top: 44px;
  margin-left: 20px;
}

.header-address {
  padding-top: 15px;
  display: inline-block;
  font-size: 1.4rem;
  font-weight: 400;
  text-align: right;
  line-height: 1.3;
}

.header-address-phone {
  color: #5ac3cc;
  font-size: 2.9rem;
  font-weight: 500;
  text-decoration: none;
}
.header-address-phone img {
  margin-right: 12px;
}

/*-----下層ページ---------------*/
.pankuzu {
  width: 100%;
  max-width: 1040px;
  padding: 0 20px;
  margin: 0 auto 65px;
}
@media (max-width: 750px) {
  .pankuzu {
    margin-bottom: 38px;
  }
}
.pankuzu ul li {
  display: inline-block;
  font-size: 1.2rem;
  font-weight: 400;
}
@media (max-width: 750px) {
  .pankuzu ul li {
    font-size: 1.1rem;
  }
}
.pankuzu ul li a {
  color: #72655b;
}
.pankuzu ul li:not(:last-child):after {
  content: " > ";
}


/*ボタン追加20240903*/
@media (min-width: 751px) {
  .contact-button-row {
    font-size: 2.6rem;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    max-width: 54rem;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1.5rem;
  }
  .contact-button-row .web-reservation-button,
  .contact-button-row .tel-button {
    max-width: 100%;
  }
}

.get-button {
  font-size: 2rem;
  background-color: #C7B25C;
  -moz-box-shadow: inset 0 -6px 0 rgb(115 103 53 / 20%);
  -webkit-box-shadow: inset 0 -6px 0 rgb(115 103 53 / 20%);
  box-shadow: inset 0 -6px 0 rgb(115 103 53 / 20%);
}
.tel-button {
  font-size: 2rem;
  background-color: #E2E2E2;
  color: #5AC3CC;
  -moz-box-shadow: inset 0 -6px 0 rgb(0 0 0 / 12%);
  -webkit-box-shadow: inset 0 -6px 0 rgb(0 0 0 / 12%);
  box-shadow: inset 0 -6px 0 rgb(0 0 0 / 12%);
}
@media (min-width: 751px) {
  .get-button {
    font-size: 2.6rem;
    -moz-box-shadow: inset 0 -6px 0 rgb(115 103 53 / 20%);
    -webkit-box-shadow: inset 0 -6px 0 rgb(115 103 53 / 20%);
    box-shadow: inset 0 -6px 0 rgb(115 103 53 / 20%);
    margin-right: 3rem;
  }
  .tel-button {
    -moz-box-shadow: inset 0 -8px 0 rgb(0 0 0 / 12%);
    -webkit-box-shadow: inset 0 -8px 0 rgb(0 0 0 / 12%);
    box-shadow: inset 0 -8px 0 rgb(0 0 0 / 12%);
    font-size: 2.6rem;
  }
  .contact-button--2rem {
    font-size: 2rem;
  }
}

.modal-menu .contact .get-button {
  font-size: 1.6rem;
}
