﻿* {
margin:0;
padding:0;
}

a { outline: none; }

body {
	text-align:center;
	font-family: 'メイリオ',Meiryo,'ＭＳ Ｐゴシック','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro', verdana, Helvetica,Arial, sans-serif;
	width:100%;
	height:100%;
	line-height:1.6;
	background:#000 url(../images/renew_usf4/common_bg01.jpg) center top no-repeat;
}

#btn_blog{
	position:fixed;
	top:280px;
	right:0px;
	z-index:30;
}

.wrap01 {
	background:none;
	position:relative;
}

.wrap02 {background:none;}

.wrap03 {
	background:none;
	position:relative;
	overflow:hidden;
}

.common_bg_logo {
	display:block;
	position:absolute;
	top:0;
	left:50%;
	margin:0 0 0 -257px;
}

.common_bg_left {
	display:block;
	position:absolute;
	top:0;
	left:50%;
	margin:0 0 0 -830px;
}

.common_bg_right {
	display:block;
	position:absolute;
	top:45px;
	left:50%;
	margin:0 0 0 230px;
}

.cf:after {
	content: "";
	display: block;
	clear: both;
}

p {
	color:#FFF;
}

img{
	vertical-align:bottom;
	border:none;
	max-width:100%;
}

.red {
font-weight:bold;
color:#F00;
}

a {
color:#F00;
text-decoration:underline;
}

a:hover {
text-decoration:none;
}

#container_frame{
	background:#000;
	width:1000px;
	margin:-18px auto 0 auto;
	padding:10px 0 30px 0;
	z-index:10;
}

#container {
	width:900px;
	margin:0 auto 0 auto;
	border:solid 1px #555;
	padding:10px 40px 0 40px;
	text-align:left;
	font-size:75%;
	position:relative;
	z-index:10;
}

#contents_area{
	position:relative;
	z-index:20;
	overflow:hidden;
}


.wrap03{
	padding:80px 0 0 0;
	position:relative;
}

.menu_ils{
	width:522px;
	height:840px;
	position:absolute;
	top:-280px;
	right:-315px;
	z-index:15;
}

.page_sys .sub_menu{background: url(../images/renew_usf4/sub_menu_bg_sys.png) center top no-repeat;}
.page_pro .sub_menu{background: url(../images/renew_usf4/sub_navi_bg_pro.png) center top no-repeat;}
.page_info .sub_menu{background: url(../images/renew_usf4/sub_menu_bg_info.png) center top no-repeat;}
.page_vde .sub_menu{background: url(../images/renew_usf4/sub_menu_bg_vde.png) center top no-repeat;}

.sub_menu{
	width:1003px;
	height:108px;
	margin:0 auto 0 auto;
	padding:25px 0 0 0;
	position:relative;
	z-index:10;
}

.sub_menu ul{
	padding:0 180px 0 300px;
}

.sub_menu ul li{
	float:left;
	position:relative;
}

.sub_menu ul li a{
	margin:5px 5px 10px 5px;
	padding:2px;
	background:#600;
	color:#fff;
	text-decoration:none;
	font-size:0.8em;
	position:relative;
	z-index:20;
}

.sub_menu .mk_new{
	position:absolute;
	top:-19px;
	left:0;
	width:50px;
	z-index:10;
}

a {
	outline:none;
}

#pagetop{
	position:fixed;
	bottom:10px;
	right:30px;
}


section h2{
	position:relative;;
}

section .mk_hlt_new{
	position:absolute;
	top:14px;
	left:15px;
	width:50px;
}



/*-----------------------------------------------------------------------------*/

.g-box01{
	border:solid 1px #999;
	background:#000;
}

.t-bold{font-weight:bold;}
.t-center{text-align:center;}
.t-left{text-align:left;}
.t-right{text-align:right;}
.t-red{color:#f00;}
.t-yellow{color:#ff0;}
.t-white{color:#fff;}
.t-gray{color:#777;}

.t-size_d1{font-size:90%;}
.t-size_d2{font-size:80%;}
.t-size_d3{font-size:70%;}
.t-size_d4{font-size:60%;}

.t-size_u1{font-size:105%;}
.t-size_u2{font-size:110%;}
.t-size_u3{font-size:115%;}
.t-size_u4{font-size:120%;}
.t-size_u5{font-size:125%;}
.t-size_u6{font-size:130%;}
.t-size_u7{font-size:135%;}
.t-size_u8{font-size:140%;}

.t-ind{
	text-indent: -1em;
	padding-left:1em;
}

.sw_10{width:10%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_15{width:15%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_20{width:20%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_25{width:25%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_30{width:30%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_35{width:35%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_40{width:40%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_45{width:45%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_50{width:50%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_55{width:55%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_60{width:60%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_65{width:65%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_70{width:70%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_75{width:75%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_80{width:80%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_85{width:85%; float:left; overflow:hidden; box-sizing:border-box;}
.sw_90{width:90%; float:left; overflow:hidden; box-sizing:border-box;}

.sw_d3{width:33.33%; float:left; overflow:hidden; box-sizing:border-box;}

.sw_box{
	display:block;
	overflow:hidden;
}

.pl_1{padding-left:5px; display:block;}
.pl_2{padding-left:10px; display:block;}
.pl_3{padding-left:15px; display:block;}
.pl_4{padding-left:20px; display:block;}
.pl_5{padding-left:25px; display:block;}
.pl_6{padding-left:30px; display:block;}
.pl_7{padding-left:35px; display:block;}
.pl_8{padding-left:40px; display:block;}
.pl_9{padding-left:45px; display:block;}

.pr_1{padding-right:5px; display:block;}
.pr_2{padding-right:10px; display:block;}
.pr_3{padding-right:15px; display:block;}
.pr_4{padding-right:20px; display:block;}
.pr_5{padding-right:25px; display:block;}
.pr_6{padding-right:30px; display:block;}
.pr_7{padding-right:35px; display:block;}
.pr_8{padding-right:40px; display:block;}
.pr_9{padding-right:45px; display:block;}

.pt_1{padding-top:5px; display:block;}
.pt_2{padding-top:10px; display:block;}
.pt_3{padding-top:15px; display:block;}
.pt_4{padding-top:20px; display:block;}
.pt_5{padding-top:25px; display:block;}
.pt_6{padding-top:30px; display:block;}
.pt_7{padding-top:35px; display:block;}
.pt_8{padding-top:40px; display:block;}
.pt_9{padding-top:45px; display:block;}

.pb_1{padding-bottom:5px; display:block;}
.pb_2{padding-bottom:10px; display:block;}
.pb_3{padding-bottom:15px; display:block;}
.pb_4{padding-bottom:20px; display:block;}
.pb_5{padding-bottom:25px; display:block;}
.pb_6{padding-bottom:30px; display:block;}
.pb_7{padding-bottom:35px; display:block;}
.pb_8{padding-bottom:40px; display:block;}
.pb_9{padding-bottom:45px; display:block;}

.pa_1{padding:5px; display:block;}
.pa_2{padding:10px; display:block;}
.pa_3{padding:15px; display:block;}
.pa_4{padding:20px; display:block;}
.pa_5{padding:25px; display:block;}
.pa_6{padding:30px; display:block;}
.pa_7{padding:35px; display:block;}
.pa_8{padding:40px; display:block;}
.pa_9{padding:45px; display:block;}

.ps_1{padding-right:5px; padding-left:5px; display:block;}
.ps_2{padding-right:10px; padding-left:10px; display:block;}
.ps_3{padding-right:15px; padding-left:15px; display:block;}
.ps_4{padding-right:20px; padding-left:20px; display:block;}
.ps_5{padding-right:25px; padding-left:25px; display:block;}
.ps_6{padding-right:30px; padding-left:30px; display:block;}
.ps_7{padding-right:35px; padding-left:35px; display:block;}
.ps_8{padding-right:40px; padding-left:40px; display:block;}
.ps_9{padding-right:45px; padding-left:45px; display:block;}

.m_auto{margin-left:auto; margin-right:auto; display:block;}




/*************************************************************
ナビゲーション
*************************************************************/

#navi .fire{
	display:none;
	width:142px;
	height:50px;
	position:absolute;
	top:0;
	left:0;
	z-index:0;
}

#navi ul li p{
	height:40px;
	position:relative;
	z-index:10;
}

#navi {
	width:100%;
	height:63px;
	background:url(../images/renew_usf4/navi_bg01.png) 0 0 repeat-x;
	margin:0 0 0 0;
	padding:4px 0 0 0;
	position:absolute;
	top:-1px;
	left:0;
	z-index:20;
}

#navi ul{
	width:920px;
	margin:0 auto 0 auto;
}

#navi ul li{
	height:40px;
	padding:0px 0px 0 10px;
	float:left;
	position:relative;
	background:url(../images/renew_usf4/navi_v-line01.png) left 12px no-repeat;
}

#navi ul li a{
	width:100%;
	height:40px;
	display:block;
	position:relative;
	text-align:center;
	z-index:10;
}

#navi ul li a img{
	line-height:100%;
}

#navi ul li p img{
	display:inline;
	padding-top:14px;
	z-index:10;
	position:relative;
}

#navi ul li .mk_new{
	width:100%;
	height:34px;
	display:none;
	position:absolute;
	top:-10px;
	left:0;
	text-align:center;
	z-index:5;
}

#navi ul li .mk_new img{
	padding:0 0 0 0;
}


#navi ul #btn01{width:100px; background:none;} /*トップ*/
#navi ul #btn02{width:140px;} /*インフォ*/
#navi ul #btn03{width:120px;} /*キャラ*/
#navi ul #btn04{width:100px;} /*システム*/
#navi ul #btn05{width:100px;} /*ビデオ*/
#navi ul #btn06{width:120px;} /*プロダクト*/
#navi ul #btn07{width:120px;} /*DLC*/
#navi ul #btn08{width:110px;} /*アーケード*/


#navi ul #btn08 img{
	margin-top:-2px;
}

/* Newの表示 */
/* #navi ul #btn01 .mk_new{display:block;} トップ*/
/* #navi ul #btn02 .mk_new{display:block;} インフォ*/
/* #navi ul #btn03 .mk_new{display:block;} キャラ*/
/* #navi ul #btn04 .mk_new{display:block;} システム*/
/* #navi ul #btn05 .mk_new{display:block;} ビデオ*/
 #navi ul #btn06 .mk_new{display:block;} /*プロダクツ*/
/* #navi ul #btn07 .mk_new{display:block;} DLC*/
/* #navi ul #btn08 .mk_new{display:block; top:-8px;} アーケード*/





/*************************************************************
フッター
*************************************************************/

div#footer {
clear:both;
width: 100%;
overflow: hidden;
padding:20px 0px;
}

div#link {
clear:both;
width:100%;
overflow: hidden;
padding:10px 0px;
text-align:center;
}

div.main_menu {
float:left;
width:700px;
}
.menu_btn {
loat:left;
margin:3px 0 0 2px;
}

.totop {
clear:both;
text-align:right;
padding-top:15px;
}

.totop a{
color:#fff;
}

p.caution {
text-indent:-1em;
padding-left:1em;
font-size:80%;
}
.develop {
clear:both;
text-align:right;
margin:6px;
font-size:80%;
color:#999;
}
div.main_menu ul#headerList li {
float: left;
text-indent: -9999px;
margin-bottom:5px;
width:225px;
height:36px;
list-style:none;
} 
div.main_menu ul#headerList li a {
display: block;
text-decoration: none;
width:225px;
height:36px;
}
ul#headerList li.menu_ae {
background:url(../images/menu_ae.gif) center bottom no-repeat;
}
ul#headerList li.menu_ae a {
background:url(../images/menu_ae.gif) center top no-repeat;
}
ul#headerList li.menu_3d {
background:url(../images/menu_3d.gif) center bottom no-repeat;
}
ul#headerList li.menu_3d a {
background:url(../images/menu_3d.gif) center top no-repeat;
}
ul#headerList li.menu_dojo {
background:url(../images/menu_dojo.gif) center bottom no-repeat;
}
ul#headerList li.menu_dojo a {
background:url(../images/menu_dojo.gif) center top no-repeat;
}
ul#headerList li.character {
background:url(../images/menu_character.gif) center bottom no-repeat;
}
ul#headerList li.character a {
background:url(../images/menu_character.gif) center top no-repeat;
}
ul#headerList li.system {
background:url(../images/menu_system.gif) center bottom no-repeat;
}
ul#headerList li.system a {
background:url(../images/menu_system.gif) center top no-repeat;
}
ul#headerList li.trailer {
background:url(../images/menu_trailer.gif) center bottom no-repeat;
}
ul#headerList li.trailer a {
background:url(../images/menu_trailer.gif) center top no-repeat;
}
ul#headerList li.blog {
background:url(../images/menu_blog.gif) center bottom no-repeat;
}
ul#headerList li.blog a {
background:url(../images/menu_blog.gif) center top no-repeat;
}
ul#headerList li.relation {
background:url(../images/menu_relation.gif) center bottom no-repeat;
}
ul#headerList li.relation a {
background:url(../images/menu_relation.gif) center top no-repeat;
}
div.main_menu ul#headerList li a:hover {
background-position:center bottom;
}

address {
font-style:normal;
color:#555555;
font-family:Arial, Helvetica, sans-serif;
margin:3px auto;
}


.under_menu {
	color:#333;
	padding:10px 0px 0px 170px;
	visibility:hidden;
}
.under_menu li {
	float:left;
	border-left:1px #666 solid;
	padding-left:15px;
	margin-left:15px;
	list-style:none;
}
.under_menu li a {
	color:#666;
	text-decoration:none;
}


/*************************************************************
ムービーページ
*************************************************************/
.movie_block {
	width:930px;
	margin:0 auto 0 auto;
	padding:0 0 10px 0;
}

.movie_block ul{
	overflow:hidden;
	padding:0 0 0 0;
}

.movie_list li {
	float: left;
	padding:0 30px 20px 0;
	color:#fff;
	width:280px;
	overflow:hidden;
}

.movie_list li p{
	padding:5px 0 0 0;
	font-size:1.3em;
	float:left;
}

.movie_list li a{
	width: 278px;
	border:solid 1px #666;
	display:block;
	position:relative;
}

.movie_list li a .btn_play{
	position:absolute;
	top:85px;
	left:105px;
}

.movie_list li a .option{
	display:block;
	width:115px;
	height:1.2em;
	text-align:center;
	padding:3px;
	position:absolute;
	top:0;
	left:0;
	z-index:100;
	background-color:#007dbb;
	border:solid 2px #61c1ef;
	color:#fff;
	font-weight:bold;
	font-size:13px;
}


/*************************************************************
コンテンツ用映像枠
*************************************************************/

.movie_contents {
	width:480px;
	/*border:solid 1px #666;*/
	overflow:hidden;
}

.movie_contents a{
	width: 480px;
	display:block;
	position:relative;
	margin:-20px 0 0 0;
	z-index:10;
}

.movie_contents p{
	/*border-top:solid 1px #666;*/
	text-align:center;
	font-size:1.3em;
	margin:-40px 0 0 0;
	position:relative;
	z-index:20;
}


.movie_contents .btn_play{
	position:absolute;
	top:150px;
	left:205px;
}

.movie_contents a .option{
	display:block;
	width:115px;
	height:1.2em;
	text-align:center;
	padding:3px;
	position:absolute;
	top:0;
	left:0;
	z-index:100;
	background-color:#007dbb;
	border:solid 2px #61c1ef;
	color:#fff;
	font-weight:bold;
	font-size:13px;
}
