@charset "UTF-8";

/* 基本 */
body {
	font-family: 'Montserrat', 'Noto Sans JP', sans-serif;
}

.container {
	width: 90%;
	margin: 0 auto;
	z-index: 0;
}

.container_company {
	width: 90%;
	margin: 0 auto;
}

@media (min-width: 800px) {
	.container {
		width: 98%;
		max-width: 1000px;
	}
	.container_company {
		width: 86%;
		max-width: 1000px;
	}
}

.fadein {
  opacity : 0;
  transform: translateY(15px);
  transition: all 1s;
}

/* リセット / ノーマライズ / サニタイズ */
body, h1, h2, h3, h4, h5, h6, p, ul, figure {
	margin: 0;
	padding: 0;
}

a {
	color: inherit;
	text-decoration: none;
}

a:hover {
	opacity: 0.6;
}

/* ヘッダー */
.header .container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 74px;
}
.header .container_company {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 74px;
}


@media (min-width: 850px) {
	.header .container {
		height: 85px;
	}
}	.header .container_company {
		height: 85px;
	}
}

/* ヘッダー：ロゴ */
.site {
	display: flex;
	align-items: center;
}

.site img {
	width: 50%;
	margin-left: 2.3%;
}

@media(min-width: 850px) {
	.site img {
		width: 250px;
	}
}

/* ナビゲーションボタン */
.nav-button {
	box-sizing: content-box;
	padding: 0;
	outline: none;
	border: none;
	background: none;
}

.nav-button::before,
.nav-button::after {
	content: '';
	display: block;
}

.sr-only img {
	width: 60%; 
}

/* ナビゲーションボタン（閉じるボタン） */
.open .nav-button {
	z-index: 1000;
}

/* ナビゲーションメニュー: モバイル */
@media (max-width: 899px) {
	html.open, .open body {
		height: 100%;
		overflow: hidden;
	}

	.open .form {
		display: none;
	}

	.open nav {
		left: -29px;
	}

	html, body {
		overflow-x: hidden;
	}

	.header {
		position: relative;
	}

	.nav {
	position: absolute;
	top: 0px;
	left: 100%;
	width: 106%;
	height: 100vh;
	background: rgba(255,255,255,0.8);
	color: #726E6E;
	display: flex;
	justify-content: flex-end;
	padding: 18% 0 0;
	transition: left 0.5s;
	z-index: 10;
	}
	

	.nav ul {
		list-style: none;
		font-weight: bold;
		text-align: right;
		margin-right: 6%;
	}

	.nav li:not(:last-child) {
		margin-bottom: 30px;
	}

	.nav .btn {
		color: inherit;
	}
}

/* ナビゲーションメニュー： PC */
@media (min-width: 900px) {
	.nav-button {
		display: none;
	}

	.nav ul {
		display: flex;
		align-items: center;
		list-style: none;
		bottom: 4px;
		font-size: 20px;
		color: #726E6E;
	}

	.nav .v_line_fix {
  		margin-right: 20px;
  		width: 1px;
  		height: 25px;
  		background-color: #98C8EC;
	}

	.nav li:not(:last-child) {
		margin-right: 23px;
	}

	.nav .btn {
		width: 148px;
		border-color: #CDD6DD;
	}
}


.spacer {
	margin-top: 90px;
}
