@charset "UTF-8";
/*
Theme Name:   GeneratePress Child
Theme URI:    https://generatepress.com/
Description: 子テーマ（GeneratePress 用）
Template:    generatepress
*/

/* =====================================================
□ 共通（PC・スマホ共通）
===================================================== */

section {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity .8s ease, transform .8s ease;
	margin-bottom: 80px !important;
}
section.is-show {
	opacity: 1;
	transform: translateY(0);
}
section h2 {
	margin-bottom: 40px !important;
	letter-spacing: 0.1rem;
	text-align: center;

}
section .c-subtitle {
	justify-content: center;
	padding-right: 16px;
	margin-bottom: 1rem;
}

/* カラムの場合は：左寄せ */
section .c-inner > div > h2 {
	text-align: left;

}

section .c-inner > div > .c-subtitle {
	justify-content: flex-start;
	padding-right: 0;
}
.c-inner {
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	padding:80px;
}
.c-subtitle .text {
	font-size: var(--font-size-body) !important;
	font-weight: var(--font-weight-heading);
	letter-spacing: 0.15rem;
}

/* ボタン */
.wp-block-button {
	margin-top:48px;
	text-align:center;
}

/* ヒーロー */
.front-hero {
	position: relative;
	isolation: isolate;
}

.front-hero__copy {
	position: absolute;
	z-index: 1;
	top: 40%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: max-content;
	max-width: calc(100% - 32px);
	margin: 0;
	padding: 28px 16px;
	color: #222;
	font-family: var(--font-body);
	font-size: clamp(1.625rem, 3.6vw, 3.5rem);
	font-weight: var(--font-weight-display);
	line-height: 1.5;
	letter-spacing: .04em;
	text-align: center;
	text-shadow: 0 0 6px #fff, 0 0 18px #fff, 0 0 32px #fff;
	pointer-events: none;
}

.front-hero__copy span {
	display: block;
}

#heroCanvas2 {
	display: block;
	width: 100%;
	height: var(--hero-height, calc(100svh - 65px));
	overflow:hidden;
}

/* 事業紹介 */
.front-business h3 {
	text-align: center;
	color: var(--text);
	margin-bottom: 90px;
	letter-spacing: 0.02em;

}
.front-business .grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 10px;
}
.front-business .card {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	color: inherit;
}
.front-business .thumb {
	position: relative;
	aspect-ratio: 4 / 3;
	background: linear-gradient(135deg, #eef1f6, #dde3ec);
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 0.5rem;
	transition: transform 0.35s ease, box-shadow 0.35s ease;
}
.front-business .card:hover .thumb {
	transform: translateY(-4px);
	box-shadow: 0 7px 14x rgba(26, 43, 74, 0.14);
}
.front-business .thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.front-business .thumb .placeholder-icon {
	width: 44px;
	height: 44px;
	opacity: 0.35;
}
.front-business .thumb .placeholder-label {
	position: absolute;
	bottom: 10px;
	left: 10px;
	font-size: 0.6875rem;
	color: var(--sub);
	background: rgba(255,255,255,0.85);
	padding: 3px 8px;
	letter-spacing: 0.04em;
}
.front-business .caption {
	text-align: center;
	margin-top: 22px;
	font-size: var(--font-size-body);
	font-weight: var(--font-weight-heading);
	color: var(--text);
	letter-spacing: 0.02em;
}
.front-business .caption small {
	display: block;
	margin-top: 6px;
	font-size: 0.7813rem;
	font-weight: var(--font-weight-body);
	color: var(--sub);
	letter-spacing: 0.01em;
}

/* ニュース */
.news-archive {
	display: flex;
	flex-direction: column;
	gap: 24px;
}
.news-card {
	width: 100%;
}
.news-card-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 32px 40px;
	border-radius: 24px;
	background-color: var(--color-gray-100);
	color: inherit;
	text-decoration: none;
	transition: background-color var(--transition);
}
.news-card-inner:hover {
	background-color: var(--color-gray-200);
}
.news-card-content {
	flex: 1;
	min-width: 0;
}
.news-card-arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	min-width: 48px;
	border-radius: 50%;
	background-color: #ffffff;
	color: var(--color-gray-800);
	flex-shrink: 0;
	text-decoration: none;
}
.news-card .entry-header {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.news-card .news-meta {
	justify-content: flex-start;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	margin: 0;
}
.news-card .news-time {
	order: 1;
	width: auto;
	font-weight: var(--font-weight-semibold);
	font-size: var(--font-size-small);
	color: var(--color-green);
}
.news-card .news-labels {
	order: 2;
	gap: 8px;
}
.news-card .label {
	padding: 4px 14px;
	background-color: #ffffff;
	color: var(--color-green);
	font-size: var(--font-size-caption);
	font-weight: var(--font-weight-heading);
}
.news-card .entry-title {
	margin: 0;
	color: var(--color-gray-800);

}
.news-meta {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10%;
	margin: 40px 0;
}
.news-meta .label {
	display: inline-block;
	max-width: 100%;
	padding: 10px 32px;
	border-radius: 999px;
	font-size: calc(1rem * 10 / 12);
	line-height: calc(1em * 60 / 40);
	text-decoration: none;
	text-align: center;
	white-space: nowrap;
	color: #171C1A66;
	background-color: #f0f2f1ff;
	transition: background-color var(--transition), color var(--transition);
}
.news-meta .news-labels {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 12px;
}
.news-meta time {
	width: 80px;
	font-family: var(--font-latin);
	font-size: var(--font-size-small);
	font-weight: var(--font-weight-heading);
	line-height: 2.4;
	white-space: nowrap;
	color: #bbb;
	text-align: center;
}
/* HOME：WBについて */
.front-company .c-inner > div:first-child {
    position: relative;
    isolation: isolate;
}

/* 建物画像：既存の位置を維持 */
.front-company .c-inner > div:first-child::after {
    content: "";
    position: absolute;
    top: 80px;
    left: 0;
    width: 80%;
    aspect-ratio: 16 / 9;
    background: url('../../../../uploads/company-hero-02.png')
        no-repeat left top / contain;
    z-index: 1;
    -webkit-mask-image: none;
    mask-image: none;
}

/* HOME：建物背面の装飾 */
.front-company .c-inner > div:first-child::before {
    content: "";
    position: absolute;
    top: 120px;
    left: 20px;
    width: 72%;
    height: 178px;
    background: #f2f3f6;
    border-radius: 120px 24px 100px 24px;
    z-index: 0;
    pointer-events: none;
}
.front-company .c-inner {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}
.front-company .list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0 40px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.front-company .list li {
	border-bottom: 1px solid var(--color-gray-300);
}
.front-company .list li a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 58px;
	padding: 0 12px;
	font-size: var(--font-size-body);
	font-weight: var(--font-weight-semibold);
	color: var(--color-gray-800);
	text-decoration: none;
	transition: background-color .3s ease;
}
.front-company .list li a::after {
	content: "→";
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	box-sizing: border-box;
	border: 1px solid var(--color-gray-300);
	border-radius: 50%;
	background: #fff;
	color: var(--color-gray-300);
	font-size: var(--font-size-body);
	line-height: 1;
	transition: background-color .3s ease, color .3s ease;
}
.front-company .list li a:hover {
	background-color: color-mix(in srgb, var(--color-gray-300) 20%, transparent);
}
.front-company .list li a:hover::after {
	border: 1px solid #fff;
}

/* サスティナブル */
.front-sustainability .c-inner {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	max-width: 1080px;
	margin: 0 auto;
	border-radius: 24px;
	background-color: var(--color-gray-100);
	overflow: hidden;
}
.front-sustainability .c-inner::before {
	content: "● SUSTAINABILITY";
	position: absolute;
	top: 50%;
	left: 40px;
	height: 180px;
	padding-left: 25px;
	border-left: 1px solid #ccc;
	transform: translateY(-50%) rotate(180deg);
	writing-mode: vertical-rl;
	font-size: var(--font-size-caption);
	font-weight: var(--font-weight-heading);
	line-height: 1;
	letter-spacing: 0.1em;
	white-space: nowrap;
	color: var(--color-green);
}
.front-sustainability .c-inner::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 8%;
	width: 34%;
	aspect-ratio: 1 / 1;
	transform: translateY(-50%);
	background: url("../../../../uploads/frontpage-sustainability-01.png") no-repeat center / contain;
}
.front-sustainability .sustainability-text {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50%;
}
.front-sustainability .sustainability-text__inner {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.front-sustainability .wp-block-button {
	text-align: left;
}

/* 採用情報 */
.front-recruit {
	position: relative;
	background: #fff;
}
.front-recruit .c-inner {
	padding:120px 80px 120px;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}
.front-recruit .c-inner:before {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		url('../../../../uploads/recruit-hero-01.png');
	background-repeat: no-repeat;
	background-position: top center;
	background-size: cover;
	z-index: -1;
}
.front-recruit .list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0 40px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.front-recruit .list li {
	border-bottom: 1px solid var(--color-gray-300);
}
.front-recruit .list li a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 58px;
	padding: 0 12px;
	font-size: var(--font-size-body);
	font-weight: var(--font-weight-semibold);
	color: var(--color-gray-800);
	text-decoration: none;
	transition: background-color .3s ease;
}
.front-recruit .list li a::after {
	content: "→";
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	box-sizing: border-box;
	border: 1px solid var(--color-gray-300);
	border-radius: 50%;
	background: #fff;
	color: var(--color-gray-300);
	font-size: var(--font-size-body);
	line-height: 1;
	transition: background-color .3s ease, color .3s ease;
}
.front-recruit .list li a:hover {
	background-color: color-mix(in srgb, var(--color-gray-300) 20%, transparent);
}
.front-recruit .list li a:hover::after {
	border: 1px solid #fff;
}

/* ストーリースライダー：トップ・一覧共通 */
.js-stories-swiper .swiper-slide > .stories-coming-soon {
	display:grid;
	place-items:center;
	aspect-ratio:16 / 9;
	min-height:280px;
	border-radius:8px;
	background:var(--color-gray-200);
	color:var(--color-gray-400);
	font-family: var(--font-display);
	font-size: var(--font-size-h4);
	font-weight: var(--font-weight-heading);
	letter-spacing:.08em;
}
/*　スライダー　*/
.stories-slider {
	width:calc(100% + (50vw - 50%) * 2);
	margin-left:calc(50% - 50vw);
	margin-right:calc(50% - 50vw);
	overflow:hidden;
	padding-top:24px;
}
.js-stories-swiper {
	width:100%;
	overflow:hidden;
}
.js-stories-swiper .swiper-wrapper {
	box-sizing:border-box;
	display:flex;
}
.js-stories-swiper .swiper-slide {
	width:calc(100% - 40px);
	max-width:720px;
	height:auto;
	flex-shrink:0;
	margin:0;
}
.stories-feature {
	--feature-marker: rgba(9, 111, 200, .8);
	--feature-title-color: #fff;
	position:relative;
	display:block;
	aspect-ratio:16 / 9;
	min-height:280px;
	overflow:hidden;
	border-radius:8px;
	background:#f0f2f4;
	color:#fff;
	text-decoration:none;
	isolation:isolate;
}
.stories-feature__image {
	position:absolute;
	inset:0;
	display:block;
	width:100%;
	height:100%;
	box-sizing:border-box;
	object-fit:cover;
}
.stories-feature::before,
.stories-feature::after {
	content:"";
	position:absolute;
	z-index:1;
	pointer-events:none;
}
.stories-feature__number {
	position:absolute;
	z-index:2;
	top:12px;
	left:12px;
	padding:8px 10px;
	background:#fff;
	border:1px solid #000;
	text-align:center;
	font-family: var(--font-display);
	font-size: var(--font-size-small);
	font-weight: var(--font-weight-display);
	letter-spacing:.05em;
	color:var(--color-blue);
}
.stories-feature__series {
	display:block;
	color:#000;
	margin-top:6px;
	padding-top:6px;
	border-top:1px solid var(--color-blue);
	font-family: var(--font-body);
	font-size: .65rem;
	font-weight: var(--font-weight-heading);
	line-height:1.5;
	letter-spacing:.03em;
}
.stories-feature__number::after,
.stories-feature__copy::after {
	content:"";
	position:absolute;
	right:0;
	bottom:0;
	clip-path:polygon(100% 0, 100% 100%, 0 100%);
	pointer-events:none;
}
.stories-feature__number::after {
	width:12px;
	height:12px;
	background:#000;
}
.stories-feature__copy::after {
	width:24px;
	height:24px;
	background:#00a6d9;
}
.stories-feature__copy {
	position:absolute;
	z-index:2;
	left:0;
	right:auto;
	width:fit-content;
	max-width:85%;
	bottom:0;
}
.stories-feature__title {
	display:block;
	padding:0 0 20px;
	box-sizing:border-box;
	letter-spacing:.02em;
	color:var(--feature-title-color);

}
.stories-feature__marker {
	padding:.12em .35em;
	background:var(--feature-marker);
	-webkit-box-decoration-break:clone;
	box-decoration-break:clone;
}
.stories-feature__tags {
	position:absolute;
	z-index:2;
	top:14px;
	left:max(120px, 32%);
	right:100px;
	display:flex;
	flex-wrap:wrap;
	gap:6px;
	margin:0;
	padding:0;
	font-size: var(--font-size-caption);
	font-weight: var(--font-weight-semibold);
	line-height:1.5;
	letter-spacing:0;
}
.stories-feature__tags > span {
	padding:3px 8px;
	background:rgba(255,255,255,.92);
	color:var(--color-gray-800);
}
/* 試作・挑戦：右下から曲線を差し込み、写真の中央を見せる */
.stories-feature--trial::before,
.stories-feature--product::before {
	inset:auto;
	top:0;
	left:0;
	width:30%;
	height:42%;
	background:radial-gradient(ellipse 100% 100% at 100% 100%, transparent 0 99.5%, #a6d8e8 100%);
	clip-path:none;
}
.stories-feature--trial::after {
	top:auto;
	right:0;
	bottom:0;
	left:auto;
	width:48%;
	height:52%;
	border:0;
	border-radius:0;
	background:radial-gradient(ellipse 100% 100% at 0 0, transparent 0 99.5%, #a6d8e8 100%);
}
/* 技術・工程：方眼と黒ベタの文字ボックス */
.stories-feature--technology {
	--feature-marker: transparent;
	--feature-title-color: #fff;
	background:#eaf1f6;
}
.stories-feature--technology::before {
	inset:auto;
	left:0;
	bottom:0;
	width:45%;
	height:24px;
	background:repeating-linear-gradient(45deg, transparent 0 11px, rgba(9, 111, 200, .6) 11px 12px), repeating-linear-gradient(135deg, transparent 0 11px, rgba(9, 111, 200, .6) 11px 12px);
	clip-path:none;
}
.stories-feature--technology::after {
	content:none;
}
.stories-feature__stripes {
	position:absolute;
	z-index:2;
	top:0;
	right:0;
	width:120px;
	height:120px;
	border:0;
	border-radius:0;
	background:repeating-linear-gradient(45deg, transparent 0 6px, #fff 6px 7px);
	clip-path:polygon(0 0, 100% 0, 100% 100%);
	filter:none;
	pointer-events:none;
}
.stories-feature__stripes--bottom {
	top:auto;
	bottom:0;
	width:72px;
	height:72px;
	background:repeating-linear-gradient(-45deg, transparent 0 6px, #00a6d9 6px 7px);
	clip-path:polygon(100% 0, 100% 100%, 0 100%);
	filter:none;
}
.stories-feature--technology .stories-feature__copy {
	bottom:24px;
	max-width:74%;
}
.stories-feature--technology .stories-feature__title {
	padding:20px 24px;
	background:#191919;

}
.stories-feature--technology .stories-feature__marker,
.stories-feature--product .stories-feature__marker {
	padding:0;
	background:none;
}
/* 製品紹介：右端から下端にだけ水色の楕円の外側を見せる */
.stories-feature--product {
	--feature-marker: transparent;
	--feature-title-color: #193b55;
	background:#f0f5ea;
}
.stories-feature--product::after {
	inset:0;
	width:auto;
	height:auto;
	border:0;
	border-radius:0;
	background:radial-gradient(ellipse 110% 125% at 0 0, transparent 0 99.5%, #a6d8e8 100%);
}
.stories-feature--product .stories-feature__copy {
	bottom:24px;
	max-width:78%;
}
.stories-feature--product .stories-feature__title {
	padding:18px 24px;
	background:rgba(255,255,255,.88);

}
.stories-feature:focus-visible {
	outline:3px solid var(--color-blue);
	outline-offset:-3px;
}


@media screen and (max-width:640px) {
	.stories-feature__tags {
		top:.75rem;
		left:max(8rem, 32%);
		right:.75rem;
		gap:4px;
		font-size: .6rem;
	}

	
}

/* ストーリー一覧 */
.front-stories {
	overflow-x:clip;
	background: linear-gradient(
		to bottom,
		#ffffff 0%,
		#ffffff 20%,
		var(--color-gray-100) 100%
	);
	padding: 5% 0;
}
.front-stories .stories-slider {
	width:100%;
	margin:0 0 40px;
}
.front-stories__description {
	margin:0 0 24px;
	text-align:center;
}
.front-stories__description strong {
	font-size:var(--font-size-lead);
}
.front-stories .js-stories-swiper .swiper-slide {
	width:calc((100% - 32px) / 3);
	max-width:none;
	container-type:inline-size;
	align-self:stretch;
}
.front-stories__card {
	display:block;
	height:100%;
	border-radius:.5rem;
	overflow:hidden;
	background:#fff;
	color:var(--color-gray-900);
	text-decoration:none;
}
.front-stories .stories-feature {
	min-height:0;
	border-radius:0;
}
.front-stories .stories-feature__number {
	top:3cqw;
	left:3cqw;
	padding:2cqw;
	font-size: clamp(.5rem, 3cqw, .85rem);
}
.front-stories .stories-feature__series {
	margin-top:1.5cqw;
	padding-top:1.5cqw;
	font-size: clamp(.4rem, 2.2cqw, .65rem);
}
.front-stories__meta {
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:1rem;
	margin:1rem 0 .75rem;
	font-family: var(--font-display);
}
.front-stories__number {
	color:var(--color-blue);
	font-size: var(--font-size-lead);
	font-weight: var(--font-weight-display);
	opacity:.7;
}
.front-stories__meta time {
	color:var(--color-gray-400);
	font-size: var(--font-size-small);
	white-space:nowrap;
}
.front-stories .stories-feature__copy {
	position:static;
	display:block;
	width:auto;
	max-width:none;
	margin-top:1rem;
}
.front-stories .stories-feature__copy::after {
	content:none;
}
.front-stories .stories-feature__title {
	padding:0 1rem;
	color:var(--color-gray-900);

}
.front-stories .stories-feature__marker {
	padding:0;
	background:none;
}
.front-stories .stories-feature__tags {
	position:static;
	margin:.75rem 0 0;
	padding:0 1rem 1rem;
	gap:.5rem;
	font-size: clamp(.8125rem, 3cqw, .875rem);
}
.front-stories .stories-feature__tags > span {
	padding:.125rem 1rem;
	border:1px solid var(--color-gray-200);
	background:transparent;
	color:var(--color-gray-500);
}
.front-stories .stories-feature__stripes {
	width:18cqw;
	height:18cqw;
}
.front-stories .stories-feature__stripes--bottom {
	width:12cqw;
	height:12cqw;
}
/* Blog スライダー */
.front-blog h2 {
	font-family: var(--font-display);
	font-weight: var(--font-weight-display);
	font-size: var(--font-size-display-title);
	text-align: center;
	color: var(--color-blue);
	letter-spacing: 0.1rem;
	padding-bottom: 1.6%;

}
.front-blog p {
	font-weight:var(--font-weight-heading);
	text-align:center;
}
.js-front-blog-swiper {
	width: 100%;
	overflow: hidden;
	--gap: 15px;
	--slides: 5;
}
.js-front-blog-swiper .swiper-wrapper {
	display: flex;
}
.js-front-blog-swiper .swiper-slide {
	width: calc((100% - (var(--gap) * (var(--slides) - 1))) / var(--slides));
	margin-right: var(--gap);
	flex-shrink: 0;
	box-sizing: border-box;
}
.js-front-blog-swiper .front-blog-card {
	display: block;
	height: 100%;
}
.js-front-blog-swiper .front-blog-card:hover {
	opacity:0.6;
}
.js-front-blog-swiper .front-blog-card__thumb {
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: 0.5rem;
	overflow: hidden;
}
.js-front-blog-swiper .front-blog-card__thumb img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
}

/* =====================================================
□ PC（641px以上）
===================================================== */
@media screen and (min-width: 641px) {

	#content {
		display: block;
		width: 100%;
	}

	#primary {
		max-width: 100%;
		margin: 5% auto 0;
	}
}

/* =====================================================
□ スマホ（640px以下）
===================================================== */
@media screen and (max-width: 640px) {
	.front-stories .js-stories-swiper .swiper-slide {
		width:65%;
	}

	#primary {
		width: 100%;
		max-width: 100%;
		margin: 0;
	}

	section {
		margin-bottom: 48px !important;
	}

	.c-inner {
		padding: 40px var(--content-gutter);
	}

	section h2 {
		margin-bottom: 28px !important;
	
}

	.c-subtitle .text {
		font-size: var(--font-size-small) !important;
		letter-spacing: .08em;
	}

	.wp-block-button {
		margin-top: 32px;
	}

	.front-hero__copy {
		box-sizing: border-box;
		padding: 16px 8px;
		font-size: clamp(1.5rem, 6.5vw, 2.25rem);
		margin: 0 !important;
	}

	#heroCanvas2 {
		height: var(--hero-height, calc(100svh - 80px));
		min-height: 0;
	}

	.front-business h3 {
		margin-bottom: 32px;
	
}
	.front-business .grid {
		gap: 28px 12px;
		grid-template-columns: repeat(2, 1fr);
	}

	.front-business .caption {
		margin-top: 12px;
		font-size: var(--font-size-small);
	}

	.front-business .caption small {
		font-size: var(--font-size-caption);
	}

	.front-sustainability {
		padding: 0 var(--content-gutter);
	}

	.front-sustainability .c-inner {
		flex-direction: column;
		box-sizing: border-box;
		padding: 32px var(--content-gutter);
		border-radius: 20px;
	}

	.front-sustainability .c-inner::before {
		content: none;
	}

	.front-sustainability .c-inner::after {
		content: none;
	}

	.front-sustainability .sustainability-text__inner {
		width: 100%;
	}

	.front-sustainability .sustainability-text__inner::after {
		content: "";
		order: 1;
		align-self: center;
		width: 65%;
		max-width: 240px;
		aspect-ratio: 1 / 1;
		margin-top: 16px;
		background: url("../../../../uploads/frontpage-sustainability-01.png") no-repeat center / contain;
	}

	.front-sustainability .wp-block-button {
		order: 2;
		width: 100%;
		text-align: center;
	}

	.front-sustainability .sustainability-text {
		width: 100%;
		justify-content: flex-start;
	}

	.front-company .c-inner,
	.front-recruit .c-inner {
		grid-template-columns: minmax(0, 1fr);
		gap: 28px;
		padding: 40px var(--content-gutter);
	}

	.front-company .c-inner > div:first-child {
		padding-bottom: 175px;
	}

	.front-company .c-inner > div:first-child::after {
		top: auto;
		bottom: 0;
		left: 50%;
		width: 240px;
		max-width: 100%;
		transform: translateX(-50%);
		background-position: center;
	}

	.front-company .c-inner > div:first-child::before {
		top: auto;
		bottom: 0;
		left: 50%;
		width: 220px;
		max-width: 90%;
		height: 125px;
		transform: translateX(-50%);
	}

	.front-recruit .list {
		grid-template-columns: minmax(0, 1fr);
		gap: 0;
	}

	.news-archive {
		gap: 16px;
	}

	.news-card-inner {
		padding: 22px 18px;
		gap: 12px;
		border-radius: 18px;
	}

	.news-card .news-time {
		font-size: var(--font-size-small);
	}

	.news-card-arrow {
		width: 32px;
		height: 32px;
		min-width: 32px;
	}

.js-front-blog-swiper {
		--slides: 2;
		--gap: 12px;
	}

	/* 事業紹介 */

	/* WBについて */
	.front-company .list {
		grid-template-columns: 1fr;
		column-gap: 0;
	}
	.front-company .list li a,
	.front-recruit .list li a {
		min-height: 68px;
		font-size: var(--font-size-small);
	}
	.front-company .list li a::after,
	.front-recruit .list li a::after {
		width: 38px;
		height: 38px;
		font-size: var(--font-size-body);
	}
}