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

/*--------------------------------
共通
--------------------------------*/
html{
  font-size: clamp(8px, 2.66vw, 20px);
}

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%;
}

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

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

.main_visual,
.main_section,
.footer{
  overflow: hidden;
}

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

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

.main_header .image {
  width: 100%;
  height: auto;
}

.main_header{
  max-width: 750px;
  width: 100%;
  margin: 0 auto;
}

.header_logo{
  padding: 3%;
  margin-inline: auto;
  width: 39%;
}

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

/* more_btn
--------------------------------*/
.more_btn {
  text-align: right;
  margin-top: 10px;
}

.more_btn a {
  display: inline-block;
  width: 25%;
}

.btn {
  width: 100%;
  display: inline-block;
  text-align: center;
  color: #fff;
  background-color: #ff94bd;
  font-size: 2rem;
  font-weight: bold;
  line-height: 1.3;
  letter-spacing: 0.2em;
  border-radius: 100px;
  padding: 4%;
  position: relative;
  border: 3px solid #fff;
}

@media (hover: hover) {
  .btn:hover {
    opacity: 0.7;
  }
}

.btn-window::after {
  content: '';
  width: min(4vw, 30px);
  height: min(4vw, 30px);
  background: url(../img/window.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  right: 4%;
  top: 50%;
  transform: translateY(-50%);
}

.btn-arrow::after {
  content: '';
  width: min(14px, 1.8667vw);
  height: min(14px, 1.8667vw);
  border: min(14px, 1.8667vw) solid transparent;
  border-left: min(14px, 2.8667vw) solid #fff;
  position: absolute;
  right: 4%;
  top: 50%;
  transform: translateY(-50%);
}

.btn.btn-inversion {
  color: #399139;
  background-color: #fff;
}

.btn.btn-inversion::after {
  border-left: min(14px, 1.8667vw) solid #399139;
}

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

/*--------------------------------
main_section
--------------------------------*/
.main_section_inner{
  position: relative;
}
.main_section_inner .main_section_contents {
  width: 100%;
  margin: 0 auto;
}
.main_title {
  width: 100%;
}
.content_title {
  padding-top: 5%;
}

.page_navi_list {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 1.87%;
  padding-inline: 5.35%;
  padding-block: 8.8%;
  justify-content: space-around;
}

.page_navi_item {
  width: 48.96%;
  text-align: center;
  color: #DD5E56;
  font-size: 1.4rem;
  font-weight: bold;
  margin-bottom: 15px;
  background: #FFF799;
  border-radius: 5px;
}

.page_navi_item a {
  width: 100%;
  display: inline-block;
  padding: 9% 10px 14%;
  position: relative;
}

.page_navi_item:nth-of-type(2) {
  background: #f5ac41;
  color: #fff;
}

.page_navi_item:nth-of-type(3) {
  background: #ff94bd;
  color: #fff;
}

.page_navi_item:nth-of-type(4) {
  background: #EA9313;
}

.page_navi_item:nth-of-type(5) {
  background: #DD5E56;
}

.page_navi_item:nth-of-type(6) {
  background: #EE85AE;
}

.page_navi_item a::after {
  content: '';
  box-sizing: border-box;
	width: min(8px, 1.3333vw);
	height: min(8px, 1.3333vw);
	border: min(8px, 1.3333vw) solid transparent;
	border-top: min(8px, 1.3333vw) solid #DD5E56;
  position: absolute;
  bottom: 8px;
  left: 50%;
  transform: translate(-50%, 50%);
}

.page_navi_item:nth-of-type(2) a::after {
  border-top: min(8px, 1.3333vw) solid #fff;
}

.page_navi_item:nth-of-type(3) a::after {
  border-top: min(8px, 1.3333vw) solid #fff;
}

@media (hover: hover) {
 .page_navi_item a:hover {
    opacity: 0.7;
  }
}

.park_info img {
  width: 100%;
  aspect-ratio: 335 / 200;
  object-fit: cover;
}

/*--------------------------------
event
--------------------------------*/
.lead {
  background: #FFF799;
  position: relative;
  padding-block: 12% 0;
  padding-inline: 5.33%;
}

.lead_title {
  margin-block-end: 8%;
}

.lead_text {
  text-align: center;
  color: #fff;
  font-size: 1.7rem;
  letter-spacing: 0.9px;
  line-height: 1.5;
}

.lead_text:not(:first-of-type) {
  margin-top: 5%;
}

#event .main_content{
  background: radial-gradient(closest-side at 50% 50%, #C6000B 0%, #BE212A 100%);
}

.event_area {
  container-type: inline-size;
  background: #FFF799;
  padding-block: 0 0;
  padding-inline: 5.33%;
}

.event_area .about_item_block {
  padding-top: 12%;
}

.event_area .event_area_items {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 6%;
}

.event_area .event_area_items li {
  width: calc(50% - 10px);
  text-align: center;
  background-color: #fff;
  border-radius: 3.16%;
  overflow: hidden;
}

.event_area .event_area_items li:first-child {
  width: 100%;
}

.event_area .event_area_items li img {
  width: 100%;
}

.event_area .event_area_items li .event_item_txt {
  padding-block: 3.80%;
  font-size: 3.28cqw;
}

.event_area .event_content .swiper-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(24px, 8vw, 60px);
}

.event_area .event_content .swiper-slide {
  display: flex;
  flex-direction: column;
  height: auto;
}

/* content_slide
--------------------------------*/
.content_slide {
  position: relative;
  z-index: 10;
}

.content_slide:not(:first-child) {
  margin-top: 52px;
}

.content_slide:nth-of-type(n + 3) {
  margin-top: 10%;
}
.content_slide .swiper,
.content_slide .swiper2,
.content_slide .swiper-slide
 {
  overflow: hidden;
  border-radius: 10px;
}

.content_slide .content_slide_title{
  text-align: center;
  color: #fff;
  font-size: 2rem;
  font-weight: bold;
  letter-spacing: 1.2px;
  margin-bottom: 3%;
  display:flex;
  justify-content: center;
  align-items: center;
  flex-grow: 1;
}

.content_slide .swiper-pagination-bullets,
.content_slide .swiper-pagination2-bullets {
  position: static;
  margin-top: 5%;
  text-align: center;
} 

.content_slide .swiper-pagination-bullet,
.content_slide .swiper-pagination2-bullet {
  width: 10px !important;
  height: 10px !important;
  margin: 0 0 0 3% !important;
  background: #FFF899 !important;
  border: 1px solid #FFF899;
  box-sizing: border-box;
  opacity: 1;
}

.content_slide .swiper-pagination-bullet-active,
.content_slide .swiper-pagination2-bullet-active {
  width: 10px !important;
  height: 10px !important;
  background: #EB6D9A !important;
}

.content_slide .swiper-pagination-bullet:first-child,
.content_slide .swiper-pagination2-bullet:first-child {
  margin: 0 !important;
}

.to_access {
  padding: 0 30px;
  margin: 40px auto 0;
}

/*-----------------------
facility
-------------------------*/
.facility {
  padding-block: 32.64% 0;
  padding-inline: 8%;
  background: url('../img/bg-line1.png') no-repeat top center/contain #94C350;
}

.facility_content:not(:first-of-type) {
  margin-block-start: 13%;
}

.facility_title {
  margin-block-end: 4%;
}

.facility_content_title {
  width: 84%;
  margin-inline: auto;
  margin-block-end: 4%;
}

.facility_content_image {
  text-align: center;
  margin-block-end: 4%;
}

.facility_content_image video {
  width: 100%;
  height: auto;
  border-radius: 10px;
  max-width: 100%;
  display: block;
}

.facility_content_note {
  text-align: center;
  font-size: 1.5rem;
  color: #fff;
  margin-block-start: 4%;
}

.swiper2 .swiper-slide {
  background-color: #fff;
  border-radius: 10px;
  padding-block: 3% 10%;
  padding-inline: 4%;
  height: auto;
  display: flex;
  flex-direction: column;
}

.facility .instagram-media {
  margin-inline: auto !important;
}

.facility_slide_title {
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  margin-block-end: 4%;
}

.facility_slide_image {
  text-align: center;
  margin-block-end: 4%;
}

.facility_slide_text {
  font-size: 1.4rem;
  line-height: 1.5;
}

.swiper2 {
  overflow: hidden;
  position: relative;
  padding-block-end: 17%;
}

.swiper2 .swiper-pagination-fraction {
  padding-block-end: 0;
  font-size: 2rem;
  font-weight: bold;
  color: #fff;
}

.swiper2 .swiper-button-next,
.swiper2 .swiper-button-prev {
  top: initial;
  bottom: 0;
}

.swiper2 .swiper-button-prev,
.swiper2 .swiper-button-next {
  height: clamp(33px, 10.93vw, 82px);
  width: clamp(48px, 16vw, 120px);
  z-index: 99;
}

.swiper2 .swiper-button-prev::after,
.swiper2 .swiper-button-next::after {
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  height: clamp(33px, 10.93vw, 82px);
  width: clamp(48px, 16vw, 120px);
  margin: auto;
}

.swiper2 .swiper-button-prev::after {
  background-image: url(../img/btn-prev.png);
}

.swiper2 .swiper-button-next::after {
  background-image: url(../img/btn-next.png);
}

/*-----------------------
access
-------------------------*/
.access {
  padding-block: 32.64% 5.5%;
  padding-inline: 8%;
  background: url('../img/bg-line2.png') no-repeat top center/contain #E6C730;
}

.access_title {
  margin-block-end: 4%;
}

/*-----------------------
instruction
-------------------------*/
.instruction {
  padding-block: 32.64% 16%;
  padding-inline: 8%;
  background: url('../img/bg-line3.png') no-repeat top center/contain #f5ac41;
}

.instruction_title {
  margin-block-end: 4%;
}

.instruction_content {
  border-radius: 10px;
  background: #fff;
  padding: 1.7%;
}

.instruction_content_title {
  font-size: 2.5rem;
  font-weight: bold;
  text-align: center;
  padding: 2%;
  background:#f5ac41;
  color: #fff;
  border-radius: 10px 10px 0 0;
}

.instruction_content_text {
  font-size: 1.2rem;
  line-height: 1.5;
  padding: 2%;
}

.instruction_content_text li.note {
  margin-top: 1.5rem;

}

.instruction_content:not(:first-of-type) {
  margin-top: 7%;
}

/*-----------------------
sns
-------------------------*/
.sns {
  padding-block: 32.64% 5.5%;
  padding-inline: 8%;
  background: url('../img/bg-line4.png') no-repeat top center/contain #DD5E56;
}

.sns_title {
  margin-block-end: 4%;
}

.sns_content_list {
  display: flex;
  justify-content: space-between;
  gap: 3%;
  margin-block-end: 15%;
}

.sns_content_title {
  width: 84%;
  margin-inline: auto;
  margin-block-end: 4%;
}

.sns_content .more-access-btn .btn {
  background: #ee7169;
}

/*-----------------------
information
-------------------------*/
.information {
  padding-block: 32.64% 10%;
  padding-inline: 8%;
  background: url('../img/bg-line5.png') no-repeat top center/contain #ff94bd;
}

.information_title {
  margin-block-end: 4%;
}

.information_content {
  margin-block-end: 9%;
}

.information_content_title {
  width: 84%;
  margin-inline: auto;
  margin-block-end: 4%;
}

.information_content_list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(8px, 2.67vw, 20px);
}

.information_content_item:first-of-type {
  grid-column: 1 / 3;
}

.information_content .more-access-btn .btn{
  background: #FFF799;
  color: #EB6D9A;
}

.information_content .btn-arrow::after {
  border-left: min(14px, 2.8667vw) solid #EB6D9A;
}


/*---------------------------------------------------------------------------*/
.more-access-btn {
  margin-top: 12%;
  padding-bottom: 5.5%;
}

/*-----------------------
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;
}

#pagetop {
  display: block;
}

#pagetop .fade {
  background: #888;
}
#pagetop a {
  width: 100%;
  display: inline-block;
  text-align: center;
  color: #fff;
  font-size: min(40px, 5.333vw);
  font-weight: bold;
  letter-spacing: 6px;
  line-height: 30px;
  background-color: #399139;
  padding: 8px 10px 10px;
  position: relative;
}

#pagetop a::after {
  content: '';
  width: min(24px, 3.2vw);
  height: min(16px, 2.133vw);
  border: min(16px, 2.133vw) solid transparent;
  border-bottom: min(24px, 3.2vw) solid #fff;
  position: absolute;
  right: 28.5px;
  top: 50%;
  transform: translateY(-75%);
}

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

/*-----------------------
Fade in
-------------------------*/
span.fade{
  display: block;
}
.fade {
  opacity: 0;
  visibility: hidden;
  transform: translateY(100px);
  transition: opacity 1s,visibility 1s, transform 1s;
}

.scroll {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}

/* -------------------------------------
  flex-nav
------------------------------------- */
.flex-nav {
  position: fixed;
  bottom: 20px;
  width: 18%;
  right: 0;
  z-index: 5;
  opacity: 0;
  transition: opacity 0.4s ease;
  /* padding: min(20px, 3%) 1% 1% 1%;
  background: #ee85ae;
  text-align: center;
  font-weight: bold; */
  /* color: #fff; */
  /* border: 2px solid #fff;
  border-radius: 5px 0 0 5px; */
}

.flex-nav.show {
  opacity: 1;
  pointer-events: auto;
}

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

.flex-nav::after {
  /* content: '';
  width: min(8px, 1.8667vw);
  height: min(8px, 1.8667vw);
  border: min(8px, 1.8667vw) solid transparent;
  border-bottom: min(8px, 2.8667vw) solid #fff;
  position: absolute;
  right: 0;
  left: 0;
  margin-inline: auto;
  top: -3px; */
}