/*-----------------------------

 root

----------------------------- */
:root {
	--bg-color: #FDFDF1;
	--bg-color2: #FFF7D5;
	--main-color: #2DAA38;
	--sub-color: #A8D18D;
	--second-color: #5F4B34;
	--accent-color: #E54312;
	--text-color: #2C2727;
	--font-family: heisei-kaku-gothic-std, sans-serif;
	--font-sub: bonnie, sans-serif;
}

/*-----------------------------

 基本

----------------------------- */
html {
	background: var(--bg-color);
}

body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	line-height: 1.5;
	letter-spacing: 0.05em;
	color: var(--text-color);
	font-family: var(--font-family);
	font-weight: 500;
	font-display: swap;
	word-break: break-word;
	overflow-x: hidden;
}

main {
	flex: 1;
}

ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

p {
	line-height: 2;
}

img {
	max-width: 100%;
}

.index_container {
	padding-top: 120px;
}

/*-----------------------------

 共通

----------------------------- */
/* タイトル */
.ttl {
	display: flex;
	flex-direction: column;
	gap: 8px;
	font-size: clamp(24px,2.4vw,34px);
	font-weight: 700;
	word-break: keep-all;
}

.ttl span {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: clamp(16px, 1.8vw, 20px);
}

.ttl span::before {
	content: "";
	display: inline-block;
	background: var(--accent-color);
}

.ttl span.circle::before {
	width: 16px;
	height: 16px;
	border-radius: 50%;
}

.ttl span.square::before {
	width: 16px;
	height: 16px;
}

.ttl span.triangle::before {
	width: 16px;
	height: 16px;
	clip-path: polygon(50% 0%, 100% 100%, 0% 100%);
}

.ttl span.pentagon::before {
	width: 16px;
	height: 16px;
	clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);
}

.ttl span.diamond::before {
	width: 16px;
	height: 16px;
	clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}

.ttl.between {
	align-items: center;
	flex-direction: row;
	justify-content: space-between;
}

.ttl.large {
	font-size: clamp(28px,2.8vw,46px);
	color: var(--main-color);
	text-align: center;
}

.ttl.large span:not(.font_sub) {
	font-size: clamp(18px,2vw,24px);
}

.font_sub {
	font-family: var(--font-sub);
}

/* 記事ない場合のテキスト */
.no_hit_text {
    margin-top: 32px;
	font-size: 16px;
	text-align: center;
}

/* テキスト文 */
.txt_center {
	padding: 0 24px;
	font-size: clamp(14px,1.8vw,20px);
	text-align: center;
}

.under_ttl_area {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	height: 300px;
	padding: 0 5% 64px;
	border-bottom: 8px solid var(--accent-color);
	background: #F1E7C0;
}

/* ボタン */
.btn {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 340px;
	height: 75px;
	margin: 56px auto 0;
	padding: 0 32px;
	background: var(--main-color);
	color: #fff;
	border-radius: 75px;
	font-size: 18px;
	font-weight: 700;
	transition: .3s;
	overflow: hidden;
}

.btn.br {
	background: var(--second-color);
}

.btn::after {
	content: "";
	display: inline-block;
	background: #fff;
}
.btn.circle::after {
	width: 16px;
	height: 16px;
	border-radius: 50%;
}
.btn.square::after {
	width: 16px;
	height: 16px;
}
.btn.triangle::after {
	width: 16px;
	height: 16px;
	clip-path: polygon(50% 0%, 100% 100%, 0% 100%);
}
.btn.pentagon::after {
	width: 16px;
	height: 16px;
	clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);
}
.btn.diamond::after {
	width: 16px;
	height: 16px;
	clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);
}
@media (hover: hover) and (pointer: fine) {
	.btn:hover {
		background: #1d8f27;
	}
	.btn.br:hover {
		background: var(--second-color);
	}
}
.btn_sub {
	background: var(--second-color);
}

.btn_back {
	display: flex;
	align-items: center;
	gap: 16px;
	width: fit-content;
	color: var(--main-color);
	font-size: 18px;
	font-weight: 700;
	transition: .3s;
}
.btn_back::before {
	transform: rotate(-180deg);
	content: "";
	width: 40px;
	height: 40px;
	border-radius: 4px;
	background-color: var(--main-color);
	background-image: url(../image/ic_arrow.svg);
	background-position: center;
	background-repeat: no-repeat;
	transition: .3s;
}
.btn_back:hover::before {
	transform: rotate(-180deg) translateX(5px);
}

.cta_area {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 90%;
	margin: 160px auto 0;
	padding: 56px 20px;
	border-radius: 20px;
	background: var(--accent-color);
}

.cta_area p {
	line-height: 1.5;
	color: #fff;
	font-size: clamp(28px,2.8vw,40px);
	font-weight: 700;
	text-align: center;
}

.cta_area p + p {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	margin-top: 16px;
	font-size: clamp(18px,2vw,24px);
	word-break: keep-all;
	text-align: center;
}

.cta_area p + p img {
	width: auto;
	height: 100%;
}

.cta_area .btn_box {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	width: 100%;
	max-width: 730px;
	margin-top: 40px;
}

.cta_area .btn_box .btn {
	width: calc((100% - 24px) / 2);
	margin: 0;
}

.cta_area .btn_box .btn.line {
	position: relative;
	justify-content: center;
	width: 100%;
	background: #06C755;
	word-break: keep-all;
}

.cta_area .btn_box .btn.line::before,
.cta_area .btn_box .btn.line::after {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	content: "";
	background: #fff;
	display: block;
	width: 16px;
	height: 16px;
	border-radius: 50%;
}

.cta_area .btn_box .btn.line::before {
	left: 32px;
}

.cta_area .btn_box .btn.line::after {
	right: 32px;
}

.cta_area .btn_box .btn.line img {
	width: 44px;
	height: auto;
}

.cta_area .btn_box .btn div {
	display: flex;
	align-items: center;
	gap: 8px;
}

.cta_area .btn_box .btn.tel {
	background: #fff;
	color: var(--second-color);
}

.cta_area .btn_box .btn.tel::after {
	background: var(--second-color);
}

.cta_area .btn_box .btn.tel img {
	width: 22px;
	height: auto;
}

.cta_area .btn_box .btn.mail img {
	width: 22px;
	height: auto;
}

/* テーブル */
img + .table {
	margin-top: 32px;
}

.table {
	width: 100%;
}

.table tr {
	display: flex;
	align-items: flex-start;
	gap: 8px 80px;
	padding: 32px 20px;
	border-bottom: 1px solid var(--second-color);
}

.table tr th {
	width: 154px;
	min-width: 154px;
	color: var(--main-color);
	font-size: 18px;
	font-weight: 700;
}

.table tr td {
	font-size: 18px;
}

/* タブ */
.tab {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 20px;
	width: 80%;
	max-width: 1000px;
	margin: 0 auto 56px;
}
.tab a {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 220px;
	height: 56px;
	padding: 0 10px;
	border: 2px solid #ADADAD;
	border-radius: 60px;
	background: #fff;
	color: #ADADAD;
	font-size: clamp(18px,1.5vw,24px);
	white-space: nowrap;
}
.tab a.active {
	border: 2px solid var(--cv-color);
	color: var(--cv-color);
}

/* 無限スライダー */
.auto_slider_area {
	display: flex;
	width: max-content;
}
.auto_slider_area .auto_slider {
    display: flex;
    flex-wrap: nowrap;
    gap: 40px;
}

.auto_slider_area .auto_slider:first-of-type {
	animation: infiniteScroll1 50s linear infinite;
}

.auto_slider_area .auto_slider:last-of-type {
	animation: infiniteScroll2 50s -25s linear infinite;
}

.auto_slider_area .auto_slider .item {
	position: relative;
	max-width: 250px;
    min-width: 250px;
}

.auto_slider_area .auto_slider .item:last-of-type {
	margin-right: 40px;
}

/* ページネーション */
.pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 90%;
	margin: 80px auto 0;
	gap: 20px 48px;
}

.pagination .page_prev,
.pagination .page_next {
	display: flex;
	align-items: center;
	gap: 16px;
	width: fit-content;
	color: var(--main-color);
	font-size: 18px;
	font-weight: 700;
	transition: .3s;
}

.pagination .page_prev::before,
.pagination .page_next::before {
	content: "";
	width: 40px;
	height: 40px;
	border-radius: 4px;
	background-color: var(--main-color);
	background-image: url(../image/ic_arrow.svg);
	background-position: center;
	background-repeat: no-repeat;
	transition: .3s;
}

.pagination .page_prev::before {
	transform: rotate(-180deg);
}

.pagination ul {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 16px;
}

.pagination ul li a,
.pagination ul li .current {
	display: inline-block;
	padding: 4px;
	font-size: 20px;
	font-family: var(--font-sub);
}

.pagination ul li .current {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--accent-color);
	color: #fff;
}


@keyframes infiniteScroll1 {
	0% {
		transform: translateX(100%);
	}

	100% {
		transform: translateX(-100%);
	}
}

@keyframes infiniteScroll2 {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(-200%);
	}
}

@media screen and (max-width: 768px) {
	.btn {
		height: 68px;
	}

	.cta_area p + p img {
		display: none;
	}

	.cta_area .btn_box {
		max-width: 500px;
		margin: 32px auto 0;
		gap: 16px;
	}

	.cta_area .btn_box .btn {
		width: 100%;
		font-size: 15px;
	}

	.cta_area .btn_box .btn.line {
		justify-content: flex-start;
		padding: 0 32px 0 20px;
	}

	.cta_area .btn_box .btn.line::before {
		display: none;
	}

	img + .table {
		margin-top: 24px;
	}

	.table tr {
		padding: 24px 20px;
		flex-direction: column;
	}

	.table tr td {
		font-size: 15px;
	}

	.under_ttl_area {
		height: 280px;
	}
}

@media screen and (max-width: 500px) {
	.pagination {
		gap: 20px;
	}
}

/*-----------------------------

 リスト

----------------------------- */
.card_list {
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
	width: 90%;
	margin: 100px auto 0;
}

.card_list li {
	display: flex;
    flex-direction: column;
	width: calc((100% - 64px) / 3);
	padding: 40px;
	background: #FFF7D5;
	border-radius: 20px;
	border-top: 5px solid var(--main-color);
	border-bottom: 5px solid var(--main-color);
}

.card_list li .info {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.card_list li .info .date {
	color: var(--second-color);
	font-size: 14px;
}

.card_list li .info .cate {
	padding: 2px 8px;
	background: var(--second-color);
	border-radius: 4px;
	color: #fff;
	font-size: 13px;
	font-weight: 700;
}

.card_list li .img_box {
	overflow: hidden;
	width: 100%;
	height: auto;
	aspect-ratio: 325 / 200;
	margin-top: 16px;
}

.card_list li .img_box img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 4px;
	transition: .5s;
}

.card_list li .txt_box {
	flex: 1;
	margin-top: 16px;
}

.card_list li .txt_box .news_ttl {
	color: var(--main-color);
	font-size: 16px;
	font-weight: 700;
}

.card_list li .txt_box p {
	margin-top: 8px;
	font-size: 13px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.card_list li .btn {
	width: 100%;
	max-width: 340px;
	height: 64px;
	margin: 32px auto 0;
}

.card_list li:nth-of-type(1n) .btn::after {
	width: 16px;
	height: 16px;
}

.card_list li:nth-of-type(2n) .btn::after {
	width: 16px;
	height: 16px;
	clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);
}

.card_list li:nth-of-type(3n) .btn::after {
	width: 16px;
	height: 16px;
	border-radius: 50%;
}

.card_list li:nth-of-type(4n) .btn::after {
	width: 16px;
	height: 16px;
	clip-path: polygon(50% 0%, 100% 100%, 0% 100%);
}

.card_list li:nth-of-type(5n) .btn::after {
	width: 16px;
	height: 16px;
	border-radius: 50%;
}

.card_list li:nth-of-type(6n) .btn::after {
	width: 16px;
	height: 16px;
	clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);
}

@media (hover: hover) and (pointer: fine) {
	.card_list li:has(.btn:hover) img {
		transform: scale(1.2);
	}
}

@media screen and (max-width: 990px) {
	.card_list li {
		width: calc((100% - 32px) / 2);
		padding: 32px;
	}
}

@media screen and (max-width: 768px) {
	.card_list li {
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
		padding: 24px;
	}
}

/*-----------------------------

 アイキャッチ

----------------------------- */
.eyecatch {
	position: relative;
	width: 100%;
	height: 100vh;
	margin: 0 auto;
}

.eyecatch .img_box {
	width: calc(100% - 80px);
	height: 100%;
	margin: 0 auto;
	background-image: url(../image/img_eyecatch.webp);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	border-radius: 8px;
	clip-path: inset(50% 50% 50% 50%);
	transition: clip-path .8s .3s ease;
}

.eyecatch.active .img_box {
	clip-path: inset(0 0 0 0);
}

.eyecatch h1 {
	position: absolute;
	bottom: 5%;
    right: 10%;
	display: flex;
	flex-direction: row-reverse;
	align-items: flex-start;
	gap: 10px;
}

.eyecatch h1 span {
	width: fit-content;
	padding: 16px 4px;
	font-size: 18px;
	font-weight: 700;
	color: var(--main-color);
	background: #fff;
	border-radius: 4px;
	border-top: 3px solid var(--main-color);
	border-bottom: 3px solid var(--main-color);
	writing-mode: vertical-rl;
	text-orientation: upright;
	clip-path: inset(0 0 100% 0);
	transition: clip-path .5s linear;
}

.eyecatch.active h1 span {
	clip-path: inset(0 0 0 0);
}

.eyecatch.active h1 span:nth-child(1) {
	transition-delay: 0.8s;
}

.eyecatch.active h1 span:nth-child(2) {
	transition-delay: 1.3s;
}

.eyecatch.active h1 span:nth-child(3) {
	transition-delay: 1.8s;
}


.news_box {
	position: absolute;
	bottom: 20px;
	left: 0;
    opacity: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	width: 50%;
	padding: 24px 32px;
	background: #fff;
	box-shadow: 0 0 10px rgba(0, 0, 0, .1);
	border-radius: 0 8px 8px 0;
}

.eyecatch.active .news_box {
    opacity: 1;
    transition: .8s .8s ease;
}

.news_box .txt {
	display: flex;
	align-items: center;
	gap: 12px;
}

.news_box .news_cat {
	padding: 2px 12px;
	background: var(--second-color);
	border-radius: 4px;
	color: #fff;
	font-size: 13px;
	font-weight: 700;
}

.news_box .news_date {
	font-size: 14px;
}

.news_box .news_ttl {
	flex: 1;
	font-size: 16px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.news_box .arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	min-width: 40px;
	min-height: 40px;
	height: 40px;
	background: var(--second-color);
	border-radius: 4px;
}

.news_box .arrow img {
	width: 20px;
	height: auto;
}

@media screen and (max-width: 990px) {
	.eyecatch {
		height: calc(100vh - 50px);
	}

	.eyecatch .img_box {
		margin-top: 50px;
		background-position: 70%;
	}

	.news_box {
		width: 60%;
	}
}

@media screen and (max-width: 768px) {
	.eyecatch h1 {
		bottom: 120px;
		right: 60px;
	}

	.eyecatch h1 span {
		font-size: 16px;
	}

	.eyecatch .img_box {
		height: calc(100% - 100px);
	}

	.news_box {
		bottom: 10px;
		left: 50%;
		transform: translateX(-50%);
		width: calc(100% - 80px);
		padding: 20px;
		border-radius: 8px;
	}
}

@media screen and (max-width: 600px) {
	.eyecatch h1 {
		right: 40px;
	}

	.eyecatch .img_box {
		width: calc(100% - 48px);
		height: calc(100% - 150px);
	}

	.news_box {
		bottom: 20px;
		width: calc(100% - 48px);
	}
}

@media screen and (max-width: 500px) {
	.news_box {
		padding: 16px;
	}

	.news_box .txt {
		flex-wrap: wrap;
		gap: 4px 10px;
	}

	.news_box .news_ttl {
		flex: auto;
		width: 100%;
	}
}


/*-----------------------------

 About

----------------------------- */
#about {
	padding: 200px 5% 160px;
}

#about .inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

#about .ttl b {
	color: var(--text-color);
	font-size: clamp(18px,2vw,24px);
}

#about .ttl b.font_sub {
	color: var(--main-color);
	font-size: clamp(28px,3.6vw,46px);
}

#about p {
	margin-top: 56px;
	font-size: 20px;
	line-height: 2;
	text-align: center;
	word-break: keep-all;
}

#about p span {
	color: var(--main-color);
	font-weight: 700;
	background: #fff;
	padding: 2px 6px;
    margin: 0 8px;
	border-radius: 4px;
	border-left: 3px solid var(--main-color);
	border-right: 3px solid var(--main-color);
	font-feature-settings: "palt";
	white-space: nowrap;
}

@media screen and (max-width: 768px) {
	#about {
		padding: 56px 5% 160px;
	}

	#about p {
		font-size: 16px;
	}
}

@media screen and (max-width: 500px) {
	#about {
		padding: 56px 5% 120px;
	}

	#about p {
		margin-top: 48px;
		font-size: 16px;
	}
}

/*-----------------------------

 Education Policy

----------------------------- */
#education_policy {
	display: flex;
	flex-direction: column;
	align-items: center;
}

#education_policy .inner {
	background: #fff;
}

#education_policy .inner .txt_area {
	padding: 0 5%;
}

#education_policy .inner .txt_area .ttl + p {
	margin-top: 32px;
	font-size: 18px;
	text-align: center;
}

#education_policy .inner .txt_area .ttl + p span {
	font-size: 20px;
	font-weight: 700;
}

#education_policy::before,
#education_policy::after {
	content: "";
	position: relative;
    z-index: -1;
	display: inline-block;
	width: 100%;
	height: auto;
	aspect-ratio: 1440 / 229;
	background-image: url(../image/bg_circle.svg);
	background-repeat: no-repeat;
	background-size: cover;
}

#education_policy::before {
	transform: translateY(1px);
}

#education_policy::after {
	transform: translateY(-1px) rotate(-180deg);
}

#education_policy .education_area {
	display: flex;
	align-items: center;
	padding: 80px 5% 80px 0;
	gap: 56px;
}

#education_policy .education_area .img_box {
	width: 60%;
	margin-left: -10%;
}

#education_policy .education_area .img_box img {
	width: 100%;
	height: auto;
}

#education_policy .education_area .education_box {
	flex: 1;
}

#education_policy .education_area .education_box dl {
	margin-top: 56px;
	padding: 16px 32px;
	border-radius: 8px;
	border-left: 5px solid var(--main-color);
	border-right: 5px solid var(--main-color);
}

#education_policy .education_area .education_box dl dt {
	color: var(--main-color);
	font-size: 24px;
	font-weight: 700;
}

#education_policy .education_area .education_box dl dd {
	margin-top: 20px;
	line-height: 1.8;
}

@media screen and (max-width: 768px) {
	#education_policy .inner .txt_area .ttl + p {
		text-align: left;
	}

	#education_policy .inner .txt_area .ttl + p br:first-of-type {
		display: none;
	}

	#education_policy .education_area {
		flex-direction: column;
		padding: 40px 5%;
	}

	#education_policy .education_area .img_box {
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
	}

	#education_policy .education_area .education_box dl dt {
		font-size: 20px;
	}

	#education_policy .education_area .education_box dl:first-of-type dd br {
		display: none;
	}
}

@media screen and (max-width: 500px) {
	#education_policy .inner .txt_area .ttl + p {
		font-size: 16px;
	}

	#education_policy .inner .txt_area .ttl + p span {
		font-size: 18px;
	}
}

/*-----------------------------

 Our Support

----------------------------- */
#support {
	padding: 80px 5% 160px;
}

#support ul {
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
	margin-top: 56px;
}

#support ul li {
	display: flex;
	flex-direction: column;
	gap: 20px;
	width: calc((100% - 64px) / 3);
	padding: 32px;
	background: var(--bg-color2);
	border-radius: 20px;
}

#support ul li:nth-child(1),
#support ul li:nth-child(2) {
	width: calc((100% - 32px) / 2);
}

#support ul li img {
	width: 100%;
	height: auto;
	border-radius: 8px;
}

#support ul li p:first-of-type {
	line-height: 1.5;
	color: var(--main-color);
	font-size: 24px;
	font-weight: 700;
	text-align: center;
}

@media screen and (max-width: 768px) {
	#support .ttl.between {
		flex-direction: column-reverse;
		align-items: flex-start;
	}

	#support ul {
		flex-direction: column;
	}

	#support ul li {
		width: 100%;
	}

	#support ul li:nth-child(1), #support ul li:nth-child(2) {
		width: 100%;
	}
}

@media screen and (max-width: 500px) {
	#support {
		padding: 80px 5% 120px;
	}

	#support ul li {
		padding: 24px;
	}

	#support ul li p:first-of-type {
		font-size: 20px;
	}
}

/*-----------------------------

 staff

----------------------------- */
#staff {
	overflow: hidden;
	padding: 120px 0;
	background: var(--bg-color2);
}

#staff .staff_area .flex {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 56px;
	padding: 0 5%;
}

#staff .staff_area .flex p {
	font-size: 18px;
}

#staff .staff_area .auto_slider_area {
	margin-top: 56px;
}

#staff .staff_area .staff img {
	width: 100%;
	height: auto;
	aspect-ratio: 328 / 412;
	object-fit: cover;
	border-radius: 8px;
	box-shadow: 0 0 10px rgba(0, 0, 0, .1);
}

#staff .staff_area .staff .staff_name {
	position: absolute;
	bottom: 20px;
	left: 0;
	padding: 4px 16px;
	border-radius: 4px;
	background: #fff;
	border-left: 3px solid var(--main-color);
	border-right: 3px solid var(--main-color);
	color: var(--main-color);
	font-weight: 700;
}

.recruit_area {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 48px;
	margin-top: 120px;
	padding: 0 5%;
}

.recruit_area .txt_box {
	flex: 1;
}

.recruit_area .txt_box p {
	margin-top: 32px;
	font-size: 18px;
}

.recruit_area .txt_box .btn {
	margin-left: 0;
}

.recruit_area .img_box {
	width: 53%;
	height: auto;
	aspect-ratio: 730 / 400;
}

.recruit_area .img_box img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 8px;
}

@media screen and (max-width: 990px) {
	.recruit_area {
		flex-direction: column-reverse;
	}

	.recruit_area .img_box {
		width: 100%;
		max-width: 768px;
		margin: 0 auto;
	}

	.recruit_area .txt_box .btn {
		margin-left: auto;
	}
}

@media screen and (max-width: 768px) {
	#staff  .staff_area .flex {
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		gap: 32px;
	}
}

/*-----------------------------

 access

----------------------------- */
#access {
	width: 80%;
	max-width: 880px;
	padding-top: 160px;
	margin: 0 auto;
}

#access iframe {
	margin-top: 48px;
	width: 100%;
}

#access .flex {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px;
	margin-top: 24px;
}

#access .flex .access_info p {
	line-height: 1.5;
}

#access .flex .access_info .name {
	font-size: 24px;
}

#access .flex .access_info .access {
	margin-top: 16px;
	font-size: 16px;
}

#access .flex .access_info .station {
	margin-top: 4px;
	font-size: 16px;
}

#access .flex .btn {
	margin: 0;
}

@media screen and (max-width: 768px) {
	#access {
		width: 90%;
	}

	#access iframe {
		height: 300px;
	}

	#access .flex {
		align-items: flex-start;
		flex-direction: column;
		gap: 0;
	}

	#access .flex .btn {
		margin: 56px auto 0;
	}
}

@media screen and (max-width: 500px) {
	#access {
		padding-top: 120px;
	}
}

/*-----------------------------

 事業所について

----------------------------- */
#choice {
	width: 80%;
	margin: 100px auto 160px;
}

#choice img {
	display: block;
	width: 100%;
	max-width: 500px;
	margin: 0 auto;
}

#choice p {
	margin-top: 54px;
	font-size: 20px;
}

#overview {
	width: 90%;
	max-width: 880px;
	margin: 160px auto 0;
}

#overview .inner + .inner {
	margin-top: 136px;
}

#overview .ttl:not(.between) {
	text-align: center;
}

#overview .ttl + img {
	width: 100%;
    aspect-ratio: 880 / 420;
    margin-top: 48px;
    border-radius: 8px;
    object-fit: cover;
}

.overview_slider {
	overflow: hidden;
	width: 100%;
}

.overview_slider .auto_slider {
	gap: 20px;
}

.overview_slider .auto_slider_area .auto_slider img {
	width: 300px;
	height: auto;
	aspect-ratio: 1 / 1;
	border-radius: 8px;
}

.overview_slider .auto_slider_area .auto_slider img:last-of-type {
	margin-right: 20px;
}

@media screen and (max-width: 768px) {
	#choice {
		width: 90%;
	}

	#choice p {
		font-size: 16px;
	}
}

@media screen and (max-width: 500px) {
	#overview {
		margin-top: 120px;
	}
}


/*-----------------------------

 スタッフ紹介

----------------------------- */
.staff_list {
	width: 90%;
	margin: 100px auto 0;
}

.staff_list li {
	display: flex;
	align-items: flex-start;
	gap: 40px;
}

.staff_list li + li {
	margin-top: 120px;
}

.staff_list li .img_box {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 20px;
	background: #F1E7C0;
	border-radius: 20px;
}

.staff_list li .img_box img {
	width: 100%;
	max-width: 300px;
	min-width: 250px;
	height: auto;
	aspect-ratio: 300 / 378;
	object-fit: cover;
	border-radius: 8px;
}

.staff_list li .img_box .staff_label {
	display: block;
	margin-top: 16px;
	font-size: 14px;
}

.staff_list li .img_box .staff_name {
	margin-top: 8px;
	padding: 4px 16px;
	background: #fff;
	border-radius: 4px;
	border-left: 3px solid var(--main-color);
	border-right: 3px solid var(--main-color);
	color: var(--main-color);
	font-size: 20px;
	font-weight: 700;
}

.staff_list li .txt_box {
	flex: 1;
}

@media screen and (max-width: 768px) {
	.staff_list li {
		flex-direction: column;
		align-items: center;
	}
}

/*-----------------------------

 ご利用の流れ

----------------------------- */
#flow {
	width: 90%;
	margin: 100px auto 0;
}

#flow ul {
	display: flex;
	gap: 56px 20px;
	counter-reset: number 0;
}

#flow ul li {
	width: calc((100% - 60px) / 4);
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 56px 32px 32px;
	background: #fff;
	border-radius: 8px;
	border-left: 5px solid var(--main-color);
	border-right: 5px solid var(--main-color);
}

#flow ul li::before {
	position: absolute;
	top: -27px;
	left: 50%;
	transform: translateX(-50%);
	counter-increment: number 1;
	content: counter(number) " ";
	display: flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	background: var(--second-color);
	border-radius: 50%;
	color: #fff;
	font-size: 24px;
	font-family: bonnie, sans-serif;
}

#flow ul li p:nth-of-type(1) {
	margin-top: 16px;
	color: var(--main-color);
	font-size: 24px;
	font-weight: 700;
}

#flow ul li p:nth-of-type(2) {
	margin-top: 20px;
	font-size: 15px;
}

#flow ul li p a {
	color: var(--main-color);
}

#information {
	width: 90%;
	max-width: 880px;
	margin: 160px auto 0;
}

#information img {
	width: 100%;
	height: auto;
	aspect-ratio: 880 / 420;
	object-fit: cover;
	margin-top: 48px;
	border-radius: 8px;
}

#information .note {
	margin-top: 32px;
	font-size: 14px;
}

@media screen and (max-width: 1024px) {
	#flow ul {
		flex-wrap: wrap;
	}

	#flow ul li {
		width: calc((100% - 20px) / 2);
	}
}

@media screen and (max-width: 768px) {
	#flow ul li {
		width: 100%;
		max-width: 600px;
		margin: 0 auto;
	}
}

/*-----------------------------

 お知らせ詳細

----------------------------- */
.archive_detail {
	width: 90%;
	max-width: 1280px;
	margin: 160px auto 0;
	padding: 40px;
	background: #FFF7D5;
	border-radius: 20px;
	border-top: 5px solid var(--main-color);
	border-bottom: 5px solid var(--main-color);
}

.archive_detail .info {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.archive_detail .info .date {
	color: var(--second-color);
	font-size: 20px;
}

.archive_detail .info .cate {
	padding: 2px 8px;
	background: var(--second-color);
	border-radius: 4px;
	color: #fff;
	font-size: 16px;
	font-weight: 700;
}

.archive_detail .detail_ttl {
	margin-top: 24px;
	color: var(--main-color);
	font-size: 32px;
	font-weight: 700;
}

.archive_detail .detail_content {
	margin-top: 20px;
}

.archive_detail .detail_content {
	font-size: 16px;
	line-height: 2;
}

.archive_detail .detail_content img {
	display: block;
	width: 100%;
	max-width: 768px;
	margin: 0 auto;
}

.archive_detail .detail_content :is(h1, h2, h3, h4, h5, h6) {
	color: var(--main-color);
	font-size: 20px;
	font-weight: 700;
}

.archive_detail + .btn_back {
	margin: 80px auto 0;
}

@media screen and (max-width: 768px) {
	.archive_detail {
		padding: 24px;
	}

	.archive_detail .info .date {
		font-size: 16px;
	}

	.archive_detail .info .cate {
		font-size: 13px;
	}

	.archive_detail .detail_ttl {
		font-size: 24px;
	}
}


/*-----------------------------

 採用情報

----------------------------- */
#recruit .job_group {
	width: 90%;
	max-width: 880px;
	margin: 100px auto 0;
}

#recruit .job_group h2 {
	font-size: 34px;
	font-weight: 700;
	text-align: center;
}

#recruit .job_group table {
	margin-top: 32px;
}

#recruit .job_group + .job_group {
	margin-top: 160px;
}

@media screen and (max-width: 768px) {
	#recruit .job_group h2 {
		font-size: 24px;
	}
}

/*-----------------------------

エントリー、お問い合わせ

----------------------------- */
.form_container {
	margin-top: 100px;
}

.form_container .flex {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 32px 5%;
	width: 90%;
	margin: 0 auto;
}

.form_container .flex p {
	font-size: 15px;
}

.form_container .flex .tel_area {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 32px 56px;
	background: var(--accent-color);
	border-radius: 20px;
}

.form_container .flex .tel_area p {
	color: #fff;
}

.form_container .flex .tel_area p:nth-of-type(1) {
	font-size: 16px;
	font-weight: 700;
}

.form_container .flex .tel_area p:nth-of-type(2) {
	display: flex;
	align-items: center;
	gap: 16px;
	font-size: 20px;
	white-space: nowrap;
}

.form_container .flex .tel_area p:nth-of-type(2) span {
	font-size: 34px;
}

.form_container .flex .tel_area p:nth-of-type(3) {
	font-size: 12px;
	line-break: strict;
	word-break: keep-all;
}

.form_container .form_area {
	width: 90%;
	margin: 80px auto 0;
	padding: 80px 0;
	border-radius: 20px;
	background: #F1E7C0;
}

.form_container .form_area .form_box {
	width: 90%;
	max-width: 768px;
	margin: 0 auto;
}

.form_container .form_area .form_box dl {
	display: flex;
	align-items: flex-start;
	gap: 16px 80px;
}

.form_container .form_area .form_box dl + dl {
	margin-top: 56px;
}

.form_container .form_area .form_box dt {
	width: 200px;
}

.form_container .form_area .form_box dd {
	flex: 1;
	display: flex;
	align-items: center;
	gap: 8px;
}

.form_container .form_area .privacy_box {
	overflow-y: auto;
	height: 200px;
	margin-top: 56px;
	padding: 40px;
	background: #fff;
	border: 1.5px solid var(--second-color);
	border-radius: 8px;
}

@media screen and (max-width: 990px) {
	.form_container .flex {
		flex-direction: column;
	}

	.form_container .flex .tel_area {
		padding: 24px 16px;
	}

	.form_container .flex .tel_area p:nth-of-type(1) {
		font-size: 14px;
	}

	.form_container .flex .tel_area p:nth-of-type(2) span {
		font-size: 24px;
	}
}


@media screen and (max-width: 768px) {
	.form_container .form_area .form_box dl {
		flex-direction: column;
	}

	.form_container .form_area .form_box dd {
		width: 100%;
	}
}

@media screen and (max-width: 600px) {
	.form_container .flex .tel_area {
		width: 100%;
	}

	.form_container .form_area {
		padding: 56px 0;
	}

	.form_container .form_area .privacy_box {
		padding: 24px;
	}
}

/*-----------------------------

フォーム

----------------------------- */
input:-webkit-autofill {
  box-shadow: 0 0 0 1000px white inset;
}

input:not([type="submit"]),
textarea,
select {
	width: 100%;
	height: 56px;
	padding: 16px;
	border-radius: 8px;
	border: 1.5px solid var(--second-color);
	background: #fff;
	font-size: 16px;
}

textarea {
	height: 200px;
}

input:not([type="submit"]):focus,
textarea:focus,
select:focus {
	outline: none;
	border-color: var(--main-color);
}

input[type="checkbox"],
input[type="radio"] {
	display: none;
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

input[type="checkbox"] + span,
input[type="radio"] + span {
	position: relative;
	padding-left: 32px;
	margin-right: 24px;
	font-size: 16px;
	cursor: pointer;
}

input[type="checkbox"] + span::before,
input[type="radio"] + span::before {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(0,-50%);
	display: inline-block;
	width: 24px;
	height: 24px;
	border-radius: 4px;
	border: 1.5px solid var(--second-color);
	background: #fff;
	transition: .3s;
}

input[type="radio"] + span::before {
	border-radius: 24px;
}

input[type="checkbox"] + span::after {
	content: "";
	position: absolute;
	left: 9px;
	top: 1px;
	width: 6px;
	height: 12px;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: rotate(45deg);
}

input[type="radio"] + span::after {
	position: absolute;
	top: 50%;
	left: 6px;
	transform: translate(0,-50%);
	width: 12px;
	height: 12px;
	border-radius: 32px;
	background: #fff;
	opacity: 0;
	transition: .3s;
}

/* checked */
input[type="checkbox"]:checked + span::before,
input[type="radio"]:checked + span::before {
	background: var(--main-color);
	border-color: var(--main-color);
}

input[type="checkbox"]:checked + span::after {
	opacity: 1;
}

input[type="radio"]:checked + span::after {
	opacity: 1;
}

input::placeholder,
textarea::placeholder,
select::placeholder {
	color: #ADADAD;
}

.select_box {
    position: relative;
	width: 100%;
}

.select_box::after {
    position: absolute;
	top: 50%;
    right: 16px;
	transform: translateY(-50%);
    width: 10px;
    height: 7px;
    background-color: var(--second-color);
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    content: '';
    pointer-events: none;
}

.select_box select {
    appearance: none;
}

.label {
	transform: translateY(1em);
	display: flex;
	align-items: center;
	gap: 4px;
	font-size: 15px;
	font-weight: 700;
}

.label::before {
	display: inline-block;
	padding: 2px 6px;
	border-radius: 4px;
	font-size: 12px;
	color: #fff;
}

.label.required::before {
	content: "必須";
	background: #E54312;
}

.label.optional::before {
	content: "任意";
	background: #ADADAD;
}

.btn:has(input[type="submit"]) {
	position: relative;
	width: 100%;
	max-width: 340px;
	padding: 0;
}

.btn:has(input[type="submit"])::after {
	position: absolute;
	top: 50%;
	right: 32px;
	transform: translateY(-50%);
}

input[type="submit"] {
	width: 100%;
	height: 75px;
	padding: 0 32px;
}


.btn:has(input[type="submit"]:disabled) {
	color: #fff;
	background: #777777;
}

.wpcf7-list-item {
	margin: 0 !important;
}

.wpcf7-form-control-wrap {
	width: 100%;
}

.wpcf7-form-control-wrap:has(input[name="entry_age"]) {
	width: 80px;
}

.wpcf7-form-control-wrap:has(input[name="entry_mail"]),
.wpcf7-form-control-wrap:has(input[name="entry_tel"]),
.wpcf7-form-control-wrap:has(input[name="contact_mail"]),
.wpcf7-form-control-wrap:has(input[name="contact_tel"]) {
	width: 240px;
}

.wpcf7-spinner {
	position: absolute !important;
	top: 50%;
	left: 15px;
	transform: translateY(-50%);
}

.wpcf7-acceptance {
	display: block;
	margin: 56px auto 0;
	text-align: center;
}

.wpcf7-acceptance a {
	text-decoration: underline;
}

.wpcf7-acceptance input[type="checkbox"] + span {
	margin: 0 auto;
}

.wpcf7-not-valid-tip {
	margin-top: 8px;
    color: #E54312 !important;
    font-size: 14px !important;
}

.wpcf7 form .wpcf7-response-output {
	padding: 24px 16px !important;
	border-radius: 8px;
	background: #fff;
	font-size: 14px;
}

@media screen and (max-width: 768px) {
	.label {
		transform: translateY(0);
	}
}

@media screen and (max-width: 500px) {
	input[type="checkbox"] + span,
	input[type="radio"] + span {
		font-size: 14px;
	}

	.wpcf7-form-control-wrap:has(input[name="entry_mail"]),
	.wpcf7-form-control-wrap:has(input[name="entry_tel"]),
	.wpcf7-form-control-wrap:has(input[name="contact_mail"]),
	.wpcf7-form-control-wrap:has(input[name="contact_tel"]) {
		width: 100%;
	}
}

/*-----------------------------

サンクスページ

----------------------------- */
#thanks {
	width: 90%;
	margin: 160px auto 0;
}

#thanks p:nth-of-type(1) {
	line-height: 1.5;
	font-size: 24px;
	font-weight: 700;
	color: var(--main-color);
	word-break: keep-all;
	text-align: center;
}

#thanks p:nth-of-type(2) {
	margin-top: 20px;
	font-size: 18px;
	text-align: center;
	word-break: keep-all;
}

#thanks .btn_back {
	margin: 56px auto 0;
}



/*-----------------------------

ローディングアニメーション

----------------------------- */
.loader {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: var(--bg-color);
	z-index: 555;
}
.loader .loader_wrapper {
	height: 100%;
}

.loader .loader_inner {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: 70%;
	height: fit-content;
}

.loader img {
	display: block;
	width: 250px;
	margin: 0 auto;
}

.loader .txt {
	padding-bottom: 20px;
	text-align: center;
	font-size: 28px;
	font-weight: bold;
	color: var(--main-color);
	font-family: var(--font-sub);
}

#loading_bar {
	width: 0;
	height: 10px;
	border-radius: 10px;
	background: var(--main-color);
	margin: 0;
	text-align: left;
}

#loading_bar.active {
	animation: bar 3s forwards;
}

@keyframes bar {
	from {
		width: 0;
	}
	to {
		width: 100%;
	}
}

/*-----------------------------

アニメーション

----------------------------- */
/* フェードスクロール */
.fadeTrigger{
    opacity: 0;
}
.fadeScroll {
	animation-name: fadeScroll;
	animation-duration: .9s;
	animation-fill-mode: forwards;
	opacity: 0;
}
@keyframes fadeScroll {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.fadeUpTrigger{
    opacity: 0;
}
.fadeUp{
	animation-name:fadeUpAnime;
	animation-duration:0.5s;
	animation-fill-mode:forwards;
	opacity:0;
}
@keyframes fadeUpAnime{
	from {
		opacity: 0;
		transform: translateY(100px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* 左から */
.fadeLeftTrigger{
    opacity: 0;
}
.fadeLeft{
	animation-name:fadeLeftAnime;
	animation-duration:0.5s;
	animation-fill-mode:forwards;
	opacity:0;
}
@keyframes fadeLeftAnime{
	from {
		opacity: 0;
		transform: translateX(-100px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

/* 右から */
.fadeRightTrigger{
    opacity: 0;
}
.fadeRight{
	animation-name:fadeRightAnime;
	animation-duration:0.5s;
	animation-fill-mode:forwards;
	opacity:0;
}
@keyframes fadeRightAnime{
	  from {
		opacity: 0;
		transform: translateX(100px);
	  }
	  to {
		opacity: 1;
		transform: translateX(0);
	  }
}