@charset "UTF-8";
/* CSS Document */
/* layout.css #login 基本フォンとサイズ13px */



@media only screen and (min-width: 481px) {
#mypage {
	background:#e4e4e4; 
	font-size:75%;
	padding:0.4em 0.6em;
}
.maypage{
	font-size:90%;
	float:none; 
	width:90%; 
	margin-left:1%;
}
.lost {
	float:none;
	width:90%; 
	font-size:70%; 
	text-align:left;
}
.login_form-container {
   border: 1px solid #7a7a7a;
   background: #ffffff;
   vertical-align: middle;
   }
.login_form_wrap {
	margin:0.6em 1.2em;
   }
.login_form {
	float: none;
	width: 100%;
   }
.login_form-field1 {
	font-size:80%;
	border: 1px solid #999999;
	background: #ebebeb;
	color: #000;
	width: 44%;
   padding:0.3em;
	margin:2% 0;
	float: left;
   }
.login_form-field2 {
	font-size:80%;
	border: 1px solid #999999;
	background: #ebebeb;
	color: #000;
	width: 44%;
   padding:0.3em;
	margin:2% 0;
	float: right;
   }
.submit-container {
	font-size:100%;
	text-align: center;
	float: none;
	width: 100%;
	margin:2% 0;
   }
.submit-button {
	font-size: 100%;
	border: 1px solid #707070;
	background: #636363;
	text-shadow: #000000 0 1px 0;
	color: #ffffff;
	text-decoration: none;
	vertical-align: middle;
	padding: 0.4em 0.2em;
	width: 100%;
   }
.submit-button:hover {
   border: 1px solid #ffffff;
   background: #de0000;
   color: #fff;
   padding:0.4em 0.2em;
   }
}


@media only screen and (min-width: 721px) {
#mypage {
	background:#e4e4e4; 
	font-size:90%;
	padding:0.4em;
}
.maypage{
	font-size:80%;
	float:left; 
	width:20%; 
	margin-left:1%;
}
.lost {
	float:right;
	width:75%; 
	font-size:78%; 
	text-align:right;
}
.login_form-container {
   border: 1px solid #7a7a7a;
   background: #ffffff;
   vertical-align: middle;
   }
.login_form_wrap {
	margin:0.8em 1.2em;
   }
.login_form {
	float: left;
	width: 80%;
   }
.login_form-field1 {
	font-size:75%;
	border: 1px solid #999999;
	background: #ebebeb;
	color: #000;
	width: 46%;
   padding:0.5em;
	margin-right:1%;
	float: left;
   }
.login_form-field2 {
	font-size:75%;
	border: 1px solid #999999;
	background: #ebebeb;
	color: #000;
	width: 38%;
   padding:0.5em;
	margin-right:1%;
	float: left;
   }
.submit-container {
	font-size:70%;
	text-align: right;
	float: right;
	width: 20%;
   }
.submit-button {
	font-size:100%;
   border: 1px solid #707070;
   background: #636363;
   text-shadow: #000000 0 1px 0;
   color: #ffffff;
   text-decoration: none;
   vertical-align: middle;
   padding:0.4em 0.2em;
   width:100%;
   }
.submit-button:hover {
   border: 1px solid #ffffff;
   background: #de0000;
   color: #fff;
   padding:0.4em 0.2em;
   }
}

@media only screen and (min-width: 960px) {
#mypage {
	font-size:100%;
	background:#e4e4e4; 
	padding:0.8em 0.6em;
}
.maypage{
	float:left; 
	width:25%; 
	margin-left:1%;
	font-size:100%;
}
.lost {
	float:right;
	width:74%; 
	font-size:80%; 
	text-align:right;
}
.login_form-container {
   border: 1px solid #7a7a7a;
   background: #ffffff;
   vertical-align: middle;
   }
.login_form_wrap {
	margin:0.4em 1.2em;
   }
.login_form {
	float: left;
	width: 80%;
   }
.login_form-field1 {
	font-size:75%;
	border: 1px solid #999999;
	background: #ebebeb;
	color: #000;
	width: 46%;
   padding:0.8em 0.5em;
	margin-right:1%;
	float: left;
   }
.login_form-field2 {
	font-size:75%;
	border: 1px solid #999999;
	background: #ebebeb;
	color: #000;
	width: 38%;
   padding:0.8em 0.5em;
	margin-right:1%;
	float: left;
   }
.submit-container {
	font-size:90%;
	text-align: right;
	float: right;
	width: 20%;
   }
.submit-button {	
	font-size:100%;
   border: 1px solid #707070;
   background: #636363;
   text-shadow: #000000 0 1px 0;
   color: #ffffff;
   text-decoration: none;
   vertical-align: middle;
   padding:0.4em 0.5em;
   width:100%;
   }
.submit-button:hover {
   border: 1px solid #ffffff;
   background: #de0000;
   color: #fff;
   padding:0.4em 0.5em;
   }
}