@charset "utf-8";
/* CSS Document */
:root {
  --width-variable: 100vw;
}
.pc-only {
	display: none !important;
}
html {
	font-size: 62.5%;
}
body {
	font-size: 1.6rem;
	font-family: YakuHanJP, 'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", sans-serif;
	color: #333;
	line-height: 1.8;
	font-weight: 400;
}

p {
	line-height: 1.8;
	font-feature-settings: "palt";
}
h1, h2, h3, h4, h5 {
	font-weight: 500;
	line-height: 1.5;
	font-feature-settings: "palt";
} 
.inner {
	width: 100%;
	padding: 0 4%;
}
img {
	max-width: 100%;
}
/*--------------swiper-----------------*/
/* .swiper-pagination-bullets {
    position: static;
    margin-top: 16px;
}
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after, .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {
	font-size: 2.5rem;
	color: #393939;
}
.swiper-pagination-bullet-active {
	background: #5e5e60;
}
.swiper-button-next, .swiper-rtl .swiper-button-prev {
	right: 0px !important;
}
.swiper-button-prev, .swiper-rtl .swiper-button-next {
	left: 0px !important;
} */
/*-----------------------------------*/
.fade {
	opacity: 0;
	transform: translate(0, 3rem);
	transition: .8s cubic-bezier(.64,.24,.42,.88);
}
.fade.active {
	opacity: 1;
	transform: translate(0, 0);
}
.zoom {
	opacity: 0;
	transform: scale(0);
	transition: .4s cubic-bezier(.09,.49,.43,.96);
}
.zoom.active {
	opacity: 1;
	transform: scale(1);
}
/*----------------------------------------------------------------------------------------------------------------*/
.mainvisual{
  /* background: url(../img/mv-bg.webp) no-repeat;
  background-size: cover;
  background-position: center;
  height: calc(var(--width-variable) / 0.707); */
}
.mainvisual img {
	width: 100%;
}
.mainvisual h1 {
	position: absolute;
	top: 0;
	left: 2%;
	width: 50%;
}
/* .mv__title{
  position: absolute;
  width: 100%;
  top:15%;
}
.mv__text{
  position: absolute;
  width: 87.46%;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
} */
/*----------------------------------------------------------------------------------------------------------------*/
.cta{
  position: relative;
  background: url(../img/cta-area-sp.webp) no-repeat;
  background-size: cover;
  background-position: center;
  height: calc(var(--width-variable) / 0.833); 
  padding: calc(var(--width-variable) / 12.5) 0 calc(var(--width-variable) / 4.68);
}
.cta__text{
  position: absolute;
  width: calc(var(--width-variable) / 1.264); 
  left: 50%;
  transform: translateX(-50%);
}
.cta__btn{
  position: absolute;
  width: calc(var(--width-variable) / 1.217); 
  left: 50%;
  transform: translateX(-50%);
  bottom: 16%;
}
/*----------------------------------------------------------------------------------------------------------------*/
.fuan{
  padding: 6rem 0;
}
.fuan__title{
  width: calc(var(--width-variable) / 1.5); 
  padding-bottom: calc(var(--width-variable) / 10.714);
  margin: 0 auto;
}
.fuan__img{
  width: calc(var(--width-variable) / 1.19); 
  margin: 0 auto;
}
/*----------------------------------------------------------------------------------------------------------------*/
.fair {
	background-color: #fff7d4;
	padding: 8rem 0 5rem;
}
.fair__title{
  width: calc(var(--width-variable) / 1.423); 
  padding-bottom: calc(var(--width-variable) / 12.5);
  margin: 0 6% 0 auto;
}
.fair__text{
  width: 100%;
  padding-bottom: calc(var(--width-variable) / 7.5);
}
.fair__img{
  padding-bottom: calc(var(--width-variable) / 15);
}
.fair__list{
  padding-bottom: calc(var(--width-variable) / 9.375);
}

.fair__item+.fair__item{
  margin-top: 4rem;
}
/*----------------------------------------------------------------------------------------------------------------*/
.entry {
	background-color: #eff7e4;
	padding: 4rem 0 5rem;
}
.entry h3 {
  font-size: 2.4rem;
  font-weight: 700;
	padding: 0 0 2rem;
  text-align: center;
}
.entry__flow {
  width: calc(var(--width-variable) / 1.5);
  margin: 0 auto; 
}
/*----------------------------------------------------------------------------------------------------------------*/
.cta__end{
  position: relative;
  background: url(../img/cta-area2-sp.webp) no-repeat;
  background-size: cover;
  background-position: center;
  height: calc(var(--width-variable) / 0.728); 
  padding-bottom: calc(var(--width-variable) / 9.375);
}
.cta__text--2{
  position: absolute;
  width: calc(var(--width-variable) / 1.1); 
  top:8%;
  left: 50%;
  transform: translateX(-50%);
}
.cta__btn--2{
  position: absolute;
  width: calc(var(--width-variable) / 1.217); 
  left: 50%;
  transform: translateX(-50%);
  bottom: 7%;
}

/*----------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------タブレット／ブレイクポイント-------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width:768px) {
	.sp-only {
		display: none !important;
	}
	.pc-only {
		display: block !important;
	}
	a[href^="tel:"] {
		pointer-events: none;
	}
	.inner {
		padding: 0 3rem;
	}
	/*----------------------------------------------------------------------------------------------------------------*/
	.mainvisual h1 {
		width: 19.46%;
	}
  .cta{
    position: relative;
    background: url(../img/cta-area.webp) no-repeat;
    background-size: cover;
    background-position: center;
    height: calc(var(--width-variable) / 3.023); 
    padding: calc(var(--width-variable) / 21.666) 0;
  }
  .cta__text{
    position: absolute;
    width: calc(var(--width-variable) / 1.264); 
  }
  .cta__btn{
    position: absolute;
    width: calc(var(--width-variable) / 2.177); 
    bottom: 12%;
    /* display: block;
    width: 40rem; */
  }
 	/*----------------------------------------------------------------------------------------------------------------*/
  .fuan{
    padding: 8rem 0 13.2rem;
  }
  .fuan__title{
    width: calc(var(--width-variable) / 1.274); 
    padding-bottom: calc(var(--width-variable) / 43.333);
    text-align: center;
    margin: 0 auto;
  }
  .fuan__img{
    width: calc(var(--width-variable) / 1.19); 
    margin: 0 auto;
  }
  /*----------------------------------------------------------------------------------------------------------------*/
  .fair {
    padding: 10rem 0 8rem;
  }
  .fair__title{
    width: calc(var(--width-variable) / 2.188); 
    padding-bottom: calc(var(--width-variable) / 26);
    margin: 0 25% 0 auto;
    text-align: center;
  }
  .fair__text{
    width: calc(var(--width-variable) / 1.756);
    margin: 0 auto;
    text-align: center;
    padding-bottom: calc(var(--width-variable) / 16.25);
  }
  .fair__subtitle{
    width: 100%;
    margin: 0 auto;
  }
  .fair__list{
    display: flex;
    justify-content: space-between;
    padding-bottom: calc(var(--width-variable) / 32.5);
  }
  .fair__item{
    width: 46%;
    img{
      width: 100%;
    }
  }
  .fair__img{
    padding-bottom: calc(var(--width-variable) / 15);
  }
  .fair__item+.fair__item{
    margin-top: 0;
  }
	/*----------------------------------------------------------------------------------------------------------------*/
  .lifestyle__img{
    width: 100vw;
    img{
      width: 100%;
    }
  }
	/*----------------------------------------------------------------------------------------------------------------*/
  .entry {
    padding: 9rem 0 10rem;
  }
  .entry h3 {
    font-size: calc(var(--width-variable) / 32.5);
    padding: 0 0 6rem;
  }
  .entry__flow {
    width: 100%;
  }
	/*----------------------------------------------------------------------------------------------------------------*/
  .cta__end{
    position: relative;
    background: url(../img/cta-area2.webp) no-repeat;
    background-size: cover;
    background-position: center;
    height: calc(var(--width-variable) / 2.031); 
    padding-bottom: calc(var(--width-variable) / 9.375);
  }
  .cta__text--2{
    position: absolute;
    width: calc(var(--width-variable) / 1.279); 
    top:12%;
  }
  .cta__btn--2{
    position: absolute;
    width: calc(var(--width-variable) / 2.25); 
    left: 50%;
    transform: translateX(-50%);
    bottom: 8%;
  }

}
/*----------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------PC／ブレイクポイント-------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------*/
	@media screen and (min-width:1100px) {
		.inner {
			width: 1100px;
			margin: 0 auto;
			padding: 0;
		}
    .mainvisual img {
      width: 100vw;
    }
    .fuan__title{
      width: 1100px;
    }
    .fuan__img{
      width: 1100px; 
      margin: 0 auto;
    }
		/*----------------------------------------------------------------------------------------------------------------*/
    .cta{
      height: 43rem; 
      padding: 6rem 0;
    }
    .cta__text{
      position: absolute;
      width: 103.8rem;
      text-align: center;
    }
    .cta__btn{
      position: absolute;
      bottom: 9%;
      width: 60rem;
    }
		/*----------------------------------------------------------------------------------------------------------------*/

    .fair__text{
      width: 1100px;
      padding-bottom: 8rem;
    }
    .fair__title{
      width: 100%;
      margin: 0 auto;
      padding-bottom: 5rem;
      img{
        padding-left: 4rem;
      }
    }
    .fair__img{
      padding-bottom: 4rem;
    }
    /*----------------------------------------------------------------------------------------------------------------*/
    .entry h3 {
      font-size: 4rem;
    }
		/*----------------------------------------------------------------------------------------------------------------*/
    .cta__end{
      height: 700px;
    }
    .cta__text--2{
      position: absolute;
      width: 110rem; 
      top:15%;
      padding-left: 5rem;
    }
    .cta__btn--2{
      width: 60rem;
    }


		/*----------------------------------------------------------------------------------------------------------------*/

		/*----------------------------------------------------------------------------------------------------------------*/

	}
	@media screen and (max-width:360px) {
		.inner {
			padding: 0 3%;
		}
		
	}