@charset "utf-8";

@import url("general.css");

body {background-image: url('bg.jpg');}
#header {
	height: 252px;
	background-image: url('header.jpg');
}
#tweet {top: 165px}

#areaMain {padding-top: 24px; position: relative; }



/* ===========================================================================
 左エリア */
#areaLeft {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
}
#areaLeft nav {
	position: sticky;
	z-index: 3;
	margin-left: 25px;
	margin-top: 43px;
	top: 43px;
	width: 180px;
	padding-top: 74px;
	background: url('areaLeftTop.png') no-repeat !important; background: none;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="css/areaLeftTop.png",sizingMethod="crop");		/*IE用*/
}


#areaLeftBtm {
	width: 100%;
	height: 13px;
	background: url('areaLeftBtm.png') no-repeat !important; background: none;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="css/areaLeftBtm.png",sizingMethod="crop");		/*IE用*/
}


h2 {
	position: absolute;
	left: 13px;
	top: 14px;
	margin: 0;
	width: 145px;
	height: 55px;
	background-repeat: no-repeat;
	text-indent: -9999px;
}
/*
コンテンツ枠シャドウ：2px
マット：161c40
*/

#sto h2 { background-image: url('h2_sto.gif'); }
#chr h2 { background-image: url('h2_chr.gif'); }
#sys h2 { background-image: url('h2_sys.gif'); }
#prd h2 { background-image: url('h2_prd.gif'); }
#pub h2 { background-image: url('h2_pub.gif'); }
#spe h2 { background-image: url('h2_spe.gif'); }



#localNavi {
	margin: 0;
	padding: 11px 0 0;
	width: 100%;
	list-style: none;
	background: url('localNaviTop.png') no-repeat !important; background: none;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="css/localNaviTop.png",sizingMethod="crop");		/*IE用*/
}

#localNavi li {
/*	display: block;
	float:left;
	width: 159px;*/
	height: 21px;
	padding: 0px;
	padding-left: 21px;
	background: url('localNaviBdy.png') repeat-y !important; background: none;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="css/localNaviBdy.png",sizingMethod="scale");		/*IE用*/
	text-align: left;
}

#localNavi a {
	position: relative;
	display: block;
	width: 144px;
	height: 100%;
	text-indent: 19px;
	background: url('localNavi.gif') 7px 4px no-repeat;

	overflow: hidden;
	text-decoration: none;
	line-height: 18px;
	color: #b8bddc;

	font-family: Meiryo,'メイリオ','ＭＳ Ｐゴシック' !important;	font-family: 'ＭＳ Ｐゴシック';
}

#localNavi a.on ,
#localNavi a:hover {
	text-indent: 24px;
	background: url('localNavi_hover.png') no-repeat !important; background: none;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="css/localNavi_hover.png",sizingMethod="crop");		/*IE用*/
	color: #fff;
}



#localNaviBtm {
	width: 100%;
	height: 15px;
	overflow-y: hidden;
	background: url('localNaviBtm.png') no-repeat !important; background: none;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="css/localNaviBtm.png",sizingMethod="crop");		/*IE用*/
}



/* ===========================================================================
 右エリア */
#areaRight {
	position: relative;
	margin-left: 203px;
	padding-top: 73px;
	padding-bottom: 68px;
	width: 676px;
	text-align: center;
}


#sys #areaRight ,
#prd #areaRight ,
#pub #areaRight ,
#spe #areaRight {
	background: url('areaRight.jpg') no-repeat;
}

#sto #areaRight {
	background: url('areaRight_sto.jpg') no-repeat;
	height: 538px;
	padding: 0;
	text-align: left;
	text-indent: -9999px;
}


#areaRightBtm {
	position: absolute;
	left: 0;
	bottom: -11px;
	width: 100%;
	height: 68px;
	background: url('areaRightBtm.png') no-repeat !important; background: none;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="css/areaRightBtm.png",sizingMethod="crop");		/*IE用*/
}


/* --------------------------------------------------------
共通 */
#prd h3 ,
#spe h3 {
	margin: 0 auto 10px;
	width: 579px;
	height: 23px;
	text-align: left;
	text-indent: 20px;
	line-height: 23px; 
	color: #faa927;
	background: url('h3.png') no-repeat !important; background: none;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="css/h3.png",sizingMethod="crop");		/*IE用*/
}

#prd h4 ,
#spe h4 {
	margin: 0 0 5px;
	width: 100%;
	text-align: left;
	font-size: 10pt;
	padding-left: 10px;
	background: url('h4.gif') 0px 3px no-repeat;
}


small { font-size: 8pt; }
strong { font-weight: bold; }
strong.orange { color: #faa927; }
.important { color: #faa927; }
textarea { color: #000;}


.detail {
	margin: 0 auto 20px;
	width: 560px;
	text-align: left;
}



table.detail th ,
#prd td ,
#pub td {
	border-bottom: 1px solid #484a5f;
}

table.detail th {
	width: 100px;
	font-weight: normal;
}




/* --------------------------------------------------------
キャラクター */

#chr #areaRight {
	height: 576px;
	padding: 0;
	background-repeat: no-repeat;
	text-align: left;
	text-indent: -9999px;
}


#chr .c01 { background-image: url('areaRight_chr01.jpg'); }
#chr .c02 { background-image: url('areaRight_chr02.jpg'); }
#chr .c03 { background-image: url('areaRight_chr03.jpg'); }
#chr .c04 { background-image: url('areaRight_chr04.jpg'); }
#chr .c05 { background-image: url('areaRight_chr05.jpg'); }
#chr .c06 { background-image: url('areaRight_chr06.jpg'); }
#chr .c07 { background-image: url('areaRight_chr07.jpg'); }
#chr .c08 { background-image: url('areaRight_chr08.jpg'); }
#chr .c09 { background-image: url('areaRight_chr09.jpg'); }
#chr .c10 { background-image: url('areaRight_chr10.jpg'); }
#chr .c11 { background-image: url('areaRight_chr11.jpg'); }
#chr .c12 { background-image: url('areaRight_chr12.jpg'); }
#chr .c13 { background-image: url('areaRight_chr13.jpg'); }
#chr .c14 { background-image: url('areaRight_chr14.jpg'); }



#chr #areaRight a#cv {
	position: absolute;
	display: block;
	left: 423px;
	top: 215px;
	width: 177px;
	height: 29px;
	overflow-x: hidden;
}
#chr #areaRight a#cv:hover ,
#chr #areaRight a#cv[data-status="play"] {
	background: url('cv_hover.png') no-repeat !important; /*background: none;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="css/cv_hover.png",sizingMethod="crop");		/*IE用*/
}


/* ---------------------------------------------------------------------------
 システム */

#sys h3 {
	margin: 0 auto 10px 0;
	width: 300px;
	height: 22px;
	text-align: left;
	text-indent: -9999px;
}

#sys0101 { background: url('h3_sys0101.gif') no-repeat; }
#sys0102 { background: url('h4_sys0102.gif') no-repeat; width: 340px;}
#sys0103 { background: url('h4_sys0103.gif') no-repeat; }

#sys0201 { background: url('h3_sys0201.gif') no-repeat; }
#sys0202 { background: url('h3_sys0202.gif') no-repeat; }
#sys0203 { background: url('h4_sys0203.gif') no-repeat; width: 300px;}

#sys0301 { background: url('h3_sys0301.gif') no-repeat; }
#sys0302 { background: url('h4_sys0302.gif') no-repeat; }
#sys0303 { background: url('h4_sys0303.gif') no-repeat; width: 300px;}

#sys0401 { background: url('h3_sys0401.gif') no-repeat; }
#sys0402 { background: url('h3_sys0402.gif') no-repeat; }
#sys0403 { background: url('h3_sys0403.gif') no-repeat; }

#sys h4 {
	margin: 0 0 5px;
	height: 22px;
	text-align: left;
	text-indent: -9999px;
}

 
#sys th {
	background: #dbcbac;
	font-weight: normal;
}
#sys td {
	background: #fff;
}

#sys table {
	border-left: 1px solid #b2975b;
	border-top: 1px solid #b2975b;
}

#sys th ,
#sys td {
	border-right: 1px solid #b2975b;
	border-bottom: 1px solid #b2975b;
	color: #3f2f0a;
	text-align: center;
	font-size: 8pt;
	padding: 3px 5px;
}


/* ---------------------------------------------------------------------------
 雑誌情報 */

#pub table {
	margin: 0 auto 10px;
	width: 579px;
	text-align: left;
}


#pub table .new td {
	background-color: #555379;
	border-bottom: 1px solid #1b2046;
}


#pub th {
	font-weight: bold;
	border-bottom: 1px solid #9EA0B6;
	color: #9EA0B6;
}



/* ---------------------------------------------------------------------------
 スペシャル */

#spe .priv td {
	width: 170px;
	vertical-align: top;
	padding-bottom: 10px;
}


#spe .detail { margin-bottom: 50px; }
#spe .detail.last { margin-bottom: 0px;}
#spe .detail ul { padding-left: 20px; }
#spe .detail li { margin-bottom: 0.5em; }

#spe .textArea {
	padding: 15px 15px 10px;
	border:1px solid #888;
	background: #000;
}
#spe .textArea li { margin-left: 10px; }

#spe h4 {
	border-bottom: 1px solid #faa927;
	margin-top: 1.5em;
}

#imageDetails * { color: #333 !important; }


#spe #areaRight {
	width: 671px;
}
#spe #areaLeft {
	position: absolute;
/*	z-index: 10;
/*	margin-left: 25px;
/*	left: auto;
/*	top: 295px;*/
}


#spe #areaRight {
	padding-top: 0;
	background: url('areaRight2.jpg') repeat-y;
}
#spe #areaRightWrap {
	padding-top: 73px;
	background: url('areaRight.jpg') no-repeat;
	padding-bottom: 80px;
	margin-bottom: -70px;
}


#spe #areaMain:before {
	position: absolute;
	top: 925px;
	content: "";
	display: block;
	width: 100%;
	height: 100px;
	background: url('footer.png') repeat-x;
}



/*[EOF]*/