@charset "utf-8";
main {
		padding-top: 0;
}
.kv {
		height: 100vh;
		min-height: 500px;
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
		padding-top: 50px;
		position: relative;
		margin-bottom: 120px;
}
.kv .kv_scroll {
		position: absolute;
		cursor: pointer;
		right: 40px;
		bottom: 80px
}
.kv_scroll .arw {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		animation: mouseScroll 0.8s infinite;
}
@keyframes mouseScroll {
		0% {
				opacity: 1;
				transform: translateY(-5px);
		}
		60% {
				opacity: 1;
		}
		100% {
				opacity: 0;
				transform: translateY(25px);
		}
}
@media(max-width: 767px) {
		.kv .kv_scroll {
				right: 25px;
				bottom: 40px;
		}
}
@media(max-width: 1024px) {
		.kv.mid {
				padding-top: 100px;
		}
}
.kv_main {
		width: 100%;
		height: 80vh;
		position: relative;
		margin: 0 auto;
		box-sizing: border-box;
		padding: 0 35px;
}
.kv_main div:nth-child(1) {
		background-image: url("../images/kv-main-1_pc_wide.png");
		background-position: left center;
}
.kv_main div:nth-child(2) {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		background-image: url("../images/kv-main-2_pc_wide.png")
}
.mid .kv_main {
		width: 100%;
		padding: 0;
}
.kv_main div {
		background-repeat: no-repeat;
		background-position: center center;
		background-size: auto 100%;
		width: 100%;
}
@media(max-width: 1700px) {
		.kv_main div:nth-child(1) {
				background-position: left center;
		}
}
.mid .kv_main div {
		background-repeat: no-repeat;
		background-position: left center;
		background-size: 100%;
		width: 100%;
}
.mid .kv_main div:nth-child(1) {
		background-image: url("../images/kv-main-1_mid.png");
}
.mid .kv_main div:nth-child(2) {
		background-image: url("../images/kv-main-2_mid.png");
}
@media(max-width: 1024px) {
		.kv {
				aspect-ratio: initial;
				min-height: inherit;
				height: 80vh;
		}
		.kv_main {
				width: 100vw;
		}
		.kv_main, .kv_main div {
				height: 60vh;
		}
		.kv_main div:nth-child(1) {
				background-image: url("../images/kv-main-1_mid.png");
				background-size: 100%;
		}
		.kv_main div:nth-child(2) {
				background-image: url("../images/kv-main-2_mid.png");
				background-size: 100%;
		}
}
@media(max-width: 767px) {
		.kv {
				padding-top: 0;
				height: 100vh !important;
				height: 100dvh !important;
				margin-bottom: 80px;
		}
		.kv_main {
				width: 100%;
				height: 147vw !important;
				padding: 0;
		}
		.kv_main div {
				position: absolute !important;
				background-repeat: no-repeat;
				background-position: 0 0 !important;
				background-size: 100%;
				top: 0 !important;
				left: 0 !important;
				height: 147vw !important;
		}
		.kv_main div:nth-child(1) {
				background-image: url("../images/kv-main-1_sp3.png")
		}
		.kv_main div:nth-child(2) {
				background-image: url("../images/kv-main-2_sp3.png")
		}
}
@media(max-width: 375px) {
		.kv_main div {
				position: absolute !important;
				background-repeat: no-repeat;
				background-position: 0 0 !important;
				background-size: 100%;
				top: 0 !important;
				left: 0 !important
		}
		.kv_main div:nth-child(1) {
				background-image: url("../images/kv-main-1_se.png")
		}
		.kv_main div:nth-child(2) {
				background-image: url("../images/kv-main-2_se.png")
		}
}
section {
		padding: 0 30px 160px
}
/* ============== */
section.why_section {
		padding-top: 80px;
		background-repeat: no-repeat;
		background-position: center top;
		background-size: 720px;
		background-image: url("../images/top_why_bg_pc.png")
}
@media(max-width: 767px) {
		section.why_section {
				padding: 80px 25px;
				background-position: 0 center;
				background-size: 100%;
				background-image: url("../images/top_why_bg_sp.png")
		}
}
@media(max-width: 375px) {
		section.why_section {
				padding: 80px 20px;
		}
}
.why_section_inner {
		max-width: 800px;
		margin: 0 auto
}
.why_section_inner p {
		line-height: 2.0;
		text-align: center;
		margin-bottom: 40px;
}
@media(max-width: 767px) {
		.why_section_inner p {
				text-align: justify;
				line-height: 1.8;
				margin-bottom: 30px;
		}
		.why_section_inner p br {
				display: none
		}
}
/* ============== */
section.about_section {
		padding-top: 80px;
}
@media(max-width: 767px) {
		section.about_section {
				padding: 80px 25px 150px;
		}
}
@media(max-width: 375px) {
		section.about_section {
				padding: 80px 20px 150px;
		}
}
/* ============== */
section.action_section {
		padding-bottom: 350px;
		background-repeat: no-repeat;
		background-position: center 60px;
		background-size: 2150px;
		background-image: url("../images/top_action_bg_pc.png")
}
.action_inner {
		max-width: 990px;
		margin: 0 auto;
}
.action_inner .title_hd_en {
		margin-bottom: 120px;
}
.action_item {
		display: flex;
		align-items: center;
		margin-bottom: 125px;
}
.action_figure {
		width: 285px;
		margin-left: 90px;
}
.action_figure img {
		width: 100%;
		height: auto;
}
.action_caption {
		flex: 1
}
.action_caption h4 {
		font-size: 40px;
		font-weight: 700;
		margin: 0 0 20px;
}
.action_caption p {
		line-height: 2.0;
		margin: 0 0 30px;
		text-align: justify;
}
@media(max-width: 1024px) {
		.action_caption h4 {
				font-size: 32px;
		}
		.action_figure {
				width: 45%;
				margin-left: 60px;
		}
}
@media(max-width: 767px) {
		section.action_section {
				padding: 0px 25px 0;
				background-position: center 0;
				background: none;
				background: #f5f5f8;
				position: relative;
		}
		section.action_section::before, section.action_section::after {
				content: '';
				display: block;
				position: absolute;
				left: 0;
				width: 100%;
				height: 100px;
				background-repeat: no-repeat;
				background-size: 100%;
		}
		section.action_section::before {
				background-image: url("../images/top_action_bg_sp.png");
				background-position: 0 0;
				top: -80px;
		}
		section.action_section::after {
				background-image: url("../images/top_action_bg_sp.png");
				background-position: 0 bottom;
				bottom: -100px;
				height: 120px
		}
		.action_inner .title_hd_en {
				position: relative;
				top: -107px;
				margin-bottom: -60px;
		}
		.action_item {
				display: flex;
				flex-direction: column-reverse;
				margin-bottom: 80px;
				position: relative;
				z-index: 2
		}
		.action_figure {
				width: 70%;
				margin: 0 auto 30px
		}
		.action_caption h4 {
				font-size: 24px;
				margin: 0 0 15px;
		}
		.action_caption p {
				line-height: 1.8;
				margin: 0 0 25px;
		}
}
@media(max-width: 767px) {
		section.action_section {
				padding: 0px 20px;
		}
}
/* ============== */
.news_section {
		padding: 0 30px 0
}
@media(max-width: 767px) {
		.news_section {
				padding: 0 25px 0
		}
}
@media(max-width: 767px) {
		.news_section {
				padding: 0 20px
		}
}
/* ============== */
.movie_section {
		background-repeat: no-repeat;
		background-position: center 120px;
		background-size: 2000px;
		background-image: url("../images/top_move_bg_pc.png");
		padding-bottom: 80px;
}
@media(max-width: 767px) {
		.movie_section {
				background-position: 0 50px;
				background-size: 100%;
				background-image: url("../images/top_move_bg_sp.png");
				padding-bottom: 0;
		}
}
.movie_inner {
		max-width: 780px;
		padding: 0;
		margin: 0 auto;
		position: relative;
		z-index: 5
}
.movie_inner img {
		width: 100%;
		height: auto
}
.movie_notes {
		line-height: 1.6;
		text-align: center;
		font-size: 15px;
}
.movie_notes a {
		color: #1e1e1e;
		text-decoration: underline;
		position: relative;
		display: inline-block
}
@media (hover: hover) {
		.movie_notes a:hover {
				color: #1e1e1e;
				text-decoration: none;
		}
}
.movie_thumb {
		margin-bottom: 15px;
		position: relative;
		border: 1px solid #1e1e1e;
}
.movie_thumb .moviePlay {
		position: absolute;
		width: 112px;
		height: 112px;
		top: calc(50% - 56px);
		left: calc(50% - 56px);
}
.moviePlay::before {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 112px;
		height: 112px;
		background: rgba(0, 0, 0, 0.3);
		border-radius: 50%;
		transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
@media (hover: hover) {
		.movie_thumb a:hover .moviePlay::before {
				transform: scale(1.2)
		}
}
.moviePlay::after {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 112px;
		height: 112px;
		background-repeat: no-repeat;
		background-position: 0 0;
		background-size: 100%;
		background-image: url("../images/movie_play.png")
}
@media(max-width: 767px) {
		.movie_thumb .moviePlay {
				width: 56px;
				height: 56px;
				top: calc(50% - 28px);
				left: calc(50% - 28px);
		}
		.moviePlay::before, .moviePlay::after {
				width: 56px;
				height: 56px;
		}
}
/* =============== */
.loop_section {
		position: relative;
		height: 400px
}
@media(max-width: 767px) {
		.loop_section {
				margin-top: 180px;
				height: 200px
		}
}
.loop_section .loop_wrap {
		overflow: hidden;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
}
.loop_slider, .reverse_slider {
		display: flex;
		width: 100%;
		overflow: hidden;
}
.loop_slider {
		position: relative;
		pointer-events: none;
}
.loop_inner, .reverse_inner {
		display: flex;
}
.loop_inner:first-child {
		animation: loop 90s linear infinite;
}
.loop_inner:nth-child(2) {
		animation: loop2 90s -60s linear infinite;
}
.loop_inner:last-child {
		animation: loop3 90s -30s linear infinite;
}
.reverse_slider .reverse_inner:first-child {
		animation: loop4 90s linear infinite;
}
.reverse_slider .reverse_inner:nth-child(2) {
		animation: loop5 90s -60s linear infinite;
}
.reverse_slider .reverse_inner:last-child {
		animation: loop6 90s -30s linear infinite;
}
@keyframes loop {
		0% {
				transform: translateX(200%);
		}
		to {
				transform: translateX(-100%);
		}
}
@keyframes loop2 {
		0% {
				transform: translateX(100%);
		}
		to {
				transform: translateX(-200%);
		}
}
@keyframes loop3 {
		0% {
				transform: translateX(0%);
		}
		to {
				transform: translateX(-300%);
		}
}
@keyframes loop4 {
		0% {
				transform: translateX(-100%);
		}
		to {
				transform: translateX(200%);
		}
}
@keyframes loop5 {
		0% {
				transform: translateX(-200%);
		}
		to {
				transform: translateX(100%);
		}
}
@keyframes loop6 {
		0% {
				transform: translateX(-300%);
		}
		to {
				transform: translateX(0%);
		}
}
.loop_item {
		width: 2950px;
}
@media(max-width: 960px) {
		.loop_item {
				width: 2000px;
		}
}
@media(max-width: 767px) {
		.loop_item {
				width: 1300px;
		}
}
.loop_item img {
		width: 100%;
		height: auto
}