@charset "utf-8";

html{
	background:#420000;
}
body{
	background:url(images/bg_wall_l.jpg);
	font-size:160%;
}
p{
	font-size:100%;
}

h3{
	font-weight:bold;
	line-height:1.5em;
	font-size:160%;
}

#site_contents{
	width:100%;
}
.page-header{
	border-bottom:none;
	position:relative;
}
h1{
	margin:0.75em auto 0.5em;
}

#login_area .page-header{
	margin-bottom:0;
}
#login_area img{
	display:inline-block;
}
#login_area form{
	padding:0 19px;
}
#login_area fieldset{
	margin:-2em 0 0 0;
	padding:0;
	background:url(images/form_bg.png);
	color:#420000;
	box-shadow:1px 1px 5px rgba(0,0,0,0.3);
}
#login_area input{
	border-color:#420000;
}
#login_area legend{
	font-size:120%;
	font-weight:bold;
	margin:0;
	padding:3em 0 0.4em;
	text-align:center;
	border:none 1px #420000;
	border-bottom-style:dashed;
	color:#420000;
	position:relative;
}
/* IE */
@media all and (-ms-high-contrast:none){
	#login_area fieldset{
		margin:1em 0 0 0;
	}
	#login_area legend{
		padding:0.5em 0 0.4em;
	}
	#login_area legend:before,#login_area legend:after{
		margin:-48px 0 0 0;
		min-height:1.5em;
	}
}
#login_area legend:before,#login_area legend:after{
	height:30%;
	width:100%;
	position:absolute;
	top:40px;
	content:" ";
	background-repeat:no-repeat;
	background-size:contain;
}
#login_area legend:before{
	background-image:url(images/form_head_l.png);
	left:4px;
	background-position:left top;
}
#login_area legend:after{
	background-image:url(images/form_head_r.png);
	right:4px;
	background-position:right top;
}
#login_area .form-group{
	margin:0 1.5em;
}
#login_area .btn{
	display:block;
	font-size:100%;
}
#login_area .btn-primary{
	color: #fff;
	background-color: #420000;
	border-color: #350000;
}
#login_area .btn-primary:hover,
#login_area .btn-primary:focus,
#login_area .btn-primary:active{
	color: #fff;
	background-color: #c1272d;
	border-color: #b41018;
}
#login_submit_area{
	padding:1em 0 1em;
}
#login_regist_area .form-group{
	text-align:center;
	padding:0;
	margin:0;
}
#login_regist_area .btn{
	border:none;
	border-radius:0;
	padding:10px 0;
	color:#420000;
}
#login_regist_area .btn.btn-info{
	color:#fff;
}

#login_errors{
	display:inline-block;
	margin:0.2em 1em 0;
}

#about_copy{
	color:#000;
	padding:1em;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1), -1px -1px 1px rgba(255, 255, 255, 0.5);
	background:url(images/about_copy.png) no-repeat right top;
	background-size:contain;
	height:80%;
	min-height:400px;
	max-height:500px;
	margin:1em 0 0 0;
	padding:0;
}
#about_copy img{
	height:2.5em;
}
#about_copy a{
	color:#420000;
}
#about_copy a:hover{
	color:#ffff80;
}

#about_area{
	margin-bottom:2em;
	color:#000;
	padding:1em 3em;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1), -1px -1px 1px rgba(255, 255, 255, 0.5);
	position:relative;
}
#about_area img{
	display:inline-block;
}
#about_area a{
	color:#420000;
}
#about_area a:hover{
	color:#ffff80;
}
#about_area>li{
	background-repeat:no-repeat;
	background-position:right top;
	background-size:contain;
	height:60%;
	min-height:400px;
	max-height:500px;
}
#about_1{
	background-image:url(images/about_1.png);
}
#about_2{
	background-image:url(images/about_2.png);
}
#about_3{
	background-image:url(images/about_3.png);
}
#about_area .about{
	background-repeat:no-repeat;
	background-position:left 0.4em;
	background-size:5em auto;
	padding:0 0 0 5.5em;
}
#about_1 .about{
	background-image:url(images/about_1_title.png);
}
#about_2 .about{
	background-image:url(images/about_2_title.png);
}
#about_3 .about{
	background-image:url(images/about_3_title.png);
}

.about_regist{
	max-width:20em;
	height:8em;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	display:inline-block;
	background-image:url(images/regist.png);
	background-repeat:no-repeat;
	background-position:0 0;
	background-size:contain;
	margin:1em 0 0 2em;
}
.about_regist:hover{
	background-image:url(images/regist_hover.png);
}

@media screen and (max-device-width: 640px) {
	body{
		font-size:40px;
	}
	h1{
		margin:0.75em auto 0;
	}
	#login_area legend:before,#login_area legend:after{
		top:100px;
	}
	#about_copy{
		height:100%;
		background-position:right bottom;
		max-height:100%;
	}
	#about_area{
		padding:1em 1em;
	}
	#about_area>li{
		background-position:right bottom;
		max-height:100%;
	}
	#about_area>li#about_1{
		height:70%;
	}
	#about_area>li#about_2{
		height:90%;
	}
	#about_area>li#about_3{
		height:95%;
	}
	#about_area .about{
		background-position:left 0.4em;
		padding-left:4.5em;
	}
	
	@media (orientation: landscape) {
		#about_copy{
			height:250%;
		}
		#about_area>li#about_1{
			height:180%;
		}
		#about_area>li#about_2{
			height:230%;
		}
		#about_area>li#about_3{
			height:240%;
		}
	}

}


ul.sns{
	list-style-type:none;
	clear:both;
	margin:0 auto;
	padding:10px 00;
	height:40px;
}
ul.sns li{
	display:block;
	float:left;
	cursor:pointer;
	margin:0 10px;
	padding:0;
	font-size:1px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
ul.sns li>a{
	display:block;
	height:18px;
}
ul.sns li.sns_twitter{
	background:url("images/social_button.png") 0 0 no-repeat;
	width:95px;
	height:18px;
}
ul.sns li.sns_twitter:hover{
	background-position:0 -18px;
}
ul.sns li.sns_facebook{
	background:url("images/social_button.png") -99px 0 no-repeat;
	width:95px;
	height:18px;
}
ul.sns li.sns_facebook:hover{
	background-position:-99px -18px;
}
ul.sns li.sns_mixi{
	background:url("images/social_button.png") -199px 0 no-repeat;
	width:95px;
	height:18px;
}
ul.sns li.sns_mixi:hover{
	background-position:-199px -18px;
}
ul.sns li.sns_amebanow{
	background:url("images/social_button.png") -299px 0 no-repeat;
	width:95px;
	height:18px;
}
ul.sns li.sns_amebanow:hover{
	background-position:-299px -18px;
}
ul.sns li.sns_bookmark{
	background:url("images/social_button.png") -400px 0 no-repeat;
	width:137px;
	height:18px;
	float:right;
}
ul.sns li.sns_bookmark:hover{
	background-position:-400px -18px;
}
ul.sns li.sns_line{
	background:url("images/social_button.png") -542px 0 no-repeat;
	width:95px;
	height:18px;
}
ul.sns li.sns_line:hover{
	background-position:-542px -18px;
}
ul.sns li.sns_fb_like, ul.sns li.sns_fb_share{
	text-indent:0;
}
ul.sns li.sns_google_plus{
	text-indent:0;
}
