@charset "UTF-8";
/* base
------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Spartan:wght@400;700&display=swap");
:root {
  --easing: cubic-bezier(.2, 1, .2, 1);
  --transition: .8s var(--easing);
  --color-base: #f8f8f8;
  --color-gray: #292929;
  --color-white: #fff;
  --color-theme: #f5695f;
  --color-theme-darken: #f12617;
}

.l-inner { position: relative; -webkit-box-sizing: content-box; box-sizing: content-box; max-width: 750px; margin: 0 auto; padding: 0 10rem; }

@media only screen and (max-width: 1024px) {
  .l-inner { padding: 0 0rem; }
}

.l-section .l-inner { padding-top: 0rem; padding-bottom: 8rem; }


/* design
------------------------------*/



/* slider */
[class*=swiper]:focus { outline: none; }

.slide-media { position: relative; overflow: hidden; }
.slide-media img { position: absolute; top: 0; left: 0; width: 100%; -o-object-fit: contain; object-fit: contain; }

/* 前へ / 次へボタン */
.swiper-button-prev, .swiper-button-next { display: grid; place-content: center; width: 6.4rem; height: 6.4rem; cursor: pointer; -webkit-transition: var(--transition); transition: var(--transition); }
@media only screen and (min-width: 1025px) {
  .swiper-button-prev::before, .swiper-button-next::before {
    -webkit-transition: var(--transition); transition: var(--transition);
  }
  .swiper-button-prev:hover::before, .swiper-button-next:hover::before {
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
  }
}
.swiper-button-prev::before, .swiper-button-next::before {
  position: absolute; top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: "";
  border-radius: 50%;
  -webkit-box-shadow: var(--box-shadow);
          box-shadow: var(--box-shadow);
}
.swiper-button-prev::after, .swiper-button-next::after {
  width: 0.8rem;
  height: 0.8rem;
  content: "";
  border: solid var(--color-white);
  border-width: 3px 3px 0 0;
}
.swiper-button-prev::after {
  margin-left: 0.4rem;
  -webkit-transform: rotate(-135deg);
          transform: rotate(-135deg);
}
.swiper-button-next::after {
  margin-right: 0.4rem;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.swiper-button-disabled { pointer-events: none; opacity: 0; }

#toptva_rectangle { overflow: hidden; }
#toptva_rectangle .swiper { overflow: visible; }
#toptva_rectangle .swiper-button-prev, #toptva_rectangle .swiper-button-next { position: absolute; z-index: 1; top: 0; bottom: 0; margin: auto; }
/*#toptva_rectangle .swiper-button-prev::after, #toptva_rectangle .swiper-button-next::after { border-color: #fff; }*/
#toptva_rectangle .swiper-button-prev { right: calc(100% - 1.6rem);}
#toptva_rectangle .swiper-button-next { left: calc(100% - 1.6rem);}

@media only screen and (max-width: 1024px) {
    #toptva_rectangle .swiper-button-prev { right: calc(100% - 5.2rem); }
    #toptva_rectangle .swiper-button-next { left: calc(100% - 5.2rem);}
}

#toptva_rectangle .slide { overflow: hidden; -webkit-transition: var(--transition), opacity 1s; transition: var(--transition), opacity 1s; }

@media only screen and (min-width: 1025px) {
    #toptva_rectangle .slide img { -webkit-transition: var(--transition); transition: var(--transition); }
    #toptva_rectangle .slide:hover img { -webkit-transform: translateY(0); transform: translateY(0); }
}

#toptva_rectangle .slide-media { padding-top: 50%; }
@media screen and (max-width: 768px) {
    #toptva_rectangle .slide-media { padding-top: 62.5%; }
}

#toptva_rectangle .slide-media img { width: calc(100% - 2px); height: 100%; border-radius: 4px; box-sizing: border-box; border: 1px solid #efefef; }

#toptva_rectangle .slide-title span.notice {font-size: 1.1rem;}
#toptva_rectangle .swiper-slide:not(.swiper-slide-visible) .slide {
  pointer-events: none;
  opacity: 0.3;
}