@charset "utf-8";
#navi{
	/*
	-webkit-display: flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	*/
}
/* ***********************************************************
* #global-nav
* *********************************************************** */
	.open #global-nav {
		z-index: 30000;
		visibility: visible;
		position:absolute;
		display: table;
	}
	#global-nav {
		height: 100%;
		text-align: center;
		position:relative;
	}
		#global-nav > li{
			float:left;
			height:100%;
			position: relative;
		}

@media (max-width: 750px) {
	#global-nav {
		visibility: hidden;
		display:none;
	}
		#global-nav > li a {
      padding:0 10px;
			position: relative;
		}
		#global-nav > li:first-child a {
			padding:0 10px 0 0;
		}
		#global-nav > li:last-child a {
			padding:0 0 0 10px;
		}
		.open #global-nav li a:hover{
			background-color: #007029;
			color:#fff;
			background:rgba(103,155,120,1);
		}
}

/*-------------------- サブナビ --------------------*/
			#global-nav .sub-navi{
				z-index:100;
				position:absolute;
				top:46px;
				left:50%;
        margin-left:-41px;
				width:138px;
				padding:38px 0 0;
				display:none;
				background-color: transparent;
				background:rgba(0,112,41,0.5);
			}
			#global-nav .sub-navi li {
				display: block;
				padding: 0;
				margin:0;
				width: 100%;
				background-image: url(../images/common/navi-line.png);
				background-position:center bottom;
				background-repeat: no-repeat;
			}
			#global-nav .sub-navi li:last-child{
				background-image: url();
			}
			#global-nav .sub-navi li a{
				text-decoration: none;
				width: 100%;
				height: 100%;
				color:#000;
				padding:14px 0;
				margin:0;
				border:none;
				color:#fff;
				line-height:1.6;
			}



	/* ***********************************************************
	* パッド・スマホ表示時

	* パッド表示時
	* *********************************************************** */
	@media (max-width: 750px) {
		#header #navi {
			width: 100%;
			height: auto;
			float: none;
			display: block;
		}

		#global-nav > li > a {
			text-decoration: none;
			display: block;
		}
		#global-nav > li{
			width: 100%;
			display:block !important;
			float: none;
			height: auto;
			position:static;
		}
		/*-------------------- サブナビ --------------------*/
			#global-nav .sub-navi {
				z-index: 0;
				position:relative;
				top: 0;
				left: 0;
				width:100%;
				padding-top:0;
        margin-left: 0;
				display: block;
			}
			/* ***********************************************************
			* パッド・スマホ表示時　オープン時
			* *********************************************************** */
			.open #global-nav {
				height: auto;
				text-align: center;
				color: #fff;
				border-top:1px solid #f5e0eb;
				border-radius: 0;
			}
			.open #global-nav li {
				float:none;
				display: table;
				width:100% !important;
				padding:0;
				margin:0;
				opacity: 1;
				background-color: #fff;
			}
				.open #global-nav li a{
					border-bottom:1px solid #f0f0f0;
					font-size:1.2em;
					line-height:1.2;
					height:80px;
					-webkit-display: flex;
					display: flex;
					-webkit-align-items: center;
					align-items: center;
					-webkit-flex-wrap: wrap;
					flex-wrap: wrap;
					-webkit-align-content: center;
					align-content: center;
					color:#990066;
					padding:0 40px;
					margin:0;
				}
			/* ***********************************************************
			* パッド・スマホ表示時　オープン時　背景
			* *********************************************************** */
			#nav-bg {
				content: "";
				top: 0;
				right: 0;
				left:0;
				width:0;
				height:0;
				display: block;
				position:absolute;
				z-index:0;
			}
			.open #nav-bg {
				width: 100%;
				height: 10000vh;
				z-index: 20000;
				top: 20vw;
				background: rgba(153,0,102,0.5);
			}
	}

	/* ***********************************************************
	* スマホ表示時
	* *********************************************************** */
	@media (max-width: 750px) {
		#global-nav {top: 20vw;}
		#global-nav {
			left:0;
			width: 100%;
		}
				#page.open #global-nav li a{
					height:auto;
					display:block;
					padding:4vw 4vw;
					text-align:left;
					width:100%;
					background-image: url();
				}
				#page.open #global-nav .sub-navi li a{
					padding-left:10vw;
				}
	}


	/* ***********************************************************
	* #nav-toggle
	* *********************************************************** */
	#nav-toggle {
		visibility: hidden;
		display: block !important;
		position:absolute;
		right: 6.66vw;
		top:6.4vw;
		width: 6.7vw;
		height:8.2vw;
		cursor: pointer;
		padding: 0;
		z-index: 30001;
		-webkit-tap-highlight-color:rgba(0,0,0,0);
		background-color:transparent;
		background-image: url(../images/common/navi_menu.png);
		background-position: left center;
		background-repeat: no-repeat;
	}
	#nav-toggle > div {
  	position: relative;
		width:100%;
	}
	#nav-toggle .name{
		position: absolute;
		bottom:0;
		left:0;
		right:0;
		text-align:center;
		line-height: 0;
	}
	#nav-toggle .name img{
		height:1.46vw;
		line-height: 0;
	}
	#nav-toggle span {
		display: block;
		position: absolute;
		height: 2px;
		width: 6.7vw;
		background: #990066;
		right: 0;
		top:0;
		zoom: 1;
	}
#nav-toggle span:nth-child(1) {top: 0;}
#nav-toggle span:nth-child(2) {top: 2.2vw;width: 5.5vw;left:0.6vw;}
#nav-toggle span:nth-child(3) {top: 4.4vw;}
	.open #nav-toggle span:nth-child(1) {
		top:2.2vw;
		-webkit-transform: rotate(-135deg);
		transform: rotate(-135deg);
		zoom: 1;
	}
	.open #nav-toggle span:nth-child(2) {
		top:2.2vw;
		-webkit-transform: rotate(135deg);
		transform: rotate(135deg);
		zoom: 1;
		width: 6.7vw;
		left:0;
	}
	.open #nav-toggle span:nth-child(3) {
		background: transparent;
	}


	@media (max-width: 750px) {
		#nav-toggle {
			visibility:visible;
		}
	}
	/* ---------- メニューここまで ---------- */
