/* ハンバーガーメニューの線 */
#spicon span{
	border-bottom:2px solid #fff;
}
/* 開閉後、ハンバーガーメニューの色を変更する場合 */
#spicon.m_active span:nth-child(1) {
    /*border-color: #FFF;*/
}
#spicon.m_active span:nth-child(3) {
    /*border-color: #FFF;*/
}
#spicon.m_active:before {
    /*color: #FFF;*/
}
/* 開閉後の背景の色 */
#center_box {
    background-color: #FFF;
}
/* テキストメニューの色 */
.page_link > li > a {
    color: #000;
    border-bottom: 1px solid #000;
}

/**************************************
	ハンバーガーアイコン
***************************************/

#spicon {
	position: absolute;
	left :50%;
	top: 50%;
	transform: translate(-50%, -50%);
	background-position:50% 0;
	background-repeat:no-repeat;
	background-size:cover;
	width:50px;
	height:32px;
	z-index:9999;
	cursor:pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;

}
#spicon span {
	width:100%;
	height:2px;
	transition: all .4s;
}

/* ボタンを押した後のボタンのスタイル */
#spicon.m_active span:nth-child(1) {
    transform: translateY(12px) rotate(-45deg);
}

#spicon.m_active span:nth-child(2) {
	opacity:0;
}

#spicon.m_active span:nth-child(3) {
    transform: translateY(-15px) rotate(-135deg);
}




#sp_menu {
	position:fixed;
	right: 0;
	top: 0;
	font-size:34px;
	z-index:9999;
	cursor:pointer;
	background: #3972b7;
	width: 100px;
	height: 100px;
}

#close {
	display: none;
}

#open_menu {
	display: none;
	background-color:#3972b7;
	color:#FFF;
	position:fixed;
	right:0;
	top:0;
	height:100vh;
	width:100%;
	max-width: 640px;
	z-index:999999;
	overflow-y:scroll;
}

#open_menu ul {
	padding:100px 70px 60px;
	height:100%;
	overflow-y: scroll;
}

	#open_menu a {
		color:#FFF;
		text-decoration:none;
		font-size: 18px;
	}
	
	#open_menu li {
		font-size:16px;
		line-height:normal;
		position:relative;
	}
	#open_menu li:nth-child(n + 2) {
		margin-top: 25px;
	}


#menu_close {
	position:absolute;
	right:20px;
	top:20px;
	font-size:50px;
	cursor:pointer;
	font-weight: 100;
}

#sptel {
	position:absolute;
	left:20px;
	top:3px;
	font-size:34px;
	z-index:9999;
	cursor:pointer;
	display:none;
}


@media only screen and (max-width:740px) {
	#sp_menu {
		width: 80px;
		height: 80px;
	}
	#spicon {
		width: 39px;
		height: 30px;
	}
	#open_menu a {
		font-size: 14px;
	}

#open_menu ul {
	text-align:left;
	padding:80px 20px 60px;
	height:auto;
}
	
	#open_menu li {
		width:100%;
		font-size:14px;
		line-height:normal;
		position:relative;
		text-align:center;
	}
	#open_menu li:nth-child(n + 2) {
		margin-top: 25px;
	}
	.fa-mobile {
		font-size: 33px !important;
	}



#menu_close {
	position:absolute;
	right:20px;
	top:15px;
	font-size:28px;
	z-index:9999;
	cursor:pointer;
}


#open_menu {
    max-width: 100%;
}


}

/* @media only screen and (max-width:480px) {
	#sp_menu {
		width: 65px;
		height: 65px;
	}
	#spicon {
		width: 39px;
		height: 40px;
	}

} */