/* リセットCSS */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body {
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
	line-height: 1.6;
	color: #333;
}

main {
	width: 100vw;
}

/* メイン画像セクション */
.main-images {
	width: 100%;
}

.image-container {
	width: 100%;
	position: relative;
}

.image-container img {
	width: 100%;
	height: auto;
	display: block;
}

@media(max-width:820px){
	.hero{
		width:100vw;
		height:90vh;
	}
	
	.hero img{
		height:100%;
		object-fit:cover;
	}
}

/* レスポンシブ対応 - 820pxで切り替え */
/* 820px未満（スマホ）: -sp画像を表示、-pc画像は非表示で読み込まない */
@media (max-width: 819px) {
	.pc-image {
		display: none !important;
	}

	.sp-image {
		display: block;
	}
}

/* 820px以上（PC）: -pc画像を表示、-sp画像は非表示で読み込まない */
@media (min-width: 820px) {
	.pc-image {
		display: block;
	}

	.sp-image {
		display: none !important;
	}
}

/* ボタン */
.btn {
	margin: 0 auto;
	padding: 10vw 0;
	width: 74.76vw;
}

@media (min-width: 820px) {
	.btn {
		width: 26.875vw;
		padding: 0 0 8vw;
	}
}

.bg_black {
	background-color: #000;
}

.relative {
	position: relative;
}

.inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}

@media (min-width: 820px) {
	.inner .btn {
		width: 45vw;
	}
}

/* Voiceセクション */
.voice-section {
	padding: 60px 20px;
}

.voice-slider {
	width: 60vw;
	margin: 0 auto;
}

.voice-item {
	padding: 0 10px;
}

.voice-item img {
	width: 100%;
	height: auto;
}

/* Slick.jsのカスタマイズ */
.voice-slider .slick-dots {
	bottom: -50px;
}

.voice-slider .slick-dots li button:before {
	font-size: 16px;
	color: #666;
}

.voice-slider .slick-dots li.slick-active button:before {
	color: #333;
}

.voice-slider .slick-prev,
.voice-slider .slick-next {
	z-index: 1;
}

.voice-slider .slick-prev {
	left: -5vw;
}

.voice-slider .slick-next {
	right: -5vw;
}

.voice-slider .slick-prev:before,
.voice-slider .slick-next:before {
	font-size: 2.8vw;
	color: #333;
}

/* レスポンシブ対応 - Voiceセクション */
@media (max-width: 819px) {
	.voice-section {
		padding: 0 6.4vw;
	}

	.voice-slider {
		width: 80vw;
	}

	.voice-slider .slick-prev {
		left: -4.76vw;
	}

	.voice-slider .slick-next {
		right: -4.76vw;
	}

	.voice-slider .slick-prev:before,
	.voice-slider .slick-next:before {
		font-size: 6.4vw;
	}

	.voice-slider .slick-dots li button:before {
		font-size: 14px;
	}
}
