@charset "utf-8";

/*====================
font-face
====================*/
@font-face {
	font-family: "Dela Gothic One";
	src: url(/fonts/DelaGothicOne-Regular.woff2) format('woff2'),
		url(/fonts/DelaGothicOne-Regular.ttf) format('truetype');
	font-weight: 400;
	font-display: swap;
}
@font-face {
	font-family: "Noto Sans JP";
	src: url(/fonts/NotoSansJP-Bold.woff2);
	font-weight: 700;
	font-display: swap;
}
@font-face {
	font-family: "Noto Sans JP";
	src: url(/fonts/NotoSansJP-Regular.woff2);
	font-weight: 400;
	font-display: swap;
}
@font-face {
	font-family: "Noto Sans JP";
	src: url(/fonts/NotoSansJP-Medium.woff2);
	font-weight: 500;
	font-display: swap;
}
@font-face {
	font-family: "Noto Sans JP";
	src: url(/fonts/NotoSansJP-SemiBold.woff2);
	font-weight: 600;
	font-display: swap;
}


body {
	/*スマホで勝手に文字が大きくなる対策*/
	-webkit-text-size-adjust: 100%;
	margin: 0;
}

/*====================
リセット
====================*/
.l-main{
	width: auto;
	padding: 0;
	overflow: hidden;
	background-color: #fff;
}

#content {
	width: 100%;
}
#contents {
	width: 100%;
	padding: 0;
}

/*====================
共通
====================*/
[class*="section__wrapper--"]{
	padding-block: 100px;
}

	[class*="section__inner--"]{
		width: 1140px;
		margin: 0 auto;
	}

		[class*="ttl__box--"]{
			position: relative;
			display: flex;
			flex-direction: column;
			align-items: center;
			text-align: center;
		}

			[class*="section__ttl--"]{
				margin: 0;
				position: relative;
				z-index: 1;
				font-family: "Dela Gothic One", sans-serif;
				font-weight: 400;
				line-height: 0.9;
				color: #30382b;
				text-align: center;
			}

			[class*="section__sub-ttl--"]{
				margin: 0;
				position: absolute;
				top: -133px;
				left: 50%;
				transform: translateX(-50%);
				z-index: 0;
				font-family: "Dela Gothic One", sans-serif;
				font-weight: 400;
				font-size: 190px;
				line-height: 1;
				letter-spacing: 11.4px;
				color: #f0ffe8;
				white-space: nowrap;
				pointer-events: none;
			}

/*====================
メイン画像
====================*/
.main__img{
	width: 100%;
	height: 100%;
}

	.main__img img{
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}

/*====================
about
====================*/
.section__wrapper--about {
	padding-block: 0;
	overflow: hidden;
}
	.section__inner--about {
		height: 1333px;
		margin: 0 auto;
		position: relative;
	}
		.section__inner--about::before {
			content: "";
			position: absolute;
			top: 0;
			left: 50%;
			transform: translateX(-50%);
			width: 1920px;
			height: 1333px;
			z-index: 0;
			background: url(../images/about_before.webp) no-repeat center / cover;
		}
		.about__txt-wrap {
			position: absolute;
			top: 86px;
			right: calc(50% - 570px);
			width: 675px;
			display: flex;
			flex-direction: column;
			gap: 29px;
			z-index: 1;
		}
			.ttl__box--about {
				width: 100%;
				align-items: flex-start;
				text-align: left;
			}
				.section__ttl--about {
					font-size: 90px;
					line-height: 1;
					letter-spacing: 5.04px;
					color: #ffffff;
					text-align: left;
				}
					.section__ttl-accent--about {
						color: #ffff3b;
						font-family: "Dela Gothic One", sans-serif;
						line-height: 1;
					}
					.section__ttl-dot--about {
						font-size: 84px;
						font-family: "Dela Gothic One", sans-serif;
						line-height: 1;
					}
					.section__ttl-num--about {
						font-size: 160px;
						font-family: "Dela Gothic One", sans-serif;
						line-height: 1;
					}
			.about__body {
				display: flex;
				flex-direction: column;
				gap: 19px;
				width: 675px;
			}
				.about__txt {
					margin: 0;
					width: 100%;
					font-family: "Noto Sans JP", sans-serif;
					font-weight: 700;
					font-size: 20px;
					line-height: 1.8;
					color: #ffffff;
				}

/*====================
keyword
====================*/
.section__wrapper--keyword{
	padding-block: 105px 100px;
}
.section__inner--keyword {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 36px;
}
	.section__ttl--keyword {
		font-size: 120px;
		letter-spacing: 7.2px;
	}
		.section__ttl-accent--keyword {
			color: #5fc521;
			font-family: "Dela Gothic One", sans-serif;
		}
		.section__ttl-sm--keyword {
			font-size: 70px;
			letter-spacing: 4.2px;
			font-family: "Dela Gothic One", sans-serif;
			line-height: 1.1;
		}
		.section__sub-ttl--keyword{
			width: 1281px;
			top: -96px;
		}
		.section__sub-ttl--keyword img{
			width: 100%;
			height: 100%;
			object-fit: cover;
			display: block;
		}
	.keyword__list {
		position: relative;
		width: 1140px;
		height: 790px;
	}
		[class*="keyword__item--"] {
			position: absolute;
			display: flex;
			flex-direction: column;
			align-items: center;
			gap: 0;
			height: 250px;
			border-radius: 20px;
			box-sizing: border-box;
		}
		.keyword__item--01 {
			top: 0;
			left: 0;
			width: 332px;
			background: linear-gradient(127deg, #5fc521 1.01%, #83d51f 97.52%);
			padding: 22px 0 0;
		}
		.keyword__item--02 {
			top: 0;
			left: 352px;
			width: 277px;
			background-color: #ecf9e5;
			padding: 53px 0 0;
		}
		.keyword__item--06 {
			top: 0;
			left: 649px;
			width: 491px;
			border: 1px solid #67c921;
			background-color: #ffffff;
			padding: 50px 0 0;
		}
		.keyword__item--04 {
			top: 270px;
			left: 0;
			width: 434px;
			border: 1px solid #70cd20;
			background-color: #ffffff;
			padding: 52px 0 0;
		}
		.keyword__item--07 {
			top: 270px;
			left: 454px;
			width: 334px;
			background: linear-gradient(127deg, #5fc521 1.01%, #83d51f 97.52%);
			padding: 52px 0 0;
		}
		.keyword__item--03 {
			top: 270px;
			left: 808px;
			width: 332px;
			background-color: #ecf9e5;
			padding: 50px 0 0;
		}
		.keyword__item--08 {
			top: 540px;
			left: 0;
			width: 611px;
			background: linear-gradient(144deg, #5fc521 1.01%, #83d51f 97.52%);
			padding: 26px 0 0;
		}
		.keyword__item--05 {
			top: 540px;
			left: 631px;
			width: 509px;
			border: 1px solid #67c921;
			background-color: #ffffff;
			padding: 51px 0 0;
		}
			[class*="keyword__txt--"] {
				margin: 0;
				font-family: "Dela Gothic One", sans-serif;
				font-weight: 400;
				text-align: center;
			}
			.keyword__txt--white {
				font-size: 50px;
				line-height: 1.1;
				letter-spacing: 2px;
				color: #ffffff;
			}
			.keyword__txt--dark {
				font-size: 50px;
				line-height: 1.1;
				letter-spacing: 2px;
				color: #383838;
			}
			.keyword__txt--yellow {
				font-size: 0;
				color: #ffff3b;
				line-height: 1;
			}
			.keyword__txt--green {
				font-size: 0;
				line-height: 0;
				color: #67c821;
			}
			.keyword__txt--grad {
				font-size: 0;
				line-height: 0;
				background-image: linear-gradient(148deg, #5fc521 1.01%, #83d51f 97.52%);
				-webkit-background-clip: text;
				background-clip: text;
				color: transparent;
				-webkit-text-fill-color: transparent;
			}
				.keyword__num {
					font-size: 84px;
					line-height: 1;
					font-family: "Dela Gothic One", sans-serif;
				}
				.keyword__unit {
					font-size: 50px;
					line-height: 1;
					letter-spacing: 2px;
					font-family: "Dela Gothic One", sans-serif;
				}

/*====================
job
====================*/
.section__wrapper--job {
	position: relative;
	padding-block: 91px 100px;
}
	.section__wrapper--job::before {
		content: "";
		position: absolute;
		top: 147px;
		left: 50%;
		transform: translateX(-50%);
		width: 1920px;
		height: 1421px;
		z-index: 0;
		pointer-events: none;
		background: url(../images/job_bg.webp) no-repeat center / cover;
	}
	.section__inner--job {
		position: relative;
		z-index: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 30px;
	}
		.section__ttl--job {
			font-size: 120px;
			letter-spacing: 7.2px;
			line-height: 1;
		}
			.section__ttl-sm--job {
				font-size: 70px;
				letter-spacing: 4.2px;
				font-family: "Dela Gothic One", sans-serif;
				line-height: 58px;
			}
			.section__ttl-accent--job {
				background-image: linear-gradient(157deg, #5fc521 1.01%, #83d51f 97.52%);
				-webkit-background-clip: text;
				background-clip: text;
				color: transparent;
				-webkit-text-fill-color: transparent;
				font-family: "Dela Gothic One", sans-serif;
				line-height: 1;
			}
			.section__sub-ttl--job{
				top: -84px;
				width: 1141px;
			}
			.section__sub-ttl--job img{
				width: 100%;
				height: 100%;
				object-fit: cover;
				display: block;
			}
		.job__list {
			display: flex;
			gap: 60px;
			justify-content: center;
			align-items: flex-start;
		}
			[class*="job__item--"] {
				position: relative;
				width: 540px;
				height: 1168px;
			}
				.job__img {
					position: absolute;
					top: 0;
					left: 0;
					width: 540px;
					height: 1168px;
					margin: 0;
					z-index: 0;
				}
					.job__img img {
						width: 100%;
						height: 100%;
						display: block;
						object-fit: cover;
					}
				.job__name {
					position: absolute;
					display: flex;
					align-items: center;
					justify-content: center;
					margin: 0;
					width: 110px;
					height: 110px;
					border-radius: 50%;
					font-family: "Noto Sans JP", sans-serif;
					font-weight: 700;
					font-size: 24px;
					line-height: 1.1;
					letter-spacing: 1.44px;
					box-sizing: border-box;
					z-index: -1;
				}
				.job__item--01 .job__name {
					top: 139px;
					left: 293px;
					background-color: #ffff3b;
					color: #78d020;
				}
				.job__item--02 .job__name {
					top: 131px;
					left: 283px;
					background: linear-gradient(120deg, #5fc521 1.01%, #83d51f 97.52%);
					color: #ffffff;
				}
				.job__card-ttl {
					position: absolute;
					top: 222px;
					left: 43px;
					width: 452px;
					z-index: 2;
				}
				.job__card-ttl img{
					width: 100%;
					height: 100%;
					object-fit: cover;
					display: block;
				}
				.job__item--02 .job__card-ttl {
					top: 216px;
					left: 37px;
				}
				.job__schedule-wrap {
					position: absolute;
					top: 0;
					left: 0;
					width: 540px;
					height: 1168px;
					z-index: 1;
					overflow: visible;
				}
				.job__schedule {
					position: absolute;
					top: 297px;
					left: 30px;
					width: 480px;
					margin: 0;
					padding: 0;
					z-index: 2;
				}
				.job__item--02 .job__schedule {
					top: 290px;
					left: 26px;
				}
				.job__schedule-photo {
					position: absolute;
					margin: 0;
					z-index: 3;
					/* サブピクセルによるズレを抑える */
					transform: translateZ(0);
				}
					.job__schedule-photo img {
						width: 100%;
						height: 100%;
						display: block;
						object-fit: fill;
					}
				/* Figma schedule_list 基準の座標 */
				.job__item--01 .job__schedule-photo--01 {
					top: 21px;
					left: 337px;
					width: 143px;
					height: 155px;
				}
				/* 13:00 step 基準（Figma: photo y217 / step y281 → top -64） */
				.job__item--01 .job__schedule-photo--02 {
					top: -64px;
					right: -30px;
					left: auto;
					width: 118px;
					height: 146px;
				}
				/* 17:00 step 基準（ステップ高さを固定し、画面幅でズレないようにする） */
				.job__item--01 .job__schedule-photo--03 {
					top: -44px;
					right: -30px;
					left: auto;
					width: 133px;
					height: 160px;
				}
				.job__item--02 .job__schedule-photo--01 {
					top: 167px;
					left: 337px;
					width: 165px;
					height: 136px;
				}
				.job__item--02 .job__schedule-photo--02 {
					top: 365px;
					right: -34px;
					left: auto;
					width: 130px;
					height: 160px;
				}
				.job__schedule-list {
					display: flex;
					flex-direction: column;
					gap: 12px;
					width: 100%;
					margin: 0;
					padding: 0;
					list-style: none;
				}
					.job__step {
						position: relative;
					}
						.job__step-box {
							display: flex;
							align-items: flex-start;
							gap: 20px;
							width: 100%;
							height: 82px;
							padding: 24px 30px;
							background-color: #ffffff;
							border-radius: 20px;
							box-sizing: border-box;
						}
						/* 2行テキストのステップは高さを固定（写真の絶対位置ズレ防止） */
						.job__step-box:has(.job__action br) {
							height: 116px;
						}
							.job__time {
								display: flex;
								align-items: center;
								justify-content: center;
								gap: 8px;
								flex-shrink: 0;
								width: 126px;
								height: 34px;
								padding: 0 14px;
								border-radius: 100px;
								background-color: #78d020;
								font-family: "Dela Gothic One", sans-serif;
								font-weight: 400;
								font-size: 20px;
								line-height: 1.1;
								letter-spacing: 0.8px;
								color: #ffffff;
								text-align: center;
								box-sizing: border-box;
							}
								.job__time-icon {
									width: 19px;
									height: 19px;
									display: block;
								}
							.job__action {
								margin: 0;
								font-family: "Noto Sans JP", sans-serif;
								font-weight: 700;
								font-size: 26px;
								line-height: 34px;
								color: #383838;
							}
						.job__arrow {
							position: absolute;
							left: 50%;
							bottom: -14px;
							transform: translateX(-50%);
							width: 40px;
							height: 24px;
							display: block;
							background-color: #ffff3b;
							mask: url(../images/schedule_arrowr.svg) center / contain no-repeat;
							-webkit-mask: url(../images/schedule_arrowr.svg) center / contain no-repeat;
							z-index: 3;
						}
						.job__item--02 .job__arrow {
							background-color: #78d020;
						}

/*====================
message
====================*/
.section__wrapper--message {
	display: flex;
	justify-content: center;
	overflow: visible;
}
.section__inner--message::before {
	position: absolute;
	content: "";
	width: 1460px;
	height: 939px;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	border-radius: 40px;
	background: linear-gradient(131.38deg, #5fc521 1.01%, #83d51f 97.52%);
	box-sizing: border-box;
}
.section__inner--message{
	position: relative;
	width: 1140px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 59px;
	padding-block: 171px 100px;
}
	.ttl__box--message {
		gap: 51px;
		width: 100%;
	}
		.section__ttl--message {
			font-size: 120px;
			line-height: 58px;
			letter-spacing: 4.2px;
			color: #ffffff;
			white-space: nowrap;
		}
			.section__ttl-sm--message {
				display: block;
				font-size: 70px;
				font-family: "Dela Gothic One", sans-serif;
				line-height: 0;
				letter-spacing: 4.2px;
			}
			.section__ttl-accent--message {
				color: #ffff3b;
				font-family: "Dela Gothic One", sans-serif;
				line-height: 0;
				letter-spacing: 7px;
			}
		.section__sub-ttl--message {
			top: -115px;
			left: calc(50% + 0.5px);
			width: 1286px;
			max-width: calc(100% + 146px);
		}
		.section__sub-ttl--message img {
			width: 100%;
			height: auto;
			display: block;
		}
		.message__caption {
			margin: 0;
			max-width: 100%;
			font-family: "Dela Gothic One", sans-serif;
			font-weight: 400;
			font-size: 34px;
			line-height: 1;
			letter-spacing: 2.04px;
			color: #ffffff;
			text-align: center;
		}
	.message__content {
		position: relative;
		display: flex;
		gap: 50px;
		align-items: flex-start;
		justify-content: center;
		width: 100%;
		max-width: 1140px;
		margin-inline: auto;
	}
		.message__img {
			position: relative;
			width: 351px;
			margin: 11px 0 0;
			border-radius: 20px 20px 20px 5px;
			overflow: hidden;
			flex-shrink: 0;
		}
			.message__img img {
				/* position: absolute; */
				width: 100%;
				height: 100%;
				display: block;
			}
		.message__body {
			display: flex;
			flex-direction: column;
			gap: 20px;
			flex: 1 0 0;
			min-width: 0;
		}
			.message__txt-group {
				display: flex;
				flex-direction: column;
				width: 100%;
			}
			.message__txt {
				margin: 0;
				width: 100%;
				font-family: "Noto Sans JP", sans-serif;
				font-weight: 700;
				font-size: 20px;
				line-height: 1.8;
				color: #ffffff;
			}
		.message__sign {
			position: absolute;
			top: 330px;
			left: -32px;
			display: flex;
			align-items: center;
			gap: 11px;
			padding: 10px 20px;
			border-radius: 6px;
			background: linear-gradient(161.55deg, #5fc521 1.01%, #83d51f 97.52%);
			white-space: nowrap;
			z-index: 2;
		}
			.message__sign-role {
				margin: 0;
				font-family: "Noto Sans JP", sans-serif;
				font-weight: 700;
				font-size: 24px;
				line-height: 1;
				color: #ffffff;
			}
			.message__sign-name {
				margin: 0;
				font-family: "Noto Sans JP", sans-serif;
				font-weight: 700;
				font-size: 32px;
				line-height: 1;
				color: #ffffff;
			}

/*====================
people
====================*/
.section__wrapper--people {
	position: relative;
	padding-block: 62px 280px;
}
	.section__wrapper--people::before {
		content: "";
		position: absolute;
		top: 132px;
		left: 50%;
		transform: translateX(-50%);
		width: 1920px;
		height: 990px;
		z-index: 0;
		pointer-events: none;
		background: url(../images/people_before.webp) no-repeat center / cover;
	}
	.section__inner--people {
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 76px;
		z-index: 1;
	}
		.section__ttl--people {
			font-size: 120px;
			letter-spacing: 4.2px;
			line-height: 89px;
		}
			.section__ttl-sm--people {
				font-size: 70px;
				font-family: "Dela Gothic One", sans-serif;
			}
			.section__ttl-accent--people {
				background-image: linear-gradient(160deg, #5fc521 1.01%, #83d51f 97.52%);
				-webkit-background-clip: text;
				background-clip: text;
				color: transparent;
				-webkit-text-fill-color: transparent;
				font-family: "Dela Gothic One", sans-serif;
			}
		.section__sub-ttl--people {
			width: 1062px;
			top: -70px;
		}
		.section__sub-ttl--people img{
			width: 100%;
			height: 100%;
			object-fit: cover;
			display: block;
		}
		.people__list {
			display: flex;
			gap: 42px;
			align-items: center;
		}
			.people__item {
				position: relative;
				width: 352px;
				height: 523px;
			}
				.people__img {
					width: 352px;
					height: 523px;
					margin: 0;
					border-radius: 9999px;
					overflow: hidden;
					background-color: #ffffff;
				}
					.people__img img {
						width: 100%;
						height: 100%;
						display: block;
						object-fit: cover;
						object-position: bottom;
					}
				[class*="people__catch--"] {
					position: absolute;
					display: flex;
					align-items: center;
					margin: 0;
					border-radius: 6px;
					background: linear-gradient(99deg, #5fc521 1.01%, #83d51f 97.52%);
					font-family: "Noto Sans JP", sans-serif;
					font-weight: 700;
					font-size: 30px;
					line-height: 1;
					color: #ffffff;
					text-align: center;
					writing-mode: vertical-rl;
					font-feature-settings: "vert" 1;
					z-index: 2;
					letter-spacing: 3px;
					min-height: 210px;
					width: 57px;
					padding: 17px 0 11px;
					white-space: nowrap;
				}
				.people__catch--01 {
					top: 30px;
					left: 309px;
				}
				.people__catch--02 {
					top: 64px;
					left: 245px;
					padding: 17px 0 0;
					height: 241px;
				}
				.people__catch--01.people__catch--01-03{
					height: 240px;
				}
				.people__catch--02.people__catch--02-01{
					height: 210px;
				}
				.people__name-wrap {
					position: absolute;
					top: 428px;
					left: 50%;
					transform: translateX(-50%);
					display: flex;
					flex-direction: column;
					align-items: center;
					gap: 4px;
					width: 136px;
					z-index: 2;
				}
					.people__kana {
						margin: 0;
						width: 100%;
						font-family: "Noto Sans JP", sans-serif;
						font-weight: 600;
						font-size: 14px;
						line-height: 1;
						color: #ffffff;
						text-align: center;
					}
					.people__name {
						margin: 0;
						width: 100%;
						font-family: "Noto Sans JP", sans-serif;
						font-weight: 600;
						font-size: 32px;
						line-height: 1;
						color: #ffffff;
						text-align: center;
					}
	.people__catch-txt {
		position: absolute;
		bottom: 0;
		left: 50%;
		transform: translateX(-50%);
		width: 100%;
		max-width: 1920px;
		height: auto;
		z-index: 1;
		margin: 0;
	}
	.people__catch-txt img{
		width: 100%;
		height: auto;
		display: block;
	}

/*====================
entry
====================*/
.section__wrapper--entry {
	position: relative;
	padding-block: 0;
	height: 575px;
	background: linear-gradient(90deg, #fda23a 0%, #fd7e3a 100%);
	overflow: hidden;
}
	.entry__deco {
		position: absolute;
		top: 402px;
		left: 50%;
		transform: translateX(-50%);
		width: 1920px;
		z-index: 2;
	}
	.entry__deco img{
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}
	.section__inner--entry {
		position: relative;
		height: 575px;
	}
		.entry__img {
			position: absolute;
			top: 80px;
			left: 0;
			width: 1140px;
			height: 415px;
			margin: 0;
			border-radius: 40px;
			overflow: hidden;
			z-index: 1;
		}
			.entry__img img {
				width: 100%;
				height: 100%;
				display: block;
				object-fit: cover;
				object-position: bottom;
			}
		.entry__btn {
			position: absolute;
			top: 342px;
			left: 320px;
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 30px;
			width: 500px;
			height: 120px;
			background: #ffffff;
			border-radius: 9999px;
			text-decoration: none;
			box-sizing: border-box;
			z-index: 3;
			transition: all 0.4s ease;
		}
		.entry__btn:hover {
			background: #fd7e3a;
			opacity: 1;
			transition: all 0.4s ease;
		}
			.entry__btn-txt {
				font-family: "Dela Gothic One", sans-serif;
				font-weight: 400;
				font-size: 50px;
				line-height: 0.8;
				letter-spacing: 3px;
				text-align: center;
				background: linear-gradient(90deg, #FDA23A 0%, #FD7E3A 100%);
				background-clip: text;
				-webkit-background-clip: text;
				-webkit-text-fill-color: transparent;
			}
			.entry__btn:hover .entry__btn-txt {
				background: none;
				-webkit-text-fill-color: #ffffff;
				color: #ffffff;
			}
			.entry__btn-icon {
				position: absolute;
				top: 39px;
				left: 420px;
				width: 42px;
				height: 42px;
				display: block;
				background: #fd7e3a;
				mask: url(../images/icon_entry-arrow.svg) center / contain no-repeat;
				-webkit-mask: url(../images/icon_entry-arrow.svg) center / contain no-repeat;
			}
			.entry__btn:hover .entry__btn-icon {
				background: #ffffff;
			}