/* -HEADER
--------------------------------------------------------------------------------------------- */

/* -togglemenu.css
--------------------------------------------------------------------------------------------- */

/**************************
ページヘッダー
**************************/

/**************************
ページヘッダー(ランダム)
**************************/
header {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1000;
	color: #fff;
	padding: 48px 0;
	-webkit-transition: all 0.4s ease-in-out, color 0s linear;
	-o-transition: all 0.4s ease-in-out, color 0s linear;
	transition: all 0.4s ease-in-out, color 0s linear;
}
header.header3 {
	color: #000;
}
header.header3.is-openmenu {
	color: #fff;
}
header.view {
	background-color: #fff;
	color: #000;
	-webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
	box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
	padding: 25px 0;
}

/* CONTAINER  */
.header__container {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
}
/* LOGO */
.header__logo {
	width: 250px;
	-webkit-transition: 0.4s ease-in-out;
	-o-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}
.header__logo .logo-white,
header.header2 .header__logo .logo-black,
header.header2.view .header__logo .logo-white {
	display: none;
}
header.header2 .header__logo .logo-white,
header.header2.view .header__logo .logo-black {
	display: block;
}
header.view .header__logo {
	width: 200px;
}
.header-group {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
}
.header-btn {
	margin-left: 25px;
}
header.view .header-btn,
header.header3 .header-btn {
	background-color: #b3d048;
	border-color: #b3d048;
	color: #fff;
}
/* TRIGGER */
.menu-trigger {
	cursor: pointer;
	margin-left: 50px;
}
.menu-trigger__text {
	display: inline-block;
	font-weight: 700;
	font-size: 1rem;
	line-height: 1;
	letter-spacing: 0;
	margin-top: 4px;
}
.menu-trigger__inner {
	position: relative;
	width: 40px;
	height: 26px;
}
.menu-trigger.tgl-active {
}
.menu-trigger__inner span {
	width: 100%;
	height: 2px;
	background-color: currentColor;
	position: absolute;
	left: 0;
	-webkit-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}
.menu-trigger__inner span:nth-child(1) {
	top: 0;
}
.menu-trigger__inner span:nth-child(2) {
	width: 50%;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
.menu-trigger__inner span:nth-child(3) {
	bottom: 0;
}
.menu-trigger.tgl-active .menu-trigger__inner span:nth-child(1) {
	top: 50%;
	-webkit-transform: rotate(45deg) translateY(-50%);
	-ms-transform: rotate(45deg) translateY(-50%);
	transform: rotate(45deg) translateY(-50%);
}
.menu-trigger.tgl-active .menu-trigger__inner span:nth-child(2) {
	opacity: 0;
	left: 120%;
}
.menu-trigger.tgl-active .menu-trigger__inner span:nth-child(3) {
	bottom: 50%;
	-webkit-transform: rotate(-45deg) translateY(50%);
	-ms-transform: rotate(-45deg) translateY(50%);
	transform: rotate(-45deg) translateY(50%);
}
@media screen and (max-width: 991px) {
	.header__container {
		position: relative;
		z-index: 2000;
	}
	header.is-openmenu .header__logo .logo-white {
		display: block;
	}
	header.is-openmenu .header__logo .logo-black {
		display: none;
	}
	.header__logo {
		width: 194px;
	}
	.menu-trigger {
		position: relative;
		z-index: 1001;
		margin-top: 8px;
	}
}
@media screen and (max-width: 767px) {
	header {
		padding: 40px 0;
	}
	header.view {
		padding: 10px 0;
	}
	header.view .header__logo {
		width: 160px;
	}
	header .header__logo .logo-white,
	header.view .header__logo .logo-black,
	header.header3 .header__logo .logo-black,
	header.header3.is-openmenu .header__logo .logo-white {
		display: block;
	}
	header .header__logo .logo-black,
	header.view .header__logo .logo-white,
	header.header3 .header__logo .logo-white,
	header.header3.is-openmenu .header__logo .logo-black {
		display: none;
	}
	.header__container {
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}
}
/* MENU TOGGLE */
.menu-toggle {
	position: fixed;
	top: 0;
	bottom: 0;
	right: 0;
	width: 100vw;
	height: 100vh;
	overflow-y: scroll;
	/* Hide scrollbar for IE, Edge and Firefox */
	-ms-overflow-style: none; /* IE and Edge */
	scrollbar-width: none; /* Firefox */
	background-color: #a9d11e;
	-webkit-transition: 0.4s ease-in-out;
	-o-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
	color: #fff;
	opacity: 0;
	visibility: hidden;
	z-index: -1;
}
/* Hide scrollbar for Chrome, Safari and Opera */
.menu-toggle::-webkit-scrollbar {
	display: none;
}
.menu-toggle.active {
	opacity: 1;
	visibility: visible;
	z-index: 1002;
}
.menu-toggle .menu-toggle__inner {
	height: 100%;
	min-height: 825px;
}
.menu-toggle__trigger-wrapper {
	position: relative;
}
.menu-toggle__trigger-wrapper .menu-trigger {
	position: absolute;
	top: 106px;
	right: 6.4%;
	margin: 0;
}
@media screen and (max-width: 991px) {
	.menu-toggle .c-logo {
		display: none;
	}
	.menu-toggle .l-layout .l-layout__left {
		padding-top: 140px;
	}
	.menu-toggle__trigger-wrapper .menu-trigger {
		display: none;
	}
}