@charset "utf-8";
/* ======
page-name #frontPage
======*/
/* --- p-front-gb -------------------- */
.p-front-gb .videoBox {
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  overflow: hidden;
}
.p-front-gb .videoBox video {
  width: auto;
  height: auto;
  min-width: 100%;
  min-height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@supports (object-fit: cover) {
  .p-front-gb .videoBox video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
  }
}

/* --- p-front-top -------------------- */
.p-front-top {
  display: flex;
  align-items: center;
  min-height: 100vh;
  color: #fff;
  text-align: center;
  padding: 212px 0 24px;
}
.p-front-top .copy__img {
  display: block;
}
.p-front-top .copy__text {
  display: block;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.6;
  margin: 20px 0 0;
}
.p-front-top .period {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 34px 0 0;
}
.p-front-top .period__text {
  display: inline-block;
  font-size: 3.6rem;
  line-height: 1;
}
.p-front-top .period__arrow {
  display: inline-flex;
  margin: 6px 10px 0;
}
.p-front-top .scrollDown {
  width: 20px;
  height: 40px;
  background: url(../img/top/mv/scrollDown.svg) no-repeat center;
  background-size: contain;
  margin: 80px auto 0;
  position: relative;
}
.p-front-top .scrollDown::before {
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  background: #d9d9d9;
  border-radius: 50%;
  position: absolute;
  top: 6px;
  left: 8px;
  animation: scrollDown 2s ease-out infinite;
}
@keyframes scrollDown {
  0% {
    top: 6px;
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    top: 30px;
    opacity: 0;
  }
}
@media screen and (max-width: 767px) {
  .p-front-top {
    padding: 164px 0 54px;
  }
}

/* --- p-front-about -------------------- */
.p-front-about {
  color: #fff;
  padding: 550px 0 200px;
  background: linear-gradient(
    180deg,
    rgba(22, 78, 147, 0) 0%,
    rgba(24, 74, 146, 0.0525) 17.5%,
    rgba(43, 43, 137, 0.5) 100%
  );
  position: relative;
  overflow: hidden;
}
.p-front-about::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  backdrop-filter: blur(10px);
  mask-image: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 1) 10%,
    rgba(0, 0, 0, 1) 100%
  );
  pointer-events: none;
  z-index: -1;
}
.p-front-about::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: url(../img/top/about/map.svg) no-repeat top 1000px right -40px;
  background-size: 1806px auto;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: -1;
}
.p-front-about .sakuraWrap {
  width: 100%;
  max-width: 1440px;
  height: 100%;
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  z-index: -1;
}
.p-front-about .sakura {
  position: absolute;
}
.p-front-about .sakura--1 {
  top: 200px;
  right: -34px;
}
.p-front-about .sakura--2 {
  top: 320px;
  left: 140px;
}
.p-front-about .sakura--3 {
  top: 280px;
  right: 290px;
}
.p-front-about .sakura--4 {
  top: 1900px;
  left: 60px;
}
.p-front-about .sakura--5 {
  top: 2060px;
  right: 110px;
}
.p-front-about .sakura--6 {
  top: 1050px;
  left: -20px;
}
.p-front-about .sakura--7 {
  top: 2170px;
  right: 50px;
}
.p-front-about .l-inner {
  max-width: 1060px;
}
.p-front-about .contents {
  display: flex;
  justify-content: space-between;
}
.p-front-about .contents .desc {
  width: 60%;
}
.p-front-about .contents .logo {
  width: 38%;
  max-width: 400px;
  margin: 28px 0 0;
}
.p-front-about .heading {
  margin: 0 0 80px;
}
.p-front-about .heading__subText {
  display: block;
  font-size: 1.4rem;
  margin: 16px 0 0;
}
.p-front-about .textBox {
  font-size: 2rem;
  line-height: 2.4;
}
.p-front-about .textBox .c-btn {
  margin-top: 70px;
}
.p-front-about .topic {
  width: 95%;
  max-width: 1360px;
  color: #000;
  background: rgba(255, 255, 255, 0.8);
  border-radius: 24px;
  padding: 80px;
  margin: 430px auto 0;
}
.p-front-about .topicList {
  max-width: 840px;
  margin: 56px auto;
}
.p-front-about .topicList__item {
  font-size: 1.6rem;
  line-height: 1.4;
  padding: 24px 0;
  color: #232f50;
}
.p-front-about .topicList__item + .topicList__item {
  border-top: 1px dashed #000;
}
.p-front-about .topicList__link {
  display: flex;
  width: 100%;
  transition: opacity 0.3s;
}
.p-front-about .topicList__date {
  display: inline-block;
  width: 80px;
  margin: 0 12px 0 0;
}
.p-front-about .topicList__title {
  font-weight: 700;
}
.p-front-about .event {
  width: 95%;
  max-width: 1360px;
  color: #000;
  background: rgba(255, 255, 255, 0.8);
  border-radius: 24px;
  padding: 80px;
  margin: 40px auto 0;
}
.p-front-about .eventList {
  max-width: 840px;
  margin: 56px auto;
}
.p-front-about .eventList__item {
  font-size: 1.6rem;
  line-height: 1.4;
  padding: 24px 0;
  color: #232f50;
}
.p-front-about .eventList__item + .eventList__item {
  border-top: 1px dashed #000;
}
.p-front-about .eventList__link {
  display: flex;
  gap: 16px;
  width: 100%;
  transition: opacity 0.3s;
}
.p-front-about .eventList__link .imgArea {
  width: 200px;
}
.p-front-about .eventList__link .textArea {
  width: calc(100% - 216px);
}
.p-front-about .eventList__date {
  display: inline-block;
  margin: 0 0 8px;
}
.p-front-about .eventList__title {
  font-weight: 700;
  font-size: 2rem;
  margin-bottom: 16px;
}
.p-front-about .eventList__item .catList {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  font-size: 1.4rem;
  font-weight: 700;
}
.p-front-about .banners {
  margin: 0 0 250px;
}
.p-front-about .banners a {
  transition: opacity 0.3s;
}
@media (hover: hover) {
  .p-front-about .topicList__link:hover,
  .p-front-about .eventList__link:hover,
  .p-front-about .banners a:hover {
    opacity: 0.7;
  }
}
@media screen and (max-width: 767px) {
  .p-front-about {
    padding: 550px 0 120px;
  }
  .p-front-about::after {
    background-size: 1024px auto;
    background-position: top 1740px right -20px;
  }
  .p-front-about .sakura--1 {
    width: 80px;
    top: 830px;
    right: -10px;
  }
  .p-front-about .sakura--2 {
    top: 330px;
    left: 100px;
  }
  .p-front-about .sakura--3 {
    top: 290px;
    right: 80px;
  }
  .p-front-about .sakura--4 {
    top: 1270px;
    left: 10px;
  }
  .p-front-about .sakura--5 {
    top: 2354px;
    right: -20px;
  }
  .p-front-about .sakura--6 {
    top: 860px;
    left: -70px;
  }
  .p-front-about .sakura--7 {
    top: 2434px;
    right: auto;
    left: 54px;
  }
  .p-front-about .contents {
    display: block;
  }
  .p-front-about .contents .desc {
    width: 100%;
  }
  .p-front-about .contents .logo {
    width: 200px;
    margin: 80px 0 0;
  }
  .p-front-about .textBox {
    font-size: 1.8rem;
    line-height: 2;
  }
  .p-front-about .topic {
    width: 88%;
    margin-top: 300px;
    padding: 80px 16px;
  }
  .p-front-about .topicList__link {
    display: block;
  }
  .p-front-about .topicList__date {
    margin: 0 0 16px;
  }
  .p-front-about .event {
    width: 88%;
    margin-top: 40px;
    padding: 80px 16px;
  }
  .p-front-about .eventList__link {
    display: block;
  }
  .p-front-about .eventList__link .imgArea {
    width: 100%;
    margin-bottom: 16px;
  }
  .p-front-about .eventList__link .textArea {
    width: 100%;
  }
  .p-front-about .banners {
    margin: 0 0 150px;
  }
}

/* --- p-front-feature -------------------- */
.p-front-feature {
  background: #fff;
  position: relative;
}
.p-front-feature::before {
  content: "";
  display: block;
  width: 100%;
  height: 52px;
  background: url(../img/common/wave01.svg) repeat-x bottom center;
  background-size: 1440px auto;
  position: absolute;
  top: -52px;
  left: 0;
}
.p-front-feature .contents {
  position: relative;
}
.p-front-feature .featureImgWrap {
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  padding: 120px 0 0;
}
.p-front-feature .featureImg {
  width: 100%;
  height: 100vh;
  position: sticky;
  top: 0;
}
.p-front-feature .featureImg__item {
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.4s;
}
.p-front-feature .featureImg__item:first-of-type {
  opacity: 1;
}
.p-front-feature .featureImg__item.is-current {
  opacity: 1;
}
.p-front-feature .featureImg__item.is-currentOff {
  opacity: 0;
}
.p-front-feature .featureCardWrap {
  padding: 120px 0 0;
  overflow: hidden;
}
.p-front-feature .featureCard {
  width: 50%;
  padding: 280px 0 320px;
  margin: 0 0 0 auto;
  position: relative;
  z-index: 1;
}
.p-front-feature .featureCard:last-of-type {
  padding-bottom: 280px;
}
.p-front-feature .featureCard__item {
  width: 80%;
  margin: 0 auto;
}
.p-front-feature .featureCard__num {
  margin: 0 0 80px;
}
.p-front-feature .featureCard__numText {
  display: inline-block;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.4;
  color: #232f50;
  background: url(../img/top/feature/line01.svg) repeat-x bottom left;
  background-size: 120px auto;
  padding: 0 0 10px;
}
.p-front-feature .featureCard__numNum {
  font-size: 4.8rem;
  line-height: 1;
  font-weight: 500;
  margin: 0 0 0 8px;
}
.p-front-feature .featureCard__heading {
  font-weight: 700;
  color: #8ec666;
  margin: 0 0 40px;
}
.p-front-feature .featureCard__title {
  font-size: 4rem;
  line-height: 1.4;
}
.p-front-feature .featureCard__title rt {
  font-size: 1.2rem;
  margin: 0 0 8px;
}
.p-front-feature .featureCard__genre {
  font-size: 1.8rem;
  line-height: 1.4;
  margin: 8px 0 0;
}
.p-front-feature .featureCard__desc {
  font-size: 1.6rem;
  line-height: 1.8;
}
.p-front-feature .c-btn {
  margin: 80px 0 0;
}
/* --- */
.p-front-feature .featureCard .illust {
  position: absolute;
  pointer-events: none;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.p-front-feature .featureCard .illust img {
  max-width: none;
}
.p-front-feature .featureCard .illust--wave {
  width: 150px;
  height: 18px;
  background: url(../img/top/feature/illust_wave.svg);
}
/* --- */
.p-front-feature .featureCard--1 .illust--1 {
  bottom: 90px;
  left: 140px;
}
.p-front-feature .featureCard--1 .illust--2 {
  top: 112px;
  left: 112px;
}
.p-front-feature .featureCard--1 .illust--3 {
  top: 162px;
  left: 530px;
}
.p-front-feature .featureCard--1 .illust--4 {
  top: 216px;
  left: 450px;
}
/* --- */
.p-front-feature .featureCard--2 .featureCard__heading {
  color: #e6616a;
}
.p-front-feature .featureCard--2 .illust--1 {
  bottom: 90px;
  left: 400px;
}
.p-front-feature .featureCard--2 .illust--2 {
  top: 86px;
  left: 500px;
}
.p-front-feature .featureCard--2 .illust--3 {
  top: 360px;
  left: 316px;
}
.p-front-feature .featureCard--2 .illust--4 {
  bottom: -20px;
  left: 26px;
}
/* --- */
.p-front-feature .featureCard--3 .featureCard__heading {
  color: #e6a161;
}
.p-front-feature .featureCard--3 .illust--1 {
  bottom: 100px;
  left: 90px;
}
.p-front-feature .featureCard--3 .illust--2 {
  top: 86px;
  left: 420px;
}
.p-front-feature .featureCard--3 .illust--3 {
  bottom: 70px;
  left: 300px;
}
.p-front-feature .featureCard--3 .illust--4 {
  bottom: 20px;
  left: 176px;
}
/* --- */
.p-front-feature .featureCard--4 .featureCard__heading {
  color: #259ddd;
}
.p-front-feature .featureCard--4 .featureCard__genre span {
  color: #543dc5;
}
.p-front-feature .featureCard--4 .illust--1 {
  top: 108px;
  left: 420px;
}
.p-front-feature .featureCard--4 .illust--2 {
  bottom: 50px;
  left: 105px;
}
.p-front-feature .featureCard--4 .illust--3 {
  top: 40px;
  left: 560px;
}
.p-front-feature .featureCard--4 .illust--4 {
  bottom: 200px;
  left: 510px;
}
.p-front-feature .featureCard--4 .illust--5 {
  bottom: 136px;
  left: -100px;
}
.p-front-feature .featureCard--4 .illust--6 {
  bottom: 84px;
  left: 364px;
}
.p-front-feature .featureCard--6 .featureCard__heading {
  color: #232f50;
}
@media screen and (max-width: 767px) {
  .p-front-feature::before {
    height: 52px;
    background-image: url(../img/common/wave01_sp.svg);
    background-size: 390px auto;
  }
  .p-front-feature .featureCardWrap {
    padding: 160px 0 0;
  }
  .p-front-feature .featureCard {
    width: 100%;
    padding: 0 0 290px;
  }
  .p-front-feature .featureCard.featureCard--5,
  .p-front-feature .featureCard:last-of-type {
    padding-bottom: 120px;
  }
  .p-front-feature .featureCard__img {
    width: 100%;
    height: 430px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    margin: 0 auto 80px;
  }
  /* --- */
  .p-front-feature .featureCard .illust img {
    max-width: 100%;
  }
  /* --- */
  .p-front-feature .featureCard--1 .illust--1 {
    width: 100px;
    left: 0;
    right: 0;
    margin: auto;
  }
  .p-front-feature .featureCard--1 .illust--2 {
    top: 600px;
    left: auto;
    right: 20px;
  }
  .p-front-feature .featureCard--1 .illust--3 {
    top: auto;
    left: auto;
    bottom: 200px;
    right: -30px;
  }
  .p-front-feature .featureCard--1 .illust--4 {
    top: auto;
    left: -20px;
    bottom: 50px;
  }
  /* --- */
  .p-front-feature .featureCard--2 .illust--1 {
    width: 90px;
    bottom: 78px;
    left: 0;
    right: 0;
    margin: auto;
  }
  .p-front-feature .featureCard--2 .illust--2 {
    top: 612px;
    left: auto;
    right: 20px;
  }
  .p-front-feature .featureCard--2 .illust--3 {
    top: auto;
    left: auto;
    bottom: 210px;
    right: -20px;
  }
  .p-front-feature .featureCard--2 .illust--4 {
    top: auto;
    left: -40px;
    bottom: 50px;
  }
  /* --- */
  .p-front-feature .featureCard--3 .illust--1 {
    width: 120px;
    bottom: 100px;
    left: 0;
    right: 0;
    margin: auto;
  }
  .p-front-feature .featureCard--3 .illust--2 {
    top: 680px;
    left: auto;
    right: 40px;
  }
  .p-front-feature .featureCard--3 .illust--3 {
    bottom: 190px;
    left: -40px;
  }
  .p-front-feature .featureCard--3 .illust--4 {
    bottom: 30px;
    left: auto;
    right: 30px;
  }
  /* --- */
  .p-front-feature .featureCard--4 .illust--1 {
    width: 80px;
    top: auto;
    left: 0;
    right: 0;
    bottom: 100px;
    margin: auto;
  }
  .p-front-feature .featureCard--4 .illust--2 {
    width: 100px;
    bottom: 10px;
    left: 0;
    right: 0;
    margin: auto;
  }
  .p-front-feature .featureCard--4 .illust--3 {
    top: 600px;
    left: auto;
    right: 20px;
  }
  .p-front-feature .featureCard--4 .illust--4 {
    display: none;
  }
  .p-front-feature .featureCard--4 .illust--5 {
    bottom: 200px;
    left: auto;
    right: -40px;
  }
  .p-front-feature .featureCard--4 .illust--6 {
    bottom: 54px;
    left: -20px;
  }
  .p-front-feature .featureCard__num {
    margin: 0 0 20px;
  }
}

/* --- p-front-search -------------------- */
.p-front-search {
  padding: 160px 0;
  background: #f2efec;
  position: relative;
}
.p-front-search::before {
  content: "";
  display: block;
  width: 100%;
  height: 52px;
  background: url(../img/common/wave02.svg) repeat-x bottom center;
  background-size: 1440px auto;
  position: absolute;
  top: -52px;
  left: 0;
}
.p-front-search .bnrList {
  max-width: 1360px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 auto 160px;
}
.p-front-search .bnrList__item {
  width: 49.12%;
  text-align: center;
  margin: 0 0 24px;
}
.p-front-search .bnrList__item.big {
  width: 100%;
}
.p-front-search .bnrList__item a {
  display: inline-block;
  transition: opacity 0.3s;
}
@media (hover: hover) {
  .p-front-search .bnrList__item a:hover {
    opacity: 0.7;
  }
}
.p-front-search .c-heading {
  margin: 0 0 80px;
}
.p-front-search .leadBox {
  color: #232f50;
  text-align: center;
  font-weight: 700;
  margin: 80px 0;
}
@media screen and (max-width: 767px) {
  .p-front-search {
    padding: 60px 0;
  }
  .p-front-search .l-inner {
    width: 88%;
  }
  .p-front-search::before {
    height: 52px;
    background-image: url(../img/common/wave02_sp.svg);
    background-size: 390px auto;
  }
  .p-front-search .bnrList {
    width: 92%;
    display: block;
    margin: 0 auto 80px;
  }
  .p-front-search .bnrList__item {
    width: 100%;
    max-width: 400px;
    margin: 0 auto 24px;
  }
  .p-front-search .leadBox {
    width: 92%;
    text-align: left;
    margin: 80px auto;
  }
}

/* --- p-front-ig -------------------- */
.p-front-ig {
  background: url(../img/top/ig/bg.jpg) no-repeat center #fff;
  background-size: cover;
  padding: 177px 0;
}
.p-front-ig .cardList {
  max-width: 1050px;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  margin: 0 auto;
}
.p-front-ig .cardList__item {
  width: calc(100% / 3);
  padding: 10px;
}
.p-front-ig .cardList__link {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 360px;
  background: #fff;
  padding: 64px 32px;
  border-radius: 24px;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  position: relative;
  transition: opacity 0.3s;
}
.p-front-ig .cardList__link::before {
  content: "";
  display: block;
  width: 32px;
  height: 32px;
  background: url(../img/common/icon_arrow02.svg) no-repeat center #232f50;
  background-size: 12px auto;
  border-radius: 50%;
  position: absolute;
  bottom: 32px;
  right: 32px;
}
@media (hover: hover) {
  .p-front-ig .cardList__link:hover {
    opacity: 0.9;
  }
}
@media screen and (max-width: 767px) {
  .p-front-ig {
    padding: 100px 0 180px;
    background-size: 1440px auto;
    background-position: top left;
  }
  .p-front-ig .l-inner {
    width: 85%;
  }
  .p-front-ig .cardList {
    display: block;
  }
  .p-front-ig .cardList__item {
    width: 100%;
    max-width: 400px;
    padding: 0;
    margin: 0 auto 12px;
  }
  .p-front-ig .cardList__link {
    min-height: 240px;
    padding: 30px 44px;
  }
}

/* --- p-front-link -------------------- */
.p-front-link {
  background: #fff;
  padding: 80px 0;
}
.p-front-link .bnrList {
  max-width: 1050px;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  margin: 40px auto 0;
}
.p-front-link .bnrList__item {
  width: calc(100% / 3);
  padding: 8px;
}
.p-front-link .bnrList__link {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #232f50;
  transition: opacity 0.3s;
}
@media (hover: hover) {
  .p-front-link .bnrList__link:hover {
    opacity: 0.7;
  }
}
@media screen and (max-width: 767px) {
  .p-front-link .bnrList__item {
    width: 100%;
    max-width: 400px;
    margin: 0 auto 20px;
    padding: 0;
  }
}
/* --- spot-banner -------------------- */
.spot-banner {
  padding: 8% 0 0;
}
.spot-banner a {
  transition: 0.3s;
}
.spot-banner a:hover {
  opacity: 0.7;
}
/* --- p-front-reservation -------------------- */
.p-front-reservation {
  background: #fff;
  padding: 20px 0 80px;
}
.p-front-reservation .front-reservation-inner {
  max-width: 1360px;
  width: 95%;
  margin: 0 auto;
  background: #f2efec;
  position: relative;
  padding: 72px 70px 42px;
}
.p-front-reservation .c-heading-h3 {
  text-align: center;
  font-size: 40px;
  position: absolute;
  max-width: 1360px;
  width: 95%;
  top: -36px;
  right: 0;
  left: 0;
  margin: 0 auto;
}
.p-front-reservation .l-inner__link ul {
  display: flex;
  align-items: center;
  justify-content: left;
  flex-wrap: wrap;
  gap: 35px;
}
.p-front-reservation .l-inner__link ul li a {
  text-decoration: underline;
  display: inline-block;
  padding-right: 40px;
  background: url(../img/common/icon_arrow04.png) no-repeat center right;
  background-size: contain;
  transition: 0.3s;
}
.p-front-reservation .l-inner__link ul li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 767px) {
  .p-front-reservation .front-reservation-inner {
    width: 90%;
    padding: 62px 16px 32px;
  }
  .p-front-reservation .c-heading-h3 {
    font-size: 28px;
    top: -26px;
  }
  .p-front-reservation .l-inner__link ul {
    display: block;
  }
  .p-front-reservation .l-inner__link ul li + li {
    margin-top: 20px;
  }
}