@charset "utf-8";

body {
	min-height:930px;
	background:#000;
}

img {
	display:block;
}

#wrapper {
	position:relative;
	width:1000px;
	margin:0 auto;
	/*padding:0 10px;*/
}

div#external_index {
	min-height:930px;
	background:url(../images/body_bg.jpg) center top no-repeat;
}

#topHeader {
	padding:14px 23px 15px;
}


#topContents {
	position:relative;
	width:964px;
	height:524px;
	margin:0 auto;
}

#topContents h1 {
	position:absolute;
	bottom:0;
	left:304px;
}



#updateArea {
	overflow:hidden;
	position:absolute;
	bottom:7px;
	width:273px;
	height:124px;
	padding:9px 7px 9px 10px;
	color:#fff;
	background:url(../images/update_bg.png);
}

.updtHead {
	padding:0 0 10px;
}

.updtHead h3 {
	float:left;
}

.updtHead .switch {
	float:right;
	cursor:pointer;
}

.updtList dl {
	padding-bottom:6px;
}

.updtList dl dt,
.updtList dl dd {
	float:left;
	font-size:84%;
}

.updtList dl dt {
	padding-left:4px;
	width:64px;
}

.updtList dl dd {
	width:190px;
}

.updtList dl dd a {
	color:#dad2af;
	text-decoration:none;
}

.stScrl {
	height:470px;
}

.jScrollPaneTrack {
	display:none;
}


#spArea {
	position:absolute;
	right:0;
	bottom:7px;
	width:271px;
}

#spArea .youtube {
	position:relative;
}

#spArea .youtube .newIcon {
	position:absolute;
	top:-16px;
	left:120px;
}

#spArea .voice {
	padding:8px 0 0;
}

#spArea .event {
	padding:8px 0 0;
}

#gNavi {
	overflow:hidden;
	position:relative;
	width:980px;
	height:44px;
	margin:0 auto 11px;
	background:url(../images/gnavi.png) center top no-repeat;
}

#gNavi li {
	display:inline;
}

#gNavi li a {
	overflow:hidden;
	position:absolute;
	display:block;
	top:16px;
	height:13px;
	text-indent:-999em;
}

#gN01 {
	left:120px;
	width:31px;
	text-indent:-999em;
	visibility:hidden;
}

#gN01 a {
	left:120px;
	width:31px;
}

#gN02 a {
	left:169px;
	width:40px;
}
#gN03 a {
	left:227px;
	width:49px;
}
#gN04 a {
	left:293px;
	width:65px;
}
#gN05 a {
	left:375px;
	width:96px;
}
#gN06 a {
	right:422px;
	width:68px;
}
#gN07 a {
	right:305px;
	width:99px;
}
#gN08 a {
	right:185px;
	width:102px;
}
#gN09 a {
	right:110px;
	width:56px;
}

.coming {
	padding:0 0 14px 312px;
}

#footer {
	position:absolute;
	width:1000px;
	top:688px;
	left:0;
}

/* @group clearfix ----------------------------------------- */

.updtHead:after,
.updtList dl:after {
	display:block;
	clear:both;
	visibility:hidden;
	height:0;
	content:".";
	font-size:0;
}

* html .updtHead,
* html .updtList dl {/* IE6 */
	zoom:1;
}

*:first-child+html .updtHead,
*:first-child+html .updtList dl {/* IE7 */
	zoom:1;
}

/* @end */



/* ----------- Add 2010 10 27 ---------- */

#top_op #container #header{
	background-image:url(../images/op/op_bg.jpg);
	background-repeat:no-repeat;
	width:960px;
	height:1130px;/**/
	position:relative;
}


#top_op #container #header h1 a{
	width:282px;
	height:134px;
	text-indent:-9999px;
	display:block;
	position:absolute;
	left:118px;
	top:23px;
	overflow: hidden;
	outline: none;

}


#trailer {
	display:block;
	width:960px;
	height:1180px;
	position:relative;
}

#trailer li {
	display:block;
}

#trailer li a {
	display:block;
	overflow: hidden;
	outline: none;
}

#trailer li a span {
	display:block;
	visibility:hidden;
}


/* -----吉田バナー----- */

#trailer #btn_yoshida {
	width:703px;
	height:143px;
	position:absolute;
	left: 123px;
	top: 139px;
}

#trailer #btn_yoshida a {
	width:703px;
	height:143px;
	background:url(../images/op/banner_yoshida.jpg) no-repeat 0px 0%;
}

#trailer #btn_yoshida a:hover {
	width:703px;
	height:143px;
	background:url(../images/op/banner_yoshida.jpg) no-repeat 0px 100%;
}

#trailer #btn_yoshida a span {
	width:703px;
	height:143px;
	display:block;
}

/* -----吉田バナー----- */


/* -----お詫び----- */

#trailer #btn_text {
	width:703px;
	position:absolute;
	left: 123px;
	top: 135px;
	text-align:center;
	color:#fff;
}

#trailer #btn_text a {
	color:#fff;
}

/* -----お詫び----- */




/* -----発売イベント----- */

#trailer #btn_event {
	width:703px;
	height:125px;
	position:absolute;
	left: 123px;
	top: 286px;
}

#trailer #btn_event a {
	width:703px;
	height:125px;
	background:url(../images/op/banner_event.jpg) no-repeat 0px 0%;
}

#trailer #btn_event a span {
	width:703px;
	height:125px;
	display:block;
}

/* -----発売イベント----- */


/* -----ニコ生----- */

#trailer #btn_nico {
	width:703px;
	height:177px;
	position:absolute;

	left: 123px;
	top: 286px;
}

#trailer #btn_nico img {
	border:none;

}

#trailer #btn_nico span {
	width:703px;
	height:177px;
	display:block;
	visibility:hidden;
}

/* -----ニコ生----- */







#trailer #btn_enter {
	width:721px;
	height:87px;
	position:absolute;
	left: 114px;
	top: 160px;
}

#trailer #btn_enter a {
	width:721px;
	height:87px;
	background:url(../images/op/btn_enter.png) no-repeat 0px 0%;
}

#trailer #btn_enter a:hover {
	width:721px;
	height:87px;
	background:url(../images/op/btn_enter.png) no-repeat 0px 100%;
}

#trailer #btn_enter a span {
	width:721px;
	height:87px;
	display:block;
}




#trailer #btn_playable {
	width:172px;
	height:132px;
	position:absolute;
	left: 128px;
	top: 15px;
background:url(../images/op/banner_playable.png) no-repeat 0px 0px;
}

#trailer #btn_playable a {
	width:172px;
	height:132px;
}

#trailer #btn_playable a:hover {
	width:172px;
	height:132px;
	
}

#trailer #btn_playable a span {
	width:172px;
	height:132px;
	display:block;
}


#trailer_box {
	width:703px;
	height:354px;
	display:block;
	background:url(../images/op/trailer_box.png) no-repeat 0px 0px;
	position:absolute;
	left: 123px;
	top: 260px;
}







#trailer #mov_kh {
	width:312px;
	height:177px;
	position:absolute;
	left: 1px;
	top: 34px;
}

#trailer #mov_kh a {
	width:312px;
	height:177px;
}

#trailer #mov_kh a:hover {
	width:312px;
	height:177px;
	background:url(../images/op/mov_kh.jpg) no-repeat 0px 0px;
}

#trailer #mov_kh a span {
	width:312px;
	height:177px;
	display:block;
}



#trailer #mov_chap01 {
	width:117px;
	height:66px;
	position:absolute;
	left: 336px;
	top: 33px;
}

#trailer #mov_chap01 a {
	width:117px;
	height:66px;
}

#trailer #mov_chap01 a:hover {
	width:117px;
	height:66px;
	background:url(../images/op/mov_play.png) no-repeat 0px 0px;
}

#trailer #mov_chap01 a span {
	width:117px;
	height:66px;
	display:block;
}


#trailer #mov_chap02 {
	width:117px;
	height:66px;
	position:absolute;
	left: 461px;
	top: 33px;
}

#trailer #mov_chap02 a {
	width:117px;
	height:66px;
}

#trailer #mov_chap02 a:hover {
	width:117px;
	height:66px;
	background:url(../images/op/mov_play.png) no-repeat -125px 0px;
}

#trailer #mov_chap02 a span {
	width:117px;
	height:66px;
	display:block;
}


#trailer #mov_chap03 {
	width:117px;
	height:66px;
	position:absolute;
	left: 586px;
	top: 33px;
}

#trailer #mov_chap03 a {
	width:117px;
	height:66px;
}

#trailer #mov_chap03 a:hover {
	width:117px;
	height:66px;
	background:url(../images/op/mov_play.png) no-repeat -250px 0px;
}

#trailer #mov_chap03 a span {
	width:117px;
	height:66px;
	display:block;
}



#trailer #mov_chap04 {
	width:117px;
	height:66px;
	position:absolute;
	left: 336px;
	top: 142px;
}

#trailer #mov_chap04 a {
	width:117px;
	height:66px;
}

#trailer #mov_chap04 a:hover {
	width:117px;
	height:66px;
	background:url(../images/op/mov_play.png) no-repeat 0px -109px;
}

#trailer #mov_chap04 a span {
	width:117px;
	height:66px;
	display:block;
}





#trailer #mov_chap05 {
	width:117px;
	height:66px;
	position:absolute;
	left: 461px;
	top: 142px;
}

#trailer #mov_chap05 a {
	width:117px;
	height:66px;
}

#trailer #mov_chap05 a:hover {
	width:117px;
	height:66px;
	background:url(../images/op/mov_play.png) no-repeat -125px -109px;
}

#trailer #mov_chap05 a span {
	width:117px;
	height:66px;
	display:block;
}


#trailer #mov_chap06 {
	width:117px;
	height:66px;
	position:absolute;
	left: 586px;
	top: 142px;
}

#trailer #mov_chap06 a {
	width:117px;
	height:66px;
}

#trailer #mov_chap06 a:hover {
	width:117px;
	height:66px;
	background:url(../images/op/mov_play.png) no-repeat -250px -109px;
}

#trailer #mov_chap06 a span {
	width:117px;
	height:66px;
	display:block;
}


#trailer #mov_chap07 {
	width:117px;
	height:66px;
	position:absolute;
	left: 336px;
	top: 255px;
}

#trailer #mov_chap07 a {
	width:117px;
	height:66px;
}

#trailer #mov_chap07 a:hover {
	width:117px;
	height:66px;
	background:url(../images/op/mov_play.png) no-repeat 0px -222px;
}

#trailer #mov_chap07 a span {
	width:117px;
	height:66px;
	display:block;
}



#trailer #btn_valuepack {
	width:703px;
	height:246px;
	position:absolute;
	left: 125px;
	top: 640px;
	background:url(../images/op/banner_vpack.jpg) no-repeat 0px 0px;

}

#trailer #btn_valuepack a {
	width:703px;
	height:246px;
	display:block;

}

#trailer #btn_valuepack a:hover {
	width:703px;
	height:246px;
	display:block;
}

#trailer #btn_valuepack  span {
	width:703px;
	height:246px;
	display:block;
	visibility:hidden;
}










#trailer #collabo {
	width:703px;
	border:1px solid #3c2620;
	position:absolute;
	left: 125px;
	top: 1235px;
}

#trailer #collabo img {
	padding:17px 17px 12px 17px;
	border:none;
}


#trailer #collabo p {
	padding:0px 17px 17px 17px;
	color:#999999;
	line-height:1.5em;
}

#trailer #collabo p a {
	display:inline;
	color:#FFCC00;
	text-decoration:none;
	border:none;
}

#trailer #collabo p a:hover {
	display:inline;
	color:#FFCC00;
	text-decoration:underline;
}








#trailer #dx_banner {
	width:703px;
	position:absolute;
	left: 125px;
	top: 905px;
	display:block;
}
