@charset "utf-8";

/*CSS_Information===========================================
File_name:screen.css
author:4403
============================================================
*/

/* reset：Yahoo!UIarrengever.
================================================== */
body{font-size:small;font-weight:normal;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}select,input,button,textarea{font-size:99%;}pre,code,kbd,samp{font-family:san-serif;font-size:100%;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,p,blockquote,th,td{margin:0;padding:0;}table{font-size:inherit;font:100%;border-collapse:collapse;border-spacing:0;empty-cells:show;}th{font-weight:normal;text-align:left;}th,td{vertical-align:top;}address,cite,dfn,em,var{font-style:normal;}ol,ul{list-style:none;}fieldset,abbr{border:0;}ins{text-decoration:none;}del{text-decoration:line-through;}a{text-decoration:underline;}strong{font-weight:bold;}img,object,param{border:0;outline:0;vertical-align:bottom;}q:before,q:after{content:"";}hr{display:none;}

/* all
================================================== */
html,body { height: 100%;width: 100%; }

body{
	background-image:url(img/header_back.gif);
	background-repeat:repeat-x;
	background-position:top;
	background-color:#000;
	color:#FFF;
	word-break: break-all;
	line-height: 1.5;
}

#container{
	background-image:url(img/top_back.jpg);
	background-position:top center;
	background-repeat:no-repeat;
	z-index:5;
}

#wrapper{
	width:860px;
	margin:0 auto;
}


h2{
	padding-bottom:20px;
}

em{
	top:10px;
	padding-bottom:10px;
	color:#c7000a;
	font-size:123%;
}

/* #header
================================================== */
#header{
	width:860px;
	position:relative;
}

h1{
	text-align:center;
	padding-top:60px;
}

#header #headerbnr{
	position:absolute;
	top:40px;
}

#header #headerbnr li{
	display:inline;
	padding-right:10px;
}

#header #headernav{
	position:absolute;
	width:860px;
	top:0;
}

#header p img{
	position:absolute;
	top:227px;
	left:0;
}


/* #story
================================================== */
#story{
	width:860px;
	background-image:url(img/story_back.gif);
	background-position:top;
	background-repeat:no-repeat;
}


#story div.section{
	width:860px;
	clear:both;
	padding-bottom:25px;
}


#story div.leftbox{
	width:650px;
	position:relative;
}

#story div.rightbox{
	width:200px;
}

#story div.leftbox p:first-letter {
	font-size:1.8em;
    font-weight:bold;  
    display: block; 
	margin-right:10px;
	background-color:#7f0000;
	padding:10px;
	height:1em;
	width:1em;
	float:left;

	/*line-height:100%;
	vertical-align:10px;
	*vertical-align:baseline;*/
}



#story div.strg{
	font-size:123%;
	color:#c7000a;
	padding-top:20px;
	padding-bottom:20px;
}

/* #chara
================================================== */
#chara{
	width:860px;
}


#chara h2,#tsurugi h2{
	padding-top:75px;
}


#chara .chara-lv2,#tsurugi .chara-lv2{
	position:relative;
	height:400px;
	padding-bottom:30px;
}

#chara .chara-lv2 p,#tsurugi .chara-lv2 p{
	position:absolute;
	bottom:60px;
	left:10px;
	width:390px;
}


/* #fotter
================================================== */
#fotter{
	padding-top:55px;
	width:860px;
	background-image:url(img/footback.jpg);
	background-position:top;
	background-repeat:no-repeat;
}

#fotter ul{
	text-align:center;
}

#fotter li{
	display:inline;
	padding-right:20px;
}



address{
	padding-top:43px;
	padding-bottom:43px;
	text-align:center;
}

/* oocss
================================================== */

.leftbox{
	float:left;
}

.rightbox{
	float:right;
}


.clearfix{
	zoom: 1;
}
.clearfix:after{
	content: "."; display: block;
	clear: both;
	height: 0; overflow: hidden; visibility: hidden;
	font-size: 1px; line-height: 0;
}