@charset "utf-8";

@import url("common.css");

#wrapper {
	min-width:980px;
	margin:0px auto 0px auto;
	padding:500px 0px 0px 0px;
	display:block;
	background:url(../images/bg_pack.jpg) no-repeat 50% 0px fixed;/**/
}


/*ロゴ*/
#logo_knm {
	width:100px;
	height:21px;
	margin:0px 0px 0px 0px;
	position:absolute;
	left: 16px;
	top: 17px;
}

	#logo_knm a {
		width:100px;
		height:21px;
		margin:0px 0px 0px 0px;
		display:block;
	}
	
		#logo_knm a span {
			width:100px;
			height:21px;
			display:block;
			visibility:hidden;
		}

/*コンテンツ部分*/
#content {
	min-width:980px;
	height:100%;
	background:none;
	text-align:left;
	overflow:auto;
	background:url(../images/bg_left.png) left repeat-y;
}


/*左部分---------------------------------------------*/
#content .boxLeft{
	width:359px;
	float:left;
	padding-bottom:50px;
}

/*パッケ*/
.pack{
	width:296px;
	/*border-top:1px solid #343434;*/
	border-bottom:1px solid #343434;
	padding:5px 10px 15px 5px;
	margin-left:17px;
	margin-bottom:15px;
}


/*アップデート*/

.update{
	width:296px;
	border-bottom:1px solid #343434;
	padding:7px 10px 10px;
	margin-left:17px;
	margin-bottom:15px;
}

	.update li{
		overflow:hidden;
		line-height:1em;
		margin-bottom:10px;
	}
		.update li span.date{
			display:block;
			width:70px;
			float:left;
			color:#959595;
			font-size:10px;
		}
		.update li span.spec{
			display:block;
			width:220px;
			float:left;
			color:#009844;
			font-size:10px;
		}
		
/*コピーライト*/
.copyright{
	margin-left:17px;
}
	.copyright p{
		font-size:11px;
		margin-bottom:1em;
	}



/*右部分---------------------------------------------*/
#content .boxRight{
	overflow:hidden;
	background:url(../images/bg_right.png);/**/
	padding-bottom:50px;
}

.gnavi{ background-color: #058746; }

.head{
	overflow:auto;
	height:44px;
	background:url(../images/bg_title.png) left top;
	margin-bottom:20px;
}
	.head span{
		float:left;
		display:block;
		padding-top:17px;
	}
	.head .btn_top{
		float:right;
	}

/*体験版告知*/
.demo_wrap{
	overflow:hidden;
	margin-left:16px;
	margin-bottom:20px;

}

#trial {
	width:666px;
	height:597px;
	display:block;
	position:relative;
	padding:17px 0 15px 0;
	}

#dl_detail {
	width:190px;
	height:36px;
	display:block;
	position:absolute;
	left: 21px;
	top: 203px;
	}
	
#dl_detail span {
	width:190px;
	height:36px;
	display:block;
	visibility:hidden;
	}


#combox_wrap {
	width:567px;
	height:93px;
	display:block;
	position:absolute;
	left: 22px;
	top: 249px;
}


#combox {
	width:567px;
	height:93px;
	background:url(../images/comment/comment_base.png);
	display:block;
	position:relative;
}

#scroll {

	overflow:hidden;
	position:absolute;
	left: 14px;
	top: 12px;
	/*border:1px solid #ddd;*/
}

#combox_list {
	width:201px;
	height:95px;
	display:block;
	position:absolute;
	left: 369px;
	top: 0px;
}

#combox_list a {
	width:201px;
	height:95px;
	display:block;
}

#combox_list a span {
	width:201px;
	height:95px;
	display:block;
	visibility:hidden;
}






/*トレイラー*/
.trailers_wrap{
	overflow:hidden;
	margin-left:20px;
	margin-bottom:20px;
}

	.trailers_wrap .box{
		position:relative;
		float:left;
		width:160px;
		margin-right:10px;
		margin-bottom:10px;
	}
	.trailers_wrap .box .icon{
		position:absolute;
		left:1px;
		top:1px;
		}

/*スクリーンショット*/
.ss_wrap{
	position:relative;
	background:#000;
	overflow:hidden;
	width:604px;
	padding-top:1px;
	padding-left:1px;
	margin-left:20px;
	margin-bottom:24px;
}

	.ss_wrap .icon{
		position:absolute;
		left:1px;
		top:1px;
		z-index:100;
	}
	.ss_wrap .title{
		height:30px;
		padding-left:37px;
	}
		.ss_wrap .title img{
			margin-top:10px;
		}
	
	.ss_wrap .line{
		overflow:hidden;
		margin-bottom:1px;
	}

	.ss_wrap .box{
		position:relative;
		float:left;
		width:150px;
		margin-right:1px;
	}
		.ss_wrap .box a img{
			-moz-opacity:0.6;opacity:0.6;filter:alpha(opacity=60); border:none;
		}
		.ss_wrap .box a:hover img{
			-moz-opacity:1;opacity:1;filter:alpha(opacity=100); border:none;
		}

/*ストーリー*/
.story_wrap{
	margin-left:20px;
	padding-top:5px;
}
	.story_wrap p{
		width:95%;
		font-size:11px;
		line-height:1.5em;
		color:#b6b6b6;
		margin-bottom:30px;
	}
	
/*キャラクター*/
.characters_wrap{
	overflow:hidden;
	width:599px;/**/
	margin-left:20px;
	margin-bottom:50px;
	background:#000;
	padding:1px;
}
	.characters_wrap .box{
		float:left;
		position:relative;
	}
	.characters_wrap .box .icon{
		position: absolute;
		right:0;
		top:0;
	}

/*フッタ*/
.footer_wrap{
	width:760px;
	color:#b6b6b6;
	border-top:1px solid #626262;
	margin-left:12px;
	padding-top:15px;
}

	.footer_wrap span{
		margin-left:20px;
	}

	.footer_wrap a,
	.footer_wrap a:hover{
		font-size:10px;
		color:#b6b6b6;
	}
	.footer_wrap a:hover{
		text-decoration:underline;
	}
	
.footerbox {
	display:block;
	position:relative;
}


/* Twitter */

.footerbox #twbox {
	width:80px;
	height:100px;
	display:block;
	position:absolute;
	left: 152px;
	top:0px;

}

/* FaceBook */
	
.footerbox #fbbox {
	width:80px;
	height:100px;
	display:block;
	position:absolute;
	left: 237px;

	top:0px;

}
	
/*ThickBox*/
#TB_window #TB_closeAjaxWindow {
	margin-right: 35px;
}

#TB_window #TB_closeWindow a{
	position: absolute;
	top: -15px;
	right: 8px;
	width: 76px;
	height: 23px;
	background:url(../images/btn_close.png) left top no-repeat;
	line-height: 0;
	font-size:1px;
	color:#333;
}

#TB_window #TB_closeAjaxWindow a {
	position: absolute;
	top: 0px;
	right: 10px;
	width: 76px;
	height: 23px;
	background:url(../images/btn_close.png) left top no-repeat;
	line-height: 0;
	font-size:1px;
	color:#333;
}

	#TB_window #TB_closeWindow a:link,
	#TB_window #TB_closeWindow a:visited,
	#TB_window #TB_closeAjaxWindow a:link,
	#TB_window #TB_closeAjaxWindow a:visited {
	}
	
	#TB_window #TB_closeWindow a:hover,
	#TB_window #TB_closeWindow a:focus,
	#TB_window #TB_closeWindow a:active,
	#TB_window #TB_closeAjaxWindow a:hover,
	#TB_window #TB_closeAjaxWindow a:focus,
	#TB_window #TB_closeAjaxWindow a:active {
		background:url(../images/btn_close.png) left bottom no-repeat;
	}
	
/* --------------- ティッカーBOX --------------- */

#tickerbox {
	width:930px;
	height:47px;
	margin:0px 0px 0px 0px;
	margin:0px auto;
	background:url(../images/index/ticker_bg.gif) 0px 0px;
	position:relative;
	overflow:hidden;
}

#tickerbox #scroll {
	position:absolute;
	top:10px;
	left:83px;
}

#tickerbox #show {
	width:83px;
	height:37px;
	position:absolute;
	top:5px;
	left:843px;
}


#tickerbox #show a {
	width:83px;
	height:37px;
	display:block;
}

#tickerbox #show a span {
	width:83px;
	height:37px;
	display:block;
	visibility:hidden;
}