@charset "UTF-8";
body.page-template-page-gray {
	background:linear-gradient(2deg, #E5EAF0 15.13%, #ECF0F3 54.34%, #F9F9F9 70.26%, #E5EAF0 88.37%);
}
/**
* sustainability CSS
* File: assets/css/sustainability.css
* Description: 固定ページ「Sustainability」専用スタイルシート
*/

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

/* 品質管理：本文と見出し */
body.page-quality .entry-content {
	max-width: 100%;
	margin: 0 auto;
	padding: 96px 64px 96px 64px;
	background: #fff;
	border-radius: 24px;
}

body.page-quality .entry-content> h2 {
	margin: 78px 0px 28px 0px;
	padding: 0px 0px 0px 20px;
	border-bottom: 0px solid var(--color-green);
	border-left: 4px solid var(--color-green);
	border-right: 0px solid var(--color-green);
	border-top: 0px solid var(--color-green);

}

body.page-quality .entry-content> h3 {
	margin: 48px 0 0 0;
	color:var(--color-green);

}

/* Hero */
.hero-section .wp-block-columns {
	gap: 3%;
}


.hero-section .wp-block-column h2 {
	white-space: normal;

}
.hero-section .wp-block-image {
	background-image: url('../../../../uploads/sustainability-01.png');
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}
.hero-section .wp-block-image img {
	opacity: 0;
}
.sustainability-section {
	width:100%;
	padding: 40px;
	margin-bottom:30px;
	border-radius: 24px;
	background-color: var(--color-gray-100);
	text-decoration: none;
	transition: background-color var(--transition);
}
.sustainability-label {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0;
	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);
}
.sustainability-section span:not(.button__text) {
	font-weight: var(--font-weight-heading);
	color:var(--color-green);
}
.sustainability-section .wp-block-list {
	list-style-position:outside;
	padding: 0;
	margin:0;

}
.sustainability-section .wp-block-list li {
	padding: 0;
	margin:0 0 0 3%;
}

/* 品質管理ページ全体 */
.quality-section {
	margin:0 0 100px;
}
.quality-section h2 {
	position: relative;
	margin: 20px 0;
	padding: 0 0 16px;

}

.quality-section h2::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 48px;
	height: 4px;
	background: var(--color-green);
}

/* =====================================================
□ PC（641px以上）
===================================================== */
@media screen and (min-width: 641px) {
	.hero-section .wp-block-column h2 { white-space: nowrap; 
}

	.hero-section .wp-block-column:first-child {
		flex-basis: 51% !important;
	}

	.hero-section .wp-block-column:last-child {
		flex-basis: 46% !important;
	}

	.sustainability-label {
		writing-mode: vertical-rl;
		transform: rotate(-180deg);
		border-left: 1px solid var(--color-gray-300);
		padding-left: 20px;
	}
}

/* =====================================================
□ スマホ（640px以下）
===================================================== */
@media screen and (max-width: 640px) {


	.hero-section.wp-block-columns,
	.hero-section .wp-block-columns {
		flex-direction: column;
		gap: 28px;
		row-gap: 28px !important;
		margin-bottom: 48px;
	}

	.hero-section > .wp-block-column,
	.hero-section .wp-block-columns > .wp-block-column {
		flex: 1 1 auto !important;
		width: 100%;
	}

	.hero-section .hero-copy h2,
	.hero-section .wp-block-column h2 {
		white-space: normal;
		word-break: normal;
	}


	body.page-quality .entry-content {
		padding: 32px var(--content-gutter);
		border-radius: 16px;
	}

	body.page-quality .entry-content > h2 {
		margin: 40px 0 20px;
		padding-left: 12px;
	
}


	.sustainability-section {
		box-sizing: border-box;
		padding: 24px var(--content-gutter);
		border-radius: 16px;
	}

	.sustainability-label {
		margin-bottom: 0;
	}

	#primary .sustainability-section h3 {
		margin: 0 0 20px;
	
}

	.sustainability-section.wp-block-columns,
	.sustainability-section .wp-block-columns {
		flex-direction: column;
		gap: 24px;
	}

	.sustainability-section > .wp-block-column,
	.sustainability-section .wp-block-columns > .wp-block-column {
		flex: 1 1 auto !important;
		width: 100%;
		min-width: 0;
	}

	.sustainability-section .wp-block-list {
		padding-left: 1.2em;
	
}

	.sustainability-section .wp-block-list li {
		margin: 0 0 6px;
	}

	.sustainability-section .wp-block-buttons.is-layout-flex {
		justify-content: center;
	}

	/* 本文とアイコンを囲むグループも縦並びにする */
	.sustainability-section > .wp-block-column > .wp-block-group.is-layout-flex {
		flex-direction: column;
		align-items: stretch;
		gap: 24px;
	}

	.sustainability-section > .wp-block-column > .wp-block-group.is-layout-flex > .wp-block-group {
		width: 100%;
		min-width: 0;
	}

	.sustainability-section .wp-block-image figure.alignright {
		float: none;
		margin: 0;
	}

	.sustainability-section .wp-block-image {
		width: min(120px, 100%);
		margin: 0 auto;
	}

	.sustainability-section .wp-block-image img {
		display: block;
		width: 100%;
		height: auto;
	}

	.quality-section {
		margin-bottom: 48px;
	}

}