@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1:wght@100..900&display=swap');

html, body {
	position: relative;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
}
body {
	/* background:linear-gradient(45deg, transparent 25%, lightgray 25%, lightgray 50%, transparent 50%,transparent 75%, lightgray 75%);
	background-size: 3px 3px;
	background-repeat: repeat; */
	box-sizing: border-box;
	font-family: "M PLUS 1", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", "Arial", sans-serif;
	font-optical-sizing: auto;
	font-size: max(1vw, 1vh, 13px);
	font-weight: 400;
	font-style: normal;
}
div {
	box-sizing: border-box;
}
a {
	text-decoration: none;
}
input, select {
	vertical-align: middle;
}
#contents {
	position: relative;
	width: 100%;
	height: 100%;
}
.clear{
	clear: both;
}
.red {
	color: red;
}
.centerbox {
	display: block;
	width: 100%;
	text-align: center;
}
.blue_button {
	position: relative;
	margin: 0px;
	padding: 0.2em 0.6em 0.2em 0.6em;
	text-align: center;
	text-shadow: 1px -1px rgb(0 0 0 / 10%);
	font-size: 1em;
	color: #fff;
	border-radius: 0.3em;
	border: 1px solid rgba(0,0,0,0.1);
	box-shadow: 0.1em 0.1em 0.1em rgb(0 0 0 / 10%), inset 1px 1px 0 rgb(255 255 255 / 20%);
	background: linear-gradient(#328cbc, #56addc);
	cursor: pointer;
}
.blue_button:hover {
	opacity:0.60;
}