@charset "UTF-8";
html {
	font-size: 62.5%;
	/*scroll-behavior: smooth;*/
}
body {
	color: #464858;
	font-family: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "游ゴシック", "Yu Gothic", sans-serif;
	font-size: 1.6rem;
}
/*  ----------------------------------------
common
-------------------------------------------*/
a {
	color: #007B45;
	text-decoration: none;
	transition: 0.5s;
}
a:hover{
	opacity: 0.7;
}
li {
	list-style: none;
}
p{
	line-height: 1.8;
}
p + p{
	margin-top: 1em;
}
.arrow {
	position: relative;
	display: inline-block;
	width: 40px;
	height: 20px;
}
.arrow::before, .arrow::after {
	content: "";
	position: absolute;
	margin: 0;
}
.arrow::before {
	top: 18px;
	left: 0;
	width: 40px;
	height: 2px;
	background: #007B45;
}
.arrow::after {
	top: 12px;
	right: -2px;
	width: 16px;
	height: 2px;
	background: #007B45;
	transform: rotate(45deg);
}
.arrow.arrow_white::before {
	background: #ffffff;
}
.arrow.arrow_white::after {
	background: #ffffff;
}
a i.arrow {
	position: absolute;
	top: calc(50% - 20px);
	right: 0;
}
.btn {
	position: relative;
	display: block;
	width: 100%;
	max-width: 300px;
	height: 70px;
	margin: 0 auto;
	background: transparent linear-gradient(103deg, #007B45 0%, #0EA563 100%) 0% 0% no-repeat padding-box;
	color: #ffffff;
	font-size: 1.8rem;
	text-align: center;
	line-height: 70px;
}
.btn_white{
	background: #ffffff;
	border: 2px solid #007B45;
	color: #007B45;
	line-height: 66px;
}
.blank::after{
	content: "";
	display: inline-block;
	width: 15px;
	height: 15px;
	margin: 0 4px;
	background: url("../images/common/icon_blank.svg") no-repeat;
}
.sponly {
}
.pconly {
	display: none;
}

/******************Media Queries******************/
@media screen and (min-width: 768px) {
	.btn {
		width: 360px;
		max-width: 360px;
		height: 80px;
		line-height: 80px;
	}
	.btn_white{
		line-height: 76px;
	}

	.sponly {
		display: none;
	}
	.pconly {
		display: block;
	}
}

/*  ----------------------------------------
header
-------------------------------------------*/
header {
	position: fixed;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	height: 80px;
	padding: 0 20px;
	z-index: 100;
}
header .logo{
	position: relative;
	display: block;
	width: 130px;
	filter: brightness(2000%);
	z-index: 500;
}
/*メニュークリックされたときにロゴ色を変える*/
header .logo_change{
	filter: brightness(100%);
	transition-delay: 0.2s;
}
/******************Media Queries******************/
@media screen and (min-width: 850px) {
	header {
		padding: 0 0 0 3vw;
	}
	header > div {
		flex-grow: 1;
		height: 80px;
		margin-left: 6vw;
	}
	header .logo{
		width: 139px;
	}
}
/*  ----------------------------------------
menu
-------------------------------------------*/
.menu_btn {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 36px;
	width: 30px;
	font-family: 'Oswald';
	cursor: pointer;
	z-index: 140;
}
.menu_btn span, 
.menu_btn span::before, 
.menu_btn span::after {
	content: '';
	position: absolute;
	display: block;
	width: 28px;
	height: 2px;
	background: #ffffff;
	color: #ffffff;
}
.menu_btn span {
	top: 10px;
	left: 0;
	visibility: hidden;/*webフォントのちらつきを抑えるため*/
}
.wf-active .menu_btn span{
	visibility: visible;/*webフォントのちらつきを抑えるため*/
}
.menu_btn span::before {
	bottom: 8px;
}
.menu_btn span:after {
	content: "MENU";
	top: 8px;
	font-size: 1.2rem;
	line-height: 2;
}
#menu_btn_check:checked ~ .menu_btn span {
	background: #007B45;
	transform: rotate(45deg);
}
#menu_btn_check:checked ~ .menu_btn span::before {
	bottom: 0;
	background: #007B45;
	transform: rotate(90deg);
}
/*メニューオープン時は下の線を透明にする*/
#menu_btn_check:checked ~ .menu_btn span::after {
	content: "CLOSE";
	left: 5px;
	background: #007B45;
	transform: rotate(-45deg);
	background-color: rgba(255, 255, 255, 0);
	color: #007B45;
}
#menu_btn_check {
	display: none;
}
/* nav*/
.menu_content {
	position: fixed;
	top: 0;
	left: 100%;
	width: 100%;
	height: 100%;
	padding: 80px 0 0;
	background: #ffffff;
	z-index: 110;
	transition: all 0.5s;
}
.menu_content ul {
	padding: 0;
}
.menu_content ul li {
	border-bottom: solid 1px #ffffff;
}
.menu_content ul li a {
	position: relative;
	display: block;
	padding: 20px;
	background: #F8F9F5;
	color: #464858;
	text-align: center;
}
.menu_content ul li.nav_access a::before {
	content: "";
	display: inline-block;
	width: 12px;
	height: 18px;
	margin: 0 4px 4px 0;
	background: url("../images/common/icon_map_gray.svg") no-repeat 0 0;
	vertical-align: bottom;
}
.menu_content ul li.nav_contact a {
	background: #007B45;
	color: #ffffff;
}
#menu_btn_check:checked ~ .menu_content {
	left: 0;
	/*メニューを画面内へ*/
}
.menu_content ul.nav_policy {
	font-size: 1.4rem;
}
/******************Media Queries******************/
@media screen and (min-width: 850px) {
	.menu_btn {
		display: none;
	}
	.menu_content {
		position: static;
		display: flex;
		justify-content: space-between;
		padding: 0 0 0;
		background: none;
		transition: none;
	}
	.menu_content ul {
		display: flex;
		align-items: center;
	}
	.menu_content ul li {
		border-bottom: none;
	}
	.menu_content ul li a {
		position: relative;
		display: block;
		padding: 0 0 0 0;
		margin-right: 3vw;
		background: none;
		color: #ffffff;
	}
	.menu_content ul li.nav_access a::before {
		background: url("../images/common/icon_map_white.svg") no-repeat 0 0;
	}
	.menu_content ul li.nav_contact a {
		width: 20vw;
		max-width: 240px;
		height: 80px;
		margin-right: 0;
		padding: 0;
		line-height: 80px;
	}
	.menu_content ul.nav_policy {
		display: none;
	}
	.menu_content ul li a .arrow {
		display: none;
	}
	.menu_content ul li.nav_contact a .arrow {
		display: block;
		width: 3vw;
		max-width: 40px;
	}
	.menu_content ul li.nav_contact a .arrow::before {
		width: 3vw;
		max-width: 40px;
	}
}
/*  ----------------------------------------
headerがスクロールで変化後のレイアウト
-------------------------------------------*/
header.HeightMin {
	height: 60px;
	transition: .5s;
}
/*背景、ロゴ、文字色を変える*/
header.HeightMin {
	background: rgba(255, 255, 255, 0.9);
}
header.HeightMin .logo{
	filter: brightness(100%);
}
header.HeightMin .menu_btn span, 
header.HeightMin .menu_btn span::before,
header.HeightMin .menu_btn span::after {
	background: #007B45;
	color: #007B45;
}
header.HeightMin .menu_content {
	padding-top: 60px;
}
header.HeightMin .menu_content ul li.nav_contact a {
	color: #ffffff;
}
/******************Media Queries******************/
@media screen and (min-width: 850px) {
	header.HeightMin {
		
	}
	header.HeightMin .menu_content {
		padding: 0;
	}
	header.HeightMin .menu_content ul li a {
		color: #464858;
	}
	header.HeightMin .menu_content ul li.nav_access a::before {
		background: url("../images/common/icon_map_gray.svg") no-repeat 0 0;
	}
	header.HeightMin .menu_content ul li.nav_contact a {
		height: 60px;
		line-height: 60px;
	}
}
/*  ----------------------------------------
key visual
-------------------------------------------*/
.kv {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	height: 200px;
	padding: 0;
	color: #ffffff;
	text-align: center;
}
.kv::before {
	content: "";
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 200px;
	background: url("../images/common/kv_fuji.jpg") center center / cover no-repeat;
	z-index: -1;
}
h1 {
	font-size: 1.8rem;
	line-height: 1;
	visibility: hidden;/*webフォントのちらつきを抑えるため*/
}
h1 span {
	display: block;
	margin: 0 auto 10px;
	font-family: 'Oswald';
	font-size: 4.0rem;
}
.kv h1 span{
	margin: 30px auto 10px;
}
.wf-active h1{
	visibility: visible;/*webフォントのちらつきを抑えるため*/
}
/******************Media Queries******************/
@media screen and (min-width: 768px) {
	.kv {
		height: 400px;
	}
	.kv::before {
		height: 400px;
}
	h1 {
	font-size: 2.0rem;
	}
	h1 span {
		margin: 0 auto 20px;
		font-size: 6.8rem;
	}
	.kv h1 span{
		margin: 20px auto 20px;
	}
}
/*  ----------------------------------------
main
-------------------------------------------*/
main {
	background: #ffffff;
}
section {
	padding: 80px 20px 0;
}
h1, h2, h3, h4, strong {
	font-weight: 500;
}
section h1 + p {
	margin-top: 30px;
}
section h2 {
	font-size: 3.0rem;
}
section h2::after {
	content: "";
	display: block;
	width: 80px;
	height: 4px;
	margin-top: 20px;
	background: #007B45;
}
section h2 + * {
	margin-top: 40px;
}
section h3 {
	margin-top: 40px;
	font-size: 2.4rem;
}
section h3 + * {
	margin-top: 20px;
}
section h5{
	display: inline-block;
	margin: 20px 0 2px;
	padding: 0 4px;
	border: 1px solid #464858;
	font-weight: 400;
	font-size: 1.6rem;
}
section strong{
	color: #007B45;
}
/*箇条書き「・」付*/
.text_list{
	margin-left: 1em;
}
.text_list li {
	line-height: 1.8;
	list-style-type: disc;
}
.text_list li::marker {
	font-size: 0.5em;
}
/*複数の写真を並べる*/
.photos {
	display: flex;
	align-items: center;
	margin-top: 20px;
}
.photos img {
	width: 48.5%;
	max-width: 450px;
}
.photos img:not(:last-of-type) {
	margin-right: 3%;
}
/*キャッチコピー*/
.catch_copy {
	font-weight: 500;
	font-size: 1.8rem;
	text-align: center;
}
.catch_copy + * {
	margin-top: 40px;
}
/*プライバシーポリシーの背景色有の枠*/
.privacy_contact {
	padding: 20px 25px;
	background: #F8F9F5;
}
.privacy_contact h4{
	margin-bottom: 5px;
}
/******************Media Queries******************/
@media screen and (min-width: 768px) {
	section {
		padding: 160px 3vw 0;
	}
	section > div {
		max-width: 960px;
		margin: 0 auto;
	}
	section h1 + p {
		line-height: 2;
	}
	section h2 {
		font-size: 4.8rem;
	}
	section h2::after {
		width: 120px;
	}
	section h2 + * {
		margin-top: 80px;
	}
	section h3 {
		margin-top: 80px;
		font-size: 3.0rem;
	}

	/*キャッチコピー*/
	.catch_copy {
		font-size: 3.0rem;
	}
	.catch_copy + * {
		margin-top: 80px;
	}
}
/*  ----------------------------------------
main breadcrumbs_list 
-------------------------------------------*/
.breadcrumbs_list {
	display: flex;
	flex-wrap: wrap;
	padding: 20px 20px;
	font-size: 1.4rem;
	gap: .4rem 0;
}
.breadcrumbs_list li:not(:last-of-type)::after{
	content: "＞";
	margin: 0 1em;
}
.breadcrumbs_list + section{
	padding-top: 20px;
}
/******************Media Queries******************/
@media screen and (min-width: 768px) {
	.breadcrumbs_list{
		padding: 20px 3vw;
		max-width: 1280px;
		margin: 0 auto;
		font-size: 1.6rem;
	}
	.breadcrumbs_list + section{
		padding-top: 100px;
	}
}
/*  ----------------------------------------
main flow　○○の流れ
-------------------------------------------*/
.flow{
	position: relative;
	margin: 20px 0 0 20px;	
}
.flow > li{
	position: relative;
	padding: 20px 0 20px 30px;
	border-left: 4px solid #0EA563;
	line-height: 1.8;
}
.flow > li::before{
	content: "";
	position: absolute;
	top: 34px;
	left: -12px;
	display: block;
	width: 20px;
	height: 20px;
	border-radius: 10px;
	background: #007B45;
}
.flow > li:last-of-type::after{
	content: "";
	position: absolute;
	bottom:10px;
	left:-6px;
	width: 30px;
	height: 4px;
	background: #0EA563;
	transform: rotate(-45deg);
}
.flow strong{
	display: block;
	margin-bottom: 4px;
	font-family: 'Oswald';
	font-size: 2.0rem;
}
.flow strong span{
	font-size: 2.4rem;
}
.flow .customize{
	border: 1px solid #464858;
	font-size: 1.3rem;
}
/******************Media Queries******************/
@media screen and (min-width: 768px) {
	.flow {
		display: flex;
		/*justify-content: center;*/
		margin: 40px 0 0 0;
	}
	.flow > li {
		width: 20%;
		padding: 20px 0 0;
		border-left: none;
		border-top: 4px solid #0EA563;
		text-align: center;
	}
	.flow > li::before {
		top: -12px;
		left: calc(50% - 10px);
	}
	.flow > li:last-of-type::after {
		bottom: auto;
		left: auto;
		top: -14px;
		right: -3px;
		transform: rotate(45deg);
	}
	.flow strong{
		font-size: 2.4rem;
	}
	.flow strong span{
		font-size: 2.8rem;
	}
}
/*  ----------------------------------------
main table
-------------------------------------------*/
table{
	width: 100%;
	border-collapse:  collapse;
}
table tr{
	border-bottom: 2px solid #cccccc;
}
table th,
table td{
	display: block;
	line-height: 1.8;
}
table th{
	padding: 20px 0 0;
	font-weight: 500;
	text-align: left;
	vertical-align: top;
}
table td{
	padding: 5px 0 20px;
	font-size: 1.56rem;
}
/******************Media Queries******************/
@media screen and (min-width: 768px) {
	table th, table td {
		display: table-cell;
		padding: 20px 0;
	}
	table th {
		width: 20%;
	}
	table td {
		width: 80%;
		font-size: 1.6rem;
	}
}
/*  ----------------------------------------
main service (top + service)　事業内容概要
-------------------------------------------*/
section.service{
	text-align: center;
}
section.service ul{
	display: flex;
	justify-content: space-around;
	margin: 40px auto 0;
}
section.service ul li{
	width: 33%;
	font-size: 1.4rem;	
	font-weight: 500;
}
section.service ul li img{
	display: block;
	height: 40px;
	margin: 0 auto 10px;
}

/******************Media Queries******************/
@media screen and (min-width: 768px) {
	section.service ul {
		max-width: 960px;
		margin: 80px auto 0;		
	}
	section.service ul li {
		width: 200px;
		font-size: 2.0rem;
	}
	section.service ul li img {
		height: 60px;
		margin: 0 auto 30px;
	}
}
/*  ----------------------------------------
main contact　お問い合わせ
-------------------------------------------*/
section.contact {
	margin-top: 80px;
	padding: 40px 20px;
	background: #F8F9F5;
}
section.contact h1 span{
	color: #007B45;
}
.tel_form {
	margin: 20px 0 0;
	text-align: center;
}
.tel {
	color: #007B45;
	font-size: 4.8rem;
	font-family: 'Oswald';
	font-weight: 500;
}
.tel img {
	margin-right: 5px;
}
.tel + p{
	margin-top: 0;
}
section.contact .btn{
	margin-top: 20px;
}
/******************Media Queries******************/
@media screen and (min-width: 768px) {
	section.contact {
		margin-top: 160px;
		padding: 6vw 3vw;
	}
	section.contact > div {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.tel_form {
		margin: 0 0 0 20px;
	}
}
/*  ----------------------------------------
footer
-------------------------------------------*/
footer {
	position: relative;
	padding: 40px 20px;
	background: #EDEFE8;
	font-size: 1.4rem;
}
footer > div {
	display: flex;
	justify-content: space-between;
}
footer p strong {
	display: block;
	margin-bottom: 20px;
	font-size: 2.0rem;
	font-weight: 400;
	line-height: 1;
}
footer p img {
	height: 16px;
	margin: 0 4px 3px;
	vertical-align: middle;
}
footer .nav_policy img {
	width: 72px;
}
.copyright {
	margin-top: 40px;
}
.pagetop {
	position: absolute;
	right: 0;
	bottom: 60px;
	display: inline-block;
	font-family: 'Oswald';
	font-size: 1.8rem;
	font-weight: 500;
	transform: rotate(90deg);
}
.pagetop i.arrow {
	transform: rotate(180deg) scale(1, -1);
	top: calc(50% - 20px);
	right: auto;
	left: -45px
}
/******************Media Queries******************/
@media screen and (min-width: 768px) {
	footer {
		padding: 6vw 3vw;
	}
	footer > div {
		max-width: 1280px;
		margin: 0 auto;
	}
	footer nav {
		display: flex;
	}
	footer nav a {
		color: #464858;
		line-height: 1.8;
	}
	footer nav > ul:first-of-type {
		display: flex;
	}
	footer nav > ul:first-of-type > li {
		margin-right: 3vw;
		font-weight: 500;
	}
	footer nav > ul:first-of-type > li > ul > li {
		font-weight: 400;
	}
	footer .nav_policy li {
		text-align: center;
	}
	footer .nav_policy img {
		margin-top: 20px;
	}
	.copyright {
		max-width: 1280px;
		margin: 60px auto 0;
	}
}
/*  ----------------------------------------
animation　スクロールで少しずつ表示
-------------------------------------------*/
section{
	opacity: 0;
}
.fadeIn {
	animation-name: fadeInAnime;
	animation-duration: 1s;
	animation-fill-mode: forwards;
	opacity: 0;
}
@keyframes fadeInAnime {
	0% {
		opacity: 0;
		transform: translateY(10px);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
/* アニメーションの開始を遅らせるCSS*/
.delay-time05 {
	animation-delay: 0.5s;
}
.delay-time1 {
	animation-delay: 1s;
}
.delay-time15 {
	animation-delay: 1.5s;
}
.delay-time2 {
	animation-delay: 2s;
}
.delay-time25 {
	animation-delay: 2.5s;
}
.delay-time3 {
	animation-delay: 3s;
}
.delay-time35 {
	animation-delay: 3.5s;
}
.delay-time4 {
	animation-delay: 4s;
}
.delay-time45 {
	animation-delay: 4.5s;
}
.delay-time5 {
	animation-delay: 5s;
}
.delay-time6 {
	animation-delay: 6s;
}
.delay-time7 {
	animation-delay: 7s;
}
.delay-time8 {
	animation-delay: 8s;
}
/* 下層ページのパンくずの次のsectionのフェードインをなくす*/
section.kv,
.breadcrumbs_list + section{
	opacity: 1;
	animation: none;
}
/* 会社情報アクセスsectionのフェードインをなくす*/
section#access{
	opacity: 1;
	animation: none;
}
/* プライバシーポリシー個人情報の取り扱いについてsectionのフェードインをなくす*/
section#privacy_policy{
	opacity: 1;
	animation: none;
}

/* 新卒採用選考方法sectionのフェードインをなくす*/
section#selection_process{
	opacity: 1;
	animation: none;
}

/* 採用ページのイラストをフェードイン
section .illust_list img{
	opacity: 0;
}

/* 働く環境・選考方法のページ内リンクの余白*/
h3#environment,
h2#process {
	padding-top: 80px;
	margin-top: -80px;
}