@charset "utf-8";

:root {
	--su-icon-blank: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13"><g><rect x=".5" y=".5" width="10" height="10" style="fill: none; stroke: %23676767;"/><line x1="4" y1="12.5" x2="13" y2="12.5" style="fill: none; stroke: %23676767;"/><line x1="12.5" y1="4" x2="12.5" y2="13" style="fill: none; stroke: %23676767;"/></g></svg>');
	--su-icon-link: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="15" viewBox="0 0 10 15"><path d="M9.14,7.51h0c0,.27-.11.53-.3.72l-6.29,6.12c-.4.39-1.03.38-1.41-.02-.39-.4-.38-1.03.02-1.41l5.55-5.41L1.16,2.08c-.39-.39-.4-1.02-.02-1.41.39-.4,1.02-.4,1.41-.02l6.29,6.14c.19.19.3.45.3.72Z" style="fill: %23989898;"/></svg>');
	--su-icon-pdf: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="19" height="23" viewBox="0 0 19 23"><path d="M18.5,7.5h-5.729c-.34,0-.668-.129-.898-.367s-.372-.572-.372-.895V.5M18.5,7v14.32c0,.31-.12.62-.34.84s-.52.34-.82.34H1.66c-.31,0-.61-.12-.82-.34-.22-.22-.34-.53-.34-.84V1.68c0-.31.12-.62.34-.83.22-.22.52-.35.82-.35h10.46M18.5,7L12.11.5M16.11,11.52h-2.61v5.29M13.5,14.16h1.7M3.5,16.8v-5.29h1.75c.47,0,.91.18,1.24.52s.51.79.51,1.25-.18.92-.51,1.25-.78.52-1.24.52h-1.75M8.5,16.81v-5.31h.89c.7,0,1.35.28,1.85.78.49.5.77,1.17.77,1.88s-.28,1.37-.77,1.88c-.49.5-1.16.78-1.85.78h-.89v-.01Z" style="fill: none; stroke: %230860a8; stroke-linecap: round; stroke-linejoin: round;"/></svg>');
	--su-icon-arr: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="4" height="8" viewBox="0 0 4 8"><path d="M.57,8c-.15,0-.3-.07-.41-.21-.22-.27-.22-.7.01-.96l2.44-2.83L.17,1.17C-.05.9-.06.47.16.2c.22-.27.58-.27.81-.01l2.86,3.32c.11.13.17.3.17.49s-.06.36-.17.49L.97,7.81c-.11.13-.26.19-.4.19Z" fill="%230860a8"/></svg>');
}


/* 共通上書き
----------------------------------------------------------------*/
.c-mainHeading_type2 .c-primaryHeading {
	line-height: 1.4;
}

.c-primaryHeading span {
	display: inline-block;
}
/*
.su-contents .c-secondaryHeading {
	padding-bottom: 0.4em;
	border-bottom: solid 1px #ccc;
}

.su-contents .c-tertiaryHeading {
	text-decoration-line: underline;
	text-decoration-color: #ccc;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.5em;

	@media screen and (max-width: 767px) {
		line-height: 1.8;
	}
}*/
.su-contents .c-tertiaryHeading:not(h3, h4, h5),
.su-contents .c-quaternaryHeading:not(h3, h4, h5) {
	text-decoration-line: none;
}

/* スマホ側でmargin-top: 20px;が追加されてため一時削除
@media screen and (max-width: 767px) {
	.su-contents p+p {
		margin-top: 1em;
	}
} */

.su-mb0 + p {
	margin-top: 0;
}

/* エリアはみ出し問題 */
.su-contents .c-textlink:has(>[target]) {
	padding-right: 30px;
}

/* 改行時対応 */
.su-contents .c-textlink >[target] {
	display: inline-block;
}

/* .is-lineAni.is-line 常時表示 3/15 スマホ側で通常テキストと変わりないため上書き
--------------------------------------------*/
.su-contents a.is-lineAni.is-line {
	color: var(--color-hover);
	position: relative;
	text-decoration: none;
	background-image: linear-gradient(currentColor, currentColor);
	background-repeat: no-repeat;
	background-position: 0 100%;
	background-size: 100% 1px;
	transition: background-size .3s ease, color .2s ease;
}

.su-contents a.is-lineAni.is-line:hover {
	color: var(--color-hover);
	background-image: linear-gradient(currentColor, currentColor);
	background-position: 0 100%;
	background-size: 100% 1px;
}

@media screen and (min-width: 768px) {
	.su-contents a.is-lineAni.is-line:hover {
		color: #008cff;
	}
}

.su-contents a.is-lineAni.is-line[target],
.su-contents a.is-lineAni.is-line[target]:hover {
	background-size: calc(100% - 18px) 1px;
}

.su-contents a.is-lineAni.is-line[target]::after {
	content: var(--su-icon-blank);
	margin: -5px 5px -5px 5px;
}

/* マージン調整 */
[class^="c-list--"].su-list {
	margin: 10px 0 20px;
	& li {
		margin-top: 0.1em;
		& dt,
		& > strong {
			display: block;
			font-family: var(--font-koburina-w6);
			font-weight: normal;
		}
	}
}


/* パンくずリスト PC側で未設定のため */
.c-breadcrumb.upper .c-breadcrumb__items {
	white-space: nowrap;
}

@media screen and (min-width: 768px) {
	.c-breadcrumb.upper {
		display: none;
	}
}

.su-contents .c-note {
	display: block;
	margin-top: 10px;
}

.su-contents .alR.c-note::before {
  position: relative;
}

.su-contents .c-note.no-kome::before {
	content: none;
}

.LastUpDate {
	max-width: 1200px;
	margin: 80px auto 0;
	padding: 5px 10px;
	font-size: 1.4rem;
	background: #efefef;
}


.su-contents .l-section {

	& .l-pagetop {
		display: none;
	}

	& .l-pagetop {
		width: 35px;
		margin: 0 0 0 auto;
		padding: 0;
		& p {
			width:100%;
			height:35px;
			margin:0;
			cursor:pointer;
		}
	}

	& > .l-pagetop {
		margin-bottom: -35px;
	}

	& > p {
		& + .l-pagetop {
			margin-top: 20px;
		}
	}
}


/* 汎用
----------------------------------------------------------------*/
.su-bold {
	font-family: var(--font-koburina-w6);
	font-weight: normal;
}

.su-vm {
	vertical-align: middle;
}

.su-large {
	font-size: 117%;
}

.su-strong {
	font-family: var(--font-koburina-w6);
}

.su-nowrap {
	white-space: nowrap;
}

.su-small {
	font-size: 92%;
}

.su-smaller {
	font-size: 84%;
}

.su-fs {
	font-size: 1.5rem;
}

.su-idt {
	padding-left: 1.0em;
	text-indent: -1.0em;
	text-align: left;
}

.su-idts {
	padding-left: 1.5em;
	text-indent: -1.4em;
	text-align: left;
}

.su-full {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.su-lh15 {
	line-height: 1.5;
}

.su-margin {
	margin-bottom: 20px !important;
}

.su-mt0 {
	margin-top: 0 !important;
}

.su-mb0 {
	margin-bottom: 0 !important;
}

.su-expand {
	padding-top: 20px;
}

.su-shrink {
	margin-top: -20px !important;
}

.su-text {
	margin-bottom: 20px !important;
}

.su-texth {
	margin-bottom: 10px !important;
}

@media screen and (max-width:767px) {
	.su-margin,
	.su-text {
		margin-bottom: calc(1.11vw + 11.4px) !important;
	}

	.su-expand {
		padding-top: calc(1.11vw + 11.4px);
	}
}

.flex_b {
	display: flex;
	justify-content: space-between;
}

.flex_c {
	display: flex;
	justify-content: center;
}

.flex_sc {
	display: flex;
	align-items: center;
}

.flex_bc {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

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

.flex_wrap {
	flex-wrap: wrap;
}


/* カテゴリトップビジュアル  >マネジメントトップ >EGCカテゴリトップ
----------------------------------------------------------------*/
.vis_title {
	position: relative;
	width: 100%;
	overflow: hidden;

	&>img {
		position: relative;
		display: block;
		width: 100%;
		max-width: none;
		height: auto;
	}

	&>div {
		position: absolute;
		display: flex;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		justify-content: center;
		align-items: center;
	}

	& h1 {
		padding: 0 10px;
		font-size: 4.0rem;
		line-height: 1;
		color: #fff;
		text-shadow: 1px 0 4px #666, 1px 1px 4px #666, 0 1px 4px #666, -1px 1px 4px #666, -1px 0 4px #666, -1px -1px 4px #666, 0 -1px 4px #666, 1px -1px 4px #666;
		text-align: center;

		& span {
			display: inline-block;
		}
	}
}

@media screen and (max-width:959px) {
	.vis_title>img {
		width: auto;
		height: 175px;
		left: 50%;
		transform: translate(-50%, 0);
	}
	.vis_title h1 span {
		font-size: calc(2.671vw + 14.384px);
	}
}

/* カテゴリトップリンク >マネジメントトップ >ESGカテゴリトップ
----------------------------------------------------------------*/
.boxTxtLnk {
	width: 100%;
	padding: 50px 0;

	&>div {
		max-width: 1100px;
		margin: 0 auto;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;

		&::after {
			content: "";
			display: block;
			width: calc(33.3% - 26.66px);
			height: 1px;
		}
	}

	& a {
		display: flex;
		width: calc(33.3% - 20px);
		min-height: 70px;
		margin: 0 0 30px 0;
		padding: 0.5em 20px;
		justify-content: space-between;
		align-items: center;
		border: solid 1px #989898;
		border-radius: 10px;
		text-decoration: none;
		box-sizing: border-box;
		background-image: none;

		&::after {
			display: block;
			content: '';
		  -webkit-mask: var(--su-icon-link) no-repeat center / contain;
		  mask: var(--su-icon-link) no-repeat center / contain;
			background-color: #989898;
			width: 10px;
			height: 15px;
			font-size: 0;
			transition: 0.3s;
		}

		&:hover {
			border: solid 1px var(--color-hover);

			& strong {
				color: var(--color-hover);
			}

			&::after {
				background-color: var(--color-hover);
			}
		}

		& strong {
			display: block;
			width: calc(100% - 30px);
			font-size: 1.8rem;
			line-height: 1.5;
			text-align: left;
			color: #000;
			transition: color 0.4s ease-in-out 0s;
			font-family: var(--font-koburina-w6);
			font-weight: normal;

			&.small_set {
				width: calc(100% - 20px);
				line-height: 1.2;

				& span {
					font-size: 1.3rem;
					text-indent: -0.5em;
				}
			}
			& span {
				display: inline-block;
			}
		}
	}
}

@media screen and (max-width:959px) {
	.boxTxtLnk {
		padding: 10% 0 0;
		& a {
			width: calc(50% - 15px);
		}
	}
}

@media screen and (max-width:640px) {
	.boxTxtLnk a {
		width: 100%;
		margin: 0 0 20px 0;
	}
}


/* 画像<>テキストブロック
----------------------------------------------------------------*/
.sustaina_pic {
	display: block;
	overflow: hidden;
}

.su-block {
	display: flex;
	gap: 20px;
	margin-bottom: 20px;

	&>figure {
		flex: 0 0 150px;
		width: 150px;
		height: auto;
		margin: 10px 0 0 0;
	}

	&[style^="--basis:"]>figure {
		flex: 0 0 var(--basis);
		width: var(--basis);
	}

	&.su-block_img-150>figure {
		flex: 0 0 150px;
		width: 150px;
	}

	&.su-block_img-200>figure {
		flex: 0 0 200px;
		width: 200px;
	}

	&.su-block_img-300>figure {
		flex: 0 0 300px;
		width: 300px;
	}
}

@media screen and (max-width:767px) {
	.su-block {
		justify-content: start;
		align-items: center;
		flex-direction: column;
		gap: 10px;
	}
	.su-block>figure {
		flex: 0 0 auto !important;
	}
	.su-block>figure:not(.sp-first) {
		order: 2;
	}
}

/* DFF仕様●改
----------------------------------------------------------------*/
.su-disc-list {
	margin-bottom: 20px;

	&>dt {
		padding: 0 0 10px 1em;
		text-indent: -0.9em;
		font-family: var(--font-koburina-w6);
		&::before {
			content: '●';
			font-size: 0.889em;
			margin: 0 4px 0 -4px;
		}
	}

	&>dd {
		margin-bottom: 25px;
	}
}


/* アイコン付き小フォントサイズリンクリスト トップ／ESGトップ
----------------------------------------------------------------*/
.su-link {
	position: relative;
	line-height: 1.6;

	& a {
		display: inline-block;
		color: var(--color-hover);
	}
	/* _blank 右 */
	&:has(> [target]) {

		&::after {
			content: var(--su-icon-blank);
			margin: -5px 0 -5px 5px;
		}
	}

	/* >アイコン 左 */
	&.su-arr {
		padding: 0 0 0 20px;

		&::before {
			content: var(--su-icon-arr);
			position: absolute;
			display: block;
			top: 0.50em;
			left: 0.2em;
			width: 4px;
			height: 8px;
			line-height: 0;
		}
	}
}

/* アイコン付きリンクリスト with c-textlink
----------------------------------------------------------------*/
.relatedLinks {
	padding: 0.2em 0 0 0;
}

.relatedLinks>.c-textlink {
	position: relative;
	padding: 0.3em 0 0.3em 1.0em;
	line-height: 1.5;

	&::before {
		position: absolute;
		display: block;
		top: 0.15em;
		left: 0.2em;
		content: var(--su-icon-arr);
		width: 4px;
		height: 8px;
	}

	&:not(:has(a))::before {
		background: var(--color-primary);
	}

	&>a {
		display: inline-block;

		&[target]::after {
			background: var(--su-icon-blank);
			width: 13px;
			height: 13px;
		}

		&.su-pdf[target]::after {
			content: none;
		}

		&.su-pdf {
			display: inline;

			&+span {
				position: relative;
				top: -0.4em;
				display: inline-flex;
				align-items: center;
				margin: 0 0 0 8px;
				font-size: 0.9em;

				&::before {
					content: '';
				}

				&::after {
					content: url(/assets_ren/images/icon-pdf.svg);
					content: var(--su-icon-pdf);
					display: inline-block;
					width: 19px;
					height: 23px;
					margin: 0 0 0 5px;
				}
			}
		}
	}
}

/* 関連リンク
----------------------------------------------------------------*/
.relatedLinks-box {
	margin: 30px auto;
	font-size: 1.6rem;

	&>dl {
		padding: 30px;
		border: solid 1px #b2b2b2;

		&>dt {
			font-size: 1.8rem;
		}

		&>dd {
			padding: 10px 0 0 10px;
		}
	}
}

@media screen and (max-width: 767px) {
	.relatedLinks-box {
		font-size: 1.4rem;
	}

	.relatedLinks-box>dl {
		padding: 20px;
	}
}

/* TABLE
----------------------------------------------------------------*/
.stdTb02 {
	width: 100%;
	font-size: clamp(1.4rem, calc(1vw + 6.33px), 1.6rem);

	& [class^="c-list--"]>li {
		font-size: inherit;
	}
}

.alR:has(+ .stdTb02-wrap) {
  font-size: clamp(1.4rem, calc(1vw + 6.33px), 1.6rem);
  margin: -0.5em 0 -1em;
}

.stdTb02-wrap {
	width: 100%;
	font-size: clamp(1.4rem, calc(1vw + 6.33px), 1.6rem);
	overflow-x: auto;
	margin: 18px 0;

	&+.stdTb02-wrap {
		margin: 36px 0 18px 0;
	}

	&>.stdTb02 {
		width: auto;
		min-width: 100%;
		margin: 0 0 6px 0;

		& th,
		& td {
			padding: 8px 5px;
			border: solid 1px #b2b2b2;
			vertical-align: middle;
		}

		& th {
			font-family: var(--font-koburina-w3);
			font-weight: normal;
			background: #f4f4f4;

			&.subcell {
				background: #f9f9f9;
			}
		}

		& thead th {
			white-space: nowrap;

			&.normal {
				white-space: normal;
			}
		}

		& tbody th {
			text-align: left;
		}

		& td {
			background: #fff;
		}

		& tbody.alR td {
			white-space: nowrap;
		}
	}
}
@media screen and (min-width: 1024px) {
.stdTb02-wrap {
	&>.stdTb02 {
		& th,
		& td {
			padding: 8px 10px;
		}
	}
}
