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


/* リセットCSS */
html,article,aside,audio,blockquote,body,dd,dialog,div,dl,dt,fieldset,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,input,li,mark,menu,nav,ol,p,pre,section,td,textarea,th,time,ul,video,main{margin:0;padding:0;word-wrap:break-word;overflow-wrap:break-word;-webkit-font-feature-settings:"palt";font-feature-settings:"palt"}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;word-wrap:break-word;overflow-wrap:break-word}table{border-collapse:collapse;border-spacing:0}caption,th{text-align:left}q:after,q:before{content:""}embed,object{vertical-align:top}hr,legend{display:none}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight: normal;}abbr,acronym,fieldset,img{border:0}li{list-style-type:none}sup{vertical-align:super;font-size:0.5em}img{vertical-align:top}i{font-style:normal}svg{vertical-align:middle}article,aside,dialog,figure,footer,header,hgroup,nav,section,main{display:block}nav,ul{list-style:none}

/* スライダーのスタイル */
.first_view {
	position: relative;
	font-family: YakuHanMP, "A1 Mincho", "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif;
}
.swiper-container {
	width: 100%;
	height: 100vh;
	background-color: #111;
}
.swiper-slide {
	overflow: hidden;
	backface-visibility: hidden;
	position: relative;
}
.slide-img {
	height: 100vh;
	background-size: cover;
	background-position: center center;
	width: 100%;
	transition: transform 0.1s ease-out;
}

/* アクティブなスライドのみにアニメーションを適用 */
.swiper-slide-active .slide-img {
	width: calc(100% + 100px);
	animation: slideLeft 7s linear 0s;
	animation-fill-mode: both;
}

@keyframes slideLeft {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-100px);
	}
}

.swiper-slide h2 {
	width: 100%;
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	transform: translate(-50%, -50%);
	padding: 0 20px;
	color: #fff;
	font-size: 1.25rem;
	line-height: 1.4;
	text-shadow: 0 0 10px #000;
	transition: opacity 0.5s ease 1s, transform 0.5s ease 1s;
	opacity: 0;
}

/* アクティブなスライドのテキストを表示 */
.swiper-slide-active h2 {
	transform: translate(-50%, -60%);
	opacity: 1;
}

/* 詩のスライド用のスタイル */
.slide_poem h2 {
	transform: translate(-50%, -50%) !important;
}


/* ナビゲーションボタンのスタイル調整 */
.swiper-button-next,
.swiper-button-prev {
	color: #ddd!important;
	text-shadow: 0 0 10px #000;
}
.swiper-button-prev:after,
.swiper-button-next:after {
	font-size: 32px!important;
}
/*.swiper-button-next,
.swiper-button-prev {
	color: #fff;
	background: rgba(0, 0, 0, 0.3);
	width: 44px;
	height: 44px;
	border-radius: 50%;
	transition: background 0.3s ease;
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
	background: rgba(0, 0, 0, 0.5);
}

.swiper-button-next::after,
.swiper-button-prev::after {
	font-size: 18px;
}*/

/* ページネーションのスタイル */
.swiper-pagination-bullet {
	background: rgba(255, 255, 255, 0.5);
	opacity: 1;
	transition: background 0.3s ease;
}

.swiper-pagination-bullet-active {
	background: #fff;
}
.swiper-pagination {
    z-index: 1000 !important;
    bottom: 10px !important; /* 下からの距離を調整 */
}

.swiper-slide h2 {
    margin-top: -40px;
}
.swiper-slide:not(.slide_poem) h2 {
    font-size: 2.25rem;
    font-feature-settings: "palt" 1;
}
.swiper-slide.slide_poem h2 img {
    height: calc(100vh - 180px);
}


/* レスポンシブ対応 */
@media (max-width: 768px) {
	.swiper-slide h2 {
		font-size: 1rem;
		line-height: 1.3;
		padding: 0 15px;
	}
	
	.slide_poem h2 img {
		height: calc(100vh - 200px);
		max-height: 300px;
	}
}



/*
.first_view {
	position: relative;
}
.swiper-container {
	width: 100%;
	height: 100vh;
	background-color: #111;
}
.swiper-slide {
	overflow: hidden;
	backface-visibility: hidden;
}
.slide-img {
	height: calc(100% - 60px);
	background-size: cover;
	background-position: center center;
}
.swiper-slide-active .slide-img,
.swiper-slide-duplicate-active .slide-img,
.swiper-slide-prev .slide-img {
	width: calc(100% + 100px);
	animation: slideLeft 7s linear 0s;
	animation-fill-mode: both;
}
@keyframes slideLeft {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-100px);
	}
}
.swiper-slide h2 {
	width: 100%;
	margin-top: -30px;
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	transform: translate(-50%,-50%);
}
.swiper-slide:not(.slide_poem) h2 {
	padding-left: calc(var(--_space, 1.8rem)*.5*var(--_margin-scale, 1));
	padding-right: calc(var(--_space, 1.8rem)*.5*var(--_margin-scale, 1));
	color: #fff;
	font-size: 1.25rem;
	line-height: 1.4;
	text-shadow: 0 0 10px #000;
	transition: opacity .5s ease 1s, transform .5s ease 1s;
	opacity: 0;
}
.swiper-slide.slide_poem h2 {
	transition: opacity .5s ease 1s;
	opacity: 0;
}
.swiper-slide-active:not(.slide_poem) h2,
.swiper-slide-duplicate-active:not(.slide_poem) h2,
.swiper-slide-prev:not(.slide_poem) h2 {
	transform: translate(-50%,-60%);
	opacity: 1;
}
.swiper-slide-active.slide_poem h2,
.swiper-slide-duplicate-active.slide_poem h2,
.swiper-slide-prev.slide_poem h2 {
	opacity: 1;
}
.swiper-slide.slide_poem h2 img {
	width: auto;
	height: calc(100vh - 300px);
}
*/