html,body{
	margin: 0;
	padding: 0;
	-webkit-text-size-adjust: 100%;
}
input, textarea, select{
	background-color: white;
	border-radius: 5px;
	font-size: large;
}
img{
	max-width: 100%;
	height: auto;
}
main{
	background: white;
	color: black;
}
h1{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 70px;
	font-family: "Jun 501";
	color: white;
	text-shadow:
		 2px  2px 0px black,
		-2px  2px 0px black,
		 2px -2px 0px black,
		-2px -2px 0px black,
		 2px  0px 0px black,
		 0px  2px 0px black,
		-2px  0px 0px black,
		 0px -2px 0px black;
	backdrop-filter:blur(40px);
	-webkit-backdrop-filter:blur(40px);
	z-index: 5;
}
h2{
	width: 100%;
	font-family: "Jun 201";
	font-size: 200%;
	text-align: center;
	color: white;
	z-index: 5;
}
#hd-title01{
	position: absolute;
	margin-top: 2px;
	left: 20px;
	font-size: 60%;
}
#hd-title02{
	position: relative;
	top: 30px;
	left: 20px;
	font-size: 80%;
}
#section01{
	position: relative;
	z-index: 1;
	height: 100vh;
}
#section02{
	position: relative;
	z-index: 2;
	background: white;
}
#h2-title02{
	position: absolute;
	top: 20px;
	color: black;
}
#contents02{
	position: relative;
	top: 100px;
}
#section03{
	position: relative;
	z-index: 1;
}
#h2-title03{
	position: absolute;
	top: 50px;
	text-shadow:
		 2px  2px 0px black,
		-2px  2px 0px black,
		 2px -2px 0px black,
		-2px -2px 0px black,
		 2px  0px 0px black,
		 0px  2px 0px black,
		-2px  0px 0px black,
		 0px -2px 0px black;
}
#contents03{
	position: relative;
	top: 160px;
	text-align: center;
}
#play03txt{
	position: absolute;
	top: 50px;
	left: 148px;
}
#section04{
	position: relative;
	z-index: 2;
	background: #080126;
}
#h2-title04{
	position: absolute;
	top: 20px;
}
#contents04{
	position: relative;
	top: 140px;
	color: white;
}
#section05{
	position: relative;
	z-index: 1;
}
#h2-title05{
	position: absolute;
	text-shadow:
		 2px  2px 0px black,
		-2px  2px 0px black,
		 2px -2px 0px black,
		-2px -2px 0px black,
		 2px  0px 0px black,
		 0px  2px 0px black,
		-2px  0px 0px black,
		 0px -2px 0px black;
}
#contents05{
	position: relative;
	width: 100%;
}
#flowarea{
	top: 60px;
}
#flow05a{
	position: relative;
	width: 310px;
	left: 0px;
}
#flow05b{
	position: relative;
	width: 310px;
	left: calc((100vw - 310px) / 5 * 1);
}
#flow05c{
	position: relative;
	width: 310px;
	left: calc((100vw - 310px) / 5 * 2);
}
#flow05d{
	position: relative;
	width: 310px;
	left: calc((100vw - 310px) / 5 * 3);
}
#flow05e{
	position: relative;
	width: 310px;
	left: calc((100vw - 310px) / 5 * 4);
}
#flow05f{
	position: relative;
}
#flow05txt1{
	position: absolute;
	top: 35px;
	left: 10px;
}
#flow05txt2{
	position: absolute;
	top: 20px;
	left: 10px;
}
#flow05txt3{
	position: absolute;
	top: 10px;
	left: 10px;
}
#text05{
	position: relative;
	text-align: center;
}
#section06{
	position: relative;
	z-index: 3;
	background: white;
}
#h2-title06{
	position: absolute;
	top: 20px;
	color: black;
}
#contents06{
	position: relative;
	top: 100px;
}
#btn-start{
	position: fixed;
	bottom: 124px;
	right: 20px;
	font-size: 150%;
}
#btn-start a{
	background: #080126;
	color: white;
	width: 250px;
	padding: 10px 0;
	text-align: center;
	display: block;
	border-radius: 10px;
}
#btn-start a:hover{
	background: #999;
}
#btn-terms{
	position: fixed;
	bottom: 70px;
	right: 148px;
	font-size: 80%;
}
#btn-terms a{
	background: #080126;
	color: white;
	width: 122px;
	padding: 15px 0;
	text-align: center;
	display: block;
	border-radius: 10px;
}
#btn-terms a:hover{
	background: #999;
}
#btn-policy{
	position: fixed;
	bottom: 70px;
	right: 20px;
	font-size: 80%;
}
#btn-policy a{
	background: #080126;
	color: white;
	width: 122px;
	padding: 6px 0;
	text-align: center;
	display: block;
	border-radius: 10px;
}
#btn-policy a:hover{
	background: #999;
}
#btn-law{
	position: fixed;
	bottom: 15px;
	right: 20px;
	font-size: 80%;
}
#btn-law a{
	background: #080126;
	color: white;
	width: 250px;
	padding: 6px 0;
	text-align: center;
	display: block;
	border-radius: 10px;
}
#btn-law a:hover{
	background: #999;
}
#bg-section01{
	position: absolute;
	top: 0px;
	height: 100vh;
	background-image: url("/img/topbg1.jpg");
}
#bg-section03{
	position: absolute;
	top: 0px;
	height: 150%;
	background-image: url("/img/topbg2.jpg");
}
#bg-section05{
	position: absolute;
	top: 0px;
	height: 100vh;
	background-image: url("/img/topbg3.jpg");
}
.bg-section{
	left: 0px;
	width: 100%;
	background-repeat: no-repeat;
	background-position: center center; 
	-webkit-background-size: cover;
		 -o-background-size: cover;
			background-size: cover;
}
.box1{
	padding: 1px;
	background: rgba(255,255,255,0.6);
	border-top: solid 5px white;
	border-bottom: solid 5px white;
}
.box2{
	padding: 2px;
	background: rgba(255,255,255,0.8);
	border-top: solid 2px black;
	border-bottom: solid 2px black;
}
.frame{
	display: inline-block;
	padding: 30px 30px;
	background: rgba(255,255,255,0.85);
	border-radius: 15px;
}
.contents{
	font-family: "Hiragino Maru Gothic W4 JIS2004";
	font-size: 110%;
	font-weight: 500;
}