@charset "utf-8";
/* CSS Document */

/*--------------------------------
共通
--------------------------------*/
:root {
  --hover-opacity: 0.6;
  --transition: .5s;
  --main-color: #E62686;
  --leading-trim: calc((1em - 1lh) / 2);
}

@supports not (top: 1lh) {
  :root {
    --leading-trim: 0px;
  }
}

html{
  font-size: clamp(8px, 2.66666666666666vw, 13px);
}

body{
	line-height: 1.3;
  font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', 'MS PGothic', sans-serif;
  letter-spacing: 0.05em;
}

img {
  max-width: 100%;
  height: auto;
}

#main {
  max-width: 500px;
  width: 100%;
  margin: 0 auto;
  opacity: 1;
  transition: 1s;
  position: relative;
  overflow: clip;
  background-color: #fff;
}

#main .u-image,
#main .image {
  width: 100%;
  height: auto;
}

.hero,
.main_visual,
.main_section,
.site-footer,
.footer{
  overflow: hidden;
}

@media (hover: hover) and (pointer: fine) {
  a img:hover{
    opacity: 0.8;
    transition: .3s;
  }

  .more_btn a:hover{
    opacity: 0.8;
    transition: .3s;
  }
}

.site-header .u-image,
.main_header .image {
  width: 100%;
  height: auto;
}

.site-header,
.main_header{
  width: 100%;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .site-header{
    display: none;
  }
}

.site-header__logo,
.header_logo{
  padding-block: 2%;
  padding-inline: 3%;
  margin-inline: 0 auto;
  width: 39%;
}

.site-header__happy,
.header_happy{
  border-top: 1px solid #000;
}

.content__inner {
  width: calc( 335 / 375 * 100% );
  margin-inline: auto;
}

.content__link-btn {
  margin-block-start: min(32px, calc(32 / 375 * 100%));
  text-align: center;
}

@media (hover: hover) and (pointer: fine) {
  .sale-bnr__link:hover{
    opacity: var(--hover-opacity);
    transition: var(--transition);
  }

  .page-nav__link:hover{
    opacity: var(--hover-opacity);
    transition: var(--transition);
  }
}

@media screen and (max-width: 767px) {

}

/* hero
--------------------------------*/
.hero {
  position: relative;
}

.hero__fade {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  pointer-events: none;
  width: 100%;
  height: 100%;
  background: url(../img/bg-mainvisual_fade.jpg),#34C3EC;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  opacity: 1;
  transition: opacity 2s ease;
}

.hero__fade img {
  max-width: min(310px, 82%);
  height: auto;
  opacity: 0;
  transition: opacity 2s ease;
}

/* flex bg sakura
--------------------------------*/
.sakura-bg,
.flex_bg{
  display: block;
  position: -webkit-fixed;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -1;
  margin: 0 auto;
  width: 100%;
  height: 100vh;
  background: url(../img/bg-flex.jpg) repeat;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  overflow: hidden;
}

.sakura-bg::before,
.flex_bg::before {
  content: "";
  background: url(../img/txt-main_right.png) no-repeat;
  background-size: cover;
  position: absolute;
  width: calc( 121 / 2000 * 100%);
  aspect-ratio: 121 / 349;
  right: 0;
  top: 0;
  z-index: 1;
}

.sakura-bg::after,
.flex_bg::after {
  content: "";
  background: url(../img/txt-main_left.png) no-repeat;
  background-size: cover;
  position: absolute;
  width: calc( 159 / 2000 * 100%);
  aspect-ratio: 159 / 481;
  left: 0;
  top: 0;
}

.sakura-bg::after,
.flex_bg::after {
  position: absolute;
}

.sakura-bg__container,
.sakura-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: hidden;
}

.sakura-bg__petal,
.sakura {
  position: absolute;
  top: -20%;
  left: var(--sakura-left, 50%);
  width: var(--sakura-size, 20px);
  height: auto;
  opacity: 0.9;
  --sakura-drift: -20px;
  animation: var(--sakura-anim, sakura-fall) var(--sakura-duration, 18s) linear infinite;
  animation-delay: var(--sakura-delay, 0s);
  animation-timing-function: var(--sakura-ease, linear);
}

@keyframes sakura-fall {
  0% {
    transform: translateY(0) translateX(var(--sakura-drift, 0px)) rotate(0deg);
    opacity: 0;
  }
  10% {
    opacity: 0.9;
  }
  90% {
    opacity: 0.9;
  }
  100% {
    transform: translateY(110vh) translateX(calc(100px - 40vh + var(--sakura-drift, 0px))) rotate(720deg);
    opacity: 0;
  }
}

/* 小さいジグザグ - 右に流れる */
@keyframes sakura-sway-1 {
  0%, 100% { transform: translateY(0) translateX(var(--sakura-drift, 0px)) scale(1) rotate(0deg) rotateY(0deg); opacity: 0; }
  10% { opacity: 0.9; }
  25% { transform: translateY(20vh) translateX(calc(15px - 10vh + var(--sakura-drift, 0px))) scale(1.05) rotate(90deg) rotateY(20deg); }
  50% { transform: translateY(50vh) translateX(calc(30px - 20vh + var(--sakura-drift, 0px))) scale(0.95) rotate(180deg) rotateY(40deg); }
  75% { transform: translateY(80vh) translateX(calc(45px - 30vh + var(--sakura-drift, 0px))) scale(1.02) rotate(270deg) rotateY(60deg); }
  90% { opacity: 0.9; }
  100% { transform: translateY(110vh) translateX(calc(60px - 40vh + var(--sakura-drift, 0px))) scale(1) rotate(360deg) rotateY(80deg); opacity: 0; }
}

/* 大きいジグザグ - 左に流れる */
@keyframes sakura-sway-2 {
  0%, 100% { transform: translateY(0) translateX(var(--sakura-drift, 0px)) scale(1) rotate(0deg) rotateX(0deg); opacity: 0; }
  10% { opacity: 0.9; }
  25% { transform: translateY(25vh) translateX(calc(-60px - 10vh + var(--sakura-drift, 0px))) scale(0.85) rotate(120deg) rotateX(25deg); }
  50% { transform: translateY(55vh) translateX(calc(-30px - 20vh + var(--sakura-drift, 0px))) scale(1.15) rotate(240deg) rotateX(50deg); }
  75% { transform: translateY(85vh) translateX(calc(-70px - 30vh + var(--sakura-drift, 0px))) scale(0.9) rotate(360deg) rotateX(70deg); }
  90% { opacity: 0.9; }
  100% { transform: translateY(110vh) translateX(calc(-50px - 40vh + var(--sakura-drift, 0px))) scale(1) rotate(480deg) rotateX(90deg); opacity: 0; }
}

/* 中くらいジグザグ - 中央付近で揺れる */
@keyframes sakura-sway-3 {
  0%, 100% { transform: translateY(0) translateX(var(--sakura-drift, 0px)) scale(1) rotate(0deg) rotateY(0deg) rotateX(0deg); opacity: 0; }
  10% { opacity: 0.9; }
  25% { transform: translateY(22vh) translateX(calc(25px - 10vh + var(--sakura-drift, 0px))) scale(1.1) rotate(60deg) rotateY(15deg) rotateX(10deg); }
  50% { transform: translateY(48vh) translateX(calc(-25px - 20vh + var(--sakura-drift, 0px))) scale(0.9) rotate(120deg) rotateY(30deg) rotateX(20deg); }
  75% { transform: translateY(78vh) translateX(calc(20px - 30vh + var(--sakura-drift, 0px))) scale(1.05) rotate(180deg) rotateY(45deg) rotateX(30deg); }
  90% { opacity: 0.9; }
  100% { transform: translateY(110vh) translateX(calc(-10px - 40vh + var(--sakura-drift, 0px))) scale(1) rotate(240deg) rotateY(60deg) rotateX(40deg); opacity: 0; }
}

/* ほぼ直線 - 少しだけ右へ */
@keyframes sakura-sway-4 {
  0%, 100% { transform: translateY(0) translateX(var(--sakura-drift, 0px)) scale(1) rotate(0deg) rotateY(0deg); opacity: 0; }
  10% { opacity: 0.9; }
  50% { transform: translateY(50vh) translateX(calc(20px - 20vh + var(--sakura-drift, 0px))) scale(1.1) rotate(180deg) rotateY(40deg); }
  90% { opacity: 0.9; }
  100% { transform: translateY(110vh) translateX(calc(35px - 40vh + var(--sakura-drift, 0px))) scale(1) rotate(360deg) rotateY(80deg); opacity: 0; }
}

/* ほぼ直線 - 少しだけ左へ */
@keyframes sakura-sway-5 {
  0%, 100% { transform: translateY(0) translateX(var(--sakura-drift, 0px)) scale(1) rotate(0deg) rotateX(0deg); opacity: 0; }
  10% { opacity: 0.9; }
  50% { transform: translateY(50vh) translateX(calc(-15px - 20vh + var(--sakura-drift, 0px))) scale(0.9) rotate(150deg) rotateX(30deg); }
  90% { opacity: 0.9; }
  100% { transform: translateY(110vh) translateX(calc(-25px - 40vh + var(--sakura-drift, 0px))) scale(1) rotate(300deg) rotateX(60deg); opacity: 0; }
}

/* 激しいジグザグ - 大きく左右に振れる */
@keyframes sakura-sway-6 {
  0%, 100% { transform: translateY(0) translateX(var(--sakura-drift, 0px)) scale(1) rotate(0deg) rotateY(0deg) rotateX(0deg); opacity: 0; }
  10% { opacity: 0.9; }
  20% { transform: translateY(15vh) translateX(calc(80px - 8vh + var(--sakura-drift, 0px))) scale(1.2) rotate(144deg) rotateY(30deg) rotateX(15deg); }
  40% { transform: translateY(35vh) translateX(calc(-70px - 16vh + var(--sakura-drift, 0px))) scale(0.8) rotate(288deg) rotateY(60deg) rotateX(30deg); }
  60% { transform: translateY(55vh) translateX(calc(90px - 24vh + var(--sakura-drift, 0px))) scale(1.15) rotate(432deg) rotateY(90deg) rotateX(45deg); }
  80% { transform: translateY(75vh) translateX(calc(-60px - 32vh + var(--sakura-drift, 0px))) scale(0.85) rotate(576deg) rotateY(120deg) rotateX(60deg); }
  90% { opacity: 0.9; }
  100% { transform: translateY(110vh) translateX(calc(40px - 40vh + var(--sakura-drift, 0px))) scale(1) rotate(720deg) rotateY(160deg) rotateX(80deg); opacity: 0; }
}

/* 斜め右下へ流れる */
@keyframes sakura-sway-7 {
  0%, 100% { transform: translateY(0) translateX(calc(-30px + var(--sakura-drift, 0px))) scale(1) rotate(0deg) rotateY(0deg); opacity: 0; }
  10% { opacity: 0.9; }
  25% { transform: translateY(20vh) translateX(calc(10px - 10vh + var(--sakura-drift, 0px))) scale(1.08) rotate(80deg) rotateY(18deg); }
  50% { transform: translateY(50vh) translateX(calc(50px - 20vh + var(--sakura-drift, 0px))) scale(0.92) rotate(160deg) rotateY(36deg); }
  75% { transform: translateY(80vh) translateX(calc(90px - 30vh + var(--sakura-drift, 0px))) scale(1.04) rotate(240deg) rotateY(54deg); }
  90% { opacity: 0.9; }
  100% { transform: translateY(110vh) translateX(calc(120px - 40vh + var(--sakura-drift, 0px))) scale(1) rotate(320deg) rotateY(72deg); opacity: 0; }
}

/* 斜め左下へ流れる */
@keyframes sakura-sway-8 {
  0%, 100% { transform: translateY(0) translateX(calc(40px + var(--sakura-drift, 0px))) scale(1) rotate(0deg) rotateX(0deg); opacity: 0; }
  10% { opacity: 0.9; }
  25% { transform: translateY(20vh) translateX(calc(10px - 10vh + var(--sakura-drift, 0px))) scale(0.9) rotate(100deg) rotateX(22deg); }
  50% { transform: translateY(50vh) translateX(calc(-30px - 20vh + var(--sakura-drift, 0px))) scale(1.1) rotate(200deg) rotateX(44deg); }
  75% { transform: translateY(80vh) translateX(calc(-70px - 30vh + var(--sakura-drift, 0px))) scale(0.95) rotate(300deg) rotateX(66deg); }
  90% { opacity: 0.9; }
  100% { transform: translateY(110vh) translateX(calc(-100px - 40vh + var(--sakura-drift, 0px))) scale(1) rotate(400deg) rotateX(88deg); opacity: 0; }
}

/* navigation
--------------------------------*/
.page-nav{
  padding-inline: min(30px, calc(30 / 375 * 100%));
  padding-block: min(40px, calc(40 / 375 * 100%)) min(31px, calc(31 / 375 * 100%));
  background: linear-gradient(to bottom, #FADCE9, #fff);
}

.page-nav__list{
  display: grid;
  grid-template-columns: 49% 49%;
  gap: 15px 2%;
  align-items: stretch;
}

.page-nav__item {
  list-style: none;
  height: 100%;
}

.page-nav__link {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  position: relative;
  padding-inline: min(13px, calc(13 / 165 * 100%));
  padding-block: min(9px, calc(9 / 165 * 100%));
  background: #EB6EA5;
  border-radius: 6px;
  color: #fff;
  text-decoration: none;
  box-shadow: 0 3px 0 #e54f95;
  min-height: 70px;
  height: 100%;
}

.page-nav__label {
  display: block;
  width: 100%;
  font-size: 0.9rem;
  font-weight: bold;
  color: #F0B1CD;
}

.page-nav__title {
  display: block;
  margin-block-start: min(3px, calc(3 / 165 * 100%));
  font-size: 1.2rem;
  font-weight: bold;
  line-height: 1.28;
}

.page-nav__link::after {
  content: "";
  position: absolute;
  right: min(10px, calc(10 / 165 * 100%));
  top: 50%;
  width: 9px;
  height: 9px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: translateY(-50%) rotate(45deg);
}

.page-nav__scroll-line {
  height: 40px;
  width: 2px;
  background-color: #8FC31F;
  margin-inline: auto;
  margin-block-start: min(28px, calc(28 / 375 * 100%));
  animation: bg 2.5s cubic-bezier(0.42, 0, 0.58, 1) infinite;
  transform: scaleY(0);
}

@keyframes bg {
  0% {
    transform: scaleY(0);
    transform-origin: top;
  }
  50% {
    transform: scaleY(1);
    transform-origin: top;
  }
  51% {
    transform: scaleY(1);
    transform-origin: bottom;
  }
  100% {
    transform: scaleY(0);
    transform-origin: bottom;
  }
}


@media screen and (max-width: 360px) {
  /* .page-nav {
    padding-inline: 12px;
  }

  .page-nav__link {
    padding: 14px 14px 18px;
    min-height: 96px;
  }

  .page-nav__title {
    font-size: 1.1rem;
  } */
}


/* content__discription
--------------------------------*/
.content__discription-text {
  text-align: center;
  margin-block-end: min(32px, calc(32 / 375 * 100%));
}

.content__discription-sub-text {
  font-size: 1.4rem;
  line-height: 2;
  padding-block-end: min(15px, calc(15 / 375 * 100%));
  margin-block-end: min(35px, calc(35 / 375 * 100%));
  text-align: center;
}

.content__discription-sub-text {
  background-image: url(../img/bg-sub_description_left.png), url(../img/bg-sub_description_right.png);
  background-repeat: no-repeat, no-repeat;
  background-position: left top, right top;
  background-size: contain, contain;
}

/* content__timeline
--------------------------------*/
.content__timeline {
  padding-block: min(65px, calc(65 / 375 * 100%)) min(48px, calc(48 / 375 * 100%));
  background: url(../img/bg-timeline_top.png), #FFFCD8;
  background-repeat: no-repeat;
  background-size: contain;
}

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

/* content__shop
--------------------------------*/
.content__shop {
  padding-block: min(60px, calc(60 / 375 * 100%));
}

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

.content__shop-list {
  margin-block-start: min(24px, calc(24 / 375 * 100%));
}

.content__shop-item {
  list-style: none;
}

.content__shop-item:not(:first-child) {
  margin-block-start: min(16px, calc(16 / 375 * 100%));
}

.shop-card {
  position: relative;
  background: #fff;
  border: 2px solid #f17cb8;
  border-radius: 5px;
  padding: min(16px, calc(16 / 335 * 100%));
  box-shadow: 0 3px 5px rgba(0,0,0,0.1);
}

.renewal .shop-card {
  border: 2px solid #8FC31F;
}

.shop-card__tag {
  position: absolute;
  top: 0;
  left: 0;
  background: #f06aa9;
  color: #fff;
  font-weight: bold;
  letter-spacing: 0.05em;
  font-size: 1.6rem;
  padding: min(8px, calc(8 / 335 * 100%)) min(15px, calc(15 / 335 * 100%)) min(10px, calc(10 / 335 * 100%));
  border-radius: 3px 0 0 0;
  min-width: 125px;
  text-align: center;
}

.renewal .shop-card__tag {
  background: #8FC31F;
}

.shop-card__logo {
  padding: min(8px, calc(8 / 335 * 100%));
  width: 50%;
  margin-inline-start: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.shop-card__logo img {
  max-width: 80%;
  height: auto;
}

.shop-card__body {
  display: grid;
  grid-template-columns: 48% 48%;
  gap: 4%;
  align-items: start;
  margin-block-start: min(8px, calc(8 / 335 * 100%));
}

.shop-card__media img {
  width: 100%;
  border-radius: 4px;
}

.shop-card__detail {
  display: grid;
  gap: 10px;
}

.shop-card__open {
  font-size: 1.4rem;
  font-weight: bold;
}

.shop-card__text {
  font-size: 1.2rem;
  line-height: 1.55;
  margin-block-start: min(8px, calc(8 / 335 * 100%));
}

.shop-card__footer {
  display: flex;
  align-items: center;
  gap: min(10px, calc(10 / 335 * 100%));
  margin-block-start: min(10px, calc(10 / 335 * 100%));
}

.shop-card__floor {
  background: #111;
  color: #fff;
  font-weight: bold;
  font-size: 1.4rem;
  padding: min(5px, calc(5 / 335 * 100%)) min(12px, calc(12 / 335 * 100%));
  border-radius: 2px;
  min-width: 50px;
  text-align: center;
}

.shop-card__name {
  font-size: 1.4rem;
  font-weight: bold;
}

/* swiper shop logo (equal speed) */
.shoplogo-swiper .swiper-wrapper {
  transition-timing-function: linear !important;
}

.content__shop-swqiper {
  margin-block-start: min(25px, calc(25 / 375 * 100%));
}

/* content__event
--------------------------------*/
.content__event {
  padding-block: min(60px, calc(60 / 375 * 100%));
  background: linear-gradient(to bottom,#fff 0, #FFF0F7 10%, #FFF0F7 90%, #fff 100%);
}

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

.content__event-list {
  margin-block-start: min(24px, calc(24 / 375 * 100%));
  text-align: center;
}

.content__event-item {
  list-style: none;
}

.content__event-item:not(:first-child) {
  margin-block-start: min(16px, calc(16 / 375 * 100%));
}

.content__event-swiper {
  padding-bottom: 30px;
  width: 100%;
  max-width: 600px; /* カード幅制限 */
  margin: 0 auto;
  overflow: visible;
}

.content__event-swiper .swiper-slide {
  height: auto;
  transition: transform 0.3s;
  transform: translateY(-24px);
}

.content__event-swiper .swiper-slide-active {
  transform: translateY(0);
}

.content__event-card {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  height: 100%;
}

.content__event-card-image {
  width: 100%;
  position: relative;
  overflow: hidden;
}

.content__event-card-image img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
  transition: transform 0.3s
}

@media (hover: hover) and (pointer: fine) {
  .content__event-card-image a:hover img{
    transform: scale(1.03);
  }
}

.content__event-card-body {
  padding-block: min(16px, calc(16 / 295 * 100%)) min(36px, calc(36 / 295 * 100%));
  padding-inline: min(28px, calc(28 / 295 * 100%));
  text-align: left;
}

.content__event-card-title {
  color: #EB6EA5; /* 画像のピンクに近い色 */
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 1.25;
  margin-block-end: min(16px, calc(16 / 223 * 100%));
}

.content__event-card-detail {
  font-size: 1.4rem;
  line-height: 1.5;
  color: #333;
}

.content__event-card-row {
  display: flex;
  align-items: flex-start;
  margin-bottom: 8px;
}

.content__event-card-row:last-child {
  margin-bottom: 0;
}

.content__event-card-row dt {
  background-color: #000;
  color: #fff;
  font-weight: bold;
  padding-inline: min(8px, calc(8 / 223 * 100%));
  padding-block: min(4px, calc(4 / 223 * 100%)) min(5px, calc(8 / 223 * 100%));
  border-radius: 2px;
  margin-inline-end:  min(8px, calc(8 / 223 * 100%));
  white-space: nowrap;
  font-size: 1.4rem;
  line-height: 1.4;
  min-width: 3.5em;
  text-align: center;
}

.content__event-card-row dd {
  flex: 1;
}

.content__event-swiper .swiper-button-prev,
.content__event-swiper .swiper-button-next {
  color: #fff;
  background: #000000;
  opacity: 0.5;
  width: 40px;
  height: 40px;
  top: min(210px, 38vw);
  border-radius: 5px;
}

.content__event-swiper .swiper-button-prev::after,
.content__event-swiper .swiper-button-next::after {
  font-size: 20px;
  font-weight: bold;
}

.content__event-swiper .swiper-pagination-bullet-active {
  background: #E62686;
}


/* content__benefits
--------------------------------*/
.content__benefits {
  padding-block: min(60px, calc(60 / 375 * 100%));
  background: repeating-linear-gradient(-45deg, #FEFCEF 0 4px, #ffffff 4px 16px);
  background-size: 100%;
}

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

.content__benefits-sub-title {
  display: block;
  margin-block-start: min(10px, calc(10 / 375 * 100%));
  font-size: 1.3rem;
  font-weight: bold;
}

.content__benefits-list {
  margin-block-start: min(24px, calc(24 / 375 * 100%));
  text-align: center;
}

.content__benefits-item {
  list-style: none;
}

.content__benefits-item:not(:first-child) {
  margin-block-start: min(16px, calc(16 / 375 * 100%));
}

/* Benefits Swiper Styles */
.content__benefits-swiper {
  padding-bottom: 30px;
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
  overflow: visible;
}

.content__benefits-swiper .swiper-slide {
  height: auto;
  transition: transform 0.3s;
  transform: translateY(20px);
}

.content__benefits-swiper .swiper-slide-active {
  transform: translateY(0);
}

.content__benefits-card {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.content__benefits-card-image {
  width: 100%;
  position: relative;
}

.content__benefits-card-image img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

.content__benefits-card-body {
  padding-block: min(16px, calc(16 / 295 * 100%)) min(36px, calc(36 / 295 * 100%));
  padding-inline: min(28px, calc(28 / 295 * 100%));
  text-align: left;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.content__benefits-card-text {
  font-size: 1.2rem;
  line-height: 1.5;
  color: #333;
  margin-block-end: min(5px, calc(5 / 375 * 100%));
}

.content__benefits-card-off {
  color: #EB6EA5;
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 1.2;
  margin-block-end: min(8px, calc(8 / 375 * 100%));
}

.content__benefits-card-note {
  font-size: 1.0rem;
  line-height: 1.5;
  color: #333;
  text-align: left;
  width: 100%;
}

.content__benefits-card-note:nth-of-type(n + 2) {
  margin-block-start: min(8px, calc(8 / 375 * 100%));
}

.content__benefits-swiper .swiper-button-prev,
.content__benefits-swiper .swiper-button-next {
  color: #fff;
  background: #000000;
  opacity: 0.5;
  width: 40px;
  height: 40px;
  top: min(210px, 38vw);
  border-radius: 5px;
}

.content__benefits-swiper .swiper-button-prev::after,
.content__benefits-swiper .swiper-button-next::after {
  font-size: 20px;
  font-weight: bold;
}

/* content__access
--------------------------------*/
.content__access {
  padding-block: min(60px, calc(60 / 375 * 100%));
  background: url(../img/img-wave.png) no-repeat bottom center,#FFFCD8;
  background-size: 100%;
}

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

.content__access-map {
  margin-block-start: min(24px, calc(24 / 375 * 100%));
}

.contents__googlemap {
  aspect-ratio: 335 / 337;
  width: 100%;
  height: auto;
  margin-inline: auto;
  background-color: #f6f6f6;
  border-radius: 10px;
}

/* content__webflyer
--------------------------------*/
.content__webflyer {
  padding-block: min(60px, calc(60 / 375 * 100%));
  text-align: center;
}

.content__webflyer .content__link-btn {
  margin-block-start: min(57px, calc(57 / 375 * 100%));
}


/* =============================================
   SP Header & Hamburger Menu
============================================= */
.sp-header {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
}

.sp-header__inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 0 0 15px;
  max-width: 500px;
  margin: 0 auto;
  background: #fff;
  height: 60px;
}

.sp-header__logo img {
  height: 30px;
  width: auto;
}

.sp-header__hamburger {
  width: 60px;
  height: 100%;
  background: #EB6EA5;
  border: none;
  border-radius: 0;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  padding: 10px;
}

.sp-header__hamburger-line {
  display: block;
  width: 20px;
  height: 2px;
  background: #fff;
  transition: 0.3s;
}

.sp-header__hamburger.is-active .sp-header__hamburger-line:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.sp-header__hamburger.is-active .sp-header__hamburger-line:nth-child(2) {
  opacity: 0;
}

.sp-header__hamburger.is-active .sp-header__hamburger-line:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* SP Menu */
.sp-menu {
  display: none;
  position: fixed;
  top: 60px;
  left: 0;
  right: 0;
  z-index: 999;
  background: #fff;
  max-height: calc(100vh - 60px);
  overflow-y: auto;
  transform: translateY(-100%);
  opacity: 0;
  transition: transform 0.3s, opacity 0.3s;
  max-width: 500px;
  margin: 0 auto;
  border-radius: 0 0 10px 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.sp-menu.is-open {
  transform: translateY(0);
  opacity: 1;
}

.sp-menu__inner {
  padding: 20px 30px 30px;
}

.sp-menu__title {
  text-align: left;
  margin-bottom: 20px;
  width: 60%;
}

.sp-menu__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sp-menu__item {
  border-bottom: 1px solid #eee;
}

.sp-menu__item:last-child {
  border-bottom: none;
}

.sp-menu__link {
  display: block;
  padding: 15px 10px;
  color: #B61A81;
  text-decoration: none;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1.4;
  position: relative;
  padding-left: 20px;
}

.sp-menu__link::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 8px;
  height: 8px;
  border-top: 2px solid #B61A81;
  border-right: 2px solid #B61A81;
  transform: translateY(-50%) rotate(45deg);
}

.sp-menu__overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.5);
  z-index: 998;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
}

.sp-menu__overlay.is-open {
  opacity: 1;
  visibility: visible;
}

/* =============================================
   PC Fixed Navigation
============================================= */
.pc-nav__overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.4);
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
}

.pc-nav__overlay.is-open {
  opacity: 1;
  visibility: visible;
}

.pc-fixed-nav {
  position: fixed;
  bottom: 30px;
  right: 0;
  z-index: 1000;
  opacity: 1;
  visibility: visible;
  transition: opacity 0.3s, visibility 0.3s;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 70px;
}

.pc-fixed-nav.is-visible {
  opacity: 1;
  visibility: visible;
}

.pc-nav {
  position: relative;
}

.pc-nav__toggle {
  display: flex;
  align-items: center;
  gap: 20px;
  background: #B61A81;
  border: none;
  width: 100%;
  border-radius: 6px 0 0 6px;
  cursor: pointer;
  padding-inline: 18px 20px;
  padding-block: 15px;
  transition: 0.3s;
}

@media (hover: hover) and (pointer: fine) {
  .pc-nav__toggle:hover {
    opacity: 0.9;
  }
}

.pc-nav__toggle.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.pc-nav__toggle-icon {
  display: block;
  width: 22px;
  height: 16px;
  position: relative;
  border-top: 2px solid #fff;
  border-bottom: 2px solid #fff;
}

.pc-nav__toggle-icon::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background: #fff;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.pc-nav__toggle-text {
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
  letter-spacing: 0.1em;
}

.pc-nav__menu {
  position: absolute;
  bottom: 0;
  right: 0;
  background: #B61A81;
  border-radius: 5px 0 0 5px;
  padding: 19px 21px 25px 73px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.15);
  opacity: 0;
  visibility: hidden;
  transform: scaleX(0.3) scaleY(0.5);
  transform-origin: right bottom;
  transition: opacity 0.3s, visibility 0.3s, transform 0.3s, min-width 0.3s;
}

.pc-nav__menu.is-open {
  opacity: 1;
  visibility: visible;
  transform: scaleX(1) scaleY(1);
  min-width: 450px;
}

.pc-nav__close {
  position: absolute;
  top: -40px;
  right: 0;
  width: 40px;
  height: 40px;
  background: transparent;
  border: none;
  color: #fff;
  font-size: 36px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (hover: hover) and (pointer: fine) {
 .pc-nav__close:hover {
    opacity: 0.8;
  }
}


.pc-nav__title {
  font-size: 2.2rem;
  font-weight: bold;
  color: #fff;
  text-align: right;
  margin-bottom: 15px;
  letter-spacing: 0.1em;
}

.pc-nav__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px 20px;
}

.pc-nav__item {
  position: relative;
}

.pc-nav__link {
  display: block;
  color: #fff;
  text-decoration: none;
  font-size: 1.5rem;
  font-weight: bold;
  padding: 5px 0;
  padding-left: 20px;
  transition: 0.3s;
  white-space: nowrap;
}

.pc-nav__link::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 6px;
  height: 6px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: translateY(-50%) rotate(135deg);
}

@media (hover: hover) and (pointer: fine) {
  .pc-nav__link:hover {
    opacity: 0.7;
  }
}

/* PC TOP Button */
.pc-top {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  margin-inline: auto;
}

.pc-top__text {
  font-size: 1.2rem;
  font-weight: bold;
}

.pc-top__btn {
  width: 90px;
  height: 90px;
  background: #8FC31F;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #fff;
  transition: 0.3s;
}

@media (hover: hover) and (pointer: fine) {
  .pc-top__btn:hover {
    transform: scale(1.05);
  }
}

.pc-top__icon {
  display: block;
  width: 10px;
  height: 10px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(-45deg);
  margin-top: 6px;
}

/* =============================================
   Responsive
============================================= */
@media screen and (max-width: 767px) {
  .sp-header {
    display: block;
  }

  .sp-menu {
    display: block;
  }

  .sp-menu__overlay {
    display: block;
  }

  .pc-fixed-nav {
    display: none;
  }

  #main {
    padding-top: 60px;
  }
}

@media screen and (min-width: 768px) {
  .sp-header {
    display: none;
  }

  .sp-menu {
    display: none;
  }

  .sp-menu__overlay {
    display: none;
  }

  .pc-fixed-nav {
    display: flex;
  }
}

/*-----------------------
footer
-------------------------*/
footer .inner {
  position: relative;
}

footer .inner {
  padding: 0;
  overflow: visible;
}

#footerInfo {
  background: #eee;
  padding: 15px 10px 0;
  color: #333;
}
#footerInfo .infoWrap {
  float: none;
  font-size: 11px;
  padding-bottom: 15px;
}
#footerInfo .address {
  float: none;
  margin-left: 0;
  margin-bottom: 0;
}
#footerInfo .address + p {
  margin-top: 15px;
}
#footerInfo .phoneTxt {
  color: #333;
}

#copyright {
  position: relative;
  margin: 0 -10px;
  text-align: center;
  color: #fff;
  right: 0;
  bottom: 0;
  font-size: 11px;
  background: #333;
  padding: 10px 0;
}

.site-footer__address {
  line-height: 1.5;
  padding-block-end: min(10px, calc(10 / 375 * 100%));
}