@font-face {
	font-family:'zooja';
	src: url(../fonts/FontsFree-Net-zooja.ttf); }

body {
	-webkit-text-size-adjust: 100%;
	positon:relative;
	font-family: "メイリオ", sans-serif;
	margin:0;
	padding:0;
	color:#ffffff;
	font-size:18px;
	background-color:#1b7ea8; }

#wrapper {
	overflow:hidden;
	position:relative;
	width:100%;
	min-width:960px;
	padding:90px 0 0;
	margin:0 auto; }

a { text-decoration:none; }

.blue {
	color:#ffffff;
	padding:0;
	background-color:#1b7ea8; }
.orange {
	color:#ffffff;
	padding:3em 0;
	background-color:#ffb800; }
.white {
	color:#707070;
	padding:1em 0;
	background-color:#ffffff; }

#contents {
	color:#707070;
	background-color:#ffffff; }

button:focus { outline:0; }
button:hover {
	cursor:pointer;
	opacity:0.7; }

.container:before,
.container:after {
	content:"";
	display:table; }
.container:after {
	clear:both; }
.container {
	position:relative;
	margin:0 auto;
	width:920px;
	padding:0 20px;
	zoom:1; }

p span {
	white-space:nowrap; }
#header {
	min-width:960px;
	position:relative;
	z-index:1000;
	line-height:1rem;
	position:absolute;
	position:fixed;
	top:0;
	left:0;
	right:0;
	width:100%;
	height:90px;
	margin:0 auto;
	background-color:#1b7ea8; }

#header > h1 {
	font-weight:normal;
	padding:0 10px 0;
	font-size:14px; }
#header a {
	color:#ffffff;
	text-decoration:none; }

ul:before,
ul:after {
	content:"";
	display:table; }
ul:after {
	clear:both; }
ul {
	zoom:1; }

#header > ul {
	min-width:920px;
	list-style:none;
	margin:0 20px;
	padding:0;
	background-color:#1b7ea8; }

#header > ul > li {
	position:relative;
	margin:0;
	padding:0;
	width:auto;
	float:left; }

#header > ul > li > ol {
	margin:0;
	padding:0; }

#header > ul > li:nth-child(1) {
	text-align:center;
	font-size:40px;
	position:relative;
	width:80px;
	height:40px; }
#header > ul > li:nth-child(1) a {
	border-radius:10px;
	display:block;
	width:100%; }
#header > ul > li:nth-child(1) i > span {
	display:none; }

#header > ul > li:nth-child(2) > a,
#header > ul > li:nth-child(3) > a,
#header > ul > li:nth-child(4) > a,
#header > ul > li:nth-child(5) > a,
#header > ul > li:nth-child(6) > a {
	display:block;
	border-radius:10px;
	padding:15px 20px 15px; }

#header > ul > li > a:hover {
	color:#1b7ea8;
 	background-color:#ffffff; }

#header #mypage {
	position:absolute;
	top:20px;
	right:20px; }

#header #mypage a {
	text-align:center;
	display:block;
	background-color:#ffb900;
	border:4px solid #ffb900;
	border-radius:30px;
	font-size:20px;
	padding:15px 20px;
	width:120px; }

#header #mypage a:hover {
	color:#ffb900;
	background-color:#ffffff; }

#header > ul > li > ol {
	background-color:#1b7ea8;
	list-style:none;
	margin:0;
	padding:0 0 10px;
	z-index:1000;
	display:none; }


#footer {
	border-top:10px solid #1b7ea8;
	min-width:960px;
	line-height:1rem;
	width:100%;
	padding:0 0 5px;
	color:#000000;
	background-color:#ffffff;
	background-image:url(../images/logo.png);
	background-size:auto 70%;
	background-repeat:no-repeat;
	background-position:98% center; }


#footer h2 {
	font-weight:normal;
	border-left:5px solid #1b7ea8;
	line-height:1em;
	margin:1em 1em;
	padding:0 0 0 1em;
	font-size:36px;
	color:#1b7ea8; }
#footer p {
	font-size:20px;
	padding:0 1.6em;
	line-height:1.4em; }

#footer ul {
	width:auto;
	list-style:none;
	margin:1em 0;
	padding:0;
	font-size:20px;
	padding:0 1em;
	zoom:1; }

#footer ul > li {
	font-size:18px;
	position:relative;
	padding:3px 10px;
	width:auto;
	float:left; }

#footer ul > li > a {
	color:#000000;
	text-decoration:none; }

#footer ul > li:before {
	margin-right:10px;
	content:"/"; }

#footer ul > li:nth-child(1):before,
#footer ul > li:nth-child(3):before {
	margin-right:0;
	content:""; }
#footer ul > li:nth-child(3) {
	clear:both; }
#navi-control {
	display:none; }

#mask {
	display:none;
	z-index:5000;
	position:fixed;
	top:0;
	left:0;
	background-color:rgba(255,255,255,0.7);
	width:100vw;
	height:100vh; }
#login-window {
	position:fixed;
	top:50px;
	bottom:0;
	right:0;
	left:0;
	margin:auto;
	width:640px; }

#login-window #login-subject {
	position:absolute;
	top:0;
	left:0;
	background-color:#ffb900;
	color:#ffffff;
	font-size:30px;
	padding:10px 0;
	width:636px;
	margin:0;
	text-align:center;
	border:2px solid #ffb900;
	border-radius:20px 20px 0 0; }
#login {
	border-radius:50px;
	border:2px solid #ffb900;
	color:#707070;
	padding:120px 20px 20px;
	width:auto;
	background-color:#ffffff; }

#login label {
	display:block;
	color:#707070;
	font-size:20px; }

#login p {
	margin:0;
	font-size:22px; }
#login .note {
	font-size:1.05em;
	margin:0 0 20px; }

#login input::placeholder,
#login input::-ms-input-placeholder,
#login input::-ms-input-placeholder {
	color:#cccccc; }


#login input[name=email],
#login input[name=password] {
	color:#000000;
	border:2px solid #ffb900;
	margin:5px 0 20px;
	box-sizing: border-box;
	width:100%;
	padding:10px;
	border-radius:5px;
	font-size:24px; }

#login button {
	display:inline-block;
	color:#ffffff;
	border-radius:30px;
	border:4px solid #ffb900;
	background-color:#ffb900;
	padding:4px 0;
	width:260px;
	margin:30px auto;
	font-size:24px; }
#login button#login-close {
	border:4px solid #cccccc;
	background-color:#cccccc; }
#login button:hover {
	color:#ffb900;
	background-color:#ffffff; }
#login button#login-close:hover {
	color:#888888;
	background-color:#ffffff; }
#login-window .window-close {
	cursor:pointer;
	position:absolute;
	top:-50px;
	right:0;
	transform: rotate(45deg);
	color:#ffb900;
	font-size:50px; }

#reminder-submit {
	cursor:pointer;
	color:#cc3333;
}

#registration-window {
	position:relative;
	border-radius:20px;
	border:2px solid #1b7ea8;
	color:#1b7ea8;
	position:fixed;
	top:50px;
	bottom:10px;
	right:0;
	left:0;
	margin:auto;
	width:900px;
	padding:70px 5px 30px 25px;
	height:auto;
	background-color:#ffffff; }

#registration-window #registration-subject {
	position:absolute;
	top:-2px;
	left:-2px;
	background-color:#1b7ea8;
	color:#ffffff;
	font-size:30px;
	padding:10px 0;
	width:930px;
	margin:0;
	text-align:center;
	border:2px solid #1b7ea8;
	border-radius:20px 20px 0 0; }

#registration-window #registration-block {
	padding:0 20px 0 0; }

#registration-window #registration-block {
	zoom:0.938; }
#registration-block {
	margin:0 0 0;
	height:100%; }
#mask #registration-block {
	overflow-y:scroll; }

#regustration-more {
	display:block;
	text-align:center; }
#regustration-more button {
	background-color:#ffffff;
	padding:10px 50px;
	font-size:24px;
	color:#1b7ea8;
	border-radius:30px;
	border:4px solid #1b7ea8;
 }
#registration-window .window-close {
	cursor:pointer;
	position:absolute;
	top:-50px;
	right:0;
	transform: rotate(45deg);
	color:#1b7ea8;
	font-size:50px; }

#login .error {
	display:block;
	padding:10px 20px 5px;
	text-align:center;
	margin:0 0 30px;
	color:#cc3333;
	line-height:1em;
	background-color:#ffeeee;
	border:2px solid #cc3333;
	border-radius:5px;
	font-size:20px; }

#login-message {
	text-align:center;
	font-size:24px;
	margin:0 0 50px; }

@media screen and ( min-width:961px ) {

	#header > ul > li:hover > ol > li {
		float:none; }

	#header > ul > li:hover > ol {
		position:absolute;
		top:45px;
		min-width:300px;
		display:inline-block; }

	#header > ul > li:hover > ol > li > a {
		display:block;
		white-space:nowarp;
		padding:15px 30px 15px; }

	#header > ul > li:hover > ol > li > a:hover {
		color:#1b7ea8;
	 	background-color:#ffffff; }

}

#registration {
	z-index:2000;
	width:960px;
	position:absolute;
	position:fixed;
	width:16vw;
	min-width:220px;
	bottom:50px;
	right:2%; }

#registration a {
	position:relative;
	display:block;
	width:100%;
	height:0;
	padding:100% 0 0;
	font-size:30px;
	margin:0 0 0 auto;
	color:#ffffff;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
	background-image:url(../images/registration.png); }

#registration a span {
	margin:auto;
	justify-content:center;
	text-align:center;
	padding:22.5% 0 0;
	position:absolute;
	width:100%;
	font-size:1em;
	top:0;
	right:0;
	left:0;
	line-height:1.4em; }

.date-block {
	margin:10px 0;
	display:inline-block;
	position:relative; }
.date-block .year {
	font-size:16px;
	position:absolute;
	top:-24px; }

@media screen and ( max-width:960px ) {

	#header > h1 {
		padding:5px 20px 0;
		font-size:46px; }

	#navi-control {
		cursor:pointer;
		position:absolute;
		z-index:11000;
		top:18px;
		right:30px;
		font-size:60px;
		width:70px;
		height:60px;
		text-align:center;
		display:block; }

	#navi-control #navi-close {
		transform: rotate(45deg); }

	#navi-control #navi-open { display:block; }
	#navi-control #navi-close { display:none; }
	#navi-control.on #navi-open { display:none; }
	#navi-control.on #navi-close { display:block; }

	#header #mypage {
		position:absolute;
		top:20px;
		right:130px; }

	#header #mypage a {
		font-size:28px;
		width:200px; }

	#header > ul {
		height:100vh;
		display:none;
		margin:40px 0 0; }

	#navi-control.on + ul {
		display:block; }

	#header > ul > li {
		font-size:28px;
		float:none; }

	#header > ul > li:nth-child(1) {
		text-align:left;
		font-size:28px;
		width:auto;
		height:auto; }

	#header > ul > li:nth-child(1) a {
		width:100%; }
	#header > ul > li:nth-child(1) i > span {
		display:none; }


	#header > ul > li:nth-child(1) i > span {
		margin-left:5px;
		display:inline-block; }

	#header > ul > li:nth-child(1) > a,
	#header > ul > li:nth-child(2) > a,
	#header > ul > li:nth-child(3) > a,
	#header > ul > li:nth-child(4) > a,
	#header > ul > li:nth-child(5) > a,
	#header > ul > li:nth-child(6) > a {
		border-radius:0;
		border-bottom:1px solid #ffffff;
		padding:30px 25px 30px; }

	#header > ul > li:nth-child(7) {
		position:absolute;
		top:10px;
		right:20px;

		margin:0;
		float:right; }

	#header > ul > li > ol {
		display:block;
		position:relative;
		min-width:100%;
		display:inline-block;
		color:#1b7ea8;
		background-color:#ffffff; }

	#header > ul > li > ol > li {
		padding:30px 25px 30px; }

	#header #mypage a:hover {
		background-color:#ffb900;
		color:#ffffff; }

	#header > ul > li > a:hover {
		background-color:#1b7ea8;
	 	color:#ffffff; }

	#header > ul > li > ol > li > a {
		color:#1b7ea8; }

	#footer h2 {
		font-size:40px; }

	#footer ul > li {
		font-size:28px;
		line-height:1.6em;
		width:auto;
		float:left; }

	#footer ul > li:nth-child(5):before {
		margin-right:0;
		content:""; }
	#footer ul > li:nth-child(5) {
		clear:both; }

	#login label {
		font-size:30px; }

	#registration-window {
		padding:120px 5px 30px 25px; }

	#login-window #login-subject {
		padding:16px 0;
		font-size:36px; }

	#login {
		padding:120px 20px 20px; }

	#registration-window #registration-subject {
		font-size:36px;
		padding:16px 0; }

}