@charset "utf-8";


*{margin: 0px;
padding:0px;
box-sizing: border-box;}
img{max-width:100%;
height:100%;
}
html {
font-size: 62.5%;
}
body{
	font-size: 2.5rem;
}
a{
	text-decoration: none;
	color: black;
}
/*光沢表現*/
.clear{
  background-image: -webkit-linear-gradient(rgba(255,255,255,.3) 0%,transparent 50%,transparent 50%,rgba(0,0,0,.1) 100%);
  background-image:         linear-gradient(rgba(255,255,255,.3) 0%,transparent 50%,transparent 50%,rgba(0,0,0,.1) 100%);
  box-shadow: 0 2px 2px 0 rgba(255,255,255,.1) inset,0 2px 10px 0 rgba(255,255,255,.2) inset,0 -2px 2px 0 rgba(0,0,0,.1) inset;
  border: 0.1rem solid rgba(0,0,0,.2); 
}

	.header{
		height: 72svh;
		width: 100vw;
		background-image: url(../素材等/ヘッダー画像/背景_縦_小_グラ2.jpg);
		background-size: cover;
		background-position: bottom 0 left 0;
		position: relative;
	}

	.header p{
		color: #FFF6BF;
	    text-align: center;
	    font-weight: bold;
	    font-size: 6.5rem;
	    position: absolute;
	    left: 7%;
	    top: 15%;
	    text-shadow: 0.3rem 0.3rem 0.4rem #808080;
	    font-family: "Zen Maru Gothic", serif;
	}

	.text{
		position: relative;
		font-size: 4rem;
		text-align: center;
		line-height: 10rem;
		margin-bottom:3svh;
	}
	.mapping{
		color: #FFAF00;
		text-shadow: 0.1rem 0.1rem 0.2rem rgba(0, 0, 0, 0.5);
	}
	/*.mapping span{
		text-decoration: underline;
	}
	*/
	.text span{
		font-size: 5rem;
	}

	.title{
	 font-size: 7rem;
	 background-color: #33CC70;
	 border-radius: 0.5rem;
	 padding: 1rem 1.5rem;
	 color: white; 
	 font-weight: bold;
	 display: inline-block;
	 border-radius: 1.5rem;
	}
	.title a{
		text-decoration: none;
		color: white;
	}
	.exc{
	 font-family: "Potta One", system-ui;
	 font-weight: normal;
	}

	.inputs{
		text-align: center;

	}

	input{
		font-size: 4rem;
		border: 0.1rem solid black;
		margin-bottom: 1svh;
	}
	#userid{
		color: #3ACEEB;
	}

	.login{
		margin-top: 3svh;
		font-size: 5rem;
		background: -webkit-gradient(linear, left top, left bottom, from(#B8E4FF), to(#54A7FF));
		background: -webkit-linear-gradient(top, #B8E4FF 0%, #54A7FF 100%);
		background: linear-gradient(to bottom, #B8E4FF 0%, #54A7FF 100%);
		border-radius: 1rem ;
		padding: 1rem 1.5rem ;
	}

	.alert{
		display: none;
		color: red;
	}
	.login_false{
		color: red;
	}
	.caution1,.caution2{
		display: none;
	}
	.caution1.red,.caution2.red{
		color: red;
	}


	.new{
		display: inline-block;
		font-size: 4rem;
		text-align: center;
		padding: 1rem 2rem;
		margin: 3svh auto 7svh auto;
		border-radius: 1rem;
		background-color:#feb645 ;
	}

	.new_regi{
		text-align: center;
	}

.auto_login{
	width: 3vw;
	transform: scale(2.5);
}
.auto_login_label{
	font-size: 3rem;
}