

.sp{display:none !important;}

/* 共通 */
.sdgs_inner,
section.block {
	max-width: 1170px;
	width: 90%;
	margin:auto;
}

section.block{width:95%;}

.left{float: left;}

.right{float: right;}

.border-ttl::after{
	content: "";
	width: 100%;
	height:5px;
	display: block;
	margin: 27px auto 44px;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ff0000+21,d6d6d6+21 */
	background: #ff0000; /* Old browsers */
	background: -moz-linear-gradient(left, #ff0000 21%, #d6d6d6 21%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #ff0000 21%,#d6d6d6 21%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #ff0000 21%,#d6d6d6 21%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff0000', endColorstr='#d6d6d6',GradientType=1 ); /* IE6-9 */
}
.cnt{text-align: center;}

/* .main_visual */
.main_visual{
	border-bottom: 5px solid #d6d6d6;
	padding-top: 60px;
	padding-bottom:40px;
	margin-bottom:45px;
	letter-spacing: 0.15em;
	text-align: center;
}
.main_visual img{
	width: auto;
	max-width: 100%;
	margin: auto;
}



.lead h1,
.policy h2{
	font-size: 30px;
	font-weight: normal;
}
.lead .txt,
.policy ul{
	max-width:1111px;
	width: 90%;
	margin:auto;
	overflow: hidden;
}
.lead .txt .left{width: 70%;}

.lead .txt .right{width: 28%;}

/*.lead .txt .left p{*/
.lead .txt p{
	font-size: 20px;
	margin-bottom: 41px;
	line-height:1.82em;
	text-align: justify;
	letter-spacing: -0.01em;
}

.lead .txt .left p:last-child{margin-bottom: 0;}

.state{
	background-image:url(../../img/sdgs/state_bg.png);
	background-position:center bottom;
	background-repeat:repeat-x;
	padding: 42px 0 125px;
	margin-bottom: 40px;
}
.state h2{
	font-size:28px;
	letter-spacing: 0.175em;
	margin-bottom: 57px;
}
.state h2 strong{
	font-size:50px;
	background: -moz-linear-gradient(top, rgba(255,246,0,0) 0%, rgba(255,246,0,0) 39%, rgba(255,246,0,1) 40%, rgba(255,246,0,1) 82%, rgba(255,246,0,0) 83%, rgba(255,246,0,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(255,246,0,0) 0%,rgba(255,246,0,0) 39%,rgba(255,246,0,1) 40%,rgba(255,246,0,1) 82%,rgba(255,246,0,0) 83%,rgba(255,246,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(255,246,0,0) 0%,rgba(255,246,0,0) 39%,rgba(255,246,0,1) 40%,rgba(255,246,0,1) 82%,rgba(255,246,0,0) 83%,rgba(255,246,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00fff600', endColorstr='#00fff600',GradientType=0 ); /* IE6-9 */
	line-height: 1.2;
}	
.state ul{
	display: flex;
	align-items: center;
	justify-content: center;
}

.state li{
	margin: 0 10px;
	width: calc(16% - 20px);
	max-width: 136px;
}

/* section */

section.block{
	margin-bottom: 10px;
	overflow: hidden;
	padding-bottom: 11px;
}
section.block article{
	-moz-box-shadow: 11px 11px 0px 0px rgba(205, 205, 205, 1);
	-webkit-box-shadow: 11px 11px 0px 0px rgba(205, 205, 205, 1);
	-ms-box-shadow: 11px 11px 0px 0px rgba(205, 205, 205, 1);
	box-shadow: 11px 11px 0px 0px rgba(205, 205, 205, 1);
	border: 3px solid #cbcbcb;
	max-width: 1134px;
	width: 97%;
	margin: auto;
	padding:50px 30px 30px;
	overflow: hidden;
}
section.block h2{
	font-size: 30px;
	color: #fff;
	font-weight: normal;
	letter-spacing: 0.19em;
	position:relative;
	top: 30px;
	z-index:1;
	padding: 10px 10px 10px 34px;
}
section.block h2::before{
	content: "";
	width: 45px;
	height: 28px;
	display: inline-block;
	vertical-align: middle;
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center;
	margin-right: 17px;
	margin-top: -7px;
}
section.quality h2::before{background-image:url(../../img/sdgs/icon_quality.png);}
section.compliance h2::before{background-image:url(../../img/sdgs/icon_compliance.png);}
section.diversity h2::before{background-image:url(../../img/sdgs/icon_diversity.png);}
section.health h2::before{background-image:url(../../img/sdgs/icon_health.png);}
section.workstyle h2::before{background-image:url(../../img/sdgs/icon_workstyle.png);}
section.environment h2::before{background-image:url(../../img/sdgs/icon_environment.png);}
section.community h2::before{background-image:url(../../img/sdgs/icon_community.png);}
section.event h2::before{background-image:url(../../img/sdgs/icon_event.png);}

section.block h2::after,
section.block h2 span::after{
	content:"";
	position:absolute;
}
section.block h2::after{
	left: -30px;
	top:0;
	bottom:0;
	z-index:-1;
	width: 86%;
	height:100%;
	-webkit-transform: skewX(-45deg);
	transform: skewX(-45deg);
	-moz-box-shadow: 11px 7px 0px 0px rgba(205, 205, 205, 1);
	-webkit-box-shadow: 11px 7px 0px 0px rgba(205, 205, 205, 1);
	-ms-box-shadow: 11px 7px 0px 0px rgba(205, 205, 205, 1);
	box-shadow: 11px 7px 0px 0px rgb(205 205 205);
}
section.block h2 span::after{
	left: 0;
	bottom: calc(-100% + 48px);
	z-index: 0;
	box-sizing: border-box;
	border-style: solid;
	border-width: 7px 9px;
	border-color: #fff;
}

section.quality h2::after{background:#c5192d;}
section.quality h2 span::after{border-right-color:#911322;border-top-color:#911322;}

section.compliance h2::after{background:#d39206;}
section.compliance h2 span::after{border-right-color:#a16f05;border-top-color:#a16f05;}

section.diversity h2::after{background:#dd097b;}
section.diversity h2 span::after{border-right-color:#ab075e;border-top-color:#ab075e;}

section.health h2::after{background:#1b973a;}
section.health h2 span::after{border-right-color:#126326;border-top-color:#126326;}

section.workstyle h2::after{background:#e83418;}
section.workstyle h2 span::after{border-right-color:#b52812;border-top-color:#b52812;}

section.environment h2::after{background:#417836;}
section.environment h2 span::after{border-right-color:#25451f;border-top-color:#25451f;}

section.community h2::after{background:#f5a30b;}
section.community h2 span::after{border-right-color:#c28108;border-top-color:#c28108;}

section.event h2::after{background:#0075ba;}
section.event h2 span::after{border-right-color:#005687;border-top-color:#005687;}

section.block h2 span{
	font-size: 16px;
	letter-spacing: 0.185em;
	margin-left: 12px;
	vertical-align: middle;
}
section.block article p{
	font-size: 20px;
	letter-spacing: -0.07em;
	line-height: 1.8em;
	margin-bottom: 20px;
}
section.block article .img_block{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
}
section.block article .img_block ul{display: flex;}

section.block article .img_block .img_li{width: 63%;}

section.block article .img_block .img_li li:nth-child(odd){margin-right:8px;}

section.block article .img_block .icon{
	width: 33.6%;
	justify-content: flex-end;
}

section.block article .img_block .icon li{width: 25%;}

section.block article .half_block{
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 40px;
}

section.block article .half_block p{
	width: 40.8%;
	margin-bottom: 0;
}

section.block article .half_block:nth-child(even) p{
	-webkit-box-ordinal-group:1;
	-ms-flex-order:2;
	order:2;
}

section.block article .half_block .img_block .img_li{width: 100%;}

section.block.event article .left{width: 40.8%;}

section.block.event article .right{
	width: 54%;
	position: relative;
}
section.block.event article .right .img_li{
	flex-wrap: wrap;
	width: 100%;
	justify-content: space-between;
}
section.block.event article .right .img_li li{
	width: 49%;
	margin-right: 0;
}
section.block.event article .right .img_li li:nth-child(1),
section.block.event article .right .img_li li:nth-child(2){margin-bottom:14px;}

section.block.event article .icon{
	position: absolute;
	bottom: 0;
	right: calc(100% + 5.2%);
	width: 62.22%;
}
.policy{
	background: #f3f3f3;
	padding: 40px 0;
	margin:60px auto 70px;
}
.policy li{
	font-size: 20px;
	padding-left: 1em;
	text-indent: -0.5em;
	line-height: 2em;
}
.policy li::before{
	content: "・";
	display: inline-block;
	vertical-align: middle;
}
.policy li strong{
	position:relative;
	z-index:1;
	padding: 0 10px 0 20px;
	display: inline-block;
	margin-right: 10px;
}
.policy li strong::after{
	content:"";
	position:absolute;
	z-index:-1;
	left:0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	width:100%;
	height: 75%;
	background:#ffde00;
	-webkit-transform: skewX(-15deg);
	transform: skewX(-15deg);
}

/* IE */

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	section.block article .img_block .img_li li{display: block;}
}


@media screen and (min-width:769px) and ( max-width:1070px) {
	.community .img_block.right .img_li, .community .half_block .img_li  {
		flex-direction: column;
		align-items: center;
	}

	section.block.community article .img_block.right .img_li li:first-child,
	section.block.community article .half_block .img_li li:first-child {
		margin-bottom: 10px;
	}

	section.block.community article .half_block .left {
		    width: 57.8%;
	}

	section.block.community article .half_block p {
		    width: 50.8%;
	}

	section.block.event article {
		display: flex;
		flex-direction: column;
		position: relative;
	}

	section.block.event article .right {
    width: 54%;
    position: initial;
}

	section.block.event article .left {width: 100%;}

	section.block.event article .icon {
		right: 30px;
		bottom: 30px;
	}

	section.block.event article .icon li {width: 15%;}



}