/*
GLOBAL ヘッダー
*/

.site-header {
	width: 100%;
	padding: 13px 20px 57px;
	position: relative;
	z-index: 1002;
	background-color: $white;
	transition: $trsA;
}

.header {
	&Logo {
		width: 140px;
		margin: auto;
		transition: $trsA;
	}
	&Menu {
		width: 100%;
		position: absolute;
		top: 48px;
		left: 0;
		padding: 0 20px 0;	
		background-color: $white;
		>ul {
			display: flex;
			justify-content: space-between;
		}
		.icon-menu {
			display: flex;
			flex-direction: column;
			color: $site-blue;
			font-size: 11px;
			font-weight: $fwB;
			padding: 13px 0 8px;
			img {
				height: 20px;
				margin-bottom: 5px;
			}
		}
	}
}

/* gnav */
.btn-hamburger {
	transition: $trsA;
	z-index: 100;
	width: 44px;
	text-align: center;
	.menu-trigger {
		padding-top: 38px;
		background: url(./img/top/menu_icon04.svg) center 13px / auto 20px no-repeat;
	}
}

.menu_box {
	display: none;
	width: 100%;
	position: fixed;
	left: 0;
	z-index: 1002;
	transition: opacity .2s .3s, top .5s 0s;
	.headerMenu {
		position: static;
	}
	.navTtl {
		background-color: $white;
	}
	.global-nav {
		// position: fixed;
		width: 100%;
		// overflow-y: scroll;
		background-color: $bgColor;
		padding-bottom: 76px;
		border-top: 1px solid $site-blue;
	}
	.global-menu {
		li {
			font-size: 14px;
			font-weight: $fwB;
			a {
				display: flex;
				flex-direction: row;
				align-items: center;
				height: 50px;
				padding: 0 30px;
				color: #5c5c5c;
				border-bottom: 1px solid #E0E0D3;
				font-size: 14px;
			}
		}
	}
	.menu-price,
	.menu-second {
		li {
			background-color: #F4F4E7;
			line-height: 40px;
			a {
				height: 40px;
				padding: 0 40px;
				span {
					display: inline-block;
					margin: 0 4px;
				}
			}
		}
	
	}
	.menu-tel {
		padding: 30px;
		&Ttl {
			margin-bottom: 10px;
		}
		p {
			&:not([class]) {
				font-size: 13px;
				font-weight: 400;
				line-height: 1;
				color: $textColorDark;
			}
		}
		li {
			margin-bottom: 10px;
		}
	}
	.menu-contact {
		padding: 0 30px;
		a {
			height: 55px;
			align-items: flex-start;
			padding: 6px 0;
			font-size: 15px;
			line-height: 1.4;
			color: $textColorDark;
			span {
				display: inline-block;
				margin-right: 5px;
				font-size: 16px;
			}
		}
	}
	.close_box_bottom {
		margin-top: 50px;
		text-align: center;
	}
}
.active {
	.menu_box {
		transition: opacity .2s 0s, top .5s 0s;
		height: calc(100vh - 105px);
		overflow-y: scroll;
		.global-nav {
			// height: calc(100% - 105px);

		}
	}
	.menu-trigger {
		background: url(./img/top/menu_icon05.svg) center 13px / auto 20px no-repeat;
		color: #818181;
	}
}

.fewscroll {
	.site-header {
		.header {
			&Menu {
				position: fixed;
				width: 100%;
				top: 0;
				left: 0;
				z-index: 100;
			}
		}
	}
	.active {
		.menu_box {
			height: calc(100vh - 57px);
		}
	}
}