.header {
	.header-inner {
		position: relative;
	}
}

& input#burgerMenu-check {
	display: none;
}

.header__menu {
	opacity: 1;
	visibility: visible;
	transition-duration: 0.5s;
	position: fixed;
	z-index: 998;
	top: 7%;
	left: -120%;
	width: 100%;
	height: auto;
	background-color: #00000050;
	transition-duration: 0.5s;
	text-align: center;

	&.panelactive {
		top: 7%;
		left: 0;
	}

	@media screen and (min-width: 1000px) {
		background-color: transparent;
		position: unset;
		top: 0;
		height: auto;
		flex-basis: 80%;
	}

	.header__list {
		width: 86.7%;
		margin: 0 auto;
		display: flex;
		margin-bottom: 25px;
		flex-direction: column;
		padding-top: 26px;

		@media screen and (min-width:1000px) {
			padding-top: 0;
			width: 100%;
			flex-direction: row;
			margin: 0 auto;
		}

		.header__item {
			@media screen and (min-width:1000px) {
				font-size: 17px;
				border-right: solid 1px #000;
				&:first-child{
					border-left: solid 1px #000;
				}
			}
			& a {
				padding: 10px 0;
				display: block;
				text-align: left;
				font-weight: bold;
				border-top: var(--bk);
				position: relative;
				@media screen and (min-width:1000px) {

					padding: 2px 20px;
				}
				&::after{
					content: ">";
					position: absolute;
					top: 50%;
					transform: translateY(-50%);
					right: 0;
					font-size: 12px;
					color: var(--bk);
				}
				@media screen and (min-width:1000px) {
					border:none;
					&::after{
						content: "";
					}
				}
			}
		}
	}
}



.burgerMenu {
	position: relative;
	width: 50px;
	height: 50px;
	border-radius: 5px;
	z-index: 999;

	@media screen and (min-width: 1000px) {
		display: none;
	}

	& span {
		transition-duration: 0.5s;
		position: absolute;
		background-color: var(--bk);
		width: 30px;
		height: 2px;
		display: inline-block;
		top: 50%;
		left: 50%;
		transform: translate(-50%, 50%);
		border-radius: 6px;
		z-index: 999;

		&:nth-child(2) {
			top: calc(50% - 10px);
		}

		&:nth-child(3) {
			top: calc(50% + 10px);
		}
	}

	&.active {
		& span {
			transition-duration: 0.5s;

			&:nth-child(1) {
				opacity: 0;
			}

			&:nth-child(2) {
				transform: rotate(45deg);
				left: 10px;
				top: 25px;
			}

			&:nth-child(3) {
				transform: rotate(-45deg);
				top: 25px;
				left: 10px;
			}
		}
	}
}