nav {
	display: none;
}
@media all and (max-width: 767px) {
	nav {
		display: block;
		text-align: center;
		width: 100%;
		position: relative;
		height: auto;
		background: none;
		height: 60px;
	}
}
/*styling open close button*/
.button {
	display: inline;
	position: absolute;
	right: 10px;
	top: -10px;
	z-index: 1000;
	font-size: 20px;
	font-weight: 700;
}
.button a {
	text-decoration: none;
	display: block;
    background: #F4F6F6;
	border: 1px solid #d9d9d9;
    width: 60px;
    height: 60px ;
    line-height:50px;
    border-radius: 30px;
}
.btn-open:before {
	color: #666;
	content: "MENU";
	font-size: 10px;
	transition-property: all .2s linear 0s;
	-moz-transition: all .2s linear 0s;
	-webkit-transition: all .2s linear 0s;
	-o-transition: all .2s linear 0s;
}
/* アイコン */
/*
.btn-open:before {
	color: #fff;
	content: "\f0c9";
	font-family: "FontAwesome";
	transition-property: all .2s linear 0s;
	-moz-transition: all .2s linear 0s;
	-webkit-transition: all .2s linear 0s;
	-o-transition: all .2s linear 0s;
	display: block;
}
*/
#header.HeightMin .btn-open:before,
.menu-container--white .btn-open:before
{
	color: #666;
}
/*
.btn-open:hover:before {
	color: #34B484;
}
*/
.btn-close:before {
	color: #34B484;
	content: "CLOSE";
	font-size: 10px;
	transition-property: all .2s linear 0s;
	-moz-transition: all .2s linear 0s;
	-webkit-transition: all .2s linear 0s;
	-o-transition: all .2s linear 0s;
}
/*
.btn-close:after {
	color: #333;
	content: "\f00d";
	font-family: "FontAwesome";
	transition-property: all .2s linear 0s;
	-moz-transition: all .2s linear 0s;
	-webkit-transition: all .2s linear 0s;
	-o-transition: all .2s linear 0s;
}

.btn-close:hover:before {
	color: #34B484;
}
*/
/*overlay*/
.overlay {
	display: none;
	position: fixed;
	top: 0;
	height: 100%;
	width: 100%;
	background: #F4F6F6;
	overflow: auto;
	z-index: 999;
}
.overlay .wrap {
	color: #666;
	max-width: 100%;
	margin: 0;
	padding: 0 10px;
}
@media all and (max-width: 767px) {
	.overlay {
		
	}
}

.sp_menu_layout{
	padding: 50px 0;
}
.sp_menu_box{
	border-bottom: 1px solid #ddd;
	width: 90%;
	margin: 0 auto;
	padding: 0 0 0 0;
}
@media all and (max-width: 767px) {
	.sp_menu_box{
		
	}
}
.sp_menu_box>a{
	height: 60px;
	display: flex !important;
	justify-content: space-between;
	align-items: center;
	text-decoration: none;
}
@media all and (max-width: 767px) {
	.sp_menu_box>a{
		color: #222;
		font-weight: 500;
	}
}
.sp_menu_box>a:after{
	content: '';
display: block;
  width: 8px;
  height: 8px;
  border-top: 2px solid #222;
  border-right: 2px solid #222;
  transform: rotate(45deg);
	transition: ease 0.3s;
}
.sp_menu_box>a.hasmenu:after{
	 transform: rotate(135deg);
}

.sp_menu_toggle{
	display: none;
	padding-bottom: 20px;
}



