@charset "UTF-8";

/*ボタン*/
button,
select {
	text-transform: none;
	/* Firefox 40+, Internet Explorer 11- */
}

/* Remove the default button styling in all browsers */
button,
input,
select,
textarea {
	border-style: none;
	background-color: transparent;
	color: inherit;
}


[type="search"] {
	/* Correct the odd appearance in Chrome and Safari */
	outline-offset: -2px;

	-webkit-appearance: textfield;
	/* Correct the outline style in Safari */
}

.l-header__toggle {
	position: fixed;
	top: 29px;
	right: 6.94444%;
	z-index: 100; 
	margin: 0;
}
.l-header__bg {
	position: fixed;
	top: 0;
	left: 50%;
	z-index: 98;
	width: 0;
	height: 100vh;
	-webkit-transition: .6s cubic-bezier(.55, .085, .68, .53);
	transition: .6s cubic-bezier(.55, .085, .68, .53); 
	-webkit-transform: skew(-30deg) translateX(-50%); 
	transform: skew(-23deg) translateX(-50%);
}
.is-active .l-header__bg {
	width: 300%;
	-webkit-transition: .3s cubic-bezier(.55, .085, .68, .53);
	transition: .3s cubic-bezier(.55, .085, .68, .53);
}

.l-hdr-toggle {
	display: block;
	width: 30px;
	height: 30px;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.l-hdr-toggle__line {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	height: 3px;
	-webkit-transition: .3s cubic-bezier(.55, .085, .68, .53);
	transition: .3s cubic-bezier(.55, .085, .68, .53);
}
.is-active .l-hdr-toggle__line {
	background-color: #fff;
}
.l-hdr-toggle__line--top {
	width: 15px;
	-webkit-transition-delay: .4s;
	transition-delay: .4s; 
	-webkit-transform: translateY(-10px) scale(1, 1); 
	transform: translateY(-10px) scale(1, 1);
	-webkit-transform-origin: left center;
	transform-origin: left center;
}
.is-active .l-hdr-toggle__line--top {
	-webkit-transition-delay: 0s;
	transition-delay: 0s; 
	-webkit-transform: translateY(-10px) scale(0, 1); 
	transform: translateY(-10px) scale(0, 1);
}
.l-hdr-toggle__line--middle {
	width: 27px;
	-webkit-transition-delay: .4s;
	transition-delay: .4s; 
	-webkit-transform-origin: left center; 
	transform-origin: left center;
}
.is-active .l-hdr-toggle__line--middle {
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}
.l-hdr-toggle__line--bottom {
	width: 15px;
	-webkit-transition-delay: .4s;
	transition-delay: .4s; 
	-webkit-transform: translateY(10px) scale(1, 1); 
	transform: translateY(10px) scale(1, 1);
	-webkit-transform-origin: right center;
	transform-origin: right center;
}
.is-active .l-hdr-toggle__line--bottom {
	-webkit-transition-delay: 0s;
	transition-delay: 0s; 
	-webkit-transform: translateY(10px) scale(0, 1); 
	transform: translateY(10px) scale(0, 1);
}
.l-hdr-toggle__line--close {
	width: 27px;
	-webkit-transition: .4ss cubic-bezier(.55, .085, .68, .53);
	transition: .4ss cubic-bezier(.55, .085, .68, .53); 
	-webkit-transition-delay: .2s; 
	transition-delay: .2s;
	-webkit-transform: rotate(90deg) translate(-13px, -13px) scale(0, 1);
	transform: rotate(90deg) translate(-13px, -13px) scale(0, 1);
	-webkit-transform-origin: left center;
	transform-origin: left center;
}
.is-active .l-hdr-toggle__line--close {
	-webkit-transform: rotate(90deg) translate(-13px, -13px) scale(1, 1);
	transform: rotate(90deg) translate(-13px, -13px) scale(1, 1);
}
.l-mask,
.l-mask--gr,
.l-mask--top {
	position: fixed;
	top: 0;
	left: 50%;
	z-index: 102;
	width: 300%;
	height: 100vh;
	background-color: #fdfe00;
	-webkit-transform: skew(-40deg) translateX(-50%);
	transform: skew(-40deg) translateX(-50%);
}
.l-mask--gr {
	z-index: 103; 
	background-color: #f5f5f5;
}
.l-mask--top {
	z-index: 101; 
	background-color: #000;
}

.l-menu {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 99; 
	display: none;
	overflow: scroll;
	width: 100%;
	height: 100vh;
}
.l-menu__body {
	position: relative;
	z-index: 1; 
	margin: 0 auto;
	padding: 70px 6.94444% 0;
	max-width: 768px;
	width: 80%;
	height: 100%;
}
	.l-menu__nav{
		border-top: 1px solid #333333;
	}
.l-menu__contact a{	padding: 10px 0px;}
@media screen and (min-width: 769px){
	/*ハンバーガーがシュッてなる*/
	.l-hdr-toggle:hover .l-hdr-toggle__line--top{
		-webkit-transform: translateY(-10px) scale(0, 1);
		transform: translateY(-10px) scale(0, 1);
	}
	.l-hdr-toggle:hover .l-hdr-toggle__line--bottom{
		-webkit-transform: translateY(10px) scale(0, 1);
		transform: translateY(10px) scale(0, 1);
	}
	.l-hdr-toggle__line--top{
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
	}
	.l-hdr-toggle__line--middle{
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
	}
	.l-hdr-toggle__line--bottom{
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
	}
	.l-hdr-toggle__line--close{
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
	}
	.l-menu__body{
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		padding: 70px 9.375% 0;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-flow: row nowrap;
		flex-flow: row nowrap;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		justify-content: flex-start;
		-webkit-box-align: start;
		-ms-flex-align: start;
		align-items: flex-start;
	}
	.l-menu__nav{
		padding-top: 74px;
		width: 50%;
	}
	.l-menu__item a:hover:after{
		-webkit-transform: rotate(-50deg) scale(1, 1) translate(-10px, -64px);
		transform: rotate(-50deg) scale(1, 1) translate(-10px, -64px);
	}
	.l-menu__item{
		font-size: 40px;
		line-height: 1.2;
	}
	.l-menu__item + .l-menu__item{
		margin-top: 22px;
	}
}

@media screen and (max-width: 667px){
.l-header__toggle{top: 17px;}
}

@media screen and (min-width: 1281px){
	.l-header__toggle{
		margin-left: 560px;
	}
	.l-menu__body{
		padding: 70px 120px 0;
	}

}