@charset "utf-8";

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

	/* PC */

	#nav_area_bg { display:none; }


	/* SP */

	#main-menu {
		position: fixed;
		max-width:400px;
		top:0;
		left:-450px;
		z-index: 10000;
		background-color:#FFF;
		height: 100%;
		overflow:scroll;
	}
	
	#main-menu_bg {
	  position: fixed;
	  top:0;
	  left:0;
	  width:100%;
	  height: 100%;
	  background-color:#333;
	  opacity: 0.5;
	  z-index: 9998;
	  display: none;
	}

	.menu_btn {
		cursor:pointer;
		position: fixed;
		top:5px;
		right:5px;
		padding:5px;
		font-size:40px;
		line-height:40px;
		text-align:center;
		color:#343434;		// main-color
		width:50px;
		height:50px;
		background-color:rgba(255,255,255,0.8);
		z-index:9997;
	}

	#main-menu_close {
		cursor:pointer;
		position: fixed;
		top:5px;
		right:5px;
		padding:5px;
		font-size:50px;
		line-height:50px;
		color:#FFF;
		width:50px;
		height:50px;
		z-index: 9999;
		display: none;
	}

}
@media screen and (min-width:768px) {

	/* SP */

	#main-menu { display:none; }
	#main-menu_bg { display:none; }
	.menu_btn { display:none; }
	#main-menu_close { display: none; }

	/* PC */

	#nav_area_bg {
		display:block;
	}

	#main-nav{
		max-width:1080px;
		margin-left:auto;
		margin-right:auto;
		border-right: 1px solid #ffffff;
	}

	#gnavi > li {
		text-align: center;
		font-weight:normal;
	}
}
@media screen and (min-width:1080px) {
	#gnavi > li {
		float: none;
		display: table-cell;
		width: 1%;
	}
}