.menu-btn {
	position:			fixed;
	top:				28px;
	right:				10px;
	display:			flex;
	height:				90px;
	width:				90px;
	justify-content:	center;
	align-items:		center;
	z-index:			90;
	background-color:	#000000;
}

.menu-btn span
{
	Top:		42px;
	transition: all 0.2s;
}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
	content:			'';
	display:			block;
	height:				3px;
	width:				30px;
	border-radius:		3px;
	background-color:	#ffffff;
	position:			absolute;
}
.menu-btn span:before {
	bottom: 8px;
	transition: all 0.5s;
}
.menu-btn span:after {
	top: 8px;
	transition: all 0.5s;
}
#menu-btn-check:checked ~ .menu-btn span {
	background-color:	rgba(255,255,255,0);
}

#menu-btn-check:checked ~ .menu-btn span::before {
	bottom:		0;
	transform:	rotate(45deg);
}

#menu-btn-check:checked ~ .menu-btn span::after {
	top:		0;
	transform:	rotate(-45deg);
}

#menu-btn-check {
	display:	none;
}

.menu-content {
	width: 300px;
	height: 500px;
	position: fixed;
	top: 28px;
	right: -300px;
	z-index: 60;
	transition: all 0.5s;/*アニメーション設定*/
	opacity: 0.0;
}

#menu-btn-check:checked ~ .menu-content {
    right: 0px;
	opacity: 1.0;
}

.menu-content ul {
    padding: 80px 10px 0;
    border: 0px;
}
.menu-content ul li {
    border-bottom: solid 1px #ffffff;
    list-style: none;
}
.menu-content ul li {
    display: block;
    width: 100%;
    font-size: 15px;
    box-sizing: border-box;
    color:#ffffff;
    text-decoration: none;
    padding: 9px 15px 10px 0;
    position: relative;
}
.menu-content ul li a::before {
    content: "";
    width: 7px;
    height: 7px;
    border-top: solid 2px #ffffff;
    border-right: solid 2px #ffffff;
    transform: rotate(45deg);
    position: absolute;
    right: 11px;
    top: 16px;
}