@charset "utf-8";

img{
	max-width: 100%;
	/*width: 100%;*/
}
a:hover {
  opacity: .6;
  transition: opacity .3s;
}
.sn-pc{ display: block;}
.sn-sp{ display: none;}
.sn-wrapper *{
	box-sizing: border-box;
}
.sn-wrapper{
	width: 1160px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 60px;
}
@media (max-width: 767px) {
	.sn-pc{ display: none;}
	.sn-sp{ display: block;}
	.sn-wrapper{
		width: auto;
		margin-left: 3.33%;
		margin-right: 3.33%;
		margin-bottom: 8%;
	}
}


/* ------------------------------------------ */
/* index-MV */
/* ------------------------------------------ */
.sn-index-mv {
	margin-bottom: 60px;
	max-width: 100%;
	min-width: 1160px;
	padding-top: 53.65%;
	background: url("../image/sustainable_21/index_mv.jpg") top center no-repeat;
	background-size:contain;
	position: relative;
}
.sn-index-mv-link {
	position: absolute;
}
.sn-index-mv-link.link-enviroment {
	top: 83.2%;
	left: 9.84%;
	width: 15.73%;
}
.sn-index-mv-link.link-archive{
	top: 33.3%;
	left: 18.02%;
	width: 11.15%;
}
.sn-index-mv-link.link-social {
	top: 28.74%;
	left: 42.14%;
	width: 15.73%;
}
.sn-index-mv-link.link-movie {
	top: 36.5%;
	left: 73.75%;
	width: 11.2%;
}
.sn-index-mv-link.link-governance {
	top: 88.54%;
	left: 71.35%;
	width: 15.73%;
}
.sn-index-mv-link.link-global {
	top: 72.62%;
	left: 37.92%;
	width: 25.36%;
}
@media (max-width: 1160px) {
	.sn-index-mv {
		width: 1160px;
		padding-top: 622px;
		margin: 0 auto 60px;
	}
}
@media (max-width: 767px) {
	.sn-index-mv {
		margin-bottom: 8%;
		width: auto;
		max-width:inherit;
		min-width: inherit;
		padding: 55.32% 3.33% 0;
		background: url("../image/sustainable_21/index_mv.jpg") top center no-repeat;
		background-size: 100% auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	.sn-index-mv-link {
		position:relative;
		top: 0 !important;
		left: 0 !important;
		width: 49% !important;
		margin-top: 1.67%;
		transition-duration:0.3s;
	}
	.sn-index-mv-link:nth-child(even) {
		margin-right: 1%;
	}
	.sn-index-mv-link.link-enviroment {
		width: 15.73%;
	}
	.sn-index-mv-link.link-social {
		width: 15.73%;
	}
	.sn-index-mv-link.link-movie {
		width: 11.2%;
	}
	.sn-index-mv-link.link-governance {
		width: 15.73%;
	}
	.sn-index-mv-link.link-global {
		width: 100%!important;
		border: 1px solid #d8d8d8;
	}
	.sn-index-mv-link.link-global a{
		display: block;
	}
	.sn-index-mv-link.link-global a img.sp{
		height: 100%;
		max-height: 100px;
		width: auto;
		margin: 0 auto;
	}
}


/* ------------------------------------------ */
/* バナーエリア01 */
/* ------------------------------------------ */
.sn-bnr01-list {
	display: flex;
	flex-wrap: wrap;
	justify-content:space-evenly;
  	/*justify-content:space-between;*/
}
.sn-bnr01-list-item {
	margin-bottom: 35px;
	width: 31.76%;
	border: 1px solid #D8D8D8;
	display:flex !important;
	/* font-size: 24px; */
	font-size: 18px;
	line-height: 1.25;
	font-family: "\6E38\30B4\30B7\30C3\30AF\4F53", "YuGothic", "\6E38\30B4\30B7\30C3\30AF", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "meiryo", "Helvetica Neue", "arial", sans-serif;
	font-weight: bold;
}

.sn-bnr01-list-item-text {
	margin-top: 18px;
	width: 60%;
	display:flex !important;
	font-size: 18px;
	line-height: 1.25;
	font-family: "\6E38\30B4\30B7\30C3\30AF\4F53", "YuGothic", "\6E38\30B4\30B7\30C3\30AF", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "meiryo", "Helvetica Neue", "arial", sans-serif;
	font-weight: bold;
}
@media (max-width: 767px) {
	.sn-bnr01-list-item-text {
		width: 100%;
		font-size: 15px;
		font-weight: 400;
	}
}

.sn-bnr01-list-item a {
	padding: 10.2% 4.08%;
	/* padding: 10.2% 44.18% 10.2% 4.08%; */
	max-height: 150px;
	width: 100%;
	height: 100%;
	display:flex !important;
	flex-direction: column;
	justify-content: center;
	text-decoration: none;
	color: #000;
}
_:-ms-lang(x)::-ms-backdrop, .sn-bnr01-list-item {
	font-size: 18px;
}

/* -item_sustainabilityreport */
.sn-bnr01-list-item.-item_sustainabilityreport a{
	background: url("../image/sustainable_21/bnr_bg_sustainabilityreport.png") 91.56% bottom no-repeat;
	background-size:35.18% auto;
}
/* -item_topcommit */
.sn-bnr01-list-item.-item_topcommit {
	padding: 0 1.24%;
	align-items: center;
	justify-content: space-between;
}
.sn-bnr01-list-item.-item_topcommit .-link-area {
	display: flex;
	justify-content: flex-end;
}
.sn-bnr01-list-item.-item_topcommit .-link{
	width: 97px;
}
.sn-bnr01-list-item.-item_topcommit .-link a{
	padding: 0;
}
.sn-bnr01-list-item.-item_topcommit .-link img{
    width: auto;
    height: 105px;
}
@media (max-width: 767px) {
	.sn-bnr01-list-item.-item_topcommit .-link img{
	    width: auto;
	    height: 100%;
	}
}

/* -item_integratedreport */
.sn-bnr01-list-item.-item_integratedreport a{
	background: url("../image/sustainable_22/bnr_bg_value_report.jpg") 91.56% bottom no-repeat;
	background-size:35.18% auto;
}
@media (max-width: 767px) {
	.sn-bnr01-list {
		margin-top: 0 !important;
		flex-direction: column;
	}
	.sn-bnr01-list-item {
		margin: 2.14% 0 0;
		width: 100%;
		font-size: 16px;
	}
	.sn-bnr01-list-item a {
		padding: 0 4.08%;
		max-height: inherit;
		height: 100px;
	}

	/* -item_sustainabilityreport */
	.sn-bnr01-list-item.-item_sustainabilityreport a{
		background-size:auto 85%;
	}

	/* -item_integratedreport */
	.sn-bnr01-list-item.-item_integratedreport a{
		background-size:auto 85%;
	}

	/* -item_topcommit */
	.sn-bnr01-list-item.-item_topcommit {
		padding: 0 4.08%;
	}
	.sn-bnr01-list-item.-item_topcommit .-name{
		width:40%;
	}
	.sn-bnr01-list-item.-item_topcommit .-link-area{
		width:60%;
	}
	.sn-bnr01-list-item.-item_topcommit .-link{
		width: auto;
	}
}


/* ------------------------------------------ */
/* ESG Museum */
/* ------------------------------------------ */
.sn-esgmuseum_bnr{
	margin: 75px auto 0;
	padding: 25px 0 10px;
	width: 1160px;
	background-color: #f4f4f4;
	text-align: center;
}
.sn-esgmuseum_bnr-ttl{
	color: #327b32;
	font-weight: bold;
	font-size: 18px;
}
.sn-esgmuseum_bnr-area{
	margin: 20px auto 0;
	display: flex;
	justify-content: center;
}
.sn-esgmuseum_bnr-item{
	width: 344px;
	margin: 0 12px 15px;
}
@media (max-width: 767px) {
	.sn-esgmuseum_bnr{
		margin-top: 8%;
		padding: 5.33% 0 ;
		width: auto;
	}
	.sn-esgmuseum_bnr-ttl{
		font-size: 15px;
	}
	.sn-esgmuseum_bnr-area{
		margin-top: 25px;
		width: calc(100% - 40px);
		display: block;
	}
	.sn-esgmuseum_bnr-item{
		width: auto;
		margin: 16px 0 0;
	}
	.sn-esgmuseum_bnr-item:first-child{
		margin-top: 0;
	}
}

/* ------------------------------------------ */
/* 更新情報 */
/* ------------------------------------------ */
.sn-update.sn-wrapper{
	width: auto;
	max-width: 1160px;
	padding: 20px;
	border: 1px solid #D8D8D8;
}
.sn-update__title{
	padding-bottom: 0.5em;
	border-bottom: 1px solid #D8D8D8;
	font-size: 18px;
    letter-spacing: .48px;
	font-weight: bold;
}
.sn-update__news{
}
.sn-update__news__item a{
	display: flex;
	border-top: 1px solid #D8D8D8;
	padding-top: 20px;
	margin-top: 20px;
	line-height: 1.4;
	text-decoration: none;
	color: #000;
}
.sn-update__news__item:first-child a{
	border: none;
	padding-top: 0;
}
.sn-update__news__item .__day {
	width: 9em;
}
.sn-update__news__item .__new {
	font-size: 12px;
	line-height: 1.0;
	margin-left: 0.5em;
	padding: 5px;
	background-color: #000;
	display: inline-block;
	color: #fff;
}
.sn-update__news__item .__text .__icon_pdf{
    display: inline-block;
	font-size: 12px;
	color: #919191;
	margin-left: 5px;
	padding-left: 1.5em;
    background: url("../image/sustainable_21/common/icon_pdf.png") left center no-repeat;
	background-size: contain;
}

/* 報告書DLページ用 */
.sn-wrapper-dl{
	width: 860px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 60px;
}

.sn-update__news__item a:not(.no-icon)[href*=".pdf"]::after {
   content: none !important;
}
.sn-update__news__item .__text .__icon_pdf2{
    display: inline-block;
	font-size: 12px;
	color: #919191;
	margin-left: 5px;
	padding-left: 1.5em;
    background: url("../image/sustainable_21/common/icon_pdf.png") left center no-repeat;
	background-size: 30%;
}




@media (max-width: 767px) {
	.sn-update{
		padding: 2.86%;
	}
	.sn-update__title{
		font-size: 15px;
	}
	.sn-update__news__item a{
		display: block;
		padding-top: 4.62%;
		margin-top: 4.62%;
		font-size: 15px;
	}
	.sn-update__news__item:first-child{
		border: none;
		padding-top: 0;
	}
	.sn-update__news__item .__day {
		width: auto;
	}
	.sn-update__news__item .__new {
		font-size: 12px;
	}
	.sn-update__news__item .__text {
		margin-top: 0.2em;
	}
}

/* ------------------------------------------ */
/* パーツ */
/* ------------------------------------------ */
.sn-link-icon-target ,
.sn-link-icon-blank {
	position: relative;
	display: inline-block;
}
.sn-link-icon-target:before ,
.sn-link-icon-blank:before {
    bottom: 1px;
    content: '';
    display: block;
    height: 15px;
    position: absolute;
    right: 1px;
    width: 15px;
    z-index: 2;
}
.sn-link-icon-target:before {
    background: url("../image/sustainable_21/common/icon_arrow.png") no-repeat right bottom;
    background-size: 15px;
}
.sn-link-icon-blank:before {
    background: url("../image/sustainable_21/common/icon_external.png") no-repeat right bottom;
    background-size: 15px;
}

/* ------------------------------------------ */
/* ESG経営TOP(下部文字バナーの幅調整) */
/* ------------------------------------------ */
.b-page-company-sustainable_pickup .b-o-moduleRowCards[data-b-row-num="4"] .b-m-boxLinkRow_info {
	width: 250px;
}
@media (max-width: 767px) {
	.b-page-company-sustainable_pickup .b-o-moduleRowCards[data-b-row-num="3"] .b-m-boxLinkRow_info,
	.b-page-company-sustainable_pickup .b-o-moduleRowCards[data-b-row-num="4"] .b-m-boxLinkRow_info {
		width: 100%;
	}
}
/* ------------------------------------------ */
/* ESG経営TOP(サムネイルバナー下の文字サイズ調整) */
/* ------------------------------------------ */
.b-m-boxLink .b-a-plainText:first-of-type + p {
	font-size: 15px;
}
/* ------------------------------------------ */
/* ESG経営TOP(ピックアップコンテンツのタイトル余白) */
/* ------------------------------------------ */
.padding0 > div {
	padding: 0!important;
}
.paddingtop0 > div {
	padding-top: 0!important;
}
.paddingbottom0 > div {
	padding-bottom: 0!important;
}
.paddingleft0 > div {
	padding-left: 0!important;
}
.paddingright0 > div {
	padding-right: 0!important;
}
.margin0 > div {
  margin: 0!important;
}
/* ------------------------------------------ */
/* ESG経営TOP(お知らせ余白) */
/* ------------------------------------------ */
.margintop60 {
  margin-top: 60px;
}
@media (max-width: 767px) {
	.margintop60 {
  margin-top: 40px;
}
}
/* ------------------------------------------ */
/* 管理画面のアンカーリンク(アイコンサイズが巨大化するのを回避) */
/* ------------------------------------------ */
.pbAnchorBlock img {
	width: 16px;
}
/* ------------------------------------------ */
/* Chromeの画像にじみを改善 */
/* ------------------------------------------ */
@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm) {
	img {
		image-rendering: -webkit-optimize-contrast;
	}
}

/* ------------------------------------------ */
/* 日英切り替え用リンク　[English] [日本語] */
/* ------------------------------------------ */
.change_language {
  font-size: 18px;
}
@media (max-width: 767px) {
.change_language {
  font-size: 16px;
}
}
/* ------------------------------------------ */
/* ESG経営TOP(ピックアップコンテンツのボーダー) */
/* ------------------------------------------ */
.border_none {
  border: none!important;
}

/* ------------------------------------------ */
/* 仕組みと原動力画像 */
/* ------------------------------------------ */
.img_bottom {
  margin: auto 0 30px 0;
}
@media (max-width: 767px) {
.img_bottom {
  margin: 0 0 15px;
}
.column-reverse > div {
  flex-direction: column-reverse!important;
  }
}
/* ------------------------------------------ */
/* ESG経営の方針・体制(伊藤作業20241126） */
/* ------------------------------------------ */
.table th{
    border-collapse: collapse; border: 1px solid #ccc; line-height: 1.5;padding:10px 20px;background-color: #E7E7E9;  
}

.table tr{
    border-collapse: collapse; border: 1px solid #ccc; line-height: 1.5;padding:10px 20px;
}
.table td{
    border-collapse: collapse; border: 1px solid #ccc; line-height: 1.5;padding:10px 20px;
}

.table tr td:nth-of-type(1){
background-color: #E7E7E9;  
}

/* ------------------------------------------ */
/* ESG経営 */
/* ------------------------------------------ */
.mt0 { margin-top: 0!important; }
.mt10 { margin-top: 10px!important; }
.mt20 { margin-top: 20px!important; }
.mt30 { margin-top: 30px!important; }
.mt40 { margin-top: 40px!important; }
/* ------------------------------------------ */
/* ESG経営(画像拡大調整) */
/* ------------------------------------------ */
img {
	width: auto;
}
/* ------------------------------------------ */
/* ESG経営 > 環境(独自ボタン) */
/* ------------------------------------------ */
/* 縦線 */
.dot-tate-line {
	position: relative;
}
.dot-tate-line::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	height: 100%;
	border-left: 1px dotted #D8D8D8;
}
/* 縦線時のボタン共通 */
.dot-tate-line a:hover {
	opacity: 1;
	transition: .3s;
}
/* 縦線時のボタンA */
.dot-tate-line .base-button a:hover {
	border-color: #e8e8e8;
	color: #8b8a8d;
}
.dot-tate-line .base-button a:hover:after {
	opacity: .6;
	transition: .3s;
}
/* 縦線時のボタンB */
.dot-tate-line .base-button.conversion a:hover {
	background-color: #89898d;
	border-color:#89898d;
	color: #fff;
}
@media (max-width: 767px) {
	.dot-tate-line .base-button + .base-button {
		margin-top: 10px;
	}
}
/* ------------------------------------------ */
/* ESG経営 > 各カテゴリー別TOP(キービジュアルの高さを半分に) */
/* ------------------------------------------ */
.b-o-keyVisual_m.height-half {
	height: 200px;
}
/* ------------------------------------------ */
/* ESG経営 > 下層ページ(2カラム黒ボタンの調整) */
/* ------------------------------------------ */
@media (min-width: 768px) {
	.panel-2clum.button-full .base-button a {
		/*max-width: none;
		max-width: 408px;*/
	}
}
/* ------------------------------------------ */
/* ESG経営 > 下層ページ(tableのセルに斜め線) */
/* ------------------------------------------ */
table th.diagonal_a { /* 左上 → 右下（＼） */
	background:
		linear-gradient(
			to bottom left,
			transparent calc(50% - 1px),
			#CCCCCC calc(50% - 1px),
			#CCCCCC calc(50% + 1px),
			transparent calc(50% + 1px)
		),
		#EBEDEF !important;
}
table th.diagonal_b { /* 右上 → 左下（／） */
	background:
		linear-gradient(
			to bottom right,
			transparent calc(50% - 1px),
			#CCCCCC calc(50% - 1px),
			#CCCCCC calc(50% + 1px),
			transparent calc(50% + 1px)
		),
		#EBEDEF !important;
}
table td.diagonal_a { /* 左上 → 右下（＼） */
	background:
		linear-gradient(
			to bottom left,
			transparent calc(50% - 1px),
			#CCCCCC calc(50% - 1px),
			#CCCCCC calc(50% + 1px),
			transparent calc(50% + 1px)
		),
		#fff !important;
}
table td.diagonal_b { /* 右上 → 左下（／） */
	background:
		linear-gradient(
			to bottom right,
			transparent calc(50% - 1px),
			#CCCCCC calc(50% - 1px),
			#CCCCCC calc(50% + 1px),
			transparent calc(50% + 1px)
		),
		#fff !important;
}
/* ------------------------------------------ */
/* ESG経営 > 下層ページ(tableの文字を小さく) */
/* ------------------------------------------ */
table.small,
table.small th,
table.small td {
	font-size: 12px;
	padding: 5px 2px;
}
table.x-small,
table.x-small th,
table.x-small td {
	font-size: 11px;
	padding: 5px 2px;
}
table.xx-small,
table.xx-small th,
table.xx-small td {
	font-size: 10px;
	padding: 5px 2px;
}
table tr.nowrap,
table tr.nowrap th,
table tr.nowrap td,
table th.nowrap,
table td.nowrap {
	white-space: nowrap;
}
table.small sup {
	font-size: 80%;
	vertical-align: top;
}
table.small sub {
	font-size: 80%;
}
table.middle th,
table.middle td {
	padding-left: 10px;
	padding-right: 10px;
}
.table_cell_cut {
	position: relative;
	display: block;
}
.table_cell_cut .cut_a {
	position: absolute;
	top: 0;
	right: 0; /* 右上 */
}
.table_cell_cut .cut_b {
	position: absolute;
	bottom: 0;
	left: 0; /* 左下 */
}
/* ------------------------------------------ */
/* ESG経営 > 下層ページ(small時やcaption、tableも上付き、下付きの文字を小さく) */
/* ------------------------------------------ */
.base-style.small sup,
div[class^=base-] .caption sup,
div[class^=base-] * sup {
	font-size: 80%;
	vertical-align: top;
}
.base-style.small sub,
div[class^=base-] .caption sub,
div[class^=base-] * sub {
	font-size: 80%;
}
/* ------------------------------------------ */
/* ESG経営 > 下層ページ(h4) */
/* ------------------------------------------ */
/*
.base-main h4 {
	position: relative;
	padding-left: 15px;
}
.base-main h4:before {
	content: '';
	position: absolute;
	top: .45em;
	left: 0;
	width: 4px;
	height: 1em;
	background: #83838C;
}
*/

/* テスト用(一時スタイル) ↓↓↓↓↓ *
.base-main h1 {
	background:red;
}
.base-main h2 {
	background:#eee;
}
.base-main h3 {
	border-bottom: 3px solid green;
}
.base-main h4 {
	color: green;
}
.base-main .h1,
.base-main .h2,
.base-main .h3,
.base-main .h4 {
	background: yellow;
}
.base-main h1::after,
.base-main h2::after,
.base-main h3::after,
.base-main h4::after,
.base-main .h1::after,
.base-main .h2::after,
.base-main .h3::after,
.base-main .h4::after {
	position: relative;
	right: 4px;
	top: 0;
	font-size: 12px;
	color: #fff;
	background: #000;
	padding: 2px 4px;
	margin-left: 10px;
}
.base-main h1::after {
	content: "h1";
}
.base-main h2::after {
	content: "h2";
}
.base-main h3::after {
	content: "h3";
}
.base-main h4::after {
	content: "h4";
}
.base-main .h1::after {
	content: "class h1";
}
.base-main .h2::after {
	content: "class h2";
}
.base-main .h3::after {
	content: "class h3";
}
.base-main .h4::after {
	content: "class h4";
}
/* テスト用(一時スタイル) ↑↑↑↑↑ */
