@charset "utf-8";

* {
	margin:0;
	padding:0;
	list-style:none;
	line-height:1.6;
	font-family:source-han-sans-japanese, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	font-weight:300;
	color:#333;
	box-sizing:border-box;
	scroll-behavior:smooth;
}
body {
	overflow-x:hidden;
	overflow-y:initial;
	padding:0;
}
a {
	text-decoration:none;
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	-moz-opacity:1.0;
	opacity:1.0;
	filter:alpha(opacity=100);
}
a:hover {
	-moz-opacity:0.8;
	opacity:0.8;
	filter:alpha(opacity=80);
}

/* ファーストビュー・ヘッダー */
h1 {
	position:fixed;
	left:7vw;
	top:62vh;
	font-size:4.2em;
	font-weight:300;
	letter-spacing:0.05em;
	z-index:0;
}

header {
	position:fixed;
	top:0;
	left:0;
	width:100vw;
	padding:80px;
	background-color:#fff;
	background-color:rgba(255,255,255,0.95);
	backdrop-filter:blur(3px);
	z-index:100;
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
}
header.min {padding:25px 3vw;}
header section.container .inner {
	width:100%;
	position:relative;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
header section.container .inner nav {}
header section.container .inner nav ul {
	display:flex;
	justify-content:flex-start;
	align-items:center;
}
header section.container .inner nav ul li {margin:0 1.5em;}
header section.container .inner nav ul li a {
	font-weight:400;
	font-size:16px;
	letter-spacing:0.05em;
}
header section.container .inner .logo {
	width:161px;
	display:block;
	line-height:1;
}
#burger {display:none;}

/* メイン */
main {
	position:relative;
	z-index:10;
	background-color:#fff;
	margin-top:84vh;
}
main section.container {
	width:100%;
	padding:100px 0;
	position:relative;
	z-index:1;
}
main section.container .inner {
	width:100%;
	padding:0 100px;
}
main section.container .inner h2 {
	font-size:2.8em;
	font-weight:300;
	border-bottom:solid 5px #000;
	line-height:2.4em;
}
main section.container .inner h2 sub {
	vertical-align:baseline;
	font-size:1.6rem;
	font-weight:300;
	margin:0 0 0 3em;
}
main section.container.x1 .inner h3 {
	font-size:2em;
	font-weight:500;
	margin:50px 30px 30px 30px;
}
main section.container.x1 .inner .txt01 {
	font-size:20px;
	line-height:2.8;
	font-weight:300;
	margin:0 0 0 60px;
}
main section.container.x2 {
	background-color:#f8faf8;
}
main section.container.x2 .inner dl {
	display:flex;
	justify-content:flex-start;
	align-items:center;
	margin:40px 80px 0;
	font-size:20px;
}
main section.container.x2 .inner dl.x1 {margin:80px 80px 0;}
main section.container.x2 .inner dl dt {
	font-weight:400;
	width:28%;
}
main section.container.x2 .inner dl dd {
	font-weight:300;
}
main section.container.x3 .inner .txt01 {
	font-size:20px;
	margin:80px 0 120px 60px;
	line-height:2.8;
	/*text-indent:1em;*/
}
main section.container.x4 {background-color:#f8faf8;}
main section.container.x4 .inner dl {
	display:flex;
	justify-content:flex-start;
	align-items:flex-start;
	margin:40px 80px 0;
	font-size:20px;
	
}
main section.container.x4 .inner dl.x1 {
	margin:60px 80px 0;
	border-bottom:solid 1px #e0e0e0;
}
main section.container.x4 .inner dl dt {
	font-weight:400;
	width:25%;
	align-content:flex-start;
	line-height:3.6;
}
main section.container.x4 .inner dl dd {
	line-height:3.6;
}
main section.container.x4 .inner dl.x1 dd {
	margin:0 0 40px 0;
}
main section.container.x5 .inner dl {
	display:flex;
	justify-content:flex-start;
	align-items:flex-start;
	margin:40px 80px 0;
	font-size:20px;
}
main section.container.x5 .inner dl.x1 {margin:80px 80px 0;}
main section.container.x5 .inner dl dt {
	font-weight:400;
	width:25%;
}
main section.container.x5 .inner dl dd {
	font-weight:300;
}


/* フッター */
footer {
	background-color:#f3f3f3;
	display:flex;
	justify-content:space-between;
	align-items:center;
	margin:0;
	padding:6em 5vw;
	position:relative;
	z-index:1000;
}
footer p {
	font-size:14px;
	font-weight:500;
}
footer ul {
	margin:0;
	display:flex;
	justify-content:center;
	align-items:center;
}
footer ul li {
	margin:0;
	display:flex;
	justify-content:center;
	align-items:center;
}
footer ul li a {
	font-size:14px;
	font-weight:500;
}
footer ul>li::before {display:none;}
footer ul>li+li::before {
	content:"";
	display:block;
	background-color:#747474;
	width:1px;
	height:1em;
	margin:0 3em;
}

#topBtn {
	position:fixed;
	right:50px;
	bottom:50px;
	z-index:1001;
		width:85px;
	height:85px;
	transition:all 0.5s ease;
	-webkit-transition:all 0.5s ease;
	-moz-opacity:1.0;
	opacity:1.0;
	filter:alpha(opacity=100);
}
#topBtn.off {
	-moz-opacity:0;
	opacity:0;
	filter:alpha(opacity=0);
	z-index:-1;
}
#topBtn a {
	width:100%;
	height:100%;
	display:flex;
	justify-content:center;
	align-items:center;
	border:solid 1px #000;
	background-color:transparent;
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	position:relative;
}
#topBtn a:hover {
	-moz-opacity:1.0;
	opacity:1.0;
	filter:alpha(opacity=100);
}
#topBtn a::before {
	content:"";
	width:20px;
	height:20px;
	display:block;
	border-top:solid 2px #000;
	border-right:solid 2px #000;
	transform:rotate(-45deg);
	margin-top:13px;
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	position:relative;
	z-index:1;
}
#topBtn a::after {
	content:"";
	display:block;
	width:100%;
	height:0;
	position:absolute;
	top:0;
	background-color:#000;
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
}
#topBtn a:hover::after {height:100%;}
#topBtn a:hover::before {border-color:#fff;}
#topBtn.end {bottom:170px;}

/* ウェーブアニメーション */
#wrapper {
	position:relative;
	width:100vw;
	z-index:100;
}
.wave{
	position:fixed;
	top:42vh;
	left:-2vw;
	width:100vw;
	height:100vh;
	z-index:0;
}
.wave canvas{
	opacity:0;
	transform:rotateZ(-7deg);
	animation-name:fadeInAnime;
	animation-duration:2s;
	animation-iteration-count:1;
	animation-fill-mode:forwards;
	animation-delay:.5s;
	transition:all 0.3s ease;
}
.wave canvas.blur {filter:blur(4px);}

@keyframes fadeInAnime {
	0%   {opacity:0;}
	100% {opacity:1;}
}

.pc {display:initial;}
.sp {display:none;}

@media print, screen and (max-width:1200px){
	header {padding:50px;}
	main section.container .inner {padding:0 50px;}
	main section.container.x2 .inner dl {margin:40px 40px 0;}
	main section.container.x2 .inner dl.x1 {margin:80px 40px 0;}
	main section.container.x3 .inner .txt01 {margin:80px 0 120px 30px;}
	main section.container.x4 .inner dl {margin:40px 40px 0;}
	main section.container.x4 .inner dl.x1 {margin:60px 40px 0;}
	main section.container.x5 .inner dl {margin:40px 40px 0;}
	main section.container.x5 .inner dl.x1 {margin:80px 40px 0;}
}
@media print, screen and (max-width:1100px){
	main section.container.x1 .inner .txt01 {margin:0 0 0 30px;}
	main section.container.x3 .inner .txt01 {margin:80px 0 120px 30px;}
}
@media print, screen and (max-width:1000px){
	h1 {top:57vh;}
	header section.container .inner nav ul li {margin:0 1.2em;}
	header section.container .inner nav ul li a {font-size:15px;}
	main section.container .inner {padding:0 25px;}
	main section.container.x2 .inner dl {margin:40px 25px 0;}
	main section.container.x2 .inner dl.x1 {margin:50px 25px 0;}
	main section.container.x3 .inner .txt01 {margin:40px 0 90px 25px;}
	main section.container.x4 .inner dl {margin:35px 0 0 25px;}
	main section.container.x4 .inner dl.x1 {margin:50px 0 0 25px;}
	main section.container.x5 .inner dl {margin:35px 0 0 25px;}
	main section.container.x5 .inner dl.x1 {margin:50px 0 0 25px;}
	footer ul>li+li::before {margin:0 2em;}
}
@media print, screen and (max-width:900px){
	header {padding:50px 25px;}
	header section.container .inner nav ul li {margin:0 0.8em;}

	main section.container {padding:30px 0 60px;}
	main section.container .inner h2 {font-size:2.4em;}
	main section.container .inner h2 sub {font-size:1.2rem;}

	main section.container.x1 .inner h3 {
		font-size:1.8em;
		margin:30px 0 10px 15px;
	}
	main section.container.x1 .inner .txt01 {
		margin:0 0 0 20px;
		font-size:18px;
		line-height:2.4;
	}
	main section.container.x2 .inner dl {
		font-size:18px;
		margin:30px 25px 0;
	}
	main section.container.x2 .inner dl.x1 {margin:40px 25px 0;}
	main section.container.x2 .inner dl dt {width:30%;}

	main section.container.x3 .inner .txt01 {
		margin:30px 0 0 10px;
		text-indent:0.5em;
		font-size:18px;
		line-height:2.1;
	}
	main section.container.x4 .inner dl {
		margin:30px 0 0 25px;
		font-size:18px;
	}
	main section.container.x4 .inner dl.x1 {margin:25px 0 0 25px;}
	main section.container.x5 .inner dl {
		font-size:18px;
		margin:30px 0 0 25px;
	}
	main section.container.x5 .inner dl.x1 {margin:35px 0 0 25px;}
	main section.container.x5 .inner dl dt {width:35%;}
	main section.container.x5 .inner dl dd {width:65%;}

	footer {
		padding:3em 5vw;
		justify-content:center;
		flex-flow:column-reverse;
	}
	footer ul {
		width:100%;
		margin:0 auto 15px;
	}

	#topBtn {right:25px;}
	#topBtn.end {bottom:130px;}
}
@media print, screen and (max-width:768px){
	.pc {display:none;}
	.sp {display:initial;}

	#wrapper {z-index:10;}
	header {
		padding:25px 3vw;
		z-index:10000;
	}
header section.container .inner nav {
    width: 70vw;
    height: 100vh;
    background-color:#0a5a28;
    position: fixed;
    top: 0;
    right: -72vw;
    overflow: hidden;
    z-index: 100;
    padding:3em 1.5em 0 3em;
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
}
	header section.container .inner nav ul {
		flex-wrap: wrap;
		width: 100%;
	}
header section.container .inner nav ul li {
    width: 100%;
    margin: 0 0 2em;
}
header section.container .inner nav ul li a {
    color: #fff;
    font-weight: 500;
    font-size: 18px;
}

nav #burger {display:initial;}
nav #burger .x1 {
    display: block;
    width: 10vw;
    height: 2px;
    background-color: #000;
    position: fixed;
    top: 38px;
    right: 20px;
    z-index: 10000;
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
}
nav #burger .x2 {
    display: block;
    width: 10vw;
    height: 2px;
    background-color: #000;
    position: fixed;
    top: 48px;
    right: 20px;
    z-index: 10000;
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
}
nav.on #burger .x1 {
    transform: rotate(35deg);
    top: 43px;
	background-color:#fff;
}
nav.on #burger .x2 {
    transform: rotate(-35deg);
    top: 43px;
	background-color:#fff;
}
header section.container .inner nav.on {right:0;}
h1 {
    top: 57vmax;
    font-size: 12vw;
}

main section.container {
    padding: 8vw 0 16vw;
}
main section.container .inner {
    padding: 0 3vw;
}
main section.container .inner h2 {
    font-size: 7.8vw;
}
main section.container .inner h2 sub {
    font-size: 1rem;
    margin: 0 0 0 1.5em;
}
main section.container.x1 .inner h3 {
    font-size: 5.2vw;
    margin: 5vw 1vw 0;
    text-align: justify;
}
main section.container.x1 .inner .txt01 {
    margin: 3vw 1.5vw 0;
    text-align: justify;
    font-size: 4vw;
    line-height: 2.4;
}
main section.container.x2 .inner dl {
    font-size: 4vw;
    margin: 5vw 1.5vw 0;
	align-items: flex-start;
}
main section.container.x2 .inner dl.x1 {
    margin: 7vw 1.5vw 0;
}
main section.container.x2 .inner dl dt {width:40vw;}
main section.container.x2 .inner dl dd {width:60vw;}
main section.container.x3 .inner .txt01 {
    margin: 3vw 1.5vw 0;
    text-align: justify;
    font-size: 4vw;
    line-height: 2.4;
}
main section.container.x4 .inner dl {
    font-size: 4vw;
    margin: 5vw 1.5vw 0;
    align-items: flex-start;
}
main section.container.x4 .inner dl.x1 {
    font-size: 4vw;
    margin: 7vw 1.5vw 0;
    align-items: flex-start;
}
main section.container.x4 .inner dl dt {
    width: 35%;
    line-height: 2;
    padding: 0 0 0 0.8em;
    box-sizing: border-box;
}
main section.container.x4 .inner dl dd {
    width: 80%;
    line-height: 2;
}
main section.container.x5 .inner dl {
    font-size: 4vw;
    margin: 5vw 1.5vw 0;
    align-items: flex-start;
}
main section.container.x5 .inner dl.x1 {
    font-size: 4vw;
    margin: 7vw 1.5vw 0;
    align-items: flex-start;
}
main section.container.x5 .inner dl dt {width: 45%;}
main section.container.x5 .inner dl dd {width: 55%;}

footer ul {
    flex-wrap: wrap;
}
footer ul li {
    margin:0.5em 6.5vw;
}
footer ul>li+li::before {display:none;}

#topBtn {
    width: 20vw;
    height: 20vw;
    background-color: #fff;
    background-color: rgba(255,255,255,0.6);
}
#topBtn.end {bottom: 180px;}
}
