@charset "UTF-8";
/* CSS Document */

html,body,div,ul,ol,li,dl,dt,dd,form,fieldset,input,textarea,h1,h2,h3,h4,h5,h6,pre,code,p,blockquote,hr,th,td { margin:0; padding:0;}

body,td,th { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; background-color: #000; color:#FFF;}
img{ border:0; }
a:link { color: #C00;}
a:visited { color: #C00;}
a:hover { color: #FFF;}
a:active { color: #09F;}
a { overflow: hidden; outline: none;}

#wrapper{ width:1000px; margin:0 auto;}
#toppage{ text-align:center;}
#toppage #btn_in{ margin-left:315px; }
#toppage #btn_in ul{ list-style:none; }
#toppage #btn_in li{ float:left;}
#toppage #btn_in li.yes a{ display:block; width:183px; height:37px; background-image:url(../img/btn_in.gif); text-indent:-9999px;}
#toppage #btn_in li.no a{ display:block; width:183px; height:37px; background-image:url(../img/btn_out.gif); text-indent:-9999px; margin-left:10px;}
#toppage #btn_in li.yes a:hover{ background-position:0 -37px;}
#toppage #btn_in li.no a:hover{ background-position:0 -37px;}
#z{ margin-top:50px; margin-bottom:50px;}

#header { height:50px; background-image:url(../img/header.png); position:relative;}
#header h1 a{ display:block; width:227px; height:121px; position:absolute; background-image:url(../img/logo.png); text-indent:-9999px;}
#header ul{ list-style:none;}
#header li{ float:right; }
#header li.facebook { margin-top: 17px; margin-right: 10px;}
#header li.twitter { margin-top:17px; }
#header li.wii{ margin-top:12px; margin-right:20px;}
#header li.order{ padding-right:5px;}
#header li a:hover img{ opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }

#navi{ height:46px; background-image:url(../img/navi.gif);}
#navi ul{ list-style:none; padding-left:240px;}
#navi li { float:left;}
#navi li a{ display:block; height:46px; text-indent:-9999px;}
#navi li.n01 a{	background-image: url(../img/navi1.png); width: 185px;}
#navi li.n02 a{	background-image: url(../img/navi2.png); width: 108px;}
#navi li.n03 a{	background-image: url(../img/navi3.png); width: 137px;}
#navi li.n04 a{	background-image: url(../img/navi4.png); width: 113px;}
#navi li.n05 a{	background-image: url(../img/navi5.png); width: 214px;}
#navi li a:hover{ background-position:0 -46px;}

#navi li.n01r { float:left; display:block; height:46px; text-indent:-9999px; background-image:url(../img/navi1.png); width:185px; background-position:0 -46px;}
#navi li.n02r { float:left; display:block; height:46px; text-indent:-9999px; background-image:url(../img/navi2.png); width:108px; background-position:0 -46px;}
#navi li.n03r { float:left; display:block; height:46px; text-indent:-9999px; background-image:url(../img/navi3.png); width:137px; background-position:0 -46px;}
#navi li.n04r { float:left; display:block; height:46px; text-indent:-9999px; background-image:url(../img/navi4.png); width:113px; background-position:0 -46px;}
#navi li.n05r { float:left; display:block; height:46px; text-indent:-9999px; background-image:url(../img/navi5.png); width:214px; background-position:0 -46px;}

#main{	height: 636px;	position: relative;	clear: both;}
#main ul{ list-style:none;}
#main li.fami{ position: absolute; top:13px; left: 15px; z-index: 50;}
#main li.ss{
	position: absolute;
	top: 519px;
	left: 27px;
	z-index: 50;
}
#main li.mov{
	position: absolute;
	top: 519px;
	left: 187px;
	z-index: 50;
}
#main li.day{
	position: absolute;
	top: 363px;
	z-index: 100;
	left: 27px;
}
#main li.day .left{float:left; margin:15px 0 0 20px;}
#main li.day .right{float:left; margin:16px 0 0 10px;}
#main li.day .update{float:left; margin:16px 0 0 10px;}

#main li.cero{ position: absolute; left: 950px;	top: 562px;	z-index: 200;}
#main li a:hover img{ opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }
#main li.ud{
	position: absolute;
	top: 503px;
	left: 473px;
	z-index: 50;
}

#content_features{ margin:0 auto; padding-bottom:40px; width:900px; line-height:180%; font-size:14px;}
#content_features .ft{ background-repeat: no-repeat; background-position: top; height:450px; position:relative;}
#content_features .ft ul{ list-style: none;	position: absolute;	left: 691px; top: 365px;}
#content_features .ft li {display: block; width: 159px;	height: 44px; overflow:hidden;}
#content_features .ft li a{	display: block;	width: 159px; height: 44px; background-image: url(../img/btn_fsb.gif); overflow: hidden; text-indent: -9999px; overflow:hidden;}
#content_features .ft li a:hover{ background-position:0 -44px;}
#content_features .line{ height: 1px; background-image: url(../img/line_f.jpg);}

#content_story{	margin: 20px auto 0 450px; padding-bottom:125px; width:550px;	line-height:180%; font-size:14px;}
#content_movie{ margin:20px auto 50px auto; width:780px; }
#content_action{ margin: 0 auto 30px auto; width: 900px;}

#content_action #senmetsu1{	height: 566px; width: 900px; background-image: url(../img/senmetsu1.jpg); background-repeat: no-repeat;	position:relative;}
#content_action #senmetsu1 .txt1{ font-size: 14px; line-height: 180%; background-image: url(../img/senmetsu_line.png); background-repeat: no-repeat; background-position: top left;	padding-top: 30px; width: 350px; position: absolute;left: 550px; top: 24px;}
#content_action #senmetsu1 .txt2{ font-size: 14px; line-height: 180%; background-image: url(../img/senmetsu_line.png); background-repeat: no-repeat; background-position: top left; padding-top: 30px; width: 300px; position: absolute;	left: 2px; top: 361px;}
#content_action h4{ clear:both;}
#content{ margin:0 auto 50px auto; width:900px; }

#content_shadow{ margin:0 auto; padding-bottom:40px; width:900px; line-height:180%; font-size:14px; background-repeat:no-repeat;}
#content_shadow .ft{ background-repeat: no-repeat; background-position: top; height:337px; position:relative;}
#content_shadow h4{ padding: 20px 0 10px 0;}
#content_shadow .right{ width:310px; margin-left:590px;}
#content_shadow .line{ height: 1px; background-image: url(../img/line_f.jpg); margin-bottom:20px;}
#content_shadow .ft ul{ list-style: none; margin-top:20px;}
#content_shadow .ft li { display: block; width: 119px;	height: 33px; overflow:hidden;}
#content_shadow .ft li a{ display: block; width: 119px; height: 33px; background-image: url(../img/btn_fsb2.gif); overflow: hidden; text-indent: -9999px; overflow:hidden;}
#content_shadow .ft li a:hover{ background-position:0 -33px;}

#info{ height: 25px; background-image: url(../img/info.gif); background-repeat: no-repeat; text-align:center;}
#info p{ font-size:11px; padding-top:8px; margin:0; line-height:100%;}
#info p span{ color:#C00; font-weight:bold; padding-right:7px;}
#info p a{ text-decoration:none; color:#FFF;}
#info p a:hover{ text-decoration:underline; color:#F00;}

#container { width: 752px; padding:10px 10px 60px 10px; margin: 0 auto; position: relative; z-index: 0;}
#example { width: 752px; height: 450px;	position: relative;}

#slides { position: absolute; top: 0px;	left: 0px; z-index: 100;}
.slides_container {	width: 752px; height: 450px; overflow: hidden; position: relative; display: none;}
#slides .slide { width: 752px; height: 450px; display: block;}
#slides .next,#slides .prev { position: absolute; top: 202px; left: -35px; width: 24px;	height: 43px; display: block; z-index: 101;}
#slides .next {	left: 760px;}

.pagination { margin:15px auto 0; width:170px;}
.pagination li { float:left; margin:0 1px; list-style:none;}
.pagination li a {	display:block; width:12px;	height:0; padding-top:12px; background-image:url(../img/pagination.png); background-position:0 0; float:left; overflow:hidden;}
.pagination li.current a { background-position:0 -12px;}

#screen ul{list-style:none;}
#screen li{ float:left; margin:0 9px 19px 9px; width:168px; height:96px; border:solid 1px #666666;}
#screen li span{ position: absolute; color: #000; font-weight:bold; font-size: 10px; background-color: #59C10B; padding: 1px 6px; margin: 0 0 0 -168px; line-height: 140%;}
#screen a:hover img{ opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }

#tabmenu{ padding: 0px; margin: 0px; color: #333; font-size: 11px; width: 930px; position: relative;}
#tabmenu div#tab{
	position: absolute;
	top: 90px;
	left: 770px;
	width: 200px;
	background-image: url(../img/chara_line.png);
	background-repeat: no-repeat;
	background-position: right;
}
#tabmenu div#tab a{
	width: 200px;
	display: block;
}
#tabmenu div#tab a:hover img{ opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }

div#tab_contents{ width: 930px;	overflow: hidden; clear: both; height: 800px; margin-bottom:30px; }
div#tab_contents ul{ width: 9300px;	padding: 0px; margin: 0px;}
div#tab_contents ul li{	float: left; width: 930px; list-style-type:none; height:800px;}
div#tab_contents ul li .ct{ margin-top:60px;}
div#tab_contents ul li .ctxt{ color:#FFF; font-size:14px; width:500px; padding-left:50px; line-height:150%;}

#movie{	margin:0 auto; }
#movie ul{list-style:none;}
#movie li{ float:left; border:#666 solid 1px; margin:0 15px 30px 15px; width:357px; height:200px;}
#movie li a{ width:357px; height:200px;}
#movie li a:hover img{ opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }
#movie li span{	position: absolute;	color: #000; font-weight:bold; font-size: 10px; background: #59C10B; padding: 1px 6px; margin: 2px 0 0 -355px; line-height: 140%;}

#gettop { text-align:right; font-size:10px; }
#gettop a{ text-decoration:none; font-weight:bold; }
#gettop a:hover{ text-decoration:underline; }

.tabmenu2{ padding: 0px; margin: 0px; width: 900px;	height: 41px; background-image: url(../img/bg_sa.png); background-repeat: no-repeat;}
.tabmenu2 ul{ list-style:none; }
.tabmenu2 li{ float:left; }
.tabmenu2 li a:hover img{ opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }

#footer{ background-image: url(../img/line.jpg); background-repeat: no-repeat; background-position: center top; position:relative;}
#footer #copy{
	margin: 0px auto 30px auto;
	width: 945px;
	padding-top: 30px;
}
#footer #get_tn a{ position: absolute; display: block; width: 107px; height: 14px;left: 844px; top:15px;	background-image: url(../img/btn_get_tns.gif); text-indent: -9999px;}
#footer #get_tn a:hover{ background-position:0 -14px;}

#footer #sns{ position: absolute; display: block; width: 300px; top: 20px; left: 25px;}
#footer #sns ul{ list-style:none;}
#footer #sns li{ float:left; }
#footer #sns li.facebook {}
#footer #sns li.twitter {}

.f00{ margin:190px 0 0 120px;}
.f00 ul{ list-style:none;}
.f00 li{ text-indent:-9999px;}
.f00 li.tab1 a{ display:block; width:755px; height:101px; background-image:url(../features/btn_f01.png);  }
.f00 li.tab2 a{ display:block; width:755px; height:101px; background-image:url(../features/btn_f02.png); margin:0 0 180px 0; }
.f00 li.tab1 a:hover{ background-position:0 -101px;}
.f00 li.tab2 a:hover{ background-position:0 -101px;}

.tab{ display: block; width: 754px;	height: 77px; margin: 0 auto; background-image: url(../features/tab.png);}
.tab ul{ list-style:none;}
.tab li{ float:left; text-indent:-9999px;}
.tab li.tab0 a{
	display: block;
	width: 280px;
	height: 40px;
	background-image: url(../features/tab00.png);
	margin: 14px 20px 0 0;
}
.tab li.tab1 a{ display:block; width:311px; height:40px; background-image:url(../features/tab01.png); margin:14px 30px 0 20px; }
.tab li.tab2 a{	display: block;	width: 88px; height: 40px; background-image: url(../features/tab02.png); margin: 14px 0 0 10px;}
.tab li.tab0 a:hover{ background-position:0 -40px;}
.tab li.tab1 a:hover{ background-position:0 -40px;}
.tab li.tab2 a:hover{ background-position:0 -40px;}
.tab li.tab0r{
	display: block;
	width: 280px;
	height: 40px;
	background-image: url(../features/tab00.png);
	margin: 14px 15px 0 0;
	background-position: 0 -40px;
}
.tab li.tab1r{
	display: block;
	width: 311px;
	height: 40px;
	background-image: url(../features/tab01.png);
	margin: 14px 30px 0 15px;
	background-position: 0 -40px;
}
.tab li.tab2r{ display:block; width:88px; height:40px; background-image:url(../features/tab02.png); margin:14px 0 0 10px; background-position:0 -40px; }

#product{
	width: 660px;
	margin-top: 10px;
	margin-right: auto;
	margin-bottom: 30px;
	margin-left: auto;
	position: relative;
}
#product #img{ float:left;}
#product #spec{ float:right; width:430px}
#product #spec .box{ width:100%; font-size:14px; line-height:160%;}
#product #spec .box td{ padding-bottom:2px;}

#small{
	margin-top: 20px;
}
#small .leftside{width:430px; float:left;}
#small .rightside{width:430px; float:right;}
#small a:hover img{ opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }

.graff{ width:900px; margin:0 auto; font-size:13px; line-height:135%; border-top: solid 1px #990000; border-bottom: solid 1px #990000; margin-bottom:20px;}
.graff th{ border-bottom:solid 1px #333333; background-image:url(../features/gruff_bg.jpg); padding:6px; text-align:left; border-top: solid 1px #333333; color:#F00;}
.graff td{ border-bottom:solid 1px #333333; background-image:url(../features/gruff_bg.jpg); padding:6px;}

#xsg{ margin-top:25px;}
#xsg ul{ list-style:none;}
#xsg li { float:left; }
#xsg li a{ display:block; width:159px; height:44px; text-indent:-9999px;}
#xsg li.toryu a{ background-image:url(../img/0228/btn_toryu.gif); margin-right:10px;}
#xsg li.fukuryu a{ background-image:url(../img/0228/btn_fukuryu.gif);}
#xsg li a:hover{ background-position:0 -44px;}

#demo{ width:867px; margin:0 auto; font-size:14px; line-height:150%;}
#demo #date{ margin:20px 0; font-size:18px; width:800px; }
#demo #date td{ padding-bottom:7px; color:#C00;}
#demoplate{ height:94px; background-image:url(../img/0228/demoplate.jpg); margin-bottom:40px;}
#demoplate #menu{ width:900px; padding:15px 0 0 66px;}
#demoplate #menu ul{ list-style:none;}
#demoplate #menu li{ float:left; margin-right:8px;}
#demoplate #menu li a:hover img{ opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }