@charset "utf-8";
html {
		overflow-y: scroll;
}
.top_section {
		background-image: url("../images/top_pc_bg_s.png");
		background-position: center top;
		background-repeat: no-repeat;
		background-size: 1300px;
		min-height: 777px;
}
.top_section img {
		width: 100%;
		height: auto;
}
.top_main_catch {
		width: 395px;
		margin: 0 auto;
		padding-top: 12px;
}
.top_hero_modal {
		width: 260px;
		margin: 0 auto;
}
.top_hero_modal, .top_hero_modal a {
		outline: none;
}
.top_nav_flex {
		padding: 85px 0 0 80px;
}
.top_nav_flex ul {
		list-style: none;
		display: flex;
		flex-wrap: wrap;
}
.top_nav_flex li {
		width: 285px;
}
.top_nav_flex li img {
		transition: transform 0.2s;
}
.top_nav_flex li a:hover img {
		transform: translateX(1px) translateY(1px);
}
.top_figure {
		display: none;
}
@media(max-width: 768px) {
		.top_main_catch {
				width: 100%;
		}
		.top_upper {
				background: url("../images/cont_bg_sp.jpg") repeat-y 0 0;
				background-size: 100%;
				padding-bottom: 25px;
		}
		.top_hero_modal {
				width: 60vw;
				margin: 0 auto;
		}
		.top_figure {
				display: block;
		}
		.top_section {
				padding-top: 0;
				background: url("../images/hero_bg_pc.png") repeat-y 0 0;
				background-size: 1000px;
		}
		.top_nav_flex {
				padding: 10vw 0 0;
				display: block;
				background: url("../images/top_cont_bg_sp.png") no-repeat center top;
				background-size: 100%;
				box-sizing: border-box;
				min-height: 150vw;
		}
		.top_nav_flex ul {
				width: 70vw;
				margin: 0 auto;
		}
		.top_nav_flex li {
				width: 100%;
		}
}