/* CSS Document */
.c-catch_font{
	font-family:"Roboto","Noto Sans JP","メイリオ", Meiryo, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif;
}

.c-box_article.c-padding.c-border{
	padding-left: 24px;
	padding-right: 24px;
}

.c-list li{
  position: relative;
  padding-left: 1.25rem;
}
.c-list li::before{
  content: "●";
  display: inline-block;
  position: absolute;
  top:0px; left: 0px;
}

.social .c-list li::before{
  color: #305A9C;
}
.environment .c-list li::before{
  color: #248052;
}
.sustainability .c-list li::before{
  color: #B03648;
}

/*project*/
.p-theme_ctg{
  line-height: 1;
  padding: 0.375rem 0.75rem;
  background-color: #666;
  font-size: 0.9375rem;
  letter-spacing: 0.1em;
  color: #fff;
}

.p-theme_ctg.social,
.social .p-themes__num,
.social .p-sdgs__point__shoulder{
  background-color: #305A9C;
}
.p-theme_ctg.environment,
.environment .p-themes__num,
.environment .p-sdgs__point__shoulder{
  background-color: #248052;
}
.p-theme_ctg.sustainability,
.sustainability .p-themes__num,
.sustainability .p-sdgs__point__shoulder{
  background-color: #B03648;
}

.p-themes{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  font-size: 0.875rem;
  line-height: 1.5;
}
.p-themes.sustainability{
  border-bottom: #ccc 1px solid;
}
.p-themes>dt{
  flex: 0 0 auto;
  width: 3rem;
  border-bottom: #ccc 1px solid;
  padding: 0.5rem 0 0rem;
}
.p-themes>dt:last-of-type,
.p-themes>dd:last-of-type{
  border-bottom: none;
}
.p-themes>dd{
  flex: 0 0 auto;
  width: calc(100% - 3rem);
  border-bottom: #ccc 1px solid;
  padding: 0.5625rem 0 0.5625rem;
}

.p-themes__num{
  width: 2rem;
  padding: 0.25rem 0;
  margin-bottom: 0.25rem;
  font-family: Arial, Helvetica, "sans-serif";
  text-align: center;
  line-height: 1;
  font-weight: 600;
  color: #fff;
  background-color: #666;
}

.p-themes>dd li{
  padding-left: 1.125rem;
  position: relative;
}
.p-themes>dd li::before{
  content: "・";
  display: inline-block;
  position: absolute;
  left: 0px; top:0px;
}

/*materiality_process*/
.materiality_process{
	padding: 0;
}

.materiality_process li{
	margin: 0.25rem 0 0.25rem;
	padding: 0.5rem 0 0.5rem 2.5rem;
	position: relative;
}
.materiality_process li .num{
	display: block;
	position: absolute;
	line-height: 1;
	font-size: 0.9375rem;
	font-weight: bold;
	color: #fff;
	width: 2rem;
	left: 0px; top: 0.5rem;
	text-align: center;
	background-color: #1A356E;
	padding: 0.25rem 0;
}
.materiality_process li::after{
	display: block;
	content: "";
	position: absolute;
	width: 0; height: 0;
	box-sizing: content-box;
	border-width: 8px 6px 0px 6px;
	border-color: #9d9d9d transparent transparent transparent;
	border-style: solid;
	top:calc(100% - 3px);
	left: 10px;
}
.materiality_process li:last-of-type::after{
	display: none;
}

/*p-sdgs*/
.p-sdgs{
  margin-bottom: 1.875rem;
}
.p-sdgs_ctg{
  background-color: #666;
  line-height: 1;
  padding: 0.75rem 1rem;
  font-size: 1.3125rem;
  color: #fff;
  font-weight: bold;
  margin-top: 2.5rem;
  letter-spacing: 0.1em;
}
#main h3.p-sdgs_heading{
  font-size: 1.4375rem;
  font-weight: bold;
  line-height: 1.5;
  position: relative;
  padding-left: 3.5rem;
  margin-top: 2.25rem;
  margin-bottom: 2.5rem;
  padding-top: 1.375rem;
  border-top: #ccc 1px solid;
}
.p-sdgs_heading__num{
  position: absolute;
  display: inline-block;
  width: 2.5rem;
  padding: 0.75rem 0;
  top:1rem; left: 0px;
  text-align: center;
  line-height: 1;
  color: #fff;
  background-color: #666;
}

.p-sdgs__point{
  background-color: #EDEEF0;
  padding: 0.75rem 1.25rem 0.9375rem;
  border-radius: 4px;
  position: relative;
}
.p-sdgs__point.color.connect{
	margin-right:2rem;
	margin-left:2rem;
	margin-top:-2rem;
}

#main .p-sdgs__point h4{
  margin: 0;
  margin-bottom: 0.25rem;
}

.p-sdgs__point.color{
  margin-top: 0.5rem;
}
.social .p-sdgs__point.color{
  background-color: #D8E8F8;
}
.environment .p-sdgs__point.color{
  background-color: #DAEECE;
}
.sustainability .p-sdgs__point.color{
  background-color: #FFDECE;
}

.p-sdgs__point__shoulder{
  position: absolute;
  right:0px;
  top:0px;
  width: auto;
  background-color: #666;
  border-radius: 0px 4px 0px 4px;
  line-height: 1;
  letter-spacing: 0.1em;
  padding: 0.4375rem 0.75rem;
  font-size: 0.9375rem;
  color: #fff;
 /* font-weight: bold;*/
}
.sp .p-sdgs__point__shoulder{
  position: inherit;
  width: 100%;
  margin-bottom: 1rem;
  border-radius: 4px;
}


  /*p-sdgs_icons*/

.p-sdgs_icons{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 2.75rem;
}

.p-sdgs_icons dt{
  flex: 0 0 auto;
  width: auto;
  margin-right: 1.25rem;
}
.p-sdgs_icons dt h5{
  font-size: 1rem;
  line-height: 1.5;
  font-weight: bold;
}
.p-sdgs_icons dd{
  flex: 1 0 auto;
  width: 75%;
}
.p-sdgs_icons__list{
  display: flex;
  justify-content: flex-start;
}
.p-sdgs_icons__list li{
  display: inline-block;
  width: 80px;
}
.p-sdgs_icons__list li img{
  width: 100%;
  height: auto;
}


.social .p-sdgs_ctg,
.social .p-sdgs_heading__num{
  background-color: #305A9C;
}
#main .social h3.p-sdgs_heading{
  color: #305A9C
}

.environment .p-sdgs_ctg,
.environment .p-sdgs_heading__num{
  background-color: #248052;
}
#main .environment h3.p-sdgs_heading{
  color: #248052
}

.sustainability .p-sdgs_ctg,
.sustainability .p-sdgs_heading__num{
  background-color: #B03648;
}
#main .sustainability h3.p-sdgs_heading{
  color: #B03648
}


/*sp*/
.sp .p-themes>dt{
  width: 2rem;
}
.sp .p-themes>dd{
  width: 2rem;
  width: calc(100% - 2rem);
}

.sp #main .p-sdgs__point h4{
  margin: 0.5rem 0 0.25rem;
}

.sp .p-sdgs_icons{
  display: block;
}
.sp .p-sdgs_icons dt{
  text-align: center;
  margin-bottom: 0.5rem;
  margin-right: 0;
}
.sp .p-sdgs_icons dd{
  width: 100%;
  padding: 0 !important;
}
.sp .p-sdgs_icons__list{
  justify-content: center;
}
.sp .p-sdgs_icons__list li{
  width: calc(100%/6);
}

.sp .p-sdgs_image{
  text-align: center;
}
.sp .p-sdgs_image img{
  width: 75%;
}

.sp .p-sdgs__point.color.connect{
	margin-right:0;
	margin-left:0;
	margin-top:0.5rem;
}
