@charset "utf-8";

/* ===========================================
	loading
============================================== */
/* Loading背景画面設定　*/
#splash {
	/*fixedで全面に固定*/
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 999;
	text-align: center;
	color: #fff;
}

/* Loading画像中央配置　*/
#splash_text {
	position: absolute;
	top: 50%;
	left: 50%;
	display: flex;
	flex-direction: column; /* 縦に並べる */
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 3px;
	font-family: 'DotGothic16', sans-serif;
	font-weight: 400;
	z-index: 999;
	transform: translate(-50%, -50%);
}

/* バー（SVG）の設定 */
#splash_text svg {
    width: 100%;
    height: 100%;
    display: block;
}

/* 数字（カウントアップ）の設定 */
#splash_text .counter {
    /* JSのstyleを削除したので、ここで改めて指定 */
    position: absolute;
    left: 50%;
    bottom: 100%;           /* バーの真上に配置 */
    transform: translateX(-50%);
    margin-bottom: 20px;    /* バーとの距離 */
    font-size: 3rem;
    color: #fff;
    white-space: nowrap;
    font-family: 'DotGothic16', sans-serif;
    font-weight: bold;      /* お好みで */
}

/*割れる画面のアニメーション*/
.loader_cover {
	width: 100%;
	height: 50%;
	background-color: #2dae5d;
	transition: all 0.2s cubic-bezier(0.04, 0.435, 0.315, 0.9);
	transform: scaleY(1);
}

/*上の画面*/
.loader_cover-up {
	transform-origin: center top;
}

/*下の画面*/
.loader_cover-down {
	position: absolute;
	bottom: 0;
	transform-origin: center bottom;
}

/*クラス名がついたらY軸方向に0*/
.coveranime {
	transform: scaleY(0);
}

@media screen and (max-width: 768px) {
	#splash_text{
		height: 2px;
	}
	
	#splash_text .counter{
		font-size: 1.7rem;
	}
}

/* ===========================================
	hero
============================================== */
.hero_area {
	background-position: center;
	background-size: 1920px;
	background-repeat: repeat;
	background-image: url(../images/common/blue_bg.png);
}

.hero_inner {
	justify-content: center;
	align-items: center;
	column-gap: 3.8rem;
	padding-top: 8.7334rem;
}

.catch_wrap {
	flex-direction: column;
	align-items: center;
	row-gap: 3.1334rem;
	margin-bottom: 6.8667rem;
}

.hero_btn {
	position: relative;
}

.hero_btn:hover {
	opacity: 0.6;
}

.hero_btn::before,
.hero_btn::after {
	content: '';
	position: absolute;
	top: 100%;
	right: 0;
	left: 0;
	margin: auto;
	width: 3px;
	height: 13rem;
}

.hero_btn::before {
	background-color: #bababa;
}

.hero_btn::after {
	background-color: var(--black_color);
	animation: elasticus 2.5s cubic-bezier(1, 0, 0, 1) infinite;
}

@keyframes elasticus {
	0% {
		transform-origin: 0% 0%;
		transform: scale(1, 0);
	}
	50% {
		transform-origin: 0% 0%;
		transform: scale(1, 1);
	}
	50.1% {
		transform-origin: 0% 100%;
		transform: scale(1, 1);
	}
	100% {
		transform-origin: 0% 100%;
		transform: scale(1, 0);
	}
}

.hero_slider {
	position: relative;
}

.hero_wrap,
.hero_slider,
.hero_slider .swiper-wrapper,
.hero_slider .swiper-slide,
.hero_slider .swiper-slide > img {
	width: 69rem;
	height: auto;
	aspect-ratio: 345 / 203;
}

.hero_slider-swiper-pagination {
	position: absolute;
	top: auto !important;
	right: 1.334rem !important;
	bottom: 1.7334rem !important;
	left: auto !important;
	text-align: right;
	z-index: 1;
}

.hero_description {
	position: relative;
	display: flex;
	justify-content: flex-end;
	margin-top: -4.2rem;
	padding-right: 4.4rem;
	z-index: 1;
}

/* ============
	responsive
================ */
@media screen and (max-width: 1740px) {
	.catch_wrap {
		width: 28.334vw;
	}

	.hero_wrap,
	.hero_slider,
	.hero_slider .swiper-wrapper,
	.hero_slider .swiper-slide,
	.hero_slider .swiper-slide > img {
		width: 54vw;
		height: auto;
		aspect-ratio: 345 / 203;
	}

	.hero_slider .swiper-slide > img {
		object-fit: cover;
	}
}

@media screen and (max-width: 1440px) {
	.hero_wrap,
	.hero_slider,
	.hero_slider .swiper-wrapper,
	.hero_slider .swiper-slide,
	.hero_slider .swiper-slide > img {
		aspect-ratio: 704 / 503;
	}
}

@media screen and (max-width: 1024px) {
	.hero_inner {
		padding-top: 4.4667rem;
	}

	.hero_btn::before {
		height: 17vw;
	}

	.hero_description {
		margin-top: -3rem;
	}
}

@media screen and (max-width: 768px) {
	.hero_inner {
		flex-direction: column-reverse;
		row-gap: 2.9334rem;
	}

	.hero_wrap,
	.hero_slider,
	.hero_slider .swiper-wrapper,
	.hero_slider .swiper-slide,
	.hero_slider .swiper-slide > img {
		width: 100%;
		aspect-ratio: 125 / 89;
	}

	.hero_slider-swiper-pagination {
		top: 0.8667rem !important;
		right: 2rem !important;
		bottom: auto !important;
	}

	.hero_description {
		justify-content: center;
		padding-right: 0;
	}

	.hero_description > picture > img {
		max-width: 18.8rem;
		width: 100%;
	}

	.catch_wrap {
		margin-bottom: 5.8rem;
		width: 70vw;
		row-gap: 1.2667rem;
	}

	.catch_wrap picture img {
		width: 100vw;
		height: auto;
	}

	.hero_btn {
		width: 14rem;
		height: 3.65rem;
	}

	.hero_btn::before {
		height: 6rem;
	}
}

/* ===========================================
	news_ticker
============================================== */
.news_ticker_area {
	position: relative;
	margin-top: -6px;
	padding-top: 1.6rem;
	padding-bottom: 1.6rem;
	background-color: var(--black_color);
	overflow: hidden;
}

.news_ticker_area > ul,
.news_ticker_area > ul > li > a {
	display: flex;
	align-items: center;
}

.news_ticker_area > ul {
	column-gap: 1.6rem;
	width: calc(var(--scroll-width) * 2);
	white-space: nowrap;
	animation: infoAnimation 20s linear infinite;
}

.news_ticker_area > ul > li > a {
	column-gap: 1.0667rem;
	font-family: 'DotGothic16', sans-serif;
	font-size: 0.8667rem;
	color: var(--white_color);
}

.news_ticker_area > ul > li > a > h3 {
	font-weight: 400;
	font-size: 1.2rem;
	color: #72ff54;
	letter-spacing: 0.05em;
}

/* 横に流れていくアニメーション (ulに適用) */
@keyframes infoAnimation {
	0% {
		transform: translateX(0);
	}
	/* JavaScriptで計算した幅の分だけ移動させる */
	/* translateX(-100%)ではなく、translateX(負の --scroll-width)とする */
	100% {
		transform: translateX(calc(var(--scroll-width) * -1));
	}
}

/* ===========================================
	message
============================================== */
.message_area {
	position: relative;
	padding-top: 12.8rem;
	padding-bottom: 21.8rem;
	background-color: #badafb;
}

.message_area::before,
.message_area::after {
	content: '';
	position: absolute;
	left: 0;
	width: 100%;
	background-size: 128rem;
	background-repeat: repeat-x;
	z-index: 1;
}

.message_area::before {
	top: 0;
	height: 10.667rem;
	background-position: center top;
	background-image: url(../images/common/cloud.png);
}

.message_area::after {
	bottom: 0;
	height: 18rem;
	background-position: center bottom;
	background-image: url(../images/common/message_bg_town.png);
}

.message_inner {
	justify-content: center;
	column-gap: 3.6rem;
	position: relative;
	z-index: 2;
}

.message_ttl_h2 {
	align-items: center;
	column-gap: 1.0667rem;
	margin-bottom: 1.6rem;
	font-family: 'DotGothic16', sans-serif;
	font-weight: 400;
	font-size: 1.2667rem;
	color: #008933;
	letter-spacing: 0.05em;
}

.message_ttl_h3 {
	font-size: 1.9334rem;
	font-weight: 600;
	line-height: 1.8;
	letter-spacing: 0.05em;
}

.txt_wrap {
	width: 35.6rem;
}

.txt_wrap > p {
	font-size: 1.0667rem;
	line-height: 2.3;
}

/* ============
	responsive
================ */
@media screen and (max-width: 1440px) {
	.message_area::before,
	.message_area::after {
		background-size: contain;
	}
}

@media screen and (max-width: 1024px) {
	.message_area {
		padding-top: 7.4667rem;
		padding-bottom: 11.334rem;
	}

	.message_ttl_h2 {
		column-gap: 8px;
		margin-bottom: 1.0667rem;
		font-size: 1.2rem;
	}

	.message_ttl_h2 > img {
		width: 1.334rem;
		height: 1.9334rem;
	}

	.message_ttl_h3 {
		margin-bottom: 1.6rem;
		font-size: 1.5334rem;
		line-height: 1.6;
	}

	.txt_wrap > p {
		font-size: 1rem;
		line-height: 1.9;
	}
}

@media screen and (max-width: 768px) {
	.message_area::before,
	.message_area::after {
		background-size: 67.2rem;
	}

	.message_inner {
		flex-direction: column;
	}

	.txt_wrap {
		width: 100%;
	}
}

/* ===========================================
	about
============================================== */
.about_area {
	padding-top: 7rem;
	padding-bottom: 18.334rem;
	font-family: 'DotGothic16', sans-serif;
	color: var(--white_color);
	background-position: center;
	background-size: 1920px;
	background-color: #009337;
	background-image: url(../images/top/about_bg_pc.png);
}

.about_logo {
	margin-right: auto;
	margin-bottom: 2.1334rem;
	margin-left: auto;
}

.about_ttl,
.about_txt {
	text-align: center;
}

.about_ttl {
	margin-bottom: 1.334rem;
	font-weight: 400;
	font-size: 3.8rem;
	letter-spacing: 0.25em;
}

.about_txt {
	margin-bottom: 3.334rem;
	font-size: 2.4667rem;
	letter-spacing: 0.23em;
}

.btn_list {
	grid-template-columns: repeat(2, 16.1334rem);
	grid-template-rows: repeat(2, 4.7334rem);
	gap: 2.1334rem;
	justify-content: center;
}

.about_btn {
	display: flex;
	justify-content: center;
	align-items: center;
	padding-left: 1.6rem;
	font-size: 1.5334rem;
	font-weight: 400;
	color: var(--white_color);
	letter-spacing: 0.05em;
	border: solid 3px var(--white_color);
	border-radius: 5px;
}

.about_btn:hover {
	background-color: #027c30;
}

.about_btn > span {
	position: relative;
}

.about_btn > span::before {
	content: '';
	position: absolute;
	top: 0;
	left: -1.6rem;
	bottom: 0;
	margin: auto;
	width: 0.8rem;
	height: 1.2rem;
	background-position: center;
	background-size: contain;
	background-image: url(../images/common/triangle_white_icon.png);
}

/* ============
	responsive
================ */
@media screen and (max-width: 1024px) {
	.about_area {
		padding-top: 3.667rem;
		padding-bottom: 12rem;
		background-size: cover;
	}

	.about_logo {
		margin-bottom: 1.6rem;
	}

	.about_ttl {
		margin-bottom: 10px;
		font-size: 1.8667rem;
		letter-spacing: 0.25em;
	}

	.about_txt {
		margin-bottom: 2.667rem;
		font-size: 1rem;
		letter-spacing: 0.23em;
	}

	.btn_list {
		grid-template-columns: repeat(2, 10rem);
		grid-template-rows: repeat(2, 3.5334rem);
		gap: 1.334rem 1rem;
	}

	.about_btn {
		padding-left: 1rem;
		font-size: 0.9334rem;
		letter-spacing: 0.05em;
	}

	.about_btn > span::before {
		left: -1rem;
		width: 8px;
		height: 0.8rem;
	}
}

@media screen and (max-width: 480px) {
	.about_area {
		padding-bottom: 9.2667rem;
		background-image: url(../images/top/about_bg_sp.png);
	}

	.btn_list {
		margin-right: auto;
		margin-left: auto;
		max-width: 20.334rem;
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ===========================================
	profile
============================================== */
.profile_area {
	position: relative;
	padding-top: 7.334rem;
	padding-bottom: 13.334rem;
	font-family: 'DotGothic16', sans-serif;
	font-weight: 400;
	background-color: #b38b1b;
	z-index: 0;
}

.profile_area::before,
.profile_area::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	width: 100%;
	background-repeat: repeat-x;
	z-index: 1;
}

.profile_area::before {
	top: 0;
	height: 5.334rem;
	background-position: center top;
	background-size: 134.4467rem;
	background-image: url(../images/top/profile_top_img_pc.png);
}

.profile_area::after {
	bottom: 0;
	height: 17rem;
	background-position: center bottom;
	background-size: 144rem;
	background-image: url(../images/top/profile_bottom_pc.png);
}

.profile_area .container {
	position: relative;
	z-index: 2;
}

.company_ttl_h2,
.company_ttl_h3 {
	font-weight: 400;
	letter-spacing: 0.05em;
}

.company_ttl_h2 {
	margin-bottom: 6rem;
	font-size: 6.2667rem;
	color: #967005;
	text-align: center;
}

.company_ttl_h3 {
	position: relative;
	margin-bottom: 5.0667rem;
	font-size: 1.9334rem;
	color: var(--white_color);
	text-align: center;
}

.company_ttl_h3::after {
	content: '';
	position: absolute;
	top: 0;
	left: calc(50% - 50vw);
	bottom: 0;
	margin: auto;
	width: 100vw;
	height: 6.9334rem;
	background-position: center;
	background-size: 131.4667rem;
	background-image: url(../images/top/profile_ttl_bg_pc.png);
}

.company_cont {
	grid-template-columns: repeat(2, 1fr);
	gap: 3.334rem 2.667rem;
	margin-bottom: 5.8667rem;
}

.company_cont_item {
	padding: 1.334rem 2.667rem 2.2667rem;
	border: solid 3px var(--white_color);
	border-radius: 10px;
}

.company_ttl_h4 {
	margin-right: -2.667rem;
	margin-left: -2.667rem;
	margin-bottom: 2.667rem;
	padding-right: 2.667rem;
	padding-left: 2.667rem;
	padding-bottom: 1.4667rem;
	font-weight: 400;
	font-size: 1.5334rem;
	color: var(--white_color);
	letter-spacing: 0.05em;
	border-bottom: solid 3px var(--white_color);
}

.company_cont_wrap {
	flex-wrap: wrap;
	gap: 1.0667rem;
}

.company_cont_wrap dt,
.company_cont_wrap dd,
.company_cont_wrap li,
.company_cont_item_txt {
	font-weight: 400;
	font-size: 1.2667rem;
	color: var(--white_color);
	line-height: 1.6;
	letter-spacing: 0.025em;
}

.company_cont_wrap dt,
.company_cont_wrap dd,
.company_cont_wrap li {
	width: calc(50% - 0.5334rem);
}

.company_cont_wrap li {
	font-size: 1.2rem;
}

.company_cont_item_txt + .company_cont_item_txt {
	margin-top: 1.6rem;
}

.company_cont_item:nth-child(1) .company_cont_wrap {
	flex-direction: column;
	row-gap: 0;
}

.company_cont_item:nth-child(4) .company_cont_wrap {
	column-gap: 2.3rem;
}

.company_cont_item:nth-child(4) .company_cont_wrap dt {
	width: 5.2667rem;
}

.company_cont_item:nth-child(4) .company_cont_wrap dd {
	width: 19.334rem;
}

.profile_area .more_btn {
	margin-left: auto;
	margin-right: auto;
}

/* ============
	responsive
================ */
@media screen and (max-width: 1800px) {
	.profile_area::after {
		width: 100vw;
		height: 14vw;
		background-size: cover;
		background-position: center bottom;
	}
}

@media screen and (max-width: 1440px) {
	.company_ttl_h2 {
		font-size: min(
			max(39px, calc(2.4375rem + ((1vw - 4.8px) * 5.7292))),
			94px
		);
	}

	.company_ttl_h3::after {
		background-size: contain;
	}
}

@media screen and (max-width: 1024px) {
	.profile_area {
		padding-top: 5.2667rem;
		padding-bottom: 15.8667rem;
	}

	.profile_area::before {
		height: 4.2rem;
		background-position: left top;
		background-size: contain;
	}

	.company_ttl_h2 {
		margin-bottom: 3.2rem;
	}

	.company_ttl_h3 {
		margin-bottom: 10rem;
		font-size: 1.4667rem;
	}

	.company_ttl_h3::after {
		top: 6.2rem;
		height: 10vw;
		background-position: center top;
		background-size: cover;
		background-image: url(../images/top/profile_ttl_bg_sp.png);
	}

	.company_cont {
		gap: 1.334rem;
	}

	.company_cont_item {
		padding: 1.5334rem 1.8rem 1.1334rem;
	}

	.company_ttl_h4 {
		margin-right: -1.8rem;
		margin-bottom: 1.2667rem;
		margin-left: -1.8rem;
		padding-right: 1.6rem;
		padding-left: 1.6rem;
		font-size: 1.2rem;
	}

	.company_cont_wrap dt,
	.company_cont_wrap dd,
	.company_cont_wrap li,
	.company_cont_item_txt {
		font-size: 1.0667rem;
	}

	.company_cont_item:nth-child(4) .company_cont_wrap dd,
	.company_cont_item:nth-child(4) .company_cont_wrap dd > img {
		max-width: 16.9334rem;
		width: 100%;
	}
}

@media screen and (max-width: 768px) {
	.profile_area::after {
		height: 11.334rem;
		background-position: bottom center;
		background-size: 56rem;
		background-image: url(../images/top/profile_bottom_sp.png);
	}

	.company_cont {
		grid-template-columns: 1fr;
	}

	.company_cont_item:nth-child(1) .company_cont_wrap {
		flex-direction: row;
		gap: 1.2rem 0;
	}

	.company_cont_item:nth-child(1) .company_cont_wrap .flex_box {
		flex-direction: column;
		width: 50%;
	}

	.company_cont_item:nth-child(1) .company_cont_wrap .flex_box dt,
	.company_cont_item:nth-child(1) .company_cont_wrap .flex_box dd {
		width: 100%;
	}

	.company_cont_item:nth-child(1) .company_cont_wrap .flex_box dt {
		font-size: 0.9334rem;
	}

	.company_cont_item:nth-child(4) .company_cont_wrap {
		flex-wrap: wrap;
	}

	.company_cont_item:nth-child(4) .company_cont_wrap dt {
		width: 30%;
	}

	.company_cont_item:nth-child(4) .company_cont_wrap dd {
		width: 60%;
	}
}

@media screen and (max-width: 480px) {
	.profile_area::before {
		background-size: 56rem;
		background-image: url(../images/top/profile_top_img_sp.png);
	}

	.profile_area::after {
		background-position: bottom right -18rem;
	}

	.company_ttl_h3::after {
		height: 4.4rem;
		background-position: center top;
		background-size: 46.9334rem;
	}

	.company_cont {
		margin-bottom: 4.8rem;
	}

	.company_cont_item:nth-child(4) .company_cont_wrap {
		flex-direction: column;
		row-gap: 1.0667rem;
	}

	.company_cont_item:nth-child(4) .company_cont_wrap dt,
	.company_cont_item:nth-child(4) .company_cont_wrap dd {
		width: 100%;
	}

	.company_cont_item:nth-child(4) .company_cont_wrap dd {
		margin-top: -0.75rem;
	}
}

/* ===========================================
	data
============================================== */
.data_area {
	position: relative;
	font-family: 'DotGothic16', sans-serif;
	font-weight: 400;
	background-image: url(../images/top/data_bg.png);
	background-repeat: repeat;
	background-position: top;
	background-size: 15.7334rem;
}

.data_cont {
	margin-right: auto;
	margin-left: auto;
	padding-top: 2.667rem;
	max-width: 96rem;
	width: 100%;
	background-color: #e6e6e6;
}

.data_ttl_h2 {
	margin-bottom: 6.667rem;
	font-weight: 400;
	font-size: 6.2667rem;
	color: var(--white_color);
	text-align: center;
	letter-spacing: 0.05em;
}

.data_ttl_h3 {
	margin-bottom: 5.0667rem;
	font-weight: 400;
	font-size: 1.9334rem;
	text-align: center;
	letter-spacing: 0.05em;
}

.data_cont_wrap {
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: repeat(4, 24.334rem);
	gap: 2.667rem 3.334rem;
	margin-bottom: 8rem;
}

.data_item {
	padding: 2.667rem 1.5rem 1.6rem;
	border: solid 7px #c3c3c3;
	background-color: var(--white_color);
}

.data_ttl_h4 {
	margin-bottom: 1.5334rem;
	font-weight: 400;
	font-size: 1.5334rem;
	text-align: center;
	letter-spacing: 0.05em;
}

.number_txt {
	margin-bottom: 1.5rem;
	font-size: 6.2667rem;
	color: #9c0306;
	text-align: center;
	letter-spacing: 0.05em;
}

.data_item:nth-child(10) .number_txt {
	font-size: 5.1334rem;
}

.number_txt > span {
	font-size: 2.667rem;
	color: #222;
}

.note {
	font-size: 1.2rem;
	letter-spacing: 0.05em;
	line-height: 1.3;
	text-align: center;
}

.data_item_img_wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 9.334rem;
}

.note + .data_item_img_wrap {
	margin-top: 1.9334rem;
	height: 4rem;
}

.data_item_icon {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-right: auto;
	margin-left: auto;
	width: 14.667rem;
	height: 5.5rem;
}

.data_item_sp_img {
	display: none;
}

/* ============
	responsive
================ */
@media screen and (max-width: 1460px) {
	.data_cont {
		max-width: none;
		width: calc(100% - 2rem);
	}
}

@media screen and (max-width: 1440px) {
	.data_ttl_h2 {
		font-size: min(
			max(39px, calc(2.4375rem + ((1vw - 4.8px) * 5.7292))),
			94px
		);
	}

	.number_txt {
		font-size: min(
			max(53px, calc(3.3125rem + ((1vw - 4.8px) * 4.2708))),
			94px
		);
	}

	.number_txt > span {
		font-size: min(
			max(18px, calc(1.125rem + ((1vw - 4.8px) * 2.2917))),
			40px
		);
	}

	.note {
		font-size: min(
			max(11px, calc(0.6875rem + ((1vw - 10.24px) * 1.6827))),
			18px
		);
	}
}

@media screen and (max-width: 1140px) {
	.data_cont_wrap {
		gap: 1rem;
	}
}

@media screen and (max-width: 1024px) {
	.data_ttl_h2 {
		margin-bottom: 2.667rem;
	}

	.data_ttl_h3 {
		margin-bottom: 3.2667rem;
		font-size: 1.4667rem;
	}

	.data_cont_wrap {
		grid-template-rows: repeat(4, 1fr);
		margin-bottom: 2.667rem;
	}

	.data_item {
		padding: 1.334rem 5px 9px;
	}

	.data_ttl_h4 {
		margin-bottom: 8px;
		font-size: 0.9334rem;
	}

	.number_txt {
		margin-bottom: 0.8rem;
	}

	.data_item:nth-child(10) .number_txt {
		font-size: min(
			max(43px, calc(2.6875rem + ((1vw - 7.68px) * 13.2813))),
			77px
		);
	}
}

@media screen and (max-width: 900px) {
	.data_cont_wrap {
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(6, 1fr);
	}

	.note + .data_item_img_wrap {
		margin-top: 0;
		height: 9.334rem;
	}
}

@media screen and (max-width: 768px) {
	.data_item {
		border: solid 3px #c3c3c3;
	}
}

@media screen and (max-width: 640px) {
	.data_cont_wrap {
		grid-template-rows: auto;
	}

	.data_item:nth-child(3),
	.data_item:nth-child(12),
	.data_item:nth-child(13) {
		grid-column: 1 / 3;
		display: flex;
		justify-content: center;
		align-items: center;
		column-gap: 1.334rem;
	}

	.data_item:nth-child(3) {
		column-gap: 9px;
	}

	.data_item:nth-child(3) {
		grid-row: 2 / 3;
	}

	.data_item:nth-child(3) .data_item_txt_wrap {
		width: 9.8rem;
	}

	.data_item_sp_img {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.data_item:nth-child(3) .data_item_img_wrap,
	.data_item:nth-child(12) .data_item_img_wrap,
	.data_item:nth-child(13) .data_item_img_wrap {
		grid-column: 1 / 3;
	}

	.data_item_txt_wrap,
	.data_item:nth-child(12) .data_item_icon,
	.data_item:nth-child(13) .data_item_icon {
		width: 6rem;
	}

	.data_item:nth-child(3) .data_ttl_h4,
	.data_item:nth-child(13) .data_ttl_h4 {
		text-align: left;
		line-height: 1.3;
	}

	.data_ttl_h4 .mb_br {
		display: block;
	}
}

@media screen and (max-width: 480px) {
	.data_area {
		background-size: 15.7334rem;
	}

	.data_cont_wrap {
		grid-template-columns: repeat(2, calc(50% - 0.5rem));
	}

	.data_item:nth-child(3) {
		padding-right: 11px;
		padding-left: 11px;
	}

	.data_item:nth-child(12),
	.data_item:nth-child(13) {
		padding-right: 2rem;
		padding-left: 1.334rem;
	}

	.data_item:nth-child(5) .number_txt,
	.data_item:nth-child(10) .number_txt {
		font-size: 2.8667rem;
	}

	.data_item:nth-child(3) .data_item_img_wrap {
		width: calc(100% - 7.334rem);
	}

	.data_item_img_wrap,
	.note + .data_item_img_wrap {
		min-height: 3.7334rem;
		height: auto;
	}

	.data_item .data_item_img_wrap > img {
		height: auto;
	}

	.data_item:nth-child(1) .data_item_img_wrap > img {
		width: 2.667rem;
	}

	.data_item:nth-child(2) .data_item_img_wrap > img {
		width: 5.334rem;
	}

	.data_item:nth-child(3) .data_item_img_wrap,
	.data_item:nth-child(3) .data_item_img_wrap > img {
		width: 9.2667rem;
	}

	.data_item:nth-child(4) .data_item_img_wrap > img {
		width: 3.667rem;
	}

	.data_item:nth-child(5) .data_item_img_wrap > img {
		width: 2.5334rem;
	}

	.data_item:nth-child(6) .data_item_img_wrap > img {
		width: 2.667rem;
	}

	.data_item:nth-child(7) .data_item_img_wrap > img {
		width: 8.5667rem;
	}

	.data_item:nth-child(8) .data_item_img_wrap > img {
		width: 5.8rem;
	}

	.data_item:nth-child(9) .data_item_img_wrap > img {
		width: 6.8667em;
	}

	.data_item:nth-child(10) .data_item_img_wrap > img {
		width: 3.8em;
	}

	.data_item:nth-child(12) .data_item_img_wrap,
	.data_item:nth-child(12) .data_item_img_wrap > img,
	.data_item:nth-child(13) .data_item_img_wrap,
	.data_item:nth-child(13) .data_item_img_wrap > img {
		width: 10.334em;
	}
}

/* ===========================================
	work
============================================== */
.work_area {
	font-family: 'DotGothic16', sans-serif;
	font-weight: 400;
	background-image: url(../images/top/work_grass_img.png);
	background-position: center top;
	background-size: 143.7334rem;
	background-repeat: repeat;
}

.work_area .container {
	padding-top: 2.4rem;
	padding-bottom: 7.0667rem;
	background-image: url(../images/top/work_road_img_pc.png);
	background-position: center top;
	background-size: 82.667rem;
	background-repeat: repeat-y;
}

.work_ttl_h2 {
	margin-bottom: 6.9334rem;
	font-weight: 400;
	font-size: 6.2667rem;
	color: #cfcfcf;
	letter-spacing: 0.05em;
	text-align: center;
}

.work_ttl_h3 {
	margin-bottom: 3.7334rem;
	font-weight: 400;
	font-size: 1.9334rem;
	color: var(--black_color);
	letter-spacing: 0.05em;
	text-align: center;
}

.support_cont {
	justify-content: center;
	align-items: center;
	column-gap: 2.5334rem;
	margin-right: auto;
	margin-bottom: 4.2667rem;
	margin-left: auto;
	padding: 1.334rem 1.8rem;
	width: 41.6rem;
	background-color: rgba(165, 232, 78, 0.92);
	border-radius: 10px;
}

.support_txt {
	font-weight: 400;
	font-size: 1.2667rem;
	letter-spacing: 0.05em;
	line-height: 1.6;
}

.work_cont {
	grid-template-columns: repeat(2, 1fr);
	grid-template-rows: repeat(2, 1fr);
	gap: 4.8rem 6.9334rem;
	margin-right: auto;
	margin-bottom: 5.2667rem;
	margin-left: auto;
	max-width: 62.9334rem;
	width: 100%;
}

.work_cont_item {
	flex-direction: column;
	align-items: center;
	padding: 3rem 5rem;
	border: solid 7px #a8a8a8;
	background-color: var(--white_color);
}

.work_ttl_h4 {
	margin-bottom: 1.6rem;
	font-weight: 400;
	font-size: 1.667rem;
}

.work_cont_img_wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 2.8rem;
	width: 5rem;
	height: 5.0667rem;
	flex-grow: 1.5;
}

.work_cont_item {
	flex-grow: 2;
}

.work_cont_txt {
	margin-bottom: 2.1334rem;
	font-family: 'IBM Plex Sans JP', sans-serif;
	font-weight: 400;
	font-size: 1rem;
	line-height: 1.8;
}

.work_cont_item .black_btn {
	max-width: 16rem;
	width: 100%;
	height: 3.667rem;
	font-size: 1.2667rem;
	border: solid 2px #e7e7e7;
	border-radius: 5px;
}

.work_cont_item .black_btn::before {
	left: 3.2rem;
}

.work_slider {
	display: none;
}

.job_change {
	margin-right: auto;
	margin-bottom: 5.8667rem;
	margin-left: auto;
	padding: 4.667rem 2.6rem 1.8667rem 4.1334rem;
	max-width: 69.334rem;
	width: 100%;
	border: solid 5px #b28918;
	background-color: #fbffda;
	border-radius: 5px;
}

.job_change_cont {
	max-width: 33.334rem;
	width: 100%;
}

.job_change_ttl_h4 {
	margin-bottom: 2.1334rem;
}

.job_change_ttl_h5 {
	margin-bottom: 1.0667rem;
	font-family: 'IBM Plex Sans JP', sans-serif;
	font-weight: 600;
	font-size: 1.9334rem;
	letter-spacing: 0.05em;
}

.job_change_txt {
	font-family: 'IBM Plex Sans JP', sans-serif;
	font-weight: 500;
	font-size: 1rem;
	line-height: 1.8;
}

.job_change_img_scroll {
	overflow: visible;
}

.work_area .more_btn {
	margin-right: auto;
	margin-left: auto;
}

.work_area .more_btn::before {
	left: 6.9334rem;
}

.job_change_img_wrap {
	justify-content: flex-end;
	margin-top: -11.334rem;
}

/* ============
	responsive
================ */
@media screen and (max-width: 1440px) {
	.work_ttl_h2 {
		font-size: min(
			max(39px, calc(2.4375rem + ((1vw - 4.8px) * 5.7292))),
			94px
		);
	}
}

@media screen and (max-width: 1280px) {
	.work_area .container {
		padding-right: 4rem;
		padding-left: 4rem;
		width: calc(100% - 2rem);
		background-size: 100%;
	}

	.work_cont {
		grid-template-columns: repeat(2, calc(50% - 3.4667rem));
	}
}

@media screen and (max-width: 1140px) {
	.job_change_img_wrap {
		margin-top: 0;
	}
}

@media screen and (max-width: 1024px) {
	.work_area .container {
		padding-top: 5.334rem;
	}

	.work_ttl_h2 {
		margin-bottom: 2.4rem;
	}

	.work_ttl_h3 {
		margin-bottom: 3.2667rem;
		font-size: 1.4667rem;
	}

	.support_cont {
		margin-bottom: 2.667rem;
	}

	.work_cont {
		grid-template-columns: repeat(2, calc(50% - 0.667rem));
		gap: 1.334rem;
	}

	.work_cont_item {
		padding: 2.1334rem 1.8667rem;
	}

	.work_ttl_h4 {
		font-size: 1.4rem;
	}

	.work_cont_img_wrap {
		margin-bottom: 1.334rem;
	}

	.job_change {
		width: 100vw;
		margin-right: -5rem;
		margin-left: -5rem;
		padding: 4.2667rem 5rem 4.9334rem;
		border-right: 0;
		border-left: 0;
		border-radius: 1rem;
	}

	.job_change_cont {
		max-width: none;
		width: 100%;
	}

	.job_change_ttl_h4 {
		margin-bottom: 2.667rem;
	}

	.job_change_ttl_h4 > img {
		margin-right: auto;
		margin-left: auto;
	}

	.job_change_ttl_h5 {
		font-size: 1.5334rem;
		line-height: 1.6;
	}
}

@media screen and (max-width: 768px) {
	.work_area .container {
		padding-right: 2.2rem;
		padding-left: 2.2rem;
	}

	.support_cont > img {
		width: 2.1334rem;
	}

	.support_cont {
		flex-direction: column;
		row-gap: 8px;
		padding-right: 2.0667rem;
		padding-left: 2.0667rem;
		width: 100%;
		border-radius: 5px;
	}

	.support_txt {
		font-size: 1rem;
		line-height: 1.6;
		letter-spacing: 0.05em;
	}

	.work_cont_img_wrap {
		width: 5rem;
		height: 4rem;
	}

	.work_cont_item .work_cont_img_wrap > img,
	.work_slider .swiper-slide .work_cont_img_wrap > img {
		height: auto;
	}

	.work_cont_item:nth-child(1) .work_cont_img_wrap > img,
	.work_slider .swiper-slide:nth-child(1) .work_cont_img_wrap > img {
		width: 2.1334rem;
	}

	.work_cont_item:nth-child(2) .work_cont_img_wrap > img,
	.work_slider .swiper-slide:nth-child(2) .work_cont_img_wrap > img {
		width: 5rem;
	}

	.work_cont_item:nth-child(3) .work_cont_img_wrap > img,
	.work_slider .swiper-slide:nth-child(3) .work_cont_img_wrap > img {
		width: 4.7334rem;
	}

	.work_cont_item:nth-child(4) .work_cont_img_wrap > img,
	.work_slider .swiper-slide:nth-child(4) .work_cont_img_wrap > img {
		width: 2.6rem;
	}

	.work_cont_txt {
		margin-bottom: 0.8rem;
	}

	.work_cont_item {
		border: solid 3px #a8a8a8;
	}

	.work_cont_item .black_btn {
		font-size: 1.1334rem;
	}

	.work_cont_item .black_btn::before {
		left: 3vw;
		padding-left: 2.0667rem;
		width: 11px;
		height: 1.0667rem;
	}

	.job_change {
		margin-right: -3.2rem;
		margin-left: -3.2rem;
		padding-right: 3.2rem;
		padding-left: 3.2rem;
	}

	.work_area .more_btn {
		height: 5.0667rem;
	}

	.work_area .more_btn::before {
		left: 3.2rem;
	}
}

@media screen and (max-width: 640px) {
	.work_area .container {
		background-image: url(../images/top/work_road_img_sp.png);
	}

	.work_cont {
		display: none;
	}

	.work_slider {
		display: block;
		position: relative;
		margin-bottom: 4.4rem;
		padding-bottom: 2.2667rem;
		overflow: visible;
	}

	.work_slider .swiper-slide:not(:last-child) {
		width: 19.667rem !important;
	}

	.work_slider .swiper-slide:last-child,
	.work_slider .work_cont_item {
		width: 18.334rem !important;
	}

	.work_slider-button-next,
	.work_slider-button-prev {
		position: absolute;
		top: 10.4667rem;
		z-index: 1;
	}

	.work_slider-button-next {
		right: -2rem;
	}

	.work_slider-button-prev {
		left: -2rem;
	}

	.work_slider-swiper-pagination {
		position: absolute;
		bottom: 0 !important;
		text-align: center;
	}

	.job_change {
		padding-right: 2rem;
		padding-left: 2rem;
	}

	.job_change_img_scroll {
		margin-right: -2rem;
		margin-left: -2rem;
		width: calc(100% + 4rem);
		overflow: scroll;
	}

	.job_change_img_wrap {
		padding-right: 2rem;
		padding-left: 2rem;
		width: 40.667rem !important;
	}

	.job_change_img_wrap > img {
		width: 40.667rem !important;
		height: auto;
	}
}