@charset "UTF-8";
/*
 *
 * $reset
 *
 *
*/
body, div, h1, h2, h3, h4, h5, h6, p, dl, dt, dd, ul, ol, li, 
brockquote, pre, table, caption, th, td, address, 
form, fieldset, legend, object, input{margin:0;padding:0;}
h5, h6, pre, table, code, kbd, samp, acronym, input, textarea, select{font-size:100%;}
a, ins{text-decoration:none;}
address, em, cite, dfn, var{font-style:normal;}
input, textarea{/*font-family:sans-serif;*/font-weight:normal;}
img{vertical-align:baseline;}
a img{border:none;margin:0;}
* html body{ /* for IE6 */font-size:small;}
*:first-child+html body{ /* for IE7 */font-size:small;}
ul{list-style-position:outside;list-style-type:none;}
ol{list-style-position:outside;margin-left:20px;}
table{border-collapse:collapse;/*word-break: break-word;*/}
legend{	color: #333;}
div, pre{word-wrap: break-word}
pre{white-space: pre-wrap;}
iframe{border:0;padding:0;}
a.colorbox{outline:none;}

/*
 *
 * $html
 *
 *
*/
html{margin:0;padding:0;}
body{
	font-family:'ヒラギノ角ゴ Pro W3',Osaka,'Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-seri;
	background:url(../img/bg_r.jpg) repeat;
}
p{font-size:14px;line-height:130%;}
.serif{font-family: 'Times New Roman', Times, "ヒラギノ明朝 Pro W6", "Hiragino Mincho Pro", "HGS明朝B", "ＭＳ Ｐ明朝", serif;}

/*
 *
 * $body
 *
 *
*/
.sprite{
	background:url(../img/sprite.png) no-repeat;
}
.hide{display:none;}
.page-top{
	position:fixed;
	right:20px;
	top:20px;
	z-index:50;
	display:none;
}
.ss{outline:none;}
/*
 *
 * $wrap
 *
 *
*/
#wrap{
	width:100%;
	max-width:1600px;
	min-width:960px;
	overflow:hidden;
	background:url(../img/bg.jpg) repeat;
	margin:0 auto;
	position:relative;
	-webkit-box-shadow:rgba(0, 0, 0, 0.4) 0px 0px 6px 3px;
	-moz-box-shadow:rgba(0, 0, 0, 0.4) 0px 0px 6px 3px;
	box-shadow:rgba(0, 0, 0, 0.4) 0px 0px 6px 3px;
}


/*
 *
 * $header
 *
 *
*/
#header{
	width:960px;
	position:absolute;
	top:0;
	left:0;
	right:0;
	margin:0 auto;
	z-index:10;
}
	#header .capcom{
		float:left;
		padding:13px 0 0 0;
	}
		#header .capcom a{
			width:117px;
			height:24px;
			display:block;
			background-position:-10px -13px;
		}
	
	#header .cog{
		float:left;
		padding:10px 0 0 10px;
	}
		#header .cog a{
			width:114px;
			height:32px;
			display:block;
			background-position:-138px -12px;
		}
	
	#header .twitter{
		float:right;
		padding:10px 5px 0 10px;
	}
		#header .twitter a{
			width:54px;
			height:54px;
			display:block;
			background-position:-265px -5px;
			-webkit-box-shadow:rgba(0, 0, 0, 0.2) 2px 2px 6px 4px;
			-moz-box-shadow:rgba(0, 0, 0, 0.2) 2px 2px 6px 4px;
			box-shadow:rgba(0, 0, 0, 0.2) 2px 2px 6px 4px;
		}
		
		#header .twitter a:hover{
			background-position:-319px -5px;
		}
	#header .facebook{
		float:right;
		padding:10px 0 0 0;
	}
		#header .facebook a{
			width:54px;
			height:54px;
			display:block;
			background-position:-373px -5px;
			-webkit-box-shadow:rgba(0, 0, 0, 0.2) 2px 2px 6px 4px;
			-moz-box-shadow:rgba(0, 0, 0, 0.2) 2px 2px 6px 4px;
			box-shadow:rgba(0, 0, 0, 0.2) 2px 2px 6px 4px;
		}
		#header .facebook a:hover{
			background-position:-427px -5px;
		}
		

/*
 *
 * $navigation
 *
 *
*/
#navigation{
	width:100%;
	height:382px;
	background:url(../img/mv.png) no-repeat top center;
	position:absolute;
	top:0;
	left:0;
}
	#navigation ul{
		width:925px;
		height:70px;
		margin:210px auto 0px auto;
		padding:0px 0px 0px 0px;
		box-sizing:border-box;
		z-index:11;
	}
	
		#navigation ul li{
			padding:0 20px 0 0;
			float:left;
		}
		#navigation ul li:last-child{
			padding:0;
		}
	
	#navigation li a{
		width:115px;
		height:70px;
		display:block;
	}
	#navigation .nav-ice a{background-position:0 -64px;}
	#navigation .nav-ice a:hover{background-position:0 -134px;}
	#navigation .nav-jin a{background-position:-115px -64px;}
	#navigation .nav-jin a:hover{background-position:-115px -134px;}
	#navigation .nav-pari a{background-position:-575px -64px;}
	#navigation .nav-pari a:hover{background-position:-575px -134px;}
	#navigation .nav-armor a{background-position:-230px -64px;}
	#navigation .nav-armor a:hover{background-position:-230px -134px;}
	#navigation .nav-gankin a{background-position:-690px -64px;}
	#navigation .nav-gankin a:hover{background-position:-690px -134px;}
	#navigation .nav-refine a{background-position:-460px -64px;}
	#navigation .nav-refine a:hover{background-position:-460px -134px;}
	#navigation .nav-notice a{background-position:-345px -64px;}
	#navigation .nav-notice a:hover{background-position:-345px -134px;}
	

/*
 *
 * $main
 *
 *
*/
#main{
	padding:382px 0 15px;
}


/*
 *
 * $ice
 *
 *
*/
#ice{
	width:100%;
	height:995px;
	margin:-65px 0 0;
	background:url(../img/ice.png) no-repeat bottom center;
	position:relative;
	z-index:10;
}
	#ice .contents{
		width:960px;
		margin:0 auto;
		position:relative;
	}
	#ice #ice_ss01{
		position:absolute;
		top:293px;
		right:-20px;
		-webkit-transition-property: all;
		-webkit-transition-duration: 0.2s;
		-webkit-transition-timing-function: linear;
		transition-property: all;
		transition-duration: 0.2;
		transition-timing-function: linear;
	}
		#ice #ice_ss01:hover{
			opacity:0.8;
			filter: alpha(opacity=80);
			-ms-filter: "alpha(opacity=80)"; 
		}
	#ice #ice_ss02{
		position:absolute;
		top:666px;
		right:43px;
		-webkit-transition-property: all;
		-webkit-transition-duration: 0.2s;
		-webkit-transition-timing-function: linear;
		transition-property: all;
		transition-duration: 0.2;
		transition-timing-function: linear;
	}
		#ice #ice_ss02:hover{
			opacity:0.8;
			filter: alpha(opacity=80);
			-ms-filter: "alpha(opacity=80)"; 
		}

/*
 *
 * $pari
 *
 *
*/

#pari{
	width:100%;
	height:778px;
	background:url(../img/pari.png) no-repeat top center;
	position:relative;
	z-index:10;
}



/*
 *
 * $jin
 *
 *
*/
#jin{
	width:100%;
	height:790px;
	background:url(../img/jin.png) no-repeat top center;
	position:relative;
	z-index:10;
}
	#jin .movie{
		width:960px;
		margin:0 auto;
		position:relative;
	}
	#jin .movie a{
		width:473px;
		height:252px;
		position:absolute;
		top:305px;
		left:65px;
		display:block;
		border:3px solid #000;
		background-position:0 -204px;
	}
	#jin .movie a:hover{
		background-position:0 -456px;
	}






/*
 *
 * $armor
 *
 *
*/
#armor{
	width:100%;
	position:relative;
	z-index:10;
}
	#armor .inr{
		width:960px;
		margin:0 auto;
		position:relative;
	}

	.armor01{
		width:100%;
		height:850px;
		background:url(../img/armor01.png) no-repeat top center;
	}
		.armor01 li{
			position:absolute;
		}
		.armor01 li#armorBtn01{
			top:682px;
			left:40px;
		}
		.armor01 li#armorBtn02{
			top:682px;
			left:750px;
		}
		.armor01 li#armorBtn03{
			top:590px;
			left:295px;
		}
	
	.armor02{
		width:100%;
		height:670px;
		background:url(../img/armor02.png) no-repeat top center;
	}
		.armor02 li{
			position:absolute;
		}
		.armor02 li#armorBtn04{
			top:400px;
			left:163px;
		}
		.armor02 li#armorBtn05{
			top:615px;
			left:170px;
		}
		.armor02 li#armorBtn06{
			top:615px;
			left:388px;
		}
		.armor02 li#armorBtn07{
			top:615px;
			left:633px;
		}
	
	.armor03{
		width:100%;
		height:610px;
		background:url(../img/armor03.png) no-repeat top center;
	}
		.armor03 li{
			position:absolute;
		}
		.armor03 li#armorBtn08{
			top:530px;
			left:30px;
		}
		.armor03 li#armorBtn09{
			top:530px;
			left:533px;
		}
	
	.armor04{
		width:100%;
		height:610px;
		background:url(../img/armor04.png) no-repeat top center;
	}
		.armor04 li{
			position:absolute;
		}
		.armor04 li#armorBtn10{
			top:533px;
			left:64px;
		}
		.armor04 li#armorBtn11{
			top:533px;
			left:516px;
		}
	
	.armor05{
		width:100%;
		height:767px;
		background:url(../img/armor05.png) no-repeat top center;
	}
	


	.armor_btn_a{
		width:155px;
		height:36px;
		display:block;
		text-indent:-9999px;
		background:url(../img/armor_btn_a.png) no-repeat top center;
	}
	.armor_btn_a:hover{
		background-position:bottom center;
	}

	
	.armor_btn_b{
		width:364px;
		height:226px;
		display:block;
		text-indent:-9999px;
		background:url(../img/armor_btn_b.png) no-repeat top center;
	}
	.armor_btn_b:hover{
		background-position:bottom center;
	}




/*
 *
 * $gankin
 *
 *
*/
#gankin{
	width:100%;
	position:relative;
	z-index:10;
}
	#gankin .inr{
		width:960px;
		margin:0 auto;
		position:relative;
	}

	.gankin01{
		width:100%;
		height:985px;
		background:url(../img/gankin01.png) no-repeat top center;
	}
	#gankin #gankin_ss01{
		position:absolute;
		top:374px;
		left:-21px;
		-webkit-transition-property: all;
		-webkit-transition-duration: 0.2s;
		-webkit-transition-timing-function: linear;
		transition-property: all;
		transition-duration: 0.2;
		transition-timing-function: linear;
	}
		#gankin #gankin_ss01:hover{
			opacity:0.8;
			filter: alpha(opacity=80);
			-ms-filter: "alpha(opacity=80)"; 
		}
	#gankin #gankin_ss02{
		position:absolute;
		top:636px;
		left:48px;
		-webkit-transition-property: all;
		-webkit-transition-duration: 0.2s;
		-webkit-transition-timing-function: linear;
		transition-property: all;
		transition-duration: 0.2;
		transition-timing-function: linear;
	}
		#gankin #gankin_ss02:hover{
			opacity:0.8;
			filter: alpha(opacity=80);
		}

	.gankin02{
		width:100%;
		height:693px;
		background:url(../img/gankin02.png) no-repeat top center;
	}
	
	.gankin03{
		width:100%;
		height:553px;
		background:url(../img/gankin03.png) no-repeat top center;
	}

/*
 *
 * $refinee
 *
 *
*/
#refine{
	width:100%;
	position:relative;
	z-index:10;
}
	#refine .inr{
		width:960px;
		margin:0 auto;
		position:relative;
	}

	.refine01{
		width:100%;
		height:670px;
		background:url(../img/refine01.png) no-repeat top center;
	}

	.refine02{
		width:100%;
		height:398px;
		background:url(../img/refine02.png) no-repeat top center;
	}
	
	.refine03{
		width:100%;
		height:420px;
		background:url(../img/refine03.png) no-repeat top center;
	}
	
	.refine04{
		width:100%;
		height:523px;
		background:url(../img/refine04.png) no-repeat top center;
	}
	
	.refine05{
		width:100%;
		height:689px;
		background:url(../img/refine05.png) no-repeat top center;
	}
	
	.refine06{
		width:100%;
		height:626px;
		background:url(../img/refine06.png) no-repeat top center;
	}
	
	.refine07{
		width:100%;
		height:602px;
		background:url(../img/refine07.png) no-repeat top center;
	}

	#refine #refine_ss01{
		position:absolute;
		top:151px;
		right:59px;
		-webkit-transition-property: all;
		-webkit-transition-duration: 0.2s;
		-webkit-transition-timing-function: linear;
		transition-property: all;
		transition-duration: 0.2;
		transition-timing-function: linear;
	}
		#refine #refine_ss01:hover{
			opacity:0.8;
			filter: alpha(opacity=80);
			-ms-filter: "alpha(opacity=80)"; 
		}
	#refine #refine_ss02{
		position:absolute;
		top:345px;
		right:-15px;
		-webkit-transition-property: all;
		-webkit-transition-duration: 0.2s;
		-webkit-transition-timing-function: linear;
		transition-property: all;
		transition-duration: 0.2;
		transition-timing-function: linear;
	}
		#refine #refine_ss02:hover{
			opacity:0.8;
			filter: alpha(opacity=80);
		}

	#refine #refine_ss03{
		position:absolute;
		top:58px;
		left:195px;
		-webkit-transition-property: all;
		-webkit-transition-duration: 0.2s;
		-webkit-transition-timing-function: linear;
		transition-property: all;
		transition-duration: 0.2;
		transition-timing-function: linear;
	}
		#refine #refine_ss03:hover{
			opacity:0.8;
			filter: alpha(opacity=80);
			-ms-filter: "alpha(opacity=80)"; 
		}
	#refine #refine_ss04{
		position:absolute;
		top:220px;
		left:-17px;
		-webkit-transition-property: all;
		-webkit-transition-duration: 0.2s;
		-webkit-transition-timing-function: linear;
		transition-property: all;
		transition-duration: 0.2;
		transition-timing-function: linear;
	}
		#refine #refine_ss04:hover{
			opacity:0.8;
			filter: alpha(opacity=80);
		}

	#refine #refine_ss05{
		position:absolute;
		top:206px;
		right:106px;
		-webkit-transition-property: all;
		-webkit-transition-duration: 0.2s;
		-webkit-transition-timing-function: linear;
		transition-property: all;
		transition-duration: 0.2;
		transition-timing-function: linear;
	}
		#refine #refine_ss05:hover{
			opacity:0.8;
			filter: alpha(opacity=80);
			-ms-filter: "alpha(opacity=80)"; 
		}
	#refine #refine_ss06{
		position:absolute;
		top:415px;
		right:-30px;
		-webkit-transition-property: all;
		-webkit-transition-duration: 0.2s;
		-webkit-transition-timing-function: linear;
		transition-property: all;
		transition-duration: 0.2;
		transition-timing-function: linear;
	}
		#refine #refine_ss06:hover{
			opacity:0.8;
			filter: alpha(opacity=80);
		}

/*
 *
 * $notice
 *
 *
*/

#notice{
	width:100%;
	height:650px;
	background:url(../img/notice.png) no-repeat top center;
	position:relative;
	z-index:10;
}


/*
 *
 * $wa
 *
 *
*/
.wa{
	width:100%;
	height:857px;
	background:url(../img/wa.png) no-repeat top center;
	position:absolute;
	top:300px;
	left:0;
	z-index:1;
}


/*
 *
 * $footer
 *
 *
*/

#footer{
	width:100%;
	background:#000;
	padding:20px 0 0;
}

	#footer .link{
		width:960px;
		height:32px;
		overflow:hidden;
		position:relative;
		margin:0 auto;
	}
		#footer .link ul{
			position: relative;
			left: 50%;
			float: left;
		}
		
		#footer .link ul li{
			position: relative;
			left: -50%;
			float: left;
			list-style: none;
			padding:0 5px;
		}

	#footer #btn_begin{
		width:193px;
		height:32px;
	}
		#footer #btn_begin a{
			width:193px;
			height:32px;
			display:block;
			background-position:0 -711px;
		}
		#footer #btn_begin a:hover{
			background-position:0 -743px;
		}
	
	#footer #btn_ima{
		width:152px;
		height:32px;
	}
		#footer #btn_ima a{
			width:152px;
			height:32px;
			display:block;
			background-position:-193px -711px;
		}
		#footer #btn_ima a:hover{
			background-position:-193px -743px;
		}
	
	#footer #btn_fukki{
		width:197px;
		height:32px;
	}

		#footer #btn_fukki a{
			width:197px;
			height:32px;
			display:block;
			background-position:-345px -711px;
		}
		#footer #btn_fukki a:hover{
			background-position:-345px -743px;
		}
	.ftBanner{
		margin:15px 0px 0px 0px;
		text-align:center;
	}
	.credit{
		width:765px;
		height:180px;
		background-position:0 -788px;
		margin:15px auto 0;
	}
	


/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{-moz-box-sizing:content-box; -webkit-box-sizing:content-box;box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
    #cboxContent{margin-right:33px;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{ }
        #cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;}
        #cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc;}
        #cboxLoadingGraphic{background:url(../img/cbox/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
        
        #cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;}
        #cboxPrevious,
        #cboxNext{display:none;}
        #cboxClose{position:absolute; top:0px; right:-33px; display:block; background:url(../img/close.gif) no-repeat top center; width:32px; height:32px; text-indent:-9999px;}