@charset "utf-8";

/* 通常
---------------------------------------------------- */
#nav_menu{
	clear:both;
    overflow: hidden;
    display: inline-block;
    z-index: 0;
	text-align:center;
	margin-top:24px;
	background-color:#9900cc;
	width:100%;
}

#nav_menu ul{
	width:1000px;
	margin:auto;
	text-align:left;	
}

#nav_menu li{
	float:left; width:143px; height:65px; text-indent:-99999em;
}
#nav_menu li.navi-access{
	width:142px;
}

#nav_menu li a{
	display:block; height:100%;
}

li.navi-home a{
	background:url(../images/common/navi01_n.png) no-repeat 0 0;
}
li.navi-about a{
	background:url(../images/common/navi02_n.png) no-repeat 0 0;
}
li.navi-guide a{
	background:url(../images/common/navi03_n.png) no-repeat 0 0;
}
li.navi-charge a{
	background:url(../images/common/navi04_n.png) no-repeat 0 0;
}
li.navi-event a{
	background:url(../images/common/navi05_n.png) no-repeat 0 0;
}
li.navi-profile a{
	background:url(../images/common/navi06_n.png) no-repeat 0 0;
}
li.navi-access a{
	background:url(../images/common/navi07_n.png) no-repeat 0 0;
}

li.navi-home a:hover{
	background:url(../images/common/navi01_r.png) no-repeat 0 0;
}
li.navi-about a:hover{
	background:url(../images/common/navi02_r.png) no-repeat 0 0;
}
li.navi-guide a:hover{
	background:url(../images/common/navi03_r.png) no-repeat 0 0;
}
li.navi-charge a:hover{
	background:url(../images/common/navi04_r.png) no-repeat 0 0;
}
li.navi-event a:hover{
	background:url(../images/common/navi05_r.png) no-repeat 0 0;
}
li.navi-profile a:hover{
	background:url(../images/common/navi06_r.png) no-repeat 0 0;
}
li.navi-access a:hover{
	background:url(../images/common/navi07_r.png) no-repeat 0 0;
}

body.home li.navi-home a{
	background:url(../images/common/navi01_r.png) no-repeat 0 0;
}
body.about li.navi-about a{
	background:url(../images/common/navi02_r.png) no-repeat 0 0;
}
body.guide li.navi-guide a{
	background:url(../images/common/navi03_r.png) no-repeat 0 0;
}
body.charge li.navi-charge a{
	background:url(../images/common/navi04_r.png) no-repeat 0 0;
}
body.event li.navi-event a{
	background:url(../images/common/navi05_r.png) no-repeat 0 0;
}
body.profile li.navi-profile a{
	background:url(../images/common/navi06_r.png) no-repeat 0 0;
}
body.access li.navi-access a{
	background:url(../images/common/navi07_r.png) no-repeat 0 0;
}


/*　ハンバーガーメニュー 
---------------------------------------------------- */

@media only screen and (max-width:750px){

	#nav_menu{
		display: none;
	}

	#rwdMenuWrap{
		width: 100%;
	}

	#rwdMenuWrap #switchBtnArea{
		width: 100%;
		height: 60px;
		background: #3c3c3c;
		position: relative;
	}

	#rwdMenuWrap #switchBtnArea #switchBtn{
		top: 10px;
		right: 10px;
		width: 40px;
		height: 40px;
		display: block;
		background: #a7a7a7;
		position: absolute;
		border-radius: 5px;
	}

	#rwdMenuWrap #switchBtnArea #switchBtn span{
		left: 20%;
		width: 60%;
		height: 4px;
		display: block;
		position: absolute;
		background-color: #fff;
		border-radius: 5px;
		transition: all 0.2s linear;
	}
	#rwdMenuWrap #switchBtnArea #switchBtn span:nth-of-type(1){
	top:10px;transform: rotate(0);
}
	#rwdMenuWrap #switchBtnArea #switchBtn span:nth-of-type(2){
	top:18px;transform: scale(1);
}
	#rwdMenuWrap #switchBtnArea #switchBtn span:nth-of-type(3){
	bottom:10px;transform: rotate(0);
}

	#rwdMenuWrap #switchBtnArea .btnClose#switchBtn span:nth-of-type(1){
	top:18px;transform: rotate(-45deg);
}
	#rwdMenuWrap #switchBtnArea #switchBtn.btnClose span:nth-of-type(2) {transform: scale(0);}
	#rwdMenuWrap #switchBtnArea .btnClose#switchBtn span:nth-of-type(3){
	bottom:18px;transform: rotate(45deg);
}

	#rwdMenuWrap ul{
		width: 100%;
		display: none;
	}

	#rwdMenuWrap ul li{
		width: 100%;
		border-bottom: #c7c7c7 1px solid;
		text-align:center;
	}

	#rwdMenuWrap ul li a{
		padding: 15px 20px;
		text-align: left;
		display: block;
		background: #fafafa;
		position: relative;
	}

	#rwdMenuWrap ul li a:after{
		content: '';
		margin-top: -4px;
		top: 50%;
		right: 15px;
		width: 8px;
		height: 8px;
		color: #888;
		font-size: 1em;
		font-weight: bold;
		line-height: 1.2em;
		display: block;
		position: absolute;
		border-top: 2px solid #b0b0b0;
		border-right: 2px solid #b0b0b0;
		-moz-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}

}

/* ------------------------------
   CLEARFIX ELEMENTS
------------------------------ */
#nav_menu > ul:before,
#nav_menu > ul:after{
	content: " ";
	display: table;
}
#nav_menu > ul:after{
	clear: both;
}
#nav_menu > ul {*zoom: 1;}