/* setting */
/* ============================================ */
:root{
  --width: 1200px;
  --width-2: 945px;
  /* ==================== */
  --width-lg: var(--width);
  --width-md: var(--width-2);
}
html{
  background-color: #006DFE;
}
body{
  position: relative;
  font-family: 'Noto Sans JP', sans-serif;
  letter-spacing: 0.03em;
  color: #fff;
  font-size: 16px;
  line-height: 1.7;
}
img{
  max-width: 100%;
  height: auto;
  image-rendering: -webkit-optimize-contrast;
}
::-webkit-full-page-media, :future, :root img{
  image-rendering: unset;
}
a{
  transition: 0.3s;
}
a:hover{
  opacity: 0.8;
}


/* layout */
/* ============================================ */
a[href^="tel:"]{
  pointer-events: none;
}
._sp{
  display: none;
}
.container{
  position: relative;
  width: 100%;
  max-width: var(--width-lg);
  margin: 0 auto;
}
.inner{
  position: relative;
  width: 95%;
  max-width: var(--width-md);
  margin: 0 auto;
}
@media (max-width: 768px){
  a[href^="tel:"]{
    pointer-events: auto;
  }
  ._pc{
		display: none;
	}
	._sp{
		display: block;
	}
  .inner{
    width: 80%;
  }
}


/* mv */
/* ============================================ */
.mv{
  position: relative;
  padding: 60px 0 40px;
  height: 714px;
}
.mv_video{
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
}
.mv_video video{
  max-width: 100%;
  height: 100%;
  object-fit: cover;
}
.mv_content{
  display: flex;
  gap: 40px;
}
.mv_content__lt{
  width: 58%;
}
.mv_content__lt img{
  margin-bottom: 30px;
}
.mv_content__lt p{
  font-size: clamp(16px,1.8vw,18px);
  font-weight: 600;
}
.mv_content__rt{
  width: 42%;
  margin-top: 7%;
}
@media (max-width: 768px){
  .mv{
    padding: 7% 0;
    height: 70%;
  }
  .mv_content{
    flex-wrap: wrap;
    gap: 10px;
  }
  .mv_content__lt{
    width: 100%;
  }
  .mv_content__lt img{
    margin-bottom: 10px;
  }
  .mv_content__rt{
    width: 100%;
    margin-top: 0;
  }
  .mv_content__lt p{
    font-size: clamp(10px,2vw,16px);
  }
}


/* slide */
/* ============================================ */
.slide_area{
  background: url(../image/bg-slide.jpg) no-repeat center / cover;
  padding-bottom: 80px;
}
.swiper{
  margin-bottom: 70px;
  background-color: #fff;
}
.swiper-wrapper {
  width: 100%;
}
.swiper-slide{
  background-color: #fff;
}
.swiper-button-prev,
.swiper-button-next {
  height: 65px;
  width: 65px;
  transition: 0.3s;
}
.swiper-button-prev:hover,
.swiper-button-next:hover{
  opacity: 0.8;
}
.swiper-button-prev:after,
.swiper-button-next:after {
  content: "";
  background-repeat: no-repeat;
  background-size: contain;
  height: 52px;
  width: 52px;
}
.swiper-button-next::after,
.swiper-button-prev::after {
  background-image: url(../image/icon-arrow.png);
}
.swiper-button-prev::after {
  transform: scaleX(-1);
}
@media (max-width: 768px){
  .slide_area{
    background: url(../image/bg-slide-sp.jpg) no-repeat center / cover;
    padding-bottom: 40px;
  }
  .movie_list__wrap{
    width: 80%;
    margin: 0 auto 10%;
  }
  .movie_list:not(:last-child){
    margin-bottom: 5%;
  }
  .movie_list a{
    display: block;
  }
  .movie_list a:hover{
    opacity: 1;
    filter: brightness(0.9);
  }
}
@media (max-width: 428px){
  .swiper{
    max-width: 240px;
  }
  .fancybox-slide{
    padding: 5%;
  }
}


/* button */
/* ============================================ */
[class^="button_primary"] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 600px;
  height: 70px;
  font-size: clamp(16px,4.1vw,32px);
  letter-spacing: 0.03em;
  font-weight: 700;
  padding: 0 20px;
  border-radius: 50vw;
}
[class^="button_primary"]:hover{
  transform: scale(1.1);
  opacity: 1;
}
.slide_area [class^="button_primary"] {
  margin: 0 auto;
}
.slide_area [class^="button_primary"]:not(:last-child){
  margin-bottom: 30px;
}
.button_primary__pink{
  background: #ff2dff url(../image/icon-button-arrow01.svg) 85% center / 15px no-repeat;
}
.button_primary__white{
  background: #fff url(../image/icon-button-arrow02.svg) 15% center / 15px no-repeat;
  color: #000;
}
@media (max-width: 420px){
  [class^="button_primary"]{
    max-width: 300px;
    height: 35px;
  }
  .slide_area [class^="button_primary"]:not(:last-child){
    margin-bottom: 15px;
  }
  .button_primary__pink{
    background: #ff2dff url(../image/icon-button-arrow01.svg) 85% center / 8px no-repeat;
  }
  .button_primary__white{
    background: #fff url(../image/icon-button-arrow02.svg) 15% center / 8px no-repeat;
    color: #000;
  }
}