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

@keyframes opacity_text {
from{ opacity: 0;}
to{ opacity: 1;}
}


.top_main_lead{ font-family: 'Noto Serif JP', serif;}

.main_slide,
.main_slide .swiper-slide{ width: 100%; height: 100%; position: relative; background-position: center; background-repeat: no-repeat; background-size: cover;}
.main_slide a.swiper-slide{ transition: .3s;}

.main_slide .swiper-slide{ position: relative; background-position: center; background-repeat: no-repeat; background-size: cover;}
.main_slide .swiper-slide::before{ content: ""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: black; opacity: .3;}
.main_slide .swiper-slide>h2,
.main_slide .swiper-slide>p{ position: absolute; z-index: 10; opacity: 0; color: white; text-shadow: 0 0 5px black,0 0 5px black;}
.main_slide .swiper-slide>h2{ font-weight: 400; margin: 0;}
.main_slide .swiper-slide>p{ font-weight: 200;}

.main_slide .swiper-slide.swiper-slide-active>h2,
.main_slide .swiper-slide.swiper-slide-active>p{ animation: 1s .5s ease-in-out both opacity_text;}


.swiper-button-next,
.swiper-button-prev{ background-image: url("../../images/slide/slide_arrow.svg");}
.swiper-button-prev{transform: rotate(180deg);}

@media (min-width: 768px) {
.top_main_lead{ height: 545px; min-width: 1000px;}


.main_slide{ overflow: hidden;}
.main_slide .swiper-slide{ width: 1000px; height: 545px;}

.swiper-button-next,
.swiper-button-prev{ background-color: rgba(0,0,0,0.5); top: 0; height: 100%; margin: 0; width: calc(50vw - 500px); background-size: 20px auto;}

.swiper-button-next, .swiper-container-rtl .swiper-button-prev{ right: auto; left: calc(50% + 500px); background-position: center center;}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next{ left: auto; right: calc(50% + 500px); background-position: center center;}


.main_slide .swiper-slide>h2,
.main_slide .swiper-slide>p{ letter-spacing: .05em;}
.main_slide .swiper-slide>h2{ left: calc(50% - 480px); top: 370px; font-size: 30px;}
.main_slide .swiper-slide>p{ left: calc(50% - 485px); top: 425px; width: 970px; margin: 0; padding-left: 5px; font-size: 18px;}


}
@media (max-width: 767.98px) {

.main_slide .swiper-slide{ height: 111vw; width: 100vw; background-position: center;}
.main_slide .swiper-slide>h2{ left: 5.33vw; font-size: 5.33vw; letter-spacing: .02em; bottom: 30vw;}
.main_slide .swiper-slide>h2>span{ padding: 2.6vw;}
.main_slide .swiper-slide>p{ left: 5.33vw; width: 89.34vw; font-size: 3.2vw; bottom: 5.33vw; margin: 0; overflow: hidden; transform-origin: left center;}



}






@media (min-width: 768px) {}
@media (max-width: 767.98px) {}