@charset "UTF-8";
@media (max-width: 559px) {
	#nav-drawer {
		position: relative;
		right: 5%;
	}
	/*チェックボックス等は非表示に*/
	.nav-unshown {
		display: none;
	}
	/*アイコンのスペース*/
	#nav-open {
		display: inline-block;
		width: 30px;
		height: 22px;
		vertical-align: middle;
	}
	/*ハンバーガーアイコンをCSSだけで表現*/
	#nav-open span, #nav-open span::before, #nav-open span::after {
		position: absolute;
		height: 3px; /*線の太さ*/
		width: 25px; /*長さ*/
		-moz-border-radius: 3px;
		     border-radius: 3px;
		background: #555;
		display: block;
		content: " ";
		cursor: pointer;
	}
	#nav-open span::before {
		bottom: -8px;
	}
	#nav-open span::after {
		bottom: -16px;
	}
	/*閉じる用の薄黒カバー*/
	#nav-close {
		display: none; /*はじめは隠しておく*/
		position: fixed;
		z-index: 99;
		top: 0; /*全体に広がるように*/
		left: 0;
		width: 100%;
		height: 100%;
		background: black;
		opacity: 0;
		-webkit-transition: .3s ease-in-out;
		-o-transition: .3s ease-in-out;
		-moz-transition: .3s ease-in-out;
		transition: .3s ease-in-out;
		cursor: pointer;
	}
	/*ハンバーガーアイコンをCSSだけで表現*/
	#nav-close span, #nav-close span::before, #nav-close span::after {
		position: absolute;
		height: 3px; /*線の太さ*/
		width: 25px; /*長さ*/
		-moz-border-radius: 3px;
		     border-radius: 3px;
		background: #555;
		display: block;
		content: " ";
		cursor: pointer;
	}
	#nav-close span::before {
		bottom: -8px;
	}
	#nav-close span::after {
		bottom: -16px;
	}
	/*content内*/
	#nav-close_btn span::before {
		position: absolute;
		top: 25px;
		right: 25px;
		height: 3px;
		width: 25px;
		background: #555;
		display: block;
		content: " ";
		cursor: pointer;
		transform: rotate(45deg);
		-o-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
	}
	#nav-close_btn span::after {
		position: absolute;
		top: 25px;
		right: 25px;
		height: 3px;
		width: 25px;
		background: #555;
		display: block;
		content: " ";
		cursor: pointer;
		transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
	}
	/*中身*/
	#nav-content {
		overflow: auto;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9999; /*最前面に*/
		width: 90%; /*右側に隙間を作る*/
		max-width: 330px; /*最大幅*/
		height: 100%;
		background: #fff; /*背景色*/
		-webkit-transition: .3s ease-in-out;
		-o-transition: .3s ease-in-out;
		-moz-transition: .3s ease-in-out;
		transition: .3s ease-in-out; /*滑らかに表示*/
		-webkit-transform: translateX(-105%);
		   -moz-transform: translateX(-105%);
		    -ms-transform: translateX(-105%);
		     -o-transform: translateX(-105%);
		        transform: translateX(-105%); /*左に隠しておく*/
	}
	/*チェックが入ったらもろもろ表示*/
	#nav-input:checked ~ #nav-close {
		display: block; /*カバーを表示*/
		opacity: .5;
	}
	#nav-input:checked ~ #nav-content {
		-webkit-transform: translateX(0%);
		   -moz-transform: translateX(0%);
		    -ms-transform: translateX(0%);
		     -o-transform: translateX(0%);
		        transform: translateX(0%); /*中身を表示*/
		box-shadow: 6px 0 25px rgba(0, 0, 0, .15);
	}
}
@media(max-width: 959px) {
	#nav-drawer {
		position: relative;
		right: 5%;
	}
	/*チェックボックス等は非表示に*/
	.nav-unshown {
		display: none;
	}
	/*アイコンのスペース*/
	#nav-open {
		display: inline-block;
		width: 30px;
		height: 22px;
		vertical-align: middle;
	}
	/*ハンバーガーアイコンをCSSだけで表現*/
	#nav-open span, #nav-open span::before, #nav-open span::after {
		position: absolute;
		height: 3px; /*線の太さ*/
		width: 25px; /*長さ*/
		-moz-border-radius: 3px;
		     border-radius: 3px;
		background: #555;
		display: block;
		content: " ";
		cursor: pointer;
	}
	#nav-open span::before {
		bottom: -8px;
	}
	#nav-open span::after {
		bottom: -16px;
	}
	/*閉じる用の薄黒カバー*/
	#nav-close {
		display: none; /*はじめは隠しておく*/
		position: fixed;
		z-index: 99;
		top: 0; /*全体に広がるように*/
		left: 0;
		width: 100%;
		height: 100%;
		background: black;
		opacity: 0;
		-webkit-transition: .3s ease-in-out;
		-o-transition: .3s ease-in-out;
		-moz-transition: .3s ease-in-out;
		transition: .3s ease-in-out;
		cursor: pointer;
	}
	/*ハンバーガーアイコンをCSSだけで表現*/
	#nav-close span, #nav-close span::before, #nav-close span::after {
		position: absolute;
		height: 3px; /*線の太さ*/
		width: 25px; /*長さ*/
		-moz-border-radius: 3px;
		     border-radius: 3px;
		background: #555;
		display: block;
		content: " ";
		cursor: pointer;
	}
	#nav-close span::before {
		bottom: -8px;
	}
	#nav-close span::after {
		bottom: -16px;
	}
	/*content内*/
	#nav-close_btn span::before {
		position: absolute;
		top: 2.5em;
		right: 25px;
		height: 3px;
		width: 25px;
		background: #555;
		display: block;
		content: " ";
		cursor: pointer;
		transform: rotate(45deg);
		-o-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
	}
	#nav-close_btn span::after {
		position: absolute;
		top: 2.5em;
		right: 25px;
		height: 3px;
		width: 25px;
		background: #555;
		display: block;
		content: " ";
		cursor: pointer;
		transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
	}
	/*中身*/
	#nav-content {
		overflow: auto;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9999; /*最前面に*/
		width: 90%; /*右側に隙間を作る*/
		max-width: 100%; /*最大幅*/
		background-color: var(--color-snowwhite, #F2F2F2);
		height: 100%;
		-webkit-transition: .3s ease-in-out;
		-o-transition: .3s ease-in-out;
		-moz-transition: .3s ease-in-out;
		transition: .3s ease-in-out; /*滑らかに表示*/
		-webkit-transform: translateX(-105%);
		   -moz-transform: translateX(-105%);
		    -ms-transform: translateX(-105%);
		     -o-transform: translateX(-105%);
		        transform: translateX(-105%); /*左に隠しておく*/
	}
	#nav-content .ly_gnav01 {
		background-color: var(--color-snowwhite, #F2F2F2);
		height: auto;
		padding-right: 0;
		width: 90%;
		margin: auto;
	}
	#nav-content .ly_gnav02 {
		background-color: var(--color-white, #fff);
		padding-right: 0;
	}
	#nav-content .ly_gnav02 .bl_gnav_cont {
		padding: 80px 0 0;
	}
	#nav-content .ly_gnav02 .bl_gnav_cont li {
		width: 100%;
	}
	#nav-content .ly_gnav02 .bl_gnav_cont li a {
		border-right: none;
		display: block;
		color: var(--color-darkgray, #333);
		background-color: var(--color-white, #fff);
		margin: 0;
		padding: 2em;
			border-top:1px solid var(--color-silver,#a3a3a3);
	}
	#nav-content .ly_gnav02 .bl_gnav_cont li a:hover {
		border-right: none;
		display: block;
		background-color: var(--color-main, #148837);
		color: var(--color-white, #fff);
		margin: 0;
		padding: 2em;
		opacity: 1;
	}
	/*チェックが入ったらもろもろ表示*/
	#nav-input:checked ~ #nav-close {
		display: block; /*カバーを表示*/
		opacity: .5;
	}
	#nav-input:checked ~ #nav-content {
		-webkit-transform: translateX(0%);
		   -moz-transform: translateX(0%);
		    -ms-transform: translateX(0%);
		     -o-transform: translateX(0%);
		        transform: translateX(0%); /*中身を表示*/
		box-shadow: 6px 0 25px rgba(0, 0, 0, .15);
	}
}
@media (min-width: 960px) {
	#nav-drawer {
		display: none;
	}
}