@charset "UTF-8";

* { box-sizing:border-box; position:relative;}


html,body {
		margin:0;
		padding:0;
		-webkit-text-size-adjust: 100%;
		-moz-text-size-adjust: 100%;
		-ms-text-size-adjust: 100%;
		text-size-adjust: 100%;
		width:100%;
		word-break: break-all;
		font-family: "Murecho", sans-serif;
		font-optical-sizing: auto;
		font-weight: 400;
		font-style: normal;
	}



input:focus {
	border-color:#F90;
}

img {display:block;}


#container {
	position:relative;
	width:100%;
	min-width:320px;
}


h2 {
	
	font-size:clamp(10px, 6vw, 40px );
	text-align:center;
	margin:0 0 1em;
	padding:0;
	z-index:10;
	position:relative;
	}

h2 span {
	display:inline-block;
	color:#1e2d58;
	font-weight:bold;
	margin:0;
	padding:0 1em;
	text-align:left;
	line-height:1.2em;
	}

section > h2 {
	margin:0 auto 0;
	}
	

h3 p {
	font-size:80%;
	display:inline-block;
	position:relative;
	border-top:4px solid #e6001c;
	padding:0.2em 0.8em 0.2em 0;
	color:#000;
	z-index:100;
	}

h3 p::before {
	content: "■";
	color:#e6001c;
	}

h3 p::after {
	content: "";
	display:block;
	border-left:5px solid #e6001c;
	border-bottom:4px solid #e6001c;
	height:50%;
	width:2000px;
	position:absolute;
	top:-4px;
	left:100%;
	/*transform: translate(50%, 0%) rotate(-45deg);*/
	transform: translate(0, 0%) skewX(45deg);
	background-color:#fff;
	z-index:9;
	}
	
h3 span {
	display:inline-block;
	font-size:inherit;
	}
	

h4 {
	/*font-size:300%;*/
	color:#e6001c;
	font-weight:bold;
	text-align:left;
	}



h4 {
	width:100%;
	margin:0;
	position:absolute;
	top:0;
	left:0;
	
    transform: translate(-0%,-50%);
	text-align:center;
	}

h4 p{
	font-size:120%;
	font-weight:bold;
	display:inline-block;
	/*max-width:1136px;*/
	margin:0 auto;
	padding:0.3em 1.5em;
	color:#fff;
	text-align:center;
	background-color:#e6001c;
	line-height:1em;
	border-radius:2em;
}


h4 .mini{
	font-size:50%;
	line-height:1.2em;
	display:inline-block;
	color:#000;
}

h5 {
	/*font-size:220%;*/
	color:#e6001c;
	font-weight:bold;
	text-align:left;
	margin-bottom:0.7em;
	font-size: 2.4rem;
	}

/*アンカー*/

a.anchor {
	display: block;
	position:absolute;
	top:-120px;
}	





#content {
	width: 100%;
}

#main {
	padding-top:0;
}


section {
	width:100%;
	min-width:320px;
	margin:0 auto;
	/*background-color:#0F9;*/
	padding:0;
	position:relative;
	
	}


section::after {
content: " ";
display: block;
clear: both;
}


section > a.anker {
	position:absolute;
	top:-150px;
}


section > .inner {
	width:100%;
	margin:0 auto;
	padding:clamp(10px, 5vw, 20px);
	max-width:1000px;
	}


section > .inner::after {
  content: "";
  display: block;
  clear: both;
}


/*--------------------------
　終了メッセージ
--------------------------*/	
	#close_msg p{
		color:#e6001c;
		font-size:300%;
		font-weight:bold;
		text-align:center;
	}


/*=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
タイトル
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-*/

#logo img{
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
}

#title p{
	margin: 0 auto;
	font-size: clamp(18px, 3.6vw, 28px);
	line-height: 1.4em;
	font-weight: 600;
}

#title p span{
	display: inline-block;
}


/*=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
ログイン
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-*/


#login {
	text-align:center;
}


#login_box {
	display:block;
	width:100%;
	max-width:800px;
	min-width:280px;
	margin:1rem auto;
	padding:3rem;
	border: 4px solid #aaa;
  border-radius: 20px;
}

#login_box p{
	margin-bottom:1em;
}

#login_box table{
	width:100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
}

#login_box table th,
#login_box table td{
	border:none;
	text-align:right;
	white-space:nowrap;
	vertical-align:middle;
	padding:0.5em;

}

#login_box table tr td input {
	padding:0.5em 1em;
	font-size:160%;
	width:100%;

}

#error_msg {
	width:100%;
	/*
	max-width:800px;
	border:2px solid #ff9191;
	*/
	margin:0 auto 1em;
	padding:1em;
	border-radius:1em;
	color:#f00;
	/*
	background-color:#fff0ff;
	*/
	}
#error_msg p{
	margin:0 auto;
	}

#error_msg p + p{
	margin-top:0.5em;
	}

#submit P{
	margin:0 0 3vh;
}

#submit P a{
	display:inline-block;
	margin:1rem;
	padding:0.8em 4em;
	background-color:#f00;
	color:#fff;
	text-decoration:none;
	font-size:140%;
	font-weight:bold;
	border-radius:0.3em;
	transition: .3s ;
}


#submit P a:hover{
	background-color:#F93;
}

#submit ul{
	max-width:800px;
	display:flex;
	margin:0 auto;
	justify-content: center;
}

#submit ul li{
	display:table;
	list-style:none;
	width:50%;
	padding:0 0.5em;
}


#submit ul li a{
	width:90%;
	height:100%;
	display:table-cell;
	margin:0 auto;;
	padding:0.8em 1em;
	background-color:#ccc;
	color:#333;
	text-decoration:none;
	font-size:100%;
	font-weight:bold;
	border-radius:0.3em;
	transition: .3s ;
}

#submit ul li a:hover{
	background-color:#f5f5f5;
}

#submit ul li a span{
	display:inline-block;
}

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

	#login_box {
		padding:1rem 1rem;
	}

	#login_box table th,
	#login_box table td{
		display:block;
		width:100%;
		text-align:left;
	
	}
	#login_box table th{
		padding: 0 0.5em;
	}
	
	#login_box table td{
		margin-bottom:1rem;
	
	}
	
}

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

	#submit ul{
		flex-direction: column;
	}
	
	#submit ul li{
		width:100%;
	}
	
	#submit ul li:first-child{
		margin-bottom:2rem;
	}
	
	
	#submit ul li a{
		padding:1.5em 1em;
	}

}




/*ログインoffの場合*/
#submit.off a{
	pointer-events:none;
	background-color:#bebebe !important;
	color:#f0f0f0 !important;
}

#submit.off ul{
	display:none;
}