@charset "utf-8";
body 	{font-family:"ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro",'Meiryo UI','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','MS PGothic',Arial,Helvetica,sans-serif; font-size: 1rem; margin: 0; padding: 0; background-color:#fafafa;}

#header	{background-image:url(https://images.d2pass.com/images/sakuralive/headerBG.jpg); height:73px; width:100%;}
#logo	{background-image:url(https://images.d2pass.com/images/sakuralive/headerLOGO.jpg); background-position:center top; background-repeat:no-repeat; width:auto; margin:0 auto;}

h1 		{font-weight:600; background-color: #a00250; color: #fff; margin: 0 0 15px 0; padding: 3px 0; font-size: 1.4rem;}
#wrapper{border: solid 0px red; width: 100%; margin: 0 auto; text-align: center;}

#login 	{width:310px; margin:10px auto 0 auto; padding:0 ;}
#box 	{position:relative; z-index:1; background-color:#fff; border: solid 1px #a00250; padding: 0 0 20px 0;
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);}
#box div 	{font-size:0.9rem;}
.inputTXT	{width:150px; margin:0 0 5px 0; padding:4px 8px; border:solid 1px #aaa;}
.nudge	{left:3px;}

#submitBTN {
	position:relative;
	margin:10px 0 20px 0; padding:6px;
	left:15px; top:-3px;
	width:120px;
	text-transform:uppercase;
	-moz-box-shadow:inset 0px 1px 0px 0px #f72a90;
	-webkit-box-shadow:inset 0px 1px 0px 0px #f72a90;
	box-shadow:inset 0px 1px 0px 0px #f72a90;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #cc0267), color-stop(1, #8c0347));
	background:-moz-linear-gradient(top, #cc0267 5%, #8c0347 100%);
	background:-webkit-linear-gradient(top, #cc0267 5%, #8c0347 100%);
	background:-o-linear-gradient(top, #cc0267 5%, #8c0347 100%);
	background:-ms-linear-gradient(top, #cc0267 5%, #8c0347 100%);
	background:linear-gradient(to bottom, #cc0267 5%, #8c0347 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#cc0267', endColorstr='#8c0347',GradientType=0);
	background-color:#cc0267;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	border:1px solid #bd0460;
	display:inline-block;
	font-weight:600;
	font-size:0.9rem;
	cursor:pointer;
	color:#fff;
	text-decoration:none;
	text-shadow:0px 1px 0px #961355;
}
#submitBTN:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #8c0347), color-stop(1, #cc0267));
	background:-moz-linear-gradient(top, #8c0347 5%, #cc0267 100%);
	background:-webkit-linear-gradient(top, #8c0347 5%, #cc0267 100%);
	background:-o-linear-gradient(top, #8c0347 5%, #cc0267 100%);
	background:-ms-linear-gradient(top, #8c0347 5%, #cc0267 100%);
	background:linear-gradient(to bottom, #8c0347 5%, #cc0267 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8c0347', endColorstr='#cc0267',GradientType=0);
	background-color:#8c0347;
}
.remind {
	position:relative; z-index:99; bottom:36px; margin-bottom:-10px;
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
	background:-moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0);
	background-color:#ffffff;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	border:1px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:#666666;
	font-size:0.8rem;
	padding:4px 16px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
}
.remind:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff));
	background:-moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0);
	background-color:#f6f6f6;
}

#joinHere	{position:relative; z-index:2; width:421px; height:263px; top:-66px; left:-120px; margin-bottom:-66px; display:block;}
#joinHereSM	{margin:0 auto;}

#footer {font-size:0.7rem; margin: 20px 0;} 
#footer a {color: #666; text-decoration:none;}	

#error	{color:#C00; margin: 0 auto 10px auto; border: dotted 1px #600; background-color: #FCD; padding: 4px 0; font-size: 0.8rem;}

@media all
and (min-device-width: 32px) {
#login 		{margin:5px auto 0 auto;}
#joinHere	{display:none;}
#joinHereSM	{display:block;}
}
@media all and (min-width: 340px) {
#login 		{margin:10px auto 0 auto;}
}
@media all and (min-width: 420px) {
#joinHere	{display:block;}
#joinHereSM	{display:none;}
}