@charset "UTF-8";
/*
最終更新日 2020-04-01
ハンバーガーメニュー
----------------------------------------------------------------*/
#nav_toggle {
	display: block;
	margin: 10px 0 0;
	width: 36px;
	cursor: pointer;
	z-index: 99999;
}

#nav_toggle div {
	position: relative;
	margin:	5px 0 0;
}

#nav_toggle span {
	display: block;
	position: absolute;
	height: 3px;
	width: 100%;
	background: #888;
	left: 0;
	-webkit-transition: .35s ease-in-out;
	-moz-transition: .35s ease-in-out;
	transition: .35s ease-in-out;
}

#nav_toggle span:nth-child(1) { top: 0; }
#nav_toggle span:nth-child(2) { top: 12px; }
#nav_toggle span:nth-child(3) {	top: 24px; }

#nav_toggle p {
	margin: 0 0 0 40px;
	font-weight: bold;
	color: #007085;
}

/* #nav-toggle 切り替えアニメーション */
.open #nav_toggle span:nth-child(1) {
	top: 7px;
	-webkit-transform: rotate(315deg);
	-moz-transform: rotate(315deg);
	transform: rotate(315deg);
}

.open #nav_toggle span:nth-child(2) {
	width: 0;
	left: 50%;
}

.open #nav_toggle span:nth-child(3) {
	top: 7px;
	-webkit-transform: rotate(-315deg);
	-moz-transform: rotate(-315deg);
	transform: rotate(-315deg);
}

/* #global-nav スライドアニメーション */
.open #global_nav {
	-moz-transform: translateY(544px);
	-webkit-transform: translateY(544px);
	transform: translateY(544px);
}


/* グローバルメニュー
----------------------------------------------------------------*/
#global_nav {
	position: absolute;
	/* 開いてないときは画面外に配置 */
	top: -490px;
	width: 100%;
	margin: 0;
	padding: 0;
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	background: #FFFEFF;
	z-index: 9999;
	font-size: 13px;
}

#global_nav ul li a {
	display: block;
	padding: 8px 0 8px 10px;
	box-sizing: border-box;
	border-bottom: 1px dotted #EEE;
	color: #FFF;
	background: #A0D1F1;
}

.lv2 {
	display: none;
	background: #FFF;
}

#global_nav ul li ul.lv2 a {
	color: #333;
	background: #FFF;
}

#global_nav > ul {
		display: -webkit-flex;display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
}

#global_nav > ul li {
	width: 100%;
}

#global_nav li:nth-child(1).sp,
#global_nav li:nth-child(2).sp {
	width: 50%;
}

#global_nav li:nth-child(1) a {
	box-sizing: border-box;
	border-right: 1px dotted #FFF;
}

#global_nav > ul li.sp_sub {
	padding: 0;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}

#global_nav > ul li.sp_sub > a {
	width: 33.3333%;
	height: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	border-right:1px dotted #FFF;
}

#global_nav > ul li.sp_sub a:last-child {
	border: none;
}


@media print,screen and (min-width: 769px) {
	.sp_sub,
	#global_nav > ul li.sp_sub {
		display: none;
	}

	#nav_toggle {
		display: none;
	}

	#global_nav > ul > li {
		width: auto;
	}

	#global_nav ul li a {
		background: #FFF;
	}

	/* グローバルナビ
	---------------------------------------------------------------------------*/
	#global_nav {
		position: static;
	}

	#global_nav > ul {
		width: 100%;
		font-size: 16px;font-size: 16rem;
		margin: 10px 0 0;
		display: -webkit-flex;display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	#global_nav > ul > li {
		text-align: center;
		padding: 0 10px;
		box-sizing: border-box;
		max-width: 140px;
	}

	#global_nav > ul > li:nth-child(4) {
		max-width: 170px;
	}

	#global_nav > ul > li:nth-child(5) {
		max-width: 200px;
	}

	#global_nav ul li a {
		padding: 0;
	}
	
	#global_nav > ul > li > a {
		display: block;
		border: 0;
		padding: 14px 0;
		text-decoration: none;
		color: #333;
	}

	#global_nav >ul > li:hover {
		position: relative;
	}

	#global_nav >ul > li a:hover  {
		padding: 14px 0;
		box-sizing: border-box;
	}

	#global_nav li:hover .lv2 {
		position: absolute;
		display: block;
		top: 53px;
		left: 50%;
		margin-left: -90px;
		background: #FFF;
		width: 180px;
	}

	#global_nav li:hover .lv2 a {
		display: block;
		text-align: left;
		width: 180px;
		font-size: 14px;font-size: 14rem;
		box-sizing: border-box;
		padding: 10px 5px 10px 10px;
		border-left: 1px solid #EEE;
		border-right: 1px solid #EEE;
		border-bottom: 1px solid #EEE;
		background: #FFF;
	}

	#global_nav li:nth-child(2):hover .lv2 a {
		width: 100%;
	}

	#global_nav li:hover .lv2 a:hover {
		color: #FFF;
		background: #3B4C8A;
		text-decoration: none;
		-webkit-transition: .3s;
		transition: .3s;
	}
}


@media print,screen and (min-width: 1200px) {
	/* グローバルナビ
	---------------------------------------------------------------------------*/
	#global_nav > ul {
		width: 1200px;
	}
}
