@charset "UTF-8";
.loading {
  position: fixed;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  top: 0;
  left: 0;
  height: 100vh;
  width: 100%;
  z-index: 999999;
  background-color: white;
  animation: fadeOut 0.5s ease 2.5s forwards;
}
.loading .loading-title {
  position: relative;
  font-size: 4rem;
  width: 100%;
  font-family: "Zen Maru Gothic", sans-serif;
}
.loading .loading-title .loading-title-top {
  position: absolute;
  display: inline-block;
  top: 0;
  left: 35%;
  width: 14ch;
  white-space: nowrap;
  overflow: hidden;
  border-right: 3px solid #444;
  animation: typing 1s steps(19) forwards, typingEffect 1s step-end forwards;
}
.loading .loading-title .loading-title-bottom {
  font-weight: bold;
  display: inline-block;
  position: absolute;
  top: 5rem;
  left: 50%;
  width: 12ch;
  white-space: nowrap;
  overflow: hidden;
  border-right: 3px solid #444;
  opacity: 0;
  animation: show 0s linear 1s forwards, typing 1s steps(19) 1s forwards, typingEffect 0.2s step-end infinite alternate 1s;
}
@keyframes typing {
  from {
    width: 0;
  }
}
@keyframes typingEffect {
  0% {
    border-color: #444;
  }
  100% {
    border-color: transparent;
  }
}
@keyframes show {
  to {
    opacity: 1;
  }
}
.loading .loading-img {
  width: 20%;
  margin-top: 10rem;
}
@keyframes fadeOut {
  0% {
    opacity: 1;
    visibility: visible;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}
@media (max-width: 767px) {
  .loading .loading-title .loading-title-top {
    left: 15%;
  }
  .loading .loading-title .loading-title-bottom {
    left: 35%;
  }
  .loading .loading-img {
    width: 40%;
    margin-top: 10rem;
  }
}

header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 70;
  width: 100%;
  display: flex;
  justify-content: space-around;
  align-items: center;
  background: url(../img/header.png) repeat-x top/contain;
  background-size: auto 100%;
}
header .store-name {
  font-size: 2rem;
  padding: 2rem;
}
header nav {
  display: flex;
  align-items: center;
  top: 0;
  padding: 2rem;
}
header nav .nav-menu {
  display: flex;
  font-size: 2rem;
  align-items: center;
  justify-content: space-between;
}
header nav .nav-menu li {
  padding-right: 1.5rem;
}
header nav .nav-menu li .instagram-icon {
  display: block;
  width: 2.5rem;
}
header nav .service-badge {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: white;
  border-radius: 50px;
  width: 8.5rem;
  height: 8.5rem;
}
header nav .service-badge .badge-text {
  font-weight: bold;
}
header .hamburger {
  display: none;
}
header .mask {
  display: none;
}
@media (max-width: 767px) {
  header {
    background: none;
    justify-content: space-between;
    padding: 1rem;
    background-color: rgba(255, 255, 255, 0.603);
  }
  header .store-name {
    font-size: 2rem;
    padding: 1rem;
  }
  header nav {
    position: fixed;
    top: 0;
    right: -100%;
    opacity: 0;
    transition: right 0.3s ease;
    z-index: 90;
  }
  header .hamburger {
    background-color: #F8EDD3;
    display: block;
    width: 60px;
    height: 60px;
    position: relative;
    z-index: 100;
    top: 0;
    right: 1rem;
    border-radius: 50%;
    cursor: pointer;
  }
  header .hamburger span {
    position: absolute;
    background-color: black;
    width: 50%;
    left: 50%;
    transform: translateX(-50%);
    height: 2px;
    transition: all 0.5s;
  }
  header .hamburger span:nth-child(1) {
    top: 30%;
  }
  header .hamburger span:nth-child(2) {
    top: 50%;
  }
  header .hamburger span:nth-child(3) {
    top: 70%;
  }
  header.open nav {
    opacity: 1;
    top: 10rem;
    right: 0;
    width: 100%;
    justify-content: center;
  }
  header.open nav .nav-menu {
    flex-direction: column;
    justify-content: center;
  }
  header.open nav .nav-menu li {
    padding-block: 1rem;
  }
  header.open nav .service-badge {
    border-radius: 20px;
    margin-inline: 1rem;
    display: none;
  }
  header.open .hamburger span:nth-child(1) {
    top: 50%;
    transform: translateX(-50%) rotate(-45deg);
  }
  header.open .hamburger span:nth-child(2) {
    opacity: 0;
  }
  header.open .hamburger span:nth-child(3) {
    top: 50%;
    transform: translateX(-50%) rotate(45deg);
  }
  header.open .mask {
    display: block;
    position: fixed;
    background-color: #F8EDD3;
    z-index: 80;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}

footer {
  background: url(../img/フッター背景\ \(3\).png) repeat-x top/contain;
  background-size: auto 100%;
}
footer .footer-container {
  display: flex;
  justify-content: space-between;
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  align-items: center;
  padding: 5rem;
}
footer .footer-container .store-text {
  text-align: center;
  width: 30%;
  white-space: nowrap;
}
footer .footer-container .store-text .store-name {
  font-size: 2.5rem;
  margin-bottom: 2%;
}
footer .footer-container .store-text .store-options {
  background-color: white;
  border-radius: 50px;
  padding: 3% 4%;
  font-size: 2rem;
}
footer .footer-container .sns-list {
  display: block;
  font-size: 1.5rem;
  text-align: center;
  width: 30%;
}
footer .footer-container .sns-list .sns-list-title {
  margin-bottom: 3%;
  font-size: 2rem;
}
footer .footer-container .sns-list .sns {
  display: flex;
  justify-content: center;
}
footer .footer-container .sns-list .sns .icon {
  width: 20%;
  padding-inline: 2%;
}
footer .footer-container .menu-list-container {
  display: flex;
  justify-content: space-around;
  width: 30%;
}
footer .footer-container .menu-list-container .menu-list {
  font-size: 2rem;
}
footer .footer-container-sp {
  display: none;
}
footer .to-top {
  position: fixed;
  display: block;
  width: 200px;
  right: 20px;
  bottom: 20px;
  z-index: 30;
}
@media (max-width: 767px) {
  footer .footer-container {
    display: none;
  }
  footer .footer-container-sp {
    display: block;
    margin-inline: 2rem;
    padding-block: 5rem;
    text-align: center;
  }
  footer .footer-container-sp .store-name {
    font-size: 2.5rem;
    padding-bottom: 2rem;
  }
  footer .footer-container-sp .store-info {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1.5rem;
    padding-bottom: 1rem;
  }
  footer .footer-container-sp .store-info .store-options {
    background-color: white;
    border-radius: 50px;
    padding: 1rem 1.5rem;
    font-size: 1.5rem;
  }
  footer .footer-container-sp .store-info .sns-list .sns-list-title {
    font-size: 1.5rem;
  }
  footer .footer-container-sp .store-info .sns-list .sns {
    display: flex;
  }
  footer .footer-container-sp .store-info .sns-list .sns .icon {
    width: 30px;
    height: 30px;
  }
  footer .footer-container-sp .menu-list {
    display: flex;
    justify-content: center;
    gap: 1rem;
    font-size: 1.5rem;
  }
  footer .to-top {
    width: 20rem;
    right: -7rem;
    bottom: 0;
    transform: rotate(-45deg);
  }
}

.main-visual {
  height: 70vh;
  display: flex;
  justify-content: space-between;
  position: relative;
}
.main-visual .main-visual-img {
  margin-right: 10rem;
}
.main-visual .main-visual-img li {
  position: absolute;
  width: 60%;
  height: 90%;
  top: 0;
  left: 0;
  opacity: 0;
  animation: fade 12s infinite;
}
.main-visual .main-visual-img li img {
  border-radius: 0 50px 50px 0;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.main-visual .main-visual-img li:nth-child(1) {
  animation-delay: 0s;
}
.main-visual .main-visual-img li:nth-child(2) {
  animation-delay: 4s;
}
.main-visual .main-visual-img li:nth-child(3) {
  animation-delay: 8s;
}
@keyframes fade {
  0% {
    opacity: 0;
  }
  15% {
    opacity: 1;
  }
  30% {
    opacity: 1;
  }
  45% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
.main-visual .info-banner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-right: 10rem;
}
.main-visual .info-banner .info-banner-text {
  position: relative;
  display: block;
  text-align: center;
  font-weight: bold;
  background-color: #FFCEC5;
  filter: drop-shadow(0 0.4rem 0.7rem rgba(0, 0, 0, 0.25));
  width: 30rem;
  padding: 2rem;
  border-radius: 30px;
  margin-bottom: 3rem;
}
.main-visual .info-banner .info-banner-text::before {
  position: absolute;
  content: "";
  border: 2rem solid transparent;
  border-top: 2rem solid #FFCEC5;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}
.main-visual .info-banner .info-banner-text .banner-text {
  display: inline-block;
}
.main-visual .info-banner .info-banner-text .banner-text:nth-child(1) {
  font-size: 2.4rem;
  margin-bottom: 1rem;
}
.main-visual .info-banner .info-banner-text .banner-text:nth-child(2) {
  display: inline-block;
  border-bottom: 1px solid black;
  font-size: 2rem;
  margin-top: 0;
}
.main-visual .info-banner .info-banner-img {
  max-width: 30rem;
}
@media (min-width: 768px) and (max-width: 1023px) {
  .main-visual .info-banner {
    justify-content: center;
    margin-right: 5rem;
  }
  .main-visual .info-banner .info-banner-img {
    max-width: 20rem;
  }
}
@media (max-width: 767px) {
  .main-visual {
    flex-direction: column;
  }
  .main-visual .main-visual-img {
    width: 100%;
  }
  .main-visual .main-visual-img li {
    width: 100%;
    height: 60%;
  }
  .main-visual .main-visual-img li img {
    border-radius: 1rem;
  }
  .main-visual .info-banner {
    flex-direction: row;
    justify-content: space-around;
    margin-inline: 2rem;
  }
  .main-visual .info-banner .info-banner-text {
    position: relative;
    width: 60%;
    border-radius: 10px;
  }
  .main-visual .info-banner .info-banner-text::before {
    position: absolute;
    content: "";
    border: 2rem solid transparent;
    border-left: 2rem solid #FFCEC5;
    top: 50%;
    right: -3rem;
    left: auto;
    transform: translateY(-50%);
  }
  .main-visual .info-banner .info-banner-text .banner-text {
    display: block;
  }
  .main-visual .info-banner .info-banner-text .banner-text:nth-child(1) {
    font-size: 2rem;
    margin-bottom: 1rem;
  }
  .main-visual .info-banner .info-banner-text .banner-text:nth-child(2) {
    border-bottom: 1px solid black;
    font-size: 1.5rem;
    margin-top: 0;
  }
  .main-visual .info-banner .info-banner-img {
    width: 25%;
  }
}

#menu .section-title {
  text-align: center;
  text-shadow: 0 4px rgba(0, 0, 0, 0.25);
  font-size: 4rem;
  margin-bottom: 5rem;
}
#menu .swiper {
  width: 90%;
  aspect-ratio: 16/9;
  padding-bottom: 2rem;
  max-height: 400px;
}
#menu .swiper .swiper-slide {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}
#menu .swiper .swiper-slide img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 50px;
}
#menu .swiper .swiper-pagination {
  bottom: 0;
}
#menu .cta-menu-list {
  display: flex;
  justify-content: center;
  gap: 1%;
  margin-top: 3rem;
}
#menu .cta-menu-list .cta-menu,
#menu .cta-menu-list .cta-instagram {
  background-color: #FFCEC5;
  display: inline-block;
  padding: 1.5rem 7rem;
  font-size: 2rem;
  border-radius: 50px;
  box-shadow: 0 4px rgba(0, 0, 0, 0.25);
}
#menu .cta-menu-list .cta-menu:hover,
#menu .cta-menu-list .cta-instagram:hover {
  transform: translateY(4px);
  box-shadow: none;
}
@media (max-width: 767px) {
  #menu {
    margin-inline: 2rem;
  }
  #menu .swiper {
    width: 100%;
    aspect-ratio: auto;
    max-height: none;
    margin: 0 auto;
  }
  #menu .swiper .swiper-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 130px;
    gap: 1rem;
  }
  #menu .swiper .swiper-wrapper .swiper-slide {
    align-items: center;
    width: 100%;
    height: 100%;
    margin: 0 auto;
  }
  #menu .swiper .swiper-wrapper .swiper-slide img {
    border-radius: 20px;
  }
  #menu .swiper-pagination {
    display: none;
  }
  #menu .cta-menu-list .cta-menu,
  #menu .cta-menu-list .cta-instagram {
    padding: 1rem 2rem;
  }
}

#concept {
  background: url(../img/背景画像.png) repeat-x center/contain;
  background-size: auto 100%;
}
#concept .wrapper .section-title {
  text-align: center;
  text-shadow: 0 4px rgba(0, 0, 0, 0.25);
  font-size: 4rem;
  margin-bottom: 5rem;
  padding-top: 3rem;
}
#concept .wrapper .concept-top,
#concept .wrapper .concept-middle,
#concept .wrapper .concept-bottom {
  display: flex;
}
#concept .wrapper .concept-top .title,
#concept .wrapper .concept-middle .title,
#concept .wrapper .concept-bottom .title {
  font-weight: bold;
  font-size: 2rem;
}
#concept .wrapper .concept-top .lead,
#concept .wrapper .concept-middle .lead,
#concept .wrapper .concept-bottom .lead {
  font-size: 1.5rem;
}
#concept .wrapper .concept-top {
  position: relative;
}
#concept .wrapper .concept-top .concept-img1 {
  border-radius: 20px;
  width: 50%;
  max-height: 40rem;
  overflow: hidden;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0 20px 20px 0;
  z-index: 5;
}
#concept .wrapper .concept-top .concept-img1 img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 100%;
}
#concept .wrapper .concept-top .line1 {
  position: absolute;
  width: 40%;
  top: 0;
  right: 0;
}
#concept .wrapper .concept-top .line2 {
  position: absolute;
  width: 30%;
  top: 3rem;
  right: 0;
}
#concept .wrapper .concept-top .line1,
#concept .wrapper .concept-top .line2 {
  height: 1rem;
}
#concept .wrapper .concept-top .title {
  position: absolute;
  top: 25%;
  left: 55%;
}
#concept .wrapper .concept-top .lead {
  position: absolute;
  top: 35%;
  left: 55%;
}
#concept .wrapper .concept-top .title,
#concept .wrapper .concept-top .lead {
  padding-right: 2rem;
}
#concept .wrapper .concept-middle {
  flex-direction: row-reverse;
  position: relative;
}
#concept .wrapper .concept-middle .concept-img2 {
  border-radius: 20px;
  width: 50%;
  max-height: 40rem;
  overflow: hidden;
  -o-object-fit: cover;
     object-fit: cover;
  width: 55%;
  border-radius: 20px 0 0 20px;
  position: absolute;
  z-index: 10;
  top: -6rem;
  right: 0;
}
#concept .wrapper .concept-middle .concept-img2 img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 100%;
}
#concept .wrapper .concept-middle .line3 {
  width: 50%;
  max-height: 25vh;
  position: absolute;
  top: -5rem;
  left: -5rem;
  z-index: 3;
}
#concept .wrapper .concept-middle .title {
  position: absolute;
  top: 30rem;
  left: 20rem;
}
#concept .wrapper .concept-middle .lead {
  position: absolute;
  top: 35rem;
  left: 20rem;
  width: 77rem;
}
#concept .wrapper .concept-bottom {
  margin-top: 50rem;
  padding-bottom: 10rem;
  justify-content: center;
  gap: 3rem;
  margin-inline: 3rem;
}
#concept .wrapper .concept-bottom .concept-img3 {
  border-radius: 20px;
  width: 50%;
  max-height: 40rem;
  overflow: hidden;
  -o-object-fit: cover;
     object-fit: cover;
}
#concept .wrapper .concept-bottom .concept-img3 img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 100%;
}
#concept .wrapper .concept-bottom .title {
  margin-top: 20rem;
  margin-bottom: 2rem;
}
#concept .wrapper .concept-bottom .lead {
  width: 60%;
}
@media (max-width: 767px) {
  #concept .wrapper {
    margin-inline: 2rem;
  }
  #concept .wrapper .concept-top,
  #concept .wrapper .concept-middle,
  #concept .wrapper .concept-bottom {
    flex-direction: column;
    margin: 0 auto;
    align-items: center;
    padding-bottom: 2rem;
  }
  #concept .wrapper .concept-top .line1,
  #concept .wrapper .concept-top .line2,
  #concept .wrapper .concept-top .line3,
  #concept .wrapper .concept-middle .line1,
  #concept .wrapper .concept-middle .line2,
  #concept .wrapper .concept-middle .line3,
  #concept .wrapper .concept-bottom .line1,
  #concept .wrapper .concept-bottom .line2,
  #concept .wrapper .concept-bottom .line3 {
    display: none;
  }
  #concept .wrapper .concept-top .concept-img1,
  #concept .wrapper .concept-top .concept-img2,
  #concept .wrapper .concept-top .concept-img3,
  #concept .wrapper .concept-middle .concept-img1,
  #concept .wrapper .concept-middle .concept-img2,
  #concept .wrapper .concept-middle .concept-img3,
  #concept .wrapper .concept-bottom .concept-img1,
  #concept .wrapper .concept-bottom .concept-img2,
  #concept .wrapper .concept-bottom .concept-img3 {
    position: static;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    height: 200px;
    border-radius: 20px;
    -o-object-fit: cover;
       object-fit: cover;
    padding-block: 1rem;
  }
  #concept .wrapper .concept-top .lead,
  #concept .wrapper .concept-top .title,
  #concept .wrapper .concept-middle .lead,
  #concept .wrapper .concept-middle .title,
  #concept .wrapper .concept-bottom .lead,
  #concept .wrapper .concept-bottom .title {
    position: static;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    margin: 0 auto;
    text-align: center;
    width: 100%;
  }
  #concept .wrapper .concept-bottom {
    gap: 0;
    padding-bottom: 5rem;
  }
}

#availability {
  max-width: 1120px;
  margin-inline: auto;
}
#availability .section-title {
  text-align: center;
  text-shadow: 0 4px rgba(0, 0, 0, 0.25);
  font-size: 4rem;
  margin-bottom: 5rem;
}
#availability .availability-container {
  display: flex;
  justify-content: space-between;
  padding-inline: 3rem;
}
#availability .availability-container .calendar-wrap {
  width: 50%;
}
#availability .availability-container .calendar-wrap .calendar-header {
  width: 100%;
  text-align: center;
  font-size: 2rem;
  padding-bottom: 0.5rem;
}
#availability .availability-container .calendar-wrap .calendar {
  width: 100%;
  height: 100%;
  text-align: center;
  font-size: 1.5rem;
}
#availability .availability-container .calendar-wrap .sunday {
  color: #FF5656;
}
#availability .availability-container .calendar-wrap .saturday {
  color: #4A90E2;
}
#availability .availability-container .calendar-wrap .today {
  border: 2px solid #FFB400;
  font-weight: bold;
}
#availability .availability-container .busy-list {
  font-size: 2rem;
  text-align: center;
  width: 50%;
}
#availability .availability-container .busy-list .title {
  border-bottom: 1px solid black;
  padding-bottom: 0.5%;
  display: inline-block;
  margin-bottom: 3%;
}
#availability .availability-container .busy-list dl {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
#availability .availability-container .busy-list dl dt {
  width: 60%;
}
#availability .availability-container .busy-list dl dd {
  width: 40%;
  border-radius: 10px;
  padding-block: 0.5rem;
}
#availability .availability-container .busy-list dl dd:nth-of-type(1), #availability .availability-container .busy-list dl dd:nth-of-type(4) {
  background-color: #76C1FF;
}
#availability .availability-container .busy-list dl dd:nth-of-type(2), #availability .availability-container .busy-list dl dd:nth-of-type(3) {
  background-color: #FF5656;
}
#availability .availability-container .busy-list dl dt,
#availability .availability-container .busy-list dl dd {
  margin-block: 1rem;
}
#availability .availability-container .busy-list .cta-instagram {
  background-color: #FFCEC5;
  display: inline-block;
  padding: 1.5rem 7rem;
  font-size: 2rem;
  border-radius: 50px;
  box-shadow: 0 4px rgba(0, 0, 0, 0.25);
}
#availability .availability-container .busy-list .cta-instagram:hover {
  transform: translateY(4px);
  box-shadow: none;
}
@media (max-width: 767px) {
  #availability .availability-container {
    flex-direction: column;
    justify-content: center;
  }
  #availability .availability-container .calendar-wrap {
    width: 100%;
    text-align: center;
    height: 300px;
    margin-bottom: 5rem;
  }
  #availability .availability-container .busy-list {
    width: 100%;
  }
  #availability .availability-container .busy-list dl dt {
    width: 60%;
  }
  #availability .availability-container .busy-list dl dd {
    width: 40%;
  }
}

#news {
  background: url(../img/背景画像2.png) repeat-x center/contain;
  background-size: auto 100%;
  padding-bottom: 6rem;
}
#news .section-title {
  text-align: center;
  text-shadow: 0 4px rgba(0, 0, 0, 0.25);
  font-size: 4rem;
  margin-bottom: 5rem;
  padding-top: 3rem;
}
#news .news-list {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: white;
  border-radius: 10px;
  margin: 0 auto;
  width: 50%;
  height: auto;
  padding: 4rem 2rem;
  /* 左上 */
  /* 右上 */
  /* 左下 */
  /* 右下 */
}
#news .news-list .news-title {
  font-size: 2rem;
  border-bottom: 1px solid black;
  margin-block: 1.5rem;
  text-align: center;
}
#news .news-list .corner {
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
}
#news .news-list .top-left {
  top: 1rem;
  left: 1rem;
  border-width: 40px 40px 0 0;
  border-color: #FFCEC5 transparent transparent transparent;
}
#news .news-list .top-right {
  top: 1rem;
  right: 1rem;
  border-width: 0 40px 40px 0;
  border-color: transparent #FFCEC5 transparent transparent;
}
#news .news-list .bottom-left {
  bottom: 1rem;
  left: 1rem;
  border-width: 0 40px 40px 0;
  border-color: transparent transparent #FFCEC5 transparent;
}
#news .news-list .bottom-right {
  bottom: 1rem;
  right: 1rem;
  border-width: 0 0 40px 40px;
  border-color: transparent transparent #FFCEC5 transparent;
}
@media (max-width: 767px) {
  #news .news-list {
    width: 90%;
    margin-inline: auto;
  }
}

#access .section-title {
  text-align: center;
  text-shadow: 0 4px rgba(0, 0, 0, 0.25);
  font-size: 4rem;
  margin-bottom: 5rem;
}
#access .access-container {
  display: flex;
  justify-content: space-evenly;
  margin-inline: auto;
  padding-inline: 2rem;
  gap: 1rem;
}
#access .access-container .img-illustration {
  width: 15%;
  animation: fuwafuwa 3s ease-in-out infinite alternate;
  transition: 1.5s ease-in-out;
}
@keyframes fuwafuwa {
  0% {
    transform: translate(0, 0) rotate(-7deg);
  }
  50% {
    transform: translate(0, -7px) rotate(0deg);
  }
  100% {
    transform: translate(0, 0) rotate(7deg);
  }
}
#access .access-container .information {
  font-size: 2.3rem;
  width: 30%;
  text-align: center;
}
#access .access-container .information .name-title {
  font-weight: bold;
  margin-bottom: 3%;
}
#access .access-container .information .access-detail {
  display: flex;
  flex-wrap: wrap;
}
#access .access-container .information .access-detail dt {
  width: 40%;
  text-align: right;
}
#access .access-container .information .access-detail dd {
  width: 60%;
  text-align: left;
  padding-left: 1rem;
}
#access .access-container .information .access-detail dt,
#access .access-container .information .access-detail dd {
  margin-block: 1%;
}
#access .access-container .information .cta-map {
  background-color: #FFCEC5;
  display: inline-block;
  padding: 1.5rem 7rem;
  font-size: 2rem;
  border-radius: 50px;
  box-shadow: 0 4px rgba(0, 0, 0, 0.25);
  margin-top: 2%;
}
#access .access-container .information .cta-map:hover {
  transform: translateY(4px);
  box-shadow: none;
}
#access .access-container iframe {
  width: 30%;
  height: auto;
}
@media (min-width: 768px) and (max-width: 1023px) {
  #access .access-container .information {
    font-size: 1.5rem;
  }
}
@media (max-width: 767px) {
  #access .access-container {
    flex-direction: column;
    flex-direction: column-reverse;
    margin-inline: 2rem;
    padding: 0;
  }
  #access .access-container .img-illustration {
    display: none;
  }
  #access .access-container .information {
    width: 100%;
  }
  #access .access-container .information .name-title {
    margin-top: 1.5rem;
  }
  #access .access-container .information dl {
    padding-left: 5rem;
  }
  #access .access-container iframe {
    width: 100%;
    height: 30%;
  }
}

.menu-sheet {
  padding: 0;
  overflow: hidden;
}
.menu-sheet .menu-main-visual {
  background: url(../img/menu-top.jpeg) no-repeat center/cover;
  height: 100vh;
  position: relative;
}
.menu-sheet .menu-main-visual .menu-title {
  position: absolute;
  top: 45%;
  left: 15%;
  font-size: 6rem;
  text-shadow: 0 4px rgba(0, 0, 0, 0.25);
}
.menu-sheet .menu-main-visual .menu-badge {
  position: absolute;
  top: 60%;
  left: 13%;
  background-color: white;
  border-radius: 50%;
  width: 20rem;
  height: 20rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  box-shadow: 0 4px rgba(0, 0, 0, 0.25);
  font-size: 2.4rem;
}
.menu-sheet .menu-tart {
  position: relative;
}
.menu-sheet .menu-tart .section-title {
  text-align: center;
  text-shadow: 0 4px rgba(0, 0, 0, 0.25);
  font-size: 4rem;
  margin-bottom: 5rem;
}
.menu-sheet .menu-tart .tart-img-illust {
  position: absolute;
  width: 10%;
  top: 0;
  right: 0;
  animation: fuwafuwa 3s ease-in-out infinite alternate;
  transition: 1.5s ease-in-out;
}
.menu-sheet .menu-drink {
  position: relative;
}
.menu-sheet .menu-drink .section-title {
  text-align: center;
  text-shadow: 0 4px rgba(0, 0, 0, 0.25);
  font-size: 4rem;
  margin-bottom: 5rem;
}
.menu-sheet .menu-drink .drink-img-illust {
  position: absolute;
  width: 10%;
  top: 0;
  left: 0;
  animation: fuwafuwa 3s ease-in-out infinite alternate;
  transition: 1.5s ease-in-out;
}
.menu-sheet .menu-tart,
.menu-sheet .menu-drink {
  max-width: 1120px;
  margin: 0 auto;
  margin-bottom: 10rem;
}
.menu-sheet .menu-tart .menu-list,
.menu-sheet .menu-drink .menu-list {
  display: grid;
  grid-template-columns: repeat(3, clamp(220px, 30vw, 270px));
  grid-template-rows: repeat(2, 300px);
  gap: 10px;
  width: -moz-fit-content;
  width: fit-content;
  text-align: center;
  margin: 0 auto;
}
.menu-sheet .menu-tart .menu-list .menu-list-item,
.menu-sheet .menu-drink .menu-list .menu-list-item {
  width: 100%;
  padding: 2rem;
}
.menu-sheet .menu-tart .menu-list .menu-list-item .list-img,
.menu-sheet .menu-drink .menu-list .menu-list-item .list-img {
  width: 20rem;
  height: 20rem;
  border-radius: 50%;
  -o-object-fit: cover;
     object-fit: cover;
  margin-bottom: 2rem;
}
.menu-sheet .menu-tart .menu-list .menu-list-item .list-title,
.menu-sheet .menu-drink .menu-list .menu-list-item .list-title {
  font-weight: bold;
  font-size: 1.2rem;
}
.menu-sheet .menu-tart .pink,
.menu-sheet .menu-drink .pink {
  background-color: #FFCEC5;
}
.menu-sheet .menu-tart .cream,
.menu-sheet .menu-drink .cream {
  background-color: #F8EDD3;
}
.menu-sheet .menu-tart .pink,
.menu-sheet .menu-tart .cream,
.menu-sheet .menu-drink .pink,
.menu-sheet .menu-drink .cream {
  border-radius: 10px;
}
@media (max-width: 767px) {
  .menu-sheet .menu-main-visual {
    height: 50vh;
  }
  .menu-sheet .menu-main-visual .menu-title {
    font-size: 2rem;
  }
  .menu-sheet .menu-main-visual .menu-badge {
    font-size: 1.25rem;
    width: 10rem;
    height: 10rem;
  }
  .menu-sheet .menu-tart .menu-list,
  .menu-sheet .menu-drink .menu-list {
    display: grid;
    grid-template-columns: repeat(2, 150px);
    grid-template-rows: repeat(3, 200px);
    gap: 20px;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto;
  }
  .menu-sheet .menu-tart .menu-list .menu-list-item,
  .menu-sheet .menu-drink .menu-list .menu-list-item {
    padding: 1rem;
  }
  .menu-sheet .menu-tart .menu-list .menu-list-item .list-img,
  .menu-sheet .menu-drink .menu-list .menu-list-item .list-img {
    width: 10rem;
    height: 10rem;
    margin-bottom: 1rem;
  }
  .menu-sheet .menu-tart .menu-list .sp-cream,
  .menu-sheet .menu-drink .menu-list .sp-cream {
    background-color: #F8EDD3;
  }
  .menu-sheet .menu-tart .menu-list .sp-pink,
  .menu-sheet .menu-drink .menu-list .sp-pink {
    background-color: #FFCEC5;
  }
}
@keyframes fuwafuwa {
  0% {
    transform: translate(0, 0) rotate(-7deg);
  }
  50% {
    transform: translate(0, -7px) rotate(0deg);
  }
  100% {
    transform: translate(0, 0) rotate(7deg);
  }
}

.news-page {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh;
}

.news-container {
  flex: 1;
  max-width: 1120px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  padding-bottom: 7rem;
}
.news-container .news-img {
  width: 30rem;
  height: 30rem;
  border-radius: 50%;
}
.news-container .news-img img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 50%;
}
.news-container .news-content {
  padding-left: 10rem;
}
.news-container .news-content .date {
  margin-bottom: 1rem;
}
.news-container .news-content .news-title {
  margin-bottom: 2rem;
  font-size: 3.6rem;
}
.news-container .news-content .news-text {
  font-size: 1.2rem;
}
@media (max-width: 767px) {
  .news-container {
    flex-direction: column-reverse;
    justify-content: start;
    align-items: center;
    padding-inline: 2rem;
  }
  .news-container .news-img {
    width: 15rem;
    height: 15rem;
  }
  .news-container .news-content {
    padding-left: 0;
    margin-bottom: 5rem;
  }
  .news-container .news-content .news-title {
    font-size: 1.5rem;
  }
  .news-container .news-content .date,
  .news-container .news-content .news-text {
    text-align: left;
  }
}

html {
  width: 100%;
  font-size: 0.782vw;
}
@media (min-width: 1280px) {
  html {
    font-size: 10px;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  html {
    font-size: clamp(8px, 0.98vw, 10px);
  }
}
@media (max-width: 767px) {
  html {
    font-size: clamp(8px, 2.67vw, 10px);
  }
}

body {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #000000;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
*::before, *::after {
  box-sizing: border-box;
}

li {
  list-style: none;
}

a {
  text-decoration: none;
  color: #000000;
  display: inline-block;
}

img {
  width: 100%;
}

section {
  margin-bottom: 10rem;
  padding-top: 10rem;
}
@media (max-width: 767px) {
  section {
    padding-top: 5rem;
  }
}

main {
  padding-top: 15rem;
}/*# sourceMappingURL=main.css.map */