@charset "UTF-8";
/*common.css*/

/*---------------------------------------------------------------*/
/*module*/
.clearSpace{display:none; visibility:hidden; font-size:0; line-height:0; height:0;}
iframe{position:relative;}
.btnClass a{display:block; width:100%; height:100%; background-repeat:no-repeat; background-position:left top; text-indent:-9999px; overflow:hidden;}
.btnClass a:hover{background-position:left bottom;}
h1,h2,h3,h4,h5,h6,
p,dd,dt,th,td{font-size:12px; line-height:1.2; text-align:left;}

.gNormal,gFloat{ width:100%; float:left; clear:both;}

/*---------------------------------------------------------------*/
/*font style*/
a		{color:#32c8ff;text-decoration:underline;}
a:hover	{color:#32e4ff;}
.txtLogo{vertical-align:-1px !important;padding:0 !important;vertical-align:-2px; padding:2px 0;}
p.caution{text-indent:-1em; padding-left:1em;}
.paragraph{padding-top:1em;}

address p{font-size:9px; line-height:1.4; text-align:center;}
address p .line01{color:#43c28b;}
address p .line02{color:#54d365;}
address p.xboxCopy{color:#21bcad;}
address p.psCopy{color:#63c6fa;}

/*---------------------------------------------------------------*/
/*layout*/
html{overflow-y:scroll;z-index:1;}
#wrapper{width:100%;min-width:980px;min-height:920px;overflow:hidden;position:relative;z-index:2;}
.fullPage #wrapperIn{min-width:980px;z-index:10;position:relative;z-index:5;}
#contents{width:980px;margin:0 auto;}

nav li{float:left;}
nav li a,
nav li p{width:100%;height:100%;display:block;text-indent:-9999px;background-position:0 0;background-repeat:no-repeat;}

#bgArea{width:1600px;height:920px;position:absolute;left:50%;top:0;margin-left:-800px;z-index:3;overflow:hidden;}
#bgArea p{position:absolute;left:0;top:0;}

footer{width:100%;min-height:30px;padding-bottom:20px;position:relative;}
footer nav li a{text-indent:0;}

/*nextCont*/
.nextCont header{width:911px;height:40px;margin:0 auto;padding:30px 9px 48px 0;}
.nextCont header h1{width:135px;float:left;}
.nextCont #contents{width:940px;height:490px;margin:0 auto;padding-bottom:245px;position:relative;}

/*gNav*/
header #gNav{float:right;width:633px;padding-top:3px;}
header #gNav li{float:left;height:33px;margin-right:23px;}
header #gNav li a,
header #gNav li p{background-image:url(../img/next_btn_nav.png);}

header #gNav #btnAbout{width:64px;}
header #gNav #btnAbout a{background-position:0 0;}
header #gNav #btnAbout a:hover{background-position:0 -33px;}
#about #gNav #btnAbout a,
#aboMulti #gNav #btnAbout a{background-position:0 -66px;}

header #gNav #btnStory{width:63px;}
header #gNav #btnStory a{background-position:-87px 0;}
header #gNav #btnStory a:hover{background-position:-87px -33px;}
#story header #gNav #btnStory a{background-position:-87px -66px;}

header #gNav #btnChara{width:127px;}
header #gNav #btnChara a{background-position:-173px 0;}
header #gNav #btnChara a:hover{background-position:-173px -33px;}
#characters header #gNav #btnChara a{background-position:-173px -66px;}
header #gNav #btnChara p{background-position:-173px -99px;}

header #gNav #btnSystem{width:76px;}
header #gNav #btnSystem a{background-position:-323px 0;}
header #gNav #btnSystem a:hover{background-position:-323px -33px;}
#system header #gNav #btnSystem a{background-position:-323px -66px;}
header #gNav #btnSystem p{background-position:-323px -99px;}

header #gNav #btnMulti{width:56px;}
header #gNav #btnMulti a{background-position:-422px 0;}
header #gNav #btnMulti a:hover{background-position:-422px -33px;}
#multi header #gNav #btnMulti a{background-position:-422px -66px;}
header #gNav #btnMulti p{background-position:-422px -99px;}

header #gNav #btnCoop{width:51px;margin-right:22px;}
header #gNav #btnCoop a{background-position:-501px 0;}
header #gNav #btnCoop a:hover{background-position:-501px -33px;}
#coop header #gNav #btnCoop a{background-position:-501px -66px;}
header #gNav #btnCoop p{background-position:-501px -99px;}

header #gNav #btnMovie{width:59px;margin-right:0;}
header #gNav #btnMovie a{background-position:-574px 0;}
header #gNav #btnMovie a:hover{background-position:-574px -33px;}
#movie header #gNav #btnMovie a{background-position:-574px -66px;}

/*scrollNav*/
section #scrollNav{width:100px;height:11px;}
section #scrollNav li{height:11px;}
section #scrollNav li.off,
section #scrollNav li a{background-image:url(../img/next_btn_scroll.png);}
/**/
section #scrollNav #btnBack{width:41px;margin-right:20px;} 
section #scrollNav #btnBack a{background-position:0 0;} 
section #scrollNav #btnBack a:hover{background-position:0 -11px;} 
section #scrollNav #btnBack.off{background-position:0 -22px;} 
/**/
section #scrollNav #btnNext{width:39px;} 
section #scrollNav #btnNext a{background-position:-41px 0;} 
section #scrollNav #btnNext a:hover{background-position:-41px -11px;} 
section #scrollNav #btnNext.off{background-position:-41px -22px;}