@charset "utf-8";


/* MV
------------------------------------------------------------------------------------ */
#topMv {
	height: 700px;
	background: url("../../images/top_mv.jpg") no-repeat center / cover;
	border-radius: 20px;
	margin: 15px 15px 0 15px;
}


/* ABOUT
------------------------------------------------------------------------------------ */
#topAbout {
}
#topAbout div.topAboutWrapper {
	display: flex;
	align-items: stretch;
}
#topAbout div.topAboutWrapper div.topAboutText {
	flex: 0 0 540px;
	padding: 100px 100px 100px 5%;
}
#topAbout div.topAboutWrapper div.topAboutText p.topAboutLogo {
	width: 100%;
	max-width: 470px;
}
#topAbout div.topAboutWrapper div.topAboutText p.topAboutDetailText {
	font-size: 1.5rem;
	line-height: 2.25;
	margin-top: 50px;
}
#topAbout div.topAboutWrapper div.topAboutImage {
	flex: 1;
	background: url("../../images/top_about.jpg") no-repeat center / cover;
	border-radius: 100px 0 0 0;
}


/* スライド
------------------------------------------------------------------------------------ */
section#topSlidePhoto div#topSlidePhotoWrapper {
	display: flex;
	overflow: hidden;
}
section#topSlidePhoto div#topSlidePhotoWrapper ul.topSlidePhotoList {
	display: flex;
	animation: infinity-scroll-left 60s infinite linear 0.5s both;
}
@keyframes infinity-scroll-left {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-100%);
	}
}
section#topSlidePhoto div#topSlidePhotoWrapper ul.topSlidePhotoList li {
	width: 480px;
	margin-right: 20px;
}
section#topSlidePhoto div#topSlidePhotoWrapper ul.topSlidePhotoList li:nth-child(even) {
	margin-top: 75px;
}
section#topSlidePhoto div#topSlidePhotoWrapper ul.topSlidePhotoList li img {
	border-radius: 20px;
}


/* Support
------------------------------------------------------------------------------------ */
section#topSupport {
	background-color: var(--color-bg-beige);
	border-radius: 20px;
	margin-left: 15px;
	margin-right: 15px;
}
section#topSupport div.topSupportInner {
	padding: 150px 0;
}
section#topSupport ul {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}
section#topSupport ul li {
	width: calc((100% - 20px * 3) / 4);
	padding: 10px 20px;
	background-color: #FFF;
	box-sizing: border-box;
}
section#topSupport ul li a {
	transition: all 0.3s ease;
}
section#topSupport ul li a:hover {
	opacity: 0.6;
}


/* COMPANY
------------------------------------------------------------------------------------ */
section#topCompany {
}
section#topCompany div.topCompanyWrapper {
	display: flex;
	align-items: flex-start;
	gap: 0 100px;
}
section#topCompany div.topCompanyWrapper h2.sectionTtl {
}
section#topCompany div.topCompanyWrapper table.table01 {
	width: 100%;
}



@media screen and (min-width:769px) and (max-width:1024px) {
}



@media screen and (max-width:1024px) {
	/* MV
	------------------------------------------------------------------------------------ */
	#topMv {
		height: 400px;
		margin: 10px 10px 0 10px;
	}

	/* ABOUT
	------------------------------------------------------------------------------------ */
	#topAbout div.topAboutWrapper {
		display: block;
	}
	#topAbout div.topAboutWrapper div.topAboutText {
		flex: 1;
		padding: 0 5%;
	}
	#topAbout div.topAboutWrapper div.topAboutText p.topAboutLogo {
		width: 100%;
		max-width: 260px;
	}
	#topAbout div.topAboutWrapper div.topAboutText p.topAboutDetailText {
		font-size: 1rem;
		line-height: 175%;
		margin-top: 30px;
	}
	#topAbout div.topAboutWrapper div.topAboutImage {
		height: 300px;
		margin: 50px 10px 10px 10px;
		border-radius: 20px;
	}

	/* スライド
	------------------------------------------------------------------------------------ */
	section#topSlidePhoto div#topSlidePhotoWrapper ul.topSlidePhotoList li {
		width: 240px;
		margin-right: 10px;
	}
	section#topSlidePhoto div#topSlidePhotoWrapper ul.topSlidePhotoList li:nth-child(even) {
		margin-top: 40px;
	}
	section#topSlidePhoto div#topSlidePhotoWrapper ul.topSlidePhotoList li img {
		border-radius: 10px;
	}

	/* Support
	------------------------------------------------------------------------------------ */
	section#topSupport {
		margin-left: 10px;
		margin-right: 10px;
	}
	section#topSupport div.topSupportInner {
		padding: 50px 0;
	}
	section#topSupport ul {
		gap: 10px;
	}
	section#topSupport ul li {
		width: calc((100% - 10px * 2) / 3);
		background-color: #FFF;
	}

	/* COMPANY
	------------------------------------------------------------------------------------ */
	section#topCompany div.topCompanyWrapper {
		display: block;
		gap: 0;
	}
}