/* cmn */
#bg-sustainability{
	background-image: url(../img/header/header-sustainability.jpg);
}
.page-nav_sustainability li:nth-last-child(2){
	width: 120%;
}

/* csr -------------------*/

#csr{
	padding-bottom: 100px;
	position: relative;
	width: 960px;
}
#csr .outer{
	padding-bottom: 100px;
	position: relative;
	width: 100%;
}
#csr .outer h3{
	padding-bottom: 30px;
	font-size: 18px;
	font-size: 1.8rem;
	letter-spacing: 0.3em;
	text-align: left;
	color: #000;
}
#csr .outer .text{
	padding-bottom: 20px;
	font-size: 15px;
	font-size: 1.5rem;
	line-height: 1.8;
	text-align: justify;
	text-justify: inter-ideograph;
}
#csr .outer .pic{
	display: -webkit-flexbox;
	display: -webkit-flex;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -moz-flexbox;
	display: -moz-flex;
	display: -moz-box;
	-js-display: flex;
	display: flex;
	-webkit-justify-content: space-between; /* Safari */
	justify-content: space-between;
	align-items: flex-start;	/* 画像の横縦比固定 */
	flex-wrap: wrap; /* 折り返し */
}
#csr .item{
	display: flex;
	justify-content: space-between;
}
#csr .item .text{
	padding-bottom: 20px;
	font-size: 15px;
	line-height: 1.8;
	text-align: justify;
	text-justify: inter-ideograph;
}
#csr .item .text{
	width: 70%;
}
#csr .item .pic{
	width: 25%;
}

@media screen and (max-width: 1080px){
	#csr{
		padding-bottom: 50px;
		width: 90%;
	}
	#csr .outer{
		padding-bottom: 70px;
	}
	#csr .outer h3{
		padding-bottom: 20px;
		font-size: 16px;
		font-size: 1.6rem;
	}
	#csr .outer .text{
		font-size: 14px;
		font-size: 1.4rem;
	}
	#csr .outer .pic img{
		width: 33.33333%;
		height: auto;
	}
	#csr .outer .pic img.widthx2{
		width: 63%;
	}
	#csr .item .text{
		padding-bottom: 20px;
		font-size: 14px;
	}
	#csr .outer .item .pic img{
		width: 100%;
		height: auto;
	}
}
@media screen and (max-width: 650px){
	#csr{
		padding: 50px 0 20px;
	}
	#csr .outer{
		padding-bottom: 50px;
	}
	#csr .outer h3{
		padding-bottom: 4%;
		font-size: 14px;
		font-size: 1.4rem;
		line-height: 1.5;
		letter-spacing: 0.15em;
	}
	#csr .outer .text{
		padding-bottom: 4%;
		font-size: 12px;
		font-size: 1.2rem;
	}
	#csr .item{
		display: block;
	}
	#csr .item .text{
		width: 100%;
		padding-bottom: 5%;
		font-size: 12px;
	}
	#csr .item .pic{
		width: 100%;
	}
	#csr .outer .item .pic img{
		width: 50%;
		margin: 0 auto;
	}
}


/* sdgs -------------------*/

#sdgs{
	padding-bottom: 50px;
	position: relative;
	width: 960px;
}
#sdgs .outer{
	padding-bottom: 100px;
	position: relative;
	width: 100%;
}
#sdgs .outer h3{
	padding-bottom: 30px;
	font-size: 18px;
	letter-spacing: 0.3em;
	text-align: left;
	color: #000;
}
#sdgs .item{
	display: flex;
	justify-content: space-between;
}
#sdgs .item .text{
	padding-bottom: 20px;
	font-size: 15px;
	line-height: 1.8;
	text-align: justify;
	text-justify: inter-ideograph;
}
#sdgs .item-1 .text{
	width: 50%;
}
#sdgs .item-1 .pic{
	width: 45%;
}
#sdgs .item-2 .text{
	width: 70%;
}
#sdgs .item-2 .pic{
	width: 25%;
}
#sdgs .goal{
	text-align: left;
}
#sdgs .goal h4{
	padding: 14px;
	letter-spacing: 0.25em;
	background-color: #eee;
}
#sdgs .goal ul{
	padding: 20px 0;
	line-height: 1.8;
	text-indent: -1em;
	padding-left: 1em;
}
.sdgs-icon{
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	padding-bottom: 60px;
}
.sdgs-icon img{
	width: 11.11%;
	height: auto;
}
@media screen and (max-width: 1080px){
	#sdgs{
		width: 90%;
	}
	#sdgs .outer{
		padding-bottom: 70px;
	}
	#sdgs .outer h3{
		padding-bottom: 20px;
		font-size: 17px;
	}
	#sdgs .goal ul{
		padding: 2% 0;
		text-indent: -1em;
		padding-left: 1em;
	}
	.sdgs-icon img{
		width: 11.11%;
		height: auto;
	}
	#sdgs .item .text{
		padding-bottom: 20px;
		font-size: 14px;
	}
}
@media screen and (max-width: 650px){
	#sdgs{
		padding: 50px 0 0;
	}
	#sdgs .outer{
		padding-bottom: 50px;
	}
	#sdgs .outer h3{
		padding-bottom: 4%;
		font-size: 14px;
		line-height: 1.5;
		letter-spacing: 0.15em;
	}
	#sdgs .item{
		display: block;
	}
	#sdgs .item .text,
	#sdgs .item .pic{
		width: 100%;
	}
	#sdgs .item-2 .pic{
		width: 40%;
		margin: 0 auto;
	}
	#sdgs .goal h4{
		padding: 3% 4%;
	}
	.sdgs-icon{
		padding-bottom: 7%;
	}
	.sdgs-icon img{
		width: 16.66%;
		height: auto;
	}
}

/* sbt -------------------*/

#sbt{
	padding-bottom: 50px;
	position: relative;
	width: 960px;
}
#sbt .outer{
	padding-bottom: 100px;
	position: relative;
	width: 100%;
}
#sbt .outer h3{
	padding-bottom: 30px;
	font-size: 18px;
	line-height: 1.5;
	letter-spacing: 0.3em;
	color: #000;
}
#sbt .item{
	display: flex;
	justify-content: space-between;
}
#sbt .item .text{
	padding-bottom: 20px;
	font-size: 15px;
	line-height: 1.8;
	text-align: justify;
	text-justify: inter-ideograph;
	width: 60%;
}
#sbt .item .pic{
	width: 30%;
}
#sbt .sbt_goal{
	background-color: #eee;
	padding: 5%;
}
#sbt .sbt_goal .sbt_goal_in{
	background-color: #fff;
	padding: 5% 0 3%;
}
#sbt .sbt_goal .pic{
	margin: 0 auto;
	width: min(60%,440px);
}
#sbt .text_s{
	text-align: justify;
	font-size: 13px;
	line-height: 1.6;
	padding: 20px 0;
}
#sbt .text_s p + p{
	padding-top: 10px;
}
#sbt table{
	width: 100%;
	margin-top: 10px;
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
}
#sbt table th,
#sbt table td{
	padding: 16px 0;
	font-size: 15px;
	line-height: 1.3;
	font-weight: normal;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
#sbt table th{
	color: #fff;
	background-color: #555;
}
#sbt table td{
	vertical-align: middle;
}
#sbt table .ghg__target,
#sbt table .ghg__actual{
	color: #fff;
	font-weight: bold;
	writing-mode: vertical-rl; /* 右から左に縦書き */
	text-orientation: upright; /* 文字を立てて表示 */
	letter-spacing: 0.3em;
	padding-right: 0.15em;/* 右側の余白 */
}
#sbt table .ghg__target{
	background-color: #888;
}
#sbt table .ghg__actual{
	background-color: #6ec85a;
}
#sbt table .ghg__target_tit{
	background-color: #f4f4f4;
}
#sbt table .ghg__actual_tit{
	background-color: rgba(110,200,90,0.15);
}
#sbt table td:last-child{
	background-color: #fffff1;
}
#sbt p.small{
	text-align: left;
	margin-top: 20px;
	font-size: 13px;
}

@media screen and (max-width: 1080px){
	#sbt{
		width: 90%;
	}
	#sbt .outer{
		padding-bottom: 70px;
	}
	#sbt .outer h3{
		padding-bottom: 20px;
		font-size: 17px;
	}
	#sdgs .item .text{
		padding-bottom: 20px;
		font-size: 14px;
	}
	#sbt table th,
	#sbt table td{
		padding: 16px 2px;
	}
	#sbt table .ghg__target,
	#sbt table .ghg__actual{
		padding-right: 0.3em;/* 右側の余白 */
	}
}
@media screen and (max-width: 650px){
	#sbt{
		padding: 50px 0 0;
	}
	#sbt .outer{
		padding-bottom: 50px;
	}
	#sbt .outer h3{
		padding-bottom: 4%;
		font-size: 14px;
		line-height: 1.5;
		letter-spacing: 0.15em;
	}
	#sbt .item{
		display: block;
	}
	#sbt .item .text{
		width: 100%;
	}
	#sbt .item .pic{
		width: min(50%,180px);
		margin: 0 auto;
	}
	#sbt .sbt_goal .pic{
		width: min(60%,440px);
	}
	#sbt .text_s{
		font-size: 10px;
	}
	#sbt table td br{
		display: none;
	}
	#sbt table th,
	#sbt table td{
		padding: 12px 4px;
		font-size: 12px;
	}
	#sbt table .ghg__target,
	#sbt table .ghg__actual{
		padding-right: 0.5em;/* 右側の余白 */
	}
	#sbt p.small{
		margin-top: 3%;
		font-size: 10px;
	}
}