/* Shared styles for multilingual content pages. */

/* Vision: keep these rules inside the content area. */
.contents.content-vision {
	min-height: 0;
	padding: 38px 4.166667% 84px;
	color: #444;
	font-size: 18px;
	font-size: clamp(15px, 3.89vw, 18.667px);
	line-height: 1.45;
	letter-spacing: -0.045em;
	word-break: keep-all;
	overflow-wrap: break-word;
}

.content-vision,
.content-vision * {
	box-sizing: border-box;
	font-family: "Spoqa Han Sans Neo", Arial, "Malgun Gothic", sans-serif;
}

.content-vision .content-vision__heading {
	margin: 0 0 15px;
	padding: 0;
	color: #333;
	font-size: 22px;
	font-size: clamp(17px, 4.65vw, 22.333px);
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -0.04em;
	text-align: center;
}

.content-vision__heading > span,
.content-vision__heading > strong {
	display: block;
}

.content-vision__heading > strong {
	font-weight: 700;
	letter-spacing: -0.035em;
}

.content-vision .content-vision__section {
	margin: 0;
	padding: 0;
	border: 0;
}

.content-vision .content-vision__section + .content-vision__section {
	margin-top: 56px;
}

.content-vision .content-vision__image {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	margin: 0;
	border: 0;
	border-radius: 10px;
}

.content-vision .content-vision__copy {
	margin-top: 20px;
}

.content-vision .content-vision__number {
	position: relative;
	z-index: 0;
	display: inline-block;
	margin-bottom: 4px;
	font-weight: 700;
	line-height: 1.25;
}

.content-vision__number::before {
	position: absolute;
	z-index: -1;
	top: -3px;
	left: 4px;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: #d5dfd8;
	content: "";
}

.content-vision .content-vision__copy h2,
.content-vision .content-vision__copy p,
.content-vision .content-vision__values,
.content-vision .content-vision__values dt,
.content-vision .content-vision__values dd {
	margin: 0;
	padding: 0;
	font-size: inherit;
	line-height: inherit;
}

.content-vision .content-vision__copy h2 {
	color: #292d2a;
	font-weight: 700;
}

.content-vision__values > div {
	display: flex;
	align-items: baseline;
}

.content-vision .content-vision__values dt {
	flex: 0 0 3.1em;
	font-weight: 700;
	text-align: justify;
	text-align-last: justify;
}

.content-vision .content-vision__values dd {
	position: relative;
	flex: 1;
	min-width: 0;
	padding-left: 1.25em;
}

.content-vision__values dd::before {
	position: absolute;
	left: 0.25em;
	content: "—";
}

.content-vision .content-vision__slogan {
	color: #34633b;
	background: linear-gradient(transparent 62%, #e3ebe2 62%);
	font-size: 0.97em;
	font-weight: 500;
	letter-spacing: -0.045em;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

.content-vision:not([lang="ko"]) {
	letter-spacing: 0;
	word-break: normal;
}

.content-vision:not([lang="ko"]) .content-vision__values > div + div {
	margin-top: 6px;
}

.content-vision:not([lang="ko"]) .content-vision__values dt {
	flex-basis: 30%;
	text-align: left;
	text-align-last: auto;
}

.content-vision[lang="th"] {
	line-height: 1.65;
}

.content-vision[lang="th"] .content-vision__heading {
	line-height: 1.45;
}

.content-vision[lang="ja"],
.content-vision[lang="ja"] * {
	font-family: "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif;
}

.content-vision[lang="zh-CN"],
.content-vision[lang="zh-CN"] * {
	font-family: "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
}

.content-vision[lang="th"],
.content-vision[lang="th"] * {
	font-family: "Leelawadee UI", Tahoma, sans-serif;
}

@media screen and (max-width: 380px) {
	.contents.content-vision {
		padding-top: 30px;
	}

	.content-vision .content-vision__section + .content-vision__section {
		margin-top: 48px;
	}
}
