﻿/* CSS Document */

html{
	line-height:0;
}

body{
	background-color:#212529;
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
	margin:0;
	padding:0;
	color:#FFFFFF;
}

#home{
	background:url(../images/bg.jpg), url(../images/content_bg.png);
	background-position:center -40px, center -83px;
	background-repeat:no-repeat, repeat-y;
	background-color:#212529;
}


#start_guide{
	background:url(../images/start_bg.jpg), url(../images/content_bg.png);
	background-position:center 40px, center  237px;
	background-repeat:no-repeat, repeat-y;
	background-color:#212529;
}

#info{
	background:url(../images/info_bg.jpg), url(../images/content_bg.png);
	background-position:center 40px, center 237px;
	background-repeat:no-repeat, repeat-y;
	background-color:#212529;
}

#indiv{
	background:url(../images/news_bg.jpg), url(../images/content_bg.png);
	background-position:center 40px, center 237px;
	background-repeat:no-repeat, repeat-y;
	background-color:#212529;
}

/* ie8 */
html>/**/body	{
	background:url(../images/bg.jpg) #212529 center -40px no-repeat\9
}

html>/**/body#start_guide{
	background:url(../images/start_bg.jpg) #212529 center 40px no-repeat\9
}

html>/**/body#info{
	background:url(../images/info_bg.jpg) #212529 center 40px no-repeat\9
}

html>/**/body#indiv{
	background:url(../images/news_bg.jpg) #212529 center 40px no-repeat\9
}

@keyframes bg{
	0%{background-position:0 0;}
	100%{background-position:1920px 0;}
}

main{
	display:block;
	margin:0 auto;
	overflow:hidden; /*clerfix用*/
	width:920px;
	padding-bottom:20px;
}

header{
	background:url(../images/mainbody_top.png) center 25px no-repeat;
	display:block;
	margin:421px auto 0 auto;
	padding: 0 0 10px 0;
	overflow:hidden; /*clerfix用*/
	position:relative;
	width:100%;
	height:100px;
}

#indiv header,
#start_guide header,
#info header{
	margin:161px auto 0 auto;
}

header:after{
	content:" ";
	background:url(../images/mainbody_top_side.png) 0 25px repeat-x;
	display:block;
	position:absolute;
	height:125px;
	width:50%;
	top:0;
	left:-480px;
}

header:before{
	content:" ";
	background:url(../images/mainbody_top_side.png) 0 25px repeat-x;
	display:block;
	position:absolute;
	height:125px;
	width:50%;
	top:0;
	right:-480px;
}

footer{
	clear:both;
	font-size:small;
	padding:30px 0;
	text-align:center;
	color:#FFFFFF;
}

img{
	border:0 none;
	vertical-align:top;
}

h1{
	margin: 20px 0 20px 0;
	text-align:center;
}

h2{
	margin: 20px 0 20px 0;
	text-align:center;
}

h3{
	color:#495FF4;
}

/* -----ids ----- */
#dmm_header{
	border:none;
	height:39px;
	margin:0;
	padding:0;
}

#wrapper{
	margin:0 auto;
	overflow:hidden;
	width:100%;
}

#home #wrapper{
	background:url(../images/title.png);
	background-position:center -40px;
	background-repeat:no-repeat;
}

#contents{

	margin:0 auto 0px auto;
	overflow:hidden;
	position:relative;
}

#main_menu{
	background:url(../images/menu.png) no-repeat;
	display:block;
	height:63px;
	margin:0px auto;
	padding:10px 0px 0px 12px;
	width:918px;
}

#main_menu li{
	display:block;
	height:50px;
	float:left;
}

#main_menu li a{
	display:block;
	height:50px;
	width:100%;
	/*リンクの文字を消す*/
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	opacity:0;
}

#menu_library,
#menu_top,
#menu_start,
#menu_manual,
#menu_about{
	width:151px;
}

#menu_support{
	width:152px;
}

#menu_top a{
	background:url(../images/menu_top.png) no-repeat;
}

#menu_about a{
	background:url(../images/menu_about.png) no-repeat;
}

#menu_start a{
	background:url(../images/menu_start.png) no-repeat;
}

#menu_manual a{
	background:url(../images/menu_manual.png) no-repeat;
}

#menu_library a{
	background:url(../images/menu_library.png) no-repeat;
}

#menu_support a{
	background:url(../images/menu_support.png) no-repeat;
}

#start{
	position:absolute;
	left:50%;
	background:url(../images/game_start_off.png);
	height:257px;
	margin:169px 0 0px 200px;
	width:257px;
        z-index:10;
}

#start img{
	opacity:0;
}

#title{
	float:left;
	margin-top:370px;
	position:relative;
	width:680px;
}

#title_logo{
	bottom: 0px;
	left: 50%;
	margin-left: -230px;
	position: absolute;
}

#cms{
	float:left;
	overflow:hidden;
	width:715px;
}

#logo{
	display:block;
	height:170px;
	margin:0 auto;
	width:337px;
}

#sidebar{
	float:right;
	width:200px;
	text-align:center;
}

.side_banner{
	margin-bottom:10px;
	display:block;
}

#sidebar #twitter{
	background:#212529;
	display:block;
	border:1px solid #212529;
	border-radius:4px;
	padding:5px;
	box-shadow:rgba(0, 0, 0, 0.3) 1px 1px 0px 0px inset;
	margin-top:10px;
}

#sidebar #twitter img{
	margin-bottom:0;
}

#footer_menu{
	margin:0 0 10px 0;
	overflow:hidden;
	position:relative;
}

#footer_menu ul{
	float:left;
	left:50%;
	list-style:none;
	position:relative;
}

#footer_menu ul li{
	float:left;
	position: relative;
	left: -50%;
	margin:0 5px;
}

#footer_menu ul li a{
	color:#0064CF;
}

#copylight{
	color:#ffffff;
	line-height:1.2;
	margin-bottom:1em;
}

#page-top{
	cursor:pointer;
	display:none;
	position:fixed;
	right:50%;
	bottom:16px;
}

#tomatsu{
	left:50px;
	position:absolute;
	top:90px;
	z-index:10;
}

#toyosaki{
	position:absolute;
	right:40px;
	top:85px;
	z-index:10;
}

/*----- プレイヤーの位置指定 -----*/

#jp_container_1,
#jp_container_3{
	right:118px;
	position:absolute;
	bottom:30px;
	z-index:10;
}

#jp_container_2,
#jp_container_4{
	position:absolute;
	left:118px;
	bottom:30px;
	z-index:10;
}


/* ----- class ----- */

.about img{
	display:block;
	margin:0 auto;
}

.setumei{
	clear:both;
	font-size:90%;
	line-height:1.4;
	overflow:hidden;
	padding:0px 60px 30px 60px;
}

.setumei .context{
	display:block;
	float:right;
	width:566px;
}

.setumei img{
	border:2px solid #ccc;
	border-radius:10px;
}

.setumei p{
	margin-bottom:1em;
}

.setumei ul li{
	padding-left:1em;
	list-style:inside;
}

.warning{
	color:#FF0000	;
}

.to_top{
	margin: 0 0 20px 0;
	text-align:center;
}

.character{
	position:relative;
}