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

/* base
------------------------------------------------------------------------------------*/
html {
	font-size:10px;
	margin:0px;
	padding:0px;
}

body {
	font-family: "Hiragino Kaku Gothic ProN" , "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, "Helvetica Neue", Helvetica, "ＭＳ Ｐゴシック", sans-serif;
	font-size:14px;
	font-size:1.4rem;
	line-height:100%;
	color:#130406;
	margin:0px;
	padding:0px;
	-webkit-text-size-adjust:100%;
	-webkit-font-smoothing:subpixel-antialiased;
	-moz-osx-font-smoothing:auto;
}

h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,small,time,table,th,td,input,select {
	font-size:14px;
	font-size:1.4rem;
	font-weight:normal;
	line-height:100%;
	list-style:none;
	margin:0px;
	padding:0px;
}

a { color:#130406; }
a:hover { text-decoration:none; }

img {
	border:none;
	vertical-align:bottom;
}

.clearfix:after {
	height:0;
	display:block;
	clear:both;
	visibility:hidden;
	content:"."; 
	zoom:1;
	overflow:hidden;
  font-size:0.1em;
  line-height:0;
}

.annotation { margin-left:1.4rem; }
.annotation span {
	position:absolute;
	margin-left:-1.4rem;
}
.annotation li:last-child { margin-bottom:0px; }

.listText li {
	list-style:disc;
	margin-left:2rem;
}
.listText li:last-child { margin-bottom:0px; }

.f_red { color:#c5181a; }
.f_blue { color:#1e7daf; }
.f_green { color:#158f0c; }

#switch {
	list-style:none;
	margin:0px;
	padding:0px;
}

@media(min-width:768px) {
	.dispPC { display:block; }
	.dispSP { display:none; }
	
	.btnMore {
		display:none;
	}
	
	.flexBOX {
		display:-webkit-box;
		display:-moz-box;
		display:-ms-box;
		display:-webkit-flexbox;
		display:-moz-flexbox;
		display:-ms-flexbox;
		display:-webkit-flex;
		display:-moz-flex;
		display:-ms-flex;
		display:flex;
		
		-webkit-box-lines:multiple;
		-moz-box-lines:multiple;
		-webkit-flex-wrap:wrap;
		-moz-flex-wrap:wrap;
		-ms-flex-wrap:wrap;
		flex-wrap:wrap;
	}
	
	/* ホワイトボーダー
	---------------------------*/
	.borderOutW {
		-webkit-transform:translateZ(0);
		transform:translateZ(0);
		-webkit-backface-visibility:hidden;
		backface-visibility:hidden;
	}
	
	.borderOutW:before {
		border:#ffffff solid 3px;
		border-radius:50px;
		content:'';
		position:absolute;
		top:0;
		right:0;
		bottom:0;
		left:0;
		-webkit-animation-duration:0.8s;
		animation-duration:0.8s;
	}
	
	.borderOutW:hover:before, .borderOutW:focus:before, .borderOutW:active:before {
		-webkit-animation-name:borderOut;
		animation-name:borderOut;
	}
	
	/* ブルーボーダー
	---------------------------*/
	.borderOutB {
		-webkit-transform:translateZ(0);
		transform:translateZ(0);
		-webkit-backface-visibility:hidden;
		backface-visibility:hidden;
	}
	
	.borderOutB:before {
		border:#2d4473 solid 3px;
		border-radius:50px;
		content:'';
		position:absolute;
		top:0;
		right:0;
		bottom:0;
		left:0;
		-webkit-animation-duration:0.8s;
		animation-duration:0.8s;
	}
	
	.borderOutB:hover:before, .borderOutB:focus:before, .borderOutB:active:before {
		-webkit-animation-name:borderOut;
		animation-name:borderOut;
	}
	
	/* ダークブルーボーダー
	---------------------------*/
	.borderOutDB {
		-webkit-transform:translateZ(0);
		transform:translateZ(0);
		-webkit-backface-visibility:hidden;
		backface-visibility:hidden;
	}
	
	.borderOutDB:before {
		border:#2d4473 solid 2px;
		content:'';
		position:absolute;
		top:0;
		right:0;
		bottom:0;
		left:0;
		-webkit-animation-duration:0.8s;
		animation-duration:0.8s;
	}
	
	.borderOutDB:hover:before, .borderOutDB:focus:before, .borderOutDB:active:before {
		-webkit-animation-name:borderOut;
		animation-name:borderOut;
	}
}

@media(max-width:767px) {
	.dispPC { display:none; }
	.dispSP { display:block; }
	
	.navFixed {
		position:fixed;
		top:0px;
		left:0px;
		z-index:9000;
	}
	
	.btnMore {
		width:100%;
		height:40px;
		background-color:#2d4473;
		background-image:url(../img/sp/btn_more.gif) , url(../img/sp/allow_faceDownW.gif);
		background-repeat:no-repeat , no-repeat;
		background-position:top center , 33% 16px;
		background-size:64px , 12px;	
		box-shadow:0px 3px 3px 0px rgba(0, 0, 0, 0.31);
		display:block;
		text-indent:-9999px;
		overflow:hidden;
		outline:none;
	}
}


/* header
------------------------------------------------------------------------------------*/
/* PC */
@media(min-width:768px) {
	#header {}
	
	#header h1 {
		height:141px;
		background-image:url(../img/pc/headerRoundBack.png) , url(../img/pc/headerTopBorder.gif) , url(../img/headerDotBack.gif);
		background-repeat:no-repeat , repeat-x , repeat;
		background-position:top center , top left , top left;
		background-size:704px , 1px 11px , 8px;
		margin:0px auto;
	}
	
	#header h1 a {
		width:302px;
		display:block;
		margin:0px auto;
		padding:8px 0px 0px 1px;
	}
	
	#header h1 img {
		width:302px;
		height:122px;
	}
	
	#header nav #gNavBtn {
		width:1040px;
		position:relative;
		margin:0px auto;
	}
	
	#header nav #gNavBtn a {
		width:165px;
		height:86px;
		display:block;
		position:absolute;
		top:-112px;
	}
	
	#header nav #gNavBtn #btn_questionnaire { left: 21px; }
	#header nav #gNavBtn #btn_twitter { top: -119px; left: 21px; }
	#header nav #gNavBtn #btn_members { right: 21px; }
	
	#header nav #gNavBtn img {
		width:165px;
		height:86px;
	}
	
	#header nav #gNavBtn #btn_twitter img {
		width:165px;
		height:93px;
	}
	
	#header nav #gNavBtn a:hover img {
		-webkit-animation: membersAction 250ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
		animation: membersAction 250ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
	}
	
	#header nav #gNavList {
		border-top:#f8b200 solid 4px;
	}
	
	#header nav	ul {
		width:1005px;
		height:78px;
		line-height:100%;
		list-style:none;
		margin:2px auto 0px;
		padding:0px 17px 0px 18px;
	}
	
	#header nav li {
		width:185px;
		height:78px;
		position:relative;
		overflow:hidden;
		margin-right:-21px;
		float:left;
	}
	
	#header nav li:nth-child(1) { z-index:4; }
	#header nav li:nth-child(2) { z-index:5; }
	#header nav li:nth-child(3) { z-index:6; }
	#header nav li:nth-child(4) { z-index:7; }
	#header nav li:nth-child(5) { z-index:8; }
	#header nav li:nth-child(6) { z-index:9; }
	
	#header nav li a,
  #header nav li p {
		width:134px;
		height:58px;
		background-repeat:no-repeat;
		background-size:134px;
		text-align:center;
		display:block;
		position:absolute;
		left:24px;
		z-index:100;
		text-indent:-9999px;
		overflow:hidden;
		outline:none;
    margin: 0;
	}
	#header nav li a:hover { background-position:bottom; }
	
	#header nav li:nth-child(1) a { background-image:url(../img/pc/gMenu_new.png); }
	#header nav li:nth-child(2) a { background-image:url(../img/pc/gMenu_flow.png); }
	#header nav li:nth-child(3) a { background-image:url(../img/pc/gMenu_play.png); }
	#header nav li:nth-child(4) a { background-image:url(../img/pc/gMenu_goods.png); }
	#header nav li:nth-child(5) a { background-image:url(../img/pc/gMenu_event.png); }
	#header nav li:nth-child(6) a { background-image:url(../img/pc/gMenu_shop.png); }
  
  #header nav li:nth-child(1) p { background-image:url(../img/pc/gMenu_new.png); }
  #header nav li:nth-child(2) p { background-image:url(../img/pc/gMenu_flow.png); }
	#header nav li:nth-child(3) p { background-image:url(../img/pc/gMenu_play.png); }
	#header nav li:nth-child(4) p { background-image:url(../img/pc/gMenu_goods.png); }
	#header nav li:nth-child(5) p { background-image:url(../img/pc/gMenu_event.png); }
	#header nav li:nth-child(6) p { background-image:url(../img/pc/gMenu_shop.png); }

	/*
	#header nav li a img {	
		-webkit-filter:grayscale(100%) brightness(1000%);
		-moz-filter:grayscale(100%) brightness(1000%);
		-o-filter:grayscale(100%) brightness(1000%);
		-ms-filter:grayscale(100%) brightness(1000%);
		filter:grayscale(100%) brightness(1000%);
	}
	#header nav li a:hover img {
		-webkit-filter:grayscale(0%) brightness(100%);
		-moz-filter:grayscale(0%) brightness(100%);
		-o-filter:grayscale(0%) brightness(100%);
		-ms-filter:grayscale(0%) brightness(100%);
		filter:grayscale(0%) brightness(100%);
	}
	*/
	
	#header nav li span {
		width:160px;
		height:0;
		border-bottom: 56px solid #f8b200;
		border-left: 25px solid transparent;
		display:block;
		position:absolute;
		z-index:10;
		-webkit-transition: 0.2s ease-out;
		-moz-transition: 0.2s sease-out;
		-o-transition: 0.2s ease-out;
		-ms-transition: 0.2s ease-out;
		transition: 0.2s ease-out;
	}
	#header nav li a:hover + span {
		-webkit-transform: translate(29px, -63px);
		-moz-transform: translate(29px, -63px);
		-o-transform: translate(29px, -63px);
		-ms-transform: translate(29px, -63px);
		transform: scale(29px, -63px);
	}
  #header nav li:nth-of-type(2) span,
  #header nav li:nth-of-type(3) span,
  #header nav li:nth-of-type(4) span,
  #header nav li:nth-of-type(5) span,
  #header nav li:nth-of-type(6) span {
		border-bottom: 56px solid #ccc;
	}
	
	#header nav li div {
		width:162px;
		height:63px;
		background:url(../img/pc/gNavBack.png) no-repeat;
		background-size:185px;
		position:absolute;
		z-index:50;
		padding-left:24px;
	}
  #header nav li:nth-of-type(2) div,
  #header nav li:nth-of-type(3) div,
  #header nav li:nth-of-type(4) div,
  #header nav li:nth-of-type(5) div,
  #header nav li:nth-of-type(6) div {
		background:url(../img/pc/gNavBack_g.png) no-repeat;
    background-size:185px;
	}
	
	#header nav #gNavCurrent a { background-position:bottom; }
	#header nav #gNavCurrent span { display:none; }
	
	#header nav #gNavCurrent div {
		width:162px;
		height:78px;
		background:url(../img/pc/gNavBack_over.png) no-repeat;
		background-size:185px;
		position:absolute;
		z-index:50;
		padding-left:24px;
	}
}

/* スマホ */
@media(max-width:767px) {
	#header {	
		background-image:url(../img/sp/headerBack.png) , url(../img/headerDotBack.gif);
		background-repeat:no-repeat , repeat;
		background-size:contain , 8px;
	}
	
	#header h1 a {
		position:relative;
		z-index:10;
	}
	
	#header h1 a {
		width:38.43%;
		display:block;
		margin:0px auto;
		padding-top:2.19%;
	}
	
	#header h1 img {
		width:100%;
	}
	/*
	#header nav #gNavBtn {
		position:relative;
		margin:-12.2% 0px 1.56%;
	}
	
	#header nav #gNavBtn a {
		width:23.75%;
		display:block;
	}
	
	#header nav #gNavBtn #btn_questionnaire { left: 21px; display:none; }
	#header nav #gNavBtn #btn_members { margin-left:73.75%; }
	
	#header nav #gNavBtn img {
		width:100%;
	}
	*/
	
	#header nav #gNavBtn {
		position:relative;
		margin:-12.2% 0px 1.56%;
		margin:-12.2% 0px 13.76%;
	}
	
	#header nav #gNavBtn a {
		width:23.75%;
		display:block;
		position:absolute;
		top:0px;
	}
	
	#header nav #gNavBtn #btn_questionnaire { left:8px; }
	#header nav #gNavBtn #btn_twitter { left: 8px; margin-top: -0.93%; }
	#header nav #gNavBtn #btn_members { right:8px; }
	
	#header nav #gNavBtn img {
		width:100%;
	}
	
	#header nav #gNavList {
		width:100%;
		border-top:#f8b200 solid 4px;
		background:#ffffff;
	}
	
	#header nav	ul {
		list-style:none;
		text-align:center;
		margin:0.63% 0px 0px 0.15%;
		padding:0px;
	}
	
	#header nav li {
		width:15.94%;
		line-height:0%;
		display:inline-block;
		margin:0px 0.313%;
	}

	#header nav li a,
  #header nav li p {
		background-color:#f8b200;
		background-repeat:no-repeat;
		background-size:contain;
		box-shadow:0px 2px 0px 0px rgba(0, 0, 0, 0.35);
		text-align:center;
		display:block;
    font-size: 0;
		text-indent:-9999px;
		overflow:hidden;
		outline:none;
		padding-top:100%;
    margin: 0;
	}
  #header nav li p {
    background-color:#ccc;
  }
	
	
	#header nav li:nth-child(1) a { background-image:url(../img/sp/gMenu_new.gif); }
	#header nav li:nth-child(2) a { background-image:url(../img/sp/gMenu_flow.gif); }
	#header nav li:nth-child(3) a { background-image:url(../img/sp/gMenu_play.gif); }
	#header nav li:nth-child(4) a { background-image:url(../img/sp/gMenu_goods.gif); }
	#header nav li:nth-child(5) a { background-image:url(../img/sp/gMenu_event.gif); }
	#header nav li:nth-child(6) a { background-image:url(../img/sp/gMenu_shop_g.gif); }
  
  #header nav li:nth-child(1) p { background-image:url(../img/sp/gMenu_new_g.gif); }
	#header nav li:nth-child(2) p { background-image:url(../img/sp/gMenu_flow_g.gif); }
	#header nav li:nth-child(3) p { background-image:url(../img/sp/gMenu_play_g.gif); }
	#header nav li:nth-child(4) p { background-image:url(../img/sp/gMenu_goods_g.gif); }
	#header nav li:nth-child(5) p { background-image:url(../img/sp/gMenu_event_g.gif); }
	#header nav li:nth-child(6) p { background-image:url(../img/sp/gMenu_shop_g.gif); }
	
	#header nav li#gNavCurrent:nth-child(1) a { background-image:url(../img/sp/gMenu_newC.gif); }
	#header nav li#gNavCurrent:nth-child(2) a { background-image:url(../img/sp/gMenu_flowC.gif); }
	#header nav li#gNavCurrent:nth-child(3) a { background-image:url(../img/sp/gMenu_playC.gif); }
	#header nav li#gNavCurrent:nth-child(4) a { background-image:url(../img/sp/gMenu_goodsC.gif); }
	#header nav li#gNavCurrent:nth-child(5) a { background-image:url(../img/sp/gMenu_eventC.gif); }
	#header nav li#gNavCurrent:nth-child(6) a { background-image:url(../img/sp/gMenu_shopC.gif); }

	#header nav li span,
	#header nav li div {
		display:none;
	}
}


/* footer
------------------------------------------------------------------------------------*/
/* PC */
@media(min-width:768px) {
	#footer {
    padding-top: 104px;
  }
	
	#footer #sns {
		width:1040px;
		text-align:center;
		margin:104px auto 0px;
	}
	
	#footer #sns a {
		/*
		width:80px;
		height:80px;
		margin:0px 16px;
		float:left;
		*/
	}
	
	#footer #sns a {
		width:80px;
		height:80px;
		margin:0px 16px;
	}
	
	/* #footer #sns a:nth-child(1) { margin-left:368px; } */
	
	#footer #sns img {
		width:80px;
		height:80px;
	}
	
	#footer #footer_inner {
		background:url(../img/pc/footerTopBorder.gif) repeat-x #f8b200;
		background-size:1px;
		margin-top:48px;
		padding-bottom:56px;
		/*padding-bottom:40px;*/
	}
	
	#footer #footerTop {
		width:1040px;
		background:url(../img/pc/footerRoundBack.png) no-repeat top center;
		background-size:704px;
		margin:0px auto;
		padding:61px 0px 7px;
	}
	
	#footer #footerTop div {
		width:1008px;
		margin:0px auto;
	}
	
	#footer #footerTop p {
		color:#ffffff;
		font-size:12px;
		font-size:1.2rem;
		float:right;
    float:left;
	}
	
	#footer #footerTop p:nth-child(2){
		width:750px;
		float:left;
	}
	
	#footer #footerTop a { color:#ffffff; }
	#footer #footerTop a:hover { text-decoration:none; }
	
	#footer #footerBottom {
		border-top:#ffffff solid 2px;
	}
	
	#footer #footerBottom div {
		width:1008px;
		margin:0px auto;
		padding:0px 16px;
	}
	
	#footer #footerBottom p:nth-child(1) {
		color:#ffffff;
		padding-top:14px;
		float:left;
	}
	
	#footer #footerBottom p:nth-child(1) small {
		font-size:10px;
		font-size:1rem;
		line-height:13px;
		line-height:1.3rem;
		display:inline-block;
		padding-top:9px;
	}
	
	#footer #footerBottom p:nth-child(2) {
		padding-top:6px;
		float:right;
	}
	
	#footer #footerBottom p:nth-child(2) a {
		width:64px;
		height:60px;
		margin:0px 0px 0px 16px;
		float:left;
	}
	
	#footer #footerBottom p:nth-child(2) img {
		width:64px;
		height:60px;
	}
}

/* スマホ */
@media(max-width:767px) {
	#footer {
		margin-top:52px;
    padding-top: 0;
	}
	
	#footer #sns {
		margin-bottom:22.4%;
	}
	
	#footer #sns a {
		width:17.5%;
		margin:0px 2.5%;
		float:left;
	}
	
	#footer #sns a:nth-child(1) { margin-left:18.75%; }
	#footer #sns img { width:100%; }
	
	#footer #footer_inner {
	}
	
	#footer #footerTop {}
	#footer #footerTop div {}
	
  /*
	#footer #footerTop  p:nth-child(1) {
		font-size:12px;
		font-size:1.2rem;
		text-align:center;
		padding-bottom:20px;
	}
  */
	
	#footer #footerTop p:nth-child(1){
		background:url(../img/sp/footerBack.gif) no-repeat #f8b200;
		background-size:contain;
		color:#ffffff;
		font-size:9px;
		font-size:0.9rem;
		line-height:11px;
		line-height:1.1rem;
		padding:10% 8px 4px 8px;
	}
	
	#footer #footerTop a { color:#130406; }
	#footer #footerTop a:hover { text-decoration:none; }
	
	#footer #footerBottom {
		background:#f8b200;
		border-top:#ffffff solid 1px;
		padding-bottom:13px;
	}
	
	#footer #footerBottom div {}
	
	#footer #footerBottom p:nth-child(1) {
		color:#ffffff;
		font-size:12px;
		font-size:1.2rem;
		padding:6px 8px 0px;
	}
	
	#footer #footerBottom p:nth-child(1) small {
		font-size:8px;
		font-size:0.8rem;	
		line-height:11px;
		line-height:1.1rem;
		display:inline-block;
		padding-top:3px;
		padding-top:3px;
	}
	
	#footer #footerBottom p:nth-child(2) {
		margin-left:29.5%;
		padding:17px 0px 0px;
	}
	
	#footer #footerBottom p:nth-child(2) a {
		width:22.56%;
		margin:0px 3.75%;
		float:left;
	}
	
	#footer #footerBottom p:nth-child(2) img {
		width:100%;
	}
}


/* contents
------------------------------------------------------------------------------------*/
/* PC */
@media(min-width:768px) {
	#contents {
		width:1008px;
		margin:0px auto;
		padding:46px 16px 0px;
	}
	
	#contents h2:nth-of-type(1) {
		background:url(../img/pc/icon_InazumaB.png) no-repeat left top #ffffff;
		background-size:32px;
		font-size:28px;
		font-size:2.8rem;
		font-weight:bold;
		margin-bottom:48px;
		padding:1px 0px 2px 41px;
	}
	
	#contents header:nth-of-type(1) {
		position:relative;
	}
	
	#contents header:nth-of-type(1) #subMenu {
		width:296px;
		position:absolute;
		top:-8px;
		right:0px;
		z-index:2000;
	}
	
	#contents header:nth-of-type(1) h3 {
		width:auto;
		background:none;
		border-left:#f8b200 solid 8px;
		color:#e69800;
		font-size:16px;
		font-size:1.6rem;
		font-weight: bold;
		margin:32px 0px 0px 8px;
		padding:1px 0px 1px 6px;
	}
	
	#contents header:nth-of-type(1) #subMenu_trigger {
		width:100%;
		height:48px;
		box-shadow: 0px 4px 0px 0px rgba(0, 0, 0, 0.35);
		display:block;
		position:relative;
		cursor:pointer;
		text-indent:-9999px;
		outline:none;
	}
	
	#contents header:nth-of-type(1) #subMenu_trigger:before {
		pointer-events:none;
		content:'';
		position:absolute;
		border:#130406 solid 3px;
		border:rgba(19 , 4 , 6 , 0) solid 3px;
		top:-16px;
		right:-16px;
		bottom:-16px;
		left:-16px;
		-webkit-transition-duration:0.3s;
		transition-duration:0.3s;
	}
	#contents header:nth-of-type(1) #subMenu_trigger:hover:before,
	#contents header:nth-of-type(1) #subMenu_trigger:focus:before,
	#contents header:nth-of-type(1) #subMenu_trigger:active:before {
		top:-6px;
		right:-6px;
		bottom:-6px;
		left:-6px;
		border:rgba(19 , 4 , 6 , 1) solid 3px;
	}
	
	#contents header:nth-of-type(1) #subMenu_trigger:after {
		width:16px;
		height:12px;
		background:url(../img/pc/allowD.png) no-repeat;
		background-size:16px;
		display:block;
		content:'';
		position:absolute;        
		top:18px;
		left:16px;
		transition:all .4s ease-in-out;
		transform-origin:50% 50%;
	}
	#contents header:nth-of-type(1) #subMenu.subMenu_open #subMenu_trigger:after { transform:rotate(-180deg); }
	
	#contents header:nth-of-type(1) #subMenu_options {
		width:100%;
		background:#fff;
		border:1px solid #b5b5b5;
		box-sizing:border-box;
		box-shadow:0 2px 1px rgba(0,0,0,.07);
		border-radius:4px;
		display:block;
		visibility:hidden;
		position:absolute;
		top:100%;
		right:0;
		transition:all .4s ease-in-out;
		opacity:0;
		pointer-events:none;
		transform:translateY(-15px);
		margin:15px 0;
	}
	
	#contents header:nth-of-type(1) #subMenu.subMenu_open #subMenu_options {
		visibility:visible;
		opacity:1;
		pointer-events:all;
		transform:translateY(0);
	}
	#contents header:nth-of-type(1) #subMenu_options:before {
		width:7px;
		height:7px;
		background:#fff;
		border-top:1px solid #b5b5b5;
		border-left:1px solid #b5b5b5;
		content:'';
		display:block;
		position:absolute;
		bottom:100%;
		right:25px;
		transform:rotate(45deg);
		transition:all .4s ease-in-out;
		margin-bottom:-4px;
	}
	#contents header:nth-of-type(1) .option-hover:before { background:#f9f9f9; }
	
	#contents header:nth-of-type(1) #subMenu_options a {
		border-bottom: 1px solid #b5b5b5;
		color:#000000;
		font-weight:600;
		line-height:340%;
		text-decoration:none;
		display:block;
		position:relative;
		cursor: pointer;
		padding:0 16px;
	}
	
	#contents header:nth-of-type(1) #subMenu_options a:first-of-type { border-radius:4px 4px 0 0; }
	#contents header:nth-of-type(1) #subMenu_options a:last-of-type {
		border-bottom:0;
		border-radius:0 0 4px 4px;
	}
	
	#contents header:nth-of-type(1) #subMenu_options a:hover,
	#contents header:nth-of-type(1) #subMenu_options a.selection,
	#contents header:nth-of-type(1) #subMenu_options #subMenuCurrent {
		background:#cccccc;
	}
	
	#overlay {
		width:100%;
		height:120%;
		background-color:rgba(0,0,0,0.75);
		display:none;
		position:fixed;
		top:0;
		left:0;
		z-index:1000;
	}
	
	#contents #footerNav2,
	#contents #footerNav3 { }
	
	#contents #footerNav2 h3,
	#contents #footerNav3 h3 {
		border:none;
		color:#130406;
		font-size:20px;
		font-size:2rem;
		font-weight:bold;
		margin:88px 0px 0px;
		padding:0px;
	}
	
	#contents #footerNav2 h4,
	#contents #footerNav3 h4 {
		border-left:#a4a4a4 solid 8px;
		color:#130406;
		font-size: 16px;
		font-size:1.6rem;
		font-weight:bold;
		margin:32px 0px -8px;
		padding:0px 0px 0px 8px;
	}
	#contents #footerNav2 h4:nth-of-type(1),
	#contents #footerNav3 h4:nth-of-type(1) { margin-top:24px; }
	
	#contents #footerNav2 a,
	#contents #footerNav3 a {
		background-color:#ffffff;	
		background-repeat:no-repeat , no-repeat;
		border-radius:32px;
		display:block;
		text-indent:-9999px;
		outline:none;
		float:left;
	}
	
	#contents #footerNav2 a {
		width:495px;
		height:40px;
		background-position:center center , 468px center;
		margin:24px 18px 0px 0px;
		float:left;
	}
	#contents #footerNav2 a:nth-of-type(2n) { margin-right:0px; }
	
	#contents #footerNav3 a {
		width:324px;
		height:40px;
		background-position:center center , 297px center;
		margin:24px 18px 0px 0px;
		float:left;
	}
	#contents #footerNav3 a:nth-of-type(3n) { margin-right:0px; }
	
	#contents #footerNav2 #footerNavCurrent,
	#contents #footerNav3 #footerNavCurrent { background-color:#e7e8f3; }
}

/* スマホ */
@media(max-width:767px) {
	#contents {
		padding:24px 8px 0px;
	}
	
	#contents h2:nth-of-type(1) {
		background:url(../img/sp/icon_InazumaB.png) no-repeat 0px 0px #ffffff;
		background-size:20px;
		font-size:19px;
		font-size:1.9rem;
		font-weight:bold;
		padding:2px 20px 24px 25px;
		padding:2px 0px 24px 25px;
	}
	
	#contents header:nth-of-type(1) {
		position:relative;
	}
	
	#contents header:nth-of-type(1) #subMenu {
		width:100%;
		position:relative;
		z-index:2000;
		display:inline-block;
	}
	
	#contents header:nth-of-type(1) h3 {
		border-left:#f8b200 solid 4px;
		color:#e69800;
		font-size:15px;
		font-size:1.5rem;
		font-weight:bold;
		position:relative;
		margin:32px 0px 0px 8px;
		padding:0px 0px 0px 6px;
	}
	
	#contents header:nth-of-type(1) #subMenu_trigger {
		height:40px;
		box-shadow: 0px 4px 0px 0px rgba(0, 0, 0, 0.35);
		display:block;
		position:relative;
		cursor:pointer;
		text-indent:-9999px;
		outline:none;
	}
	
	#contents header:nth-of-type(1) #subMenu_trigger:after {
		width:12px;
		height:9px;
		background:url(../img/sp/allow_faceDownB.gif) no-repeat;
		background-size:12px;
		display:block;
		content:'';
		position:absolute;        
		top:16px;
		left:10%;
		transition:all .4s ease-in-out;
		transform-origin:50% 50%;
	}
	#contents header:nth-of-type(1) #subMenu.subMenu_open #subMenu_trigger:after { transform:rotate(-180deg); }
	
	#contents header:nth-of-type(1) #subMenu_options {
		width:100%;
		background:#fff;
		border:1px solid #b5b5b5;
		box-sizing:border-box;
		box-shadow:0 2px 1px rgba(0,0,0,.07);
		border-radius:4px;
		display:block;
		visibility:hidden;
		position:absolute;
		top:100%;
		right:0;
		transition:all .4s ease-in-out;
		opacity:0;
		pointer-events:none;
		transform:translateY(-15px);
		margin:15px 0;
	}
	
	#contents header:nth-of-type(1) #subMenu.subMenu_open #subMenu_options {
		visibility:visible;
		opacity:1;
		pointer-events:all;
		transform:translateY(0);
	}
	#contents header:nth-of-type(1) #subMenu_options:before {
		width:7px;
		height:7px;
		background:#fff;
		border-top:1px solid #b5b5b5;
		border-left:1px solid #b5b5b5;
		content:'';
		display:block;
		position:absolute;
		bottom:100%;
		right:25px;
		transform:rotate(45deg);
		transition:all .4s ease-in-out;
		margin-bottom:-4px;
	}
	#contents header:nth-of-type(1) .option-hover:before { background:#f9f9f9; }
	
	#contents header:nth-of-type(1) #subMenu_options a {
		border-bottom: 1px solid #b5b5b5;
		color:#000000;
		font-weight:600;
		line-height:340%;
		text-decoration:none;
		display:block;
		position:relative;
		cursor: pointer;
		padding:0 16px;
	}
	
	#contents header:nth-of-type(1) #subMenu_options a:first-of-type { border-radius:4px 4px 0 0; }
	#contents header:nth-of-type(1) #subMenu_options a:last-of-type {
		border-bottom:0;
		border-radius:0 0 4px 4px;
	}
	
	#contents header:nth-of-type(1) #subMenu_options a:hover,
	#contents header:nth-of-type(1) #subMenu_options a.selection,
	#contents header:nth-of-type(1) #subMenu_options #subMenuCurrent  {
		background:#cccccc;
	}
	
	#overlay {
		width:100%;
		height:120%;
		background-color:rgba(0,0,0,0.75);
		display:none;
		position:fixed;
		top:0;
		left:0;
		z-index:1000;
	}
	
	#contents #footerNav2,
	#contents #footerNav3 { }
	
	#contents #footerNav2 h3,
	#contents #footerNav3 h3 {
		border:none;
		color:#130406;
		font-size:17px;
		font-size:1.7rem;
		font-weight:bold;
		margin:56px 0px 0px;
		padding:0px;
	}
	
	#contents #footerNav2 h4,
	#contents #footerNav3 h4 {
		border-left:#a6a6a6 solid 4px;
		color:#130406;
		font-weight:bold;
		margin:24px 0px 0px;
		padding:0px 0px 0px 6px;
	}
	#contents #footerNav2 h4:nth-of-type(1),
	#contents #footerNav3 h4:nth-of-type(1) { margin-top:16px; }
	
	#contents #footerNav2 a,
	#contents #footerNav3 a {
		border-color:#2d4473;
		border-style:solid;
		border-width:2px;
		background-color:#ffffff;	
		background-repeat:no-repeat , no-repeat;
		border-radius:32px;
		display:block;
		text-indent:-9999px;
		outline:none;
		float:left;
	}
	
	#contents #footerNav2 a,
	#contents #footerNav3 a {
		width:48%;
		height:28px;
		background-position:center center , right center;
		margin-top:8px;
		float:left;
	}
	#contents #footerNav2 a:nth-of-type(2n),
	#contents #footerNav3 a:nth-of-type(2n) { float:right; }
	
	#contents #footerNav2 #footerNavCurrent,
	#contents #footerNav3 #footerNavCurrent { background-color:#e7e8f3; }
}


/* ページTOPへ
------------------------------------------------------------------------------------*/
/* PC */
@media(min-width:768px) {
	#pageTop {
		width:72px;
		height:72px;
		background:url(../img/btn_top.png) no-repeat #000000;
		background-size:100%;
		box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #000000;
		display:block;
		position:fixed;
		bottom:-80px;
		right:20px;
		z-index:8000;
		text-indent:-9999px;
		outline:none;
		opacity:0.2;
		filter: alpha(opacity=20);
		-ms-filter: "alpha(opacity=20)";
		-webkit-transition:all 0.2s;
		transition:all 0.2s;
	}
	#pageTop:hover {
		opacity:0.6;
		filter: alpha(opacity=60);
		-ms-filter: "alpha(opacity=60)";
		-webkit-transition:all 0.2s;
		transition:all 0.2s;
	}
	
	#pageTop canvas {
		position: absolute;
		top: 7px;
		left: 14px;
	}
}
/* スマホ */
@media(max-width:767px) {
	#pageTop {
		width:52px;
		height:52px;
		background:url(../img/btn_top.png) no-repeat #000000;
		background-size:100%;
		box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #000000;
		display:block;
		position:fixed;
		bottom:-60px;
		right:8px;
		z-index:8000;
		text-indent:-9999px;
		outline:none;
		opacity:0.4;
		filter: alpha(opacity=40);
		-ms-filter: "alpha(opacity=40)";
	}
	
	#pageTop canvas {
		position: absolute;
		top: 5px;
		left: 10px;
	}
}


/* くさ　＋　キャラ
------------------------------------------------------------------------------------*/
/* PC */
@media(min-width:768px) {
	
	/* くさ */
	#backAnime #grass1,
	#backAnime #grass2 {
		width: 300px;
		visibility: hidden;
		position :fixed;
		bottom: -40px;
		left: 0px;
		z-index: 9999;
		
		/*
		visibility: visible;
		-webkit-transform: translateX(0px) translateY(-160px) rotate(45deg);
		*/
	}
	
	#backAnime #grass1 img,
	#backAnime #grass2 img {
		width: 200px;
		position: absolute;
		top: 0;
		left: 0;
	}
	#backAnime #grass1 img:nth-of-type(1) {top: 0; left: 50px;}
	#backAnime #grass1 img:nth-of-type(2) {top: 45px; left: 0px;}
	#backAnime #grass1 img:nth-of-type(3) {top: 45px; left: 100px;}
	#backAnime #grass2 img:nth-of-type(1) {top: 0; left: 50px;}
	#backAnime #grass2 img:nth-of-type(2) {top: 44px; left: 0px;}
	#backAnime #grass2 img:nth-of-type(3) {top: 44px; left: 100px;}
	
	/* レアリティ1*/
	#backAnime #reality1 {
		width: 300px;
		visibility: hidden;
		position :fixed;
		bottom: 0px;
		left: 0px;
		z-index: 9999;
		opacity: 0;
		/*
		visibility: visible;
		-webkit-transform: translateX(0px) translateY(-160px);
		opacity: 1;
		*/
	}

	#backAnime #reality1 img {
		position: absolute;
		top: 0;
		left: 0;
		-webkit-transform:rotate(45deg);
		transform:rotate(45deg);
	}
	#backAnime #reality1 img:nth-of-type(1) { width: 176px; top: -40px; left: -55px;}
	#backAnime #reality1 img:nth-of-type(2) { width: 183px; top: -10px; left: 80px;}
	#backAnime #reality1 img:nth-of-type(3) { width: 120px; top: 55px; left: -20px;}
	
	/* レアリティ2*/
	#backAnime #reality2 {
		width: 300px;
		visibility: hidden;
		position :fixed;
		bottom: 0px;
		left: 0px;
		z-index: 9999;
		/*
		backface-visibility: visible;
		-webkit-transform: translateX(0px) translateY(-160px);
		opacity: 1;
		*/
	}

	#backAnime #reality2 img {
		position: absolute;
		top: 0;
		left: 0;
		-webkit-transform:rotate(45deg);
		transform:rotate(45deg);
	}
	#backAnime #reality2 img:nth-of-type(1) { width: 153px; top: -100px; left: 80px;}
	#backAnime #reality2 img:nth-of-type(2) { width: 239px; top: -80px; left: -65px;}
	#backAnime #reality2 img:nth-of-type(3) { width: 264px; top: -30px; left: -10px;}
	
	/* レアリティ3*/
	#backAnime #reality3 {
		width: 300px;
		visibility: hidden;
		position :fixed;
		bottom: 0px;
		left: 0px;
		z-index: 9999;
		opacity: 0;
		/*
		visibility: visible;
		-webkit-transform: translateX(0px) translateY(-160px);
		opacity: 1;
		*/
	}

	#backAnime #reality3 img {
		position: absolute;
		top: 0;
		left: 0;
		-webkit-transform:rotate(45deg);
		transform:rotate(45deg);
	}
	#backAnime #reality3 img:nth-of-type(1) { width: 468px; top: -140px; left: -100px;}
	#backAnime #reality3 img:nth-of-type(2) { width: 278px; top: -100px; left: -120px;}
	#backAnime #reality3 img:nth-of-type(3) { width: 250px; top: -10px; left: 65px;}
}

/* スマホ */
@media(max-width:767px) {
	
	/* くさ */
	#backAnime #grass1,
	#backAnime #grass2 {
		width: 300px;
		visibility: hidden;
		position :fixed;
		bottom: -150px;
		left: -20px;
		z-index: 9999;
		
		/*
		visibility: visible;
		-webkit-transform: translateX(0px) translateY(-160px);
		*/
	}

	#backAnime #grass1 img,
	#backAnime #grass2 img {
		width: 100px;
		position: absolute;
		top: 0;
		left: 0;
	}
	#backAnime #grass1 img:nth-of-type(1) {top: 0; left: 25px;}
	#backAnime #grass1 img:nth-of-type(2) {top: 25px; left: 0px;}
	#backAnime #grass1 img:nth-of-type(3) {top: 25px; left: 50px;}
	#backAnime #grass2 img:nth-of-type(1) {top: 0; left: 25px;}
	#backAnime #grass2 img:nth-of-type(2) {top: 24px; left: 0px;}
	#backAnime #grass2 img:nth-of-type(3) {top: 24px; left: 50px;}
	
	/* レアリティ1*/
	#backAnime #reality1 {
		width: 300px;
		visibility: hidden;
		position :fixed;
		bottom: 0px;
		left: 0px;
		z-index: 9999;
		opacity: 0;
		/*
		visibility: visible;
		-webkit-transform: translateX(0px) translateY(-160px);
		opacity: 1;
		*/
	}

	#backAnime #reality1 img {
		position: absolute;
		top: 0;
		left: 0;
		-webkit-transform:rotate(45deg) scale(0.5 , 0.5);
		transform:rotate(45deg) scale(0.5 , 0.5);
	}
	#backAnime #reality1 img:nth-of-type(1) { width: 176px; top: 10px; left: -75px;}
	#backAnime #reality1 img:nth-of-type(2) { width: 183px; top: 20px; left: -10px;}
	#backAnime #reality1 img:nth-of-type(3) { width: 120px; top: 70px; left: -40px;}
	
	/* レアリティ2*/
	#backAnime #reality2 {
		width: 300px;
		visibility: hidden;
		position :fixed;
		bottom: 0px;
		left: 0px;
		z-index: 9999;
		opacity: 0;
		/*
		visibility: visible;
		-webkit-transform: translateX(0px) translateY(-160px);
		opacity: 1;
		*/
	}

	#backAnime #reality2 img {
		position: absolute;
		top: 0;
		left: 0;
		-webkit-transform:rotate(45deg) scale(0.5 , 0.5);
		transform:rotate(45deg) scale(0.5 , 0.5);
	}
	#backAnime #reality2 img:nth-of-type(1) { width: 153px; top: -30px; left: -5px;}
	#backAnime #reality2 img:nth-of-type(2) { width: 239px; top: -20px; left: -95px;}
	#backAnime #reality2 img:nth-of-type(3) { width: 264px; top: 0px; left: -70px;}
	
	/* レアリティ3*/
	#backAnime #reality3 {
		width: 300px;
		visibility: hidden;
		position :fixed;
		bottom: -75px;
		left: -65px;
		z-index: 9999;
		opacity: 0;
		/*
		visibility: visible;
		-webkit-transform: translateX(0px) translateY(-160px);
		opacity: 1;
		*/		
	}

	#backAnime #reality3 img {
		position: absolute;
		top: 0;
		left: 0;
		-webkit-transform:rotate(45deg);
		transform:rotate(45deg);
	}
	#backAnime #reality3 img:nth-of-type(1) { width: 234px; top: -60px; left: 5px;}
	#backAnime #reality3 img:nth-of-type(2) { width: 139px; top: -45px; left: 0px;}
	#backAnime #reality3 img:nth-of-type(3) { width: 125px; top: 0px; left: 85px;}
}

/* アニメーションくさ */
.grassAnime {
	-webkit-animation: grassAnime 1.6s;
	animation: grassAnime 1.6s;
}
@-webkit-keyframes grassAnime {
	0% { -webkit-transform: translateX(-110px) translateY(0px) rotate(45deg); }
	15% { -webkit-transform: translateX(0px) translateY(-160px) rotate(45deg); }
	85% { -webkit-transform: translateX(0px) translateY(-160px) rotate(45deg); }
	100% { -webkit-transform: translateX(-110px) translateY(0px) rotate(45deg); }
}
@keyframes grassAnime {
	0% { -webkit-transform: translateX(-110px) translateY(0px) rotate(45deg); -ms-transform: translateX(-110px) translateY(0px) rotate(45deg); transform: translateX(-110px) translateY(0px) rotate(45deg); }
	15% { -webkit-transform: translateY(-160px) rotate(45deg); -ms-transform: translateX(0px) translateY(-160px) rotate(45deg); transform: translateX(0px) translateY(-160px) rotate(45deg); }
	85% { -webkit-transform: translateY(-160px) rotate(45deg); -ms-transform: translateX(0px) translateY(-160px) rotate(45deg); transform: translateX(0px) translateY(-160px) rotate(45deg); }
	100% { -webkit-transform: translateX(-110px) translateY(0px) rotate(45deg); -ms-transform: translateX(-110px) translateY(0px) rotate(45deg); transform: translateX(-110px) translateY(0px) rotate(45deg); }
}

/* アニメーションくさ2 */
.grassAnime2 {
	/*-webkit-animation: grassAnime2 10s;*/
	animation: grassAnime2 4.8s;
}
@-webkit-keyframes grassAnime2 {
	0% { opacity: 1; -webkit-transform: translateX(-110px) translateY(0px) rotate(45deg); }
	5% { opacity: 1; -webkit-transform: translateX(0px) translateY(-160px) rotate(45deg); }
	90% { opacity: 1; -webkit-transform: translateX(0px) translateY(-160px) rotate(45deg); }
	91% { opacity: 0; -webkit-transform: translateX(-110px) translateY(0px) rotate(45deg); }
}
/*
@keyframes grassAnime2 {
	0% { -webkit-transform: translateX(-110px) translateY(0px) rotate(45deg); -ms-transform: translateX(-110px) translateY(0px) rotate(45deg); transform: translateX(-110px) translateY(0px) rotate(45deg); }
	15% { -webkit-transform: translateY(-160px) rotate(45deg); -ms-transform: translateX(0px) translateY(-160px) rotate(45deg); transform: translateX(0px) translateY(-160px) rotate(45deg); }
	85% { -webkit-transform: translateY(-160px) rotate(45deg); -ms-transform: translateX(0px) translateY(-160px) rotate(45deg); transform: translateX(0px) translateY(-160px) rotate(45deg); }
	100% { -webkit-transform: translateX(-110px) translateY(0px) rotate(45deg); -ms-transform: translateX(-110px) translateY(0px) rotate(45deg); transform: translateX(-110px) translateY(0px) rotate(45deg); }
}
*/
/* アニメーションレアリティ1 or 2 */
.reality1 {
	-webkit-animation: reality1 1.6s;
	animation: reality1 1.6s;
}
@-webkit-keyframes reality1 {
	0% { opacity: 1; -webkit-transform: translateX(-110px) translateY(40px); }
	15% { opacity: 1; -webkit-transform: translateX(0px) translateY(-160px); }
	85% { opacity: 1; -webkit-transform: translateX(0px) translateY(-160px); }
	100% { opacity: 0; -webkit-transform: translateX(-110px) translateY(40px); }
}
@keyframes reality1 {
	0% { opacity: 1; -webkit-transform: translateX(-110px) translateY(40px); -ms-transform: translateX(-110px) translateY(40px); transform: translateX(-110px) translateY(40px); }
	15% { opacity: 1; -webkit-transform: translateX(0px) translateY(-160px); -ms-transform: translateX(0px) translateY(-160px); transform: translateX(0px) translateY(-160px); }
	85% { opacity: 1; -webkit-transform: translateX(0px) translateY(-160px); -ms-transform: translateX(0px) translateY(-160px); transform: translateX(0px) translateY(-160px); }
	100% { opacity: 0; -webkit-transform: translateX(-110px) translateY(40px); -ms-transform: translateX(-110px) translateY(40px); transform: translateX(-110px) translateY(40px); }
}


/*
.reality2 {	
	-webkit-animation: reality2 1.6s;
	animation: reality2 1.6s;
	
	-webkit-animation-delay:3s;
}
@-webkit-keyframes reality2 {
	0% { opacity: 1; -webkit-transform: translateX(-110px) translateY(40px) rotate(45deg); }
	15% { opacity: 1; -webkit-transform: translateX(-20px) translateY(-160px) rotate(45deg); }
	85% { opacity: 1; -webkit-transform: translateX(-20px) translateY(0px) rotate(0deg); }
	100% { opacity: 0; -webkit-transform: translateX(-20px) translateY(40px) rotate(0deg); }
}
*/

/* アニメーションレアリティ3 */
.reality3 {	
	-webkit-animation: reality3 3.2s linear;
	animation: reality3 3.2s linear;
	-webkit-animation-delay:4.3s;
	animation-delay:4.3s;
}
@-webkit-keyframes reality3 {
	0% { opacity: 0.4; -webkit-transform: translateX(0px) translateY(-160px) scale(0.1 , 0.1); }
	6% { opacity: 0.8; -webkit-transform: translateX(0px) translateY(-160px) scale(1.5 , 1.5) ; }
	8% { opacity: 1; -webkit-transform: translateX(0px) translateY(-160px) scale(1 , 1) ; }
	85% { opacity: 1; -webkit-transform: translateX(0px) translateY(-160px) scale(1 , 1) ; }
	100% { opacity: 0; -webkit-transform: translateX(-110px) translateY(40px) scale(1 , 1) ; }
}
@keyframes reality3 {
	0% { opacity: 0.4; -webkit-transform: translateX(0px) translateY(-160px); -ms-transform: translateX(0px) translateY(-160px); transform: translateX(0px) translateY(-160px) scale(0.1 , 0.1); }
	6% { opacity: 0.8; -webkit-transform: translateX(0px) translateY(-160px); -ms-transform: translateX(0px) translateY(-160px); transform: translateX(0px) translateY(-160px) scale(1.5 , 1.5); }
	8% { opacity: 1; -webkit-transform: translateX(0px) translateY(-160px); -ms-transform: translateX(0px) translateY(-160px); transform: translateX(0px) translateY(-160px) scale(1 , 1); }
	85% { opacity: 1; -webkit-transform: translateX(0px) translateY(-160px); -ms-transform: translateX(0px) translateY(-160px); transform: translateX(0px) translateY(-160px) scale(1 , 1); }
	100% { opacity: 0; -webkit-transform: translateX(-110px) translateY(40px); -ms-transform: translateX(-110px) translateY(40px); transform: translateX(-110px) translateY(40px) scale(1 , 1); }
}

/* アニメーション
------------------------------------------------------------------------------------*/
@-webkit-keyframes membersAction {
	50% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes membersAction {
	50% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

/* Ripple Out */
@-webkit-keyframes borderOut
{
	100% {
		top:-12px;
		right:-12px;
		bottom:-12px;
		left:-12px;
		opacity:0;
	}
}

@keyframes borderOut
{
	100% {
		top:-12px;
		right:-12px;
		bottom:-12px;
		left:-12px;
		opacity:0;
	}
}


/* PC スマホ 切り替え
------------------------------------------------------------------------------------*/
/* PC */
@media(min-width:768px) {
	#switch {
		display:none;
		font-size:20px;
		font-size:2rem;
		text-align:center;
		line-height:100%;
		z-index:10;
		margin:60px 0 80px;
		padding:0px;
	}
	
}
/* スマホ */
@media(max-width:767px) {
	#switch {
		display:none;
		text-align:center;
		line-height:100%;
		margin:0px 0 13.75%;
		padding:0px;
	}
}
