.navBtn {z-index: 700000!important;}
.drawerWrap {z-index: 600000!important;}
.knockOut {z-index: 500000!important;}
#drawerCheckbox, .drawerInner .localNav, .navBtn { display: none;}

@media (max-width: 1023px) {
	.drawerInner .localNav {
		display: block;
	}
	.navBtn {
		position: fixed;
		right: 4vw;
		cursor: pointer;
		display: inline-block;
		margin: 0 auto;
		width: 1.75rem;
		height: 1.5rem;
    /* transform: translateY(0); */
	}
	.navBtn span,
	.navBtn span::before,
	.navBtn span::after {
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		margin: auto;
		width: 100%;
		height: 2px;
		border-radius: 3px;
		background: #000;
	}
	.navBtn span {
		top: 50%;
	}
	.navBtn span::before {
		content: '';
		top: -11px;
		transform: rotate3d(0,0,0,0deg);
		transition: top .2s ease-in .2s, transform .2s ease-in;
	}
	.navBtn span::after {
		content: '';
		top: 11px;
		transform: rotate(0deg);
		transition: top .2s ease-in .2s, transform .2s ease-in;
	}
	#drawerCheckbox:checked ~ .navBtn span {
		background: transparent !important;
		transition: background .1s ease;
		box-shadow: none;
	}
	#drawerCheckbox:checked ~ .navBtn span::before,
	#drawerCheckbox:checked ~ .navBtn span::after {
		width: 100%;
		top: 0;
		bottom: 0;
		box-shadow: none;
		background: #fff;
	}
	#drawerCheckbox:checked ~ .navBtn span::before {
		transform: rotate3d(0,0,1,45deg);
		top: 0;
		transition: top .2s ease, transform .2s ease .2s;
	}
	#drawerCheckbox:checked ~ .navBtn span::after {
		transform: rotate3d(0,0,1,-45deg);
		top: 0;
		transition: top .2s ease, transform .2s ease .2s;
	}

	.drawerWrap {
		display: none;
		width: 80vw;
		height: 100vh;
		background: var(--color01);
		display: block;
		position: fixed;
		top: 0;
		left: -100vw;
		transform: translateX(0);
		transition: transform .4s cubic-bezier(0.1, 0.57, 0.1, 1);
		-webkit-overflow-scrolling: touch;
		pointer-events: none;
		overflow-y: scroll;
	}
	.knockOut {
		display: none;
		background: rgba(0,0,0,0.75);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
		position: fixed;
		width: 100vw;
		height: 100vh;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
	}
	#drawerCheckbox:checked ~ .drawerWrap {
		opacity: 1;
		transform: translateX(100vw);
		transition: transform .5s cubic-bezier(0.1, 0.57, 0.1, 1);
		pointer-events: auto;
	}
	#drawerCheckbox:checked ~ .drawerWrap + .knockOut {
		display: block;
	}

	.drawerWrap .drawerInner {
		padding: 5% 4vw 0 4vw;
	}
  .drawerWrap .drawerInner .logo_header {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    margin: 60px auto 30px auto;
  }
	.drawerInner .localNav ul {
		padding-left: 0;
	}
	.drawerInner .localNav ul li {
		width: 100%;
		margin: 2.5rem 0
	}
	.drawerInner a {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		padding: 0;
    line-height: 1;
    text-decoration: none;
		font-size: min(4vw, 24px);
		color: var(--color03);
		font-weight: 500;
		text-decoration: none;
		text-align: center;
	}
	.drawerInner a br {
		display: none;
	}
	/* .drawerInner a::before {
		content: '';
		height: 1px;
		width: 1.5em;
		background: var(--color04);
		margin-right: 1.5%;
	} */
}
