@charset "utf-8";
/* CSS Document */
/* 共通 */
:root {
	--bgcolor-top01: #F9F9F9;
	--bgcolor-top02: #FFF;
	--bgcolor-earth01: #F5FAF2;
	--bgcolor-wellness01: #F1F7F9;
	--bgcolor-community01: #F9F5F2;
	--bgcolor-work01: #F6F4F9;
	--color-earth01: #6A9E4E;
	--color-wellness01: #6882BC;
	--color-community01: #E09D80;
	--color-work01: #8F73B2;
}
#main-img {
	max-width: 1200px;
	margin: 0 auto;
}
#contants-all {
	font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	font-size: 14px;
	color: #222;
	line-height: 2;
	padding-bottom: 80px;
}
#contants-all img {
	width: 100%;
	height: auto;
}
section {
	max-width: 750px;
	margin: 70px auto 0;
}
section.readarea {
	max-width: inherit;
	padding: 0;
	margin: 0 auto 40px;
	padding-top: 60px;
}
section.readarea h2 {
	font-size: 16px;
    font-weight: 500;
	margin: 0;
}
section.readarea h2 span {
	font-size: 33px;
	display: block;
    font-weight: 700;
}
section.readarea h2 + p {
	max-width: 980px;
	width: 89.3333%;
	margin: 0 auto;
	font-size: 18px;
	text-align: center;
	margin-top: 30px;
}
.pc { display: block;}
.sp { display: none;}

@media only screen and (max-width: 700px) {
	.pc { display: none;}
	.sp { display: block;}

	#contants-all {
		padding-bottom: 12%;
	    text-align: justify;
	}
	section.readarea {
		margin: 0 auto 10.5%;
		padding-top: 8.5%;
	}
	section.readarea h2 {
		font-size: 3.45vw;
		line-height: 1.6;
		margin-bottom: 30px;
	}
	section.readarea h2 span {
    	font-size: 5.6vw;
		margin-bottom: 10px;
	}
	section.readarea h2 + p {
		font-size: 4.28vw;
		/*text-align: justify;*/
		margin-top: 4%;
		font-weight: 500;
		line-height: 1.8;
	}
	hr.dotline {
		width: 46.6666%;
		height: 2px;
		margin: 10.5% auto;
		border: none;
		background-image: linear-gradient(to right, #777 45%, transparent 0);
		background-size: 6% 2px;
		background-repeat: repeat-x;
	}
}
@media only screen and (max-width: 500px) {
	#contants-all {
		font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;
		letter-spacing: 2px;
	}
	section.readarea h2 + p {
		line-height: 2;
		font-size: 3.5vw;
	}
}
/* 共通 end */

/* TOP　topics*/
.sdgs-top { background-color: var(--bgcolor-top01);}

section.topics {
	max-width: 980px;
	width: 89.3333%;
	margin: 0 auto 60px;
	padding: 50px;
	border-radius: 10px;
	border: 1px solid #F5F5F5;
	background: var(--bgcolor-top02);
	box-shadow: 0px 15px 32px 0px rgba(0, 0, 0, 0.02), 0px 59px 59px 0px rgba(0, 0, 0, 0.03), 0px 132px 79px 0px rgba(0, 0, 0, 0.01), 0px 235px 94px 0px rgba(0, 0, 0, 0.00), 0px 368px 103px 0px rgba(0, 0, 0, 0.00);
}
section.topics h2 {
	text-align: left;
	font-size: 16px;
	font-weight: 500;
	padding-bottom: 30px;
    margin: 0 0 0;
}
section.topics h2 span {
	display: inline-block;
	margin-right: 10px;
	font-size: 26px;
	font-weight: 700;
}
section.topics dl {
	font-size: 18px;
	font-weight: 400;
	line-height: 1.6;
	display: flex;
	flex-direction: row;
    justify-content: left;
    align-items: flex-start;
	position: relative;
}
section.topics a {
	display: block;
	margin-bottom: 20px;
}
section.topics a:last-of-type {
	/*margin-bottom: 0;*/
}
section.topics dt {
    padding-right: 5.8%;
}
section.topics dd {
	width: 77%;
    font-size: 16px;
	padding-right: 3%;
}
section.topics dl::after {
    content: "";
    display: inline-block;
    width: 10%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: absolute;
    top: 20%;
    right: 0%;
}
section.topics dl.cate_earth::after {
	background-image: url(/sdgs/img/top/icon_summary01.svg);
	height: 30px;
}
section.topics dl.cate_well::after {
	background-image: url(/sdgs/img/top/icon_summary02.svg);
	height: 20px;
}
section.topics dl.cate_com::after {
	background-image: url(/sdgs/img/top/icon_summary03.svg);
	height: 30px;
}
section.topics dl.cate_work::after {
	background-image: url(/sdgs/img/top/icon_summary04.svg);
	height: 30px;
}
@media only screen and (max-width: 1100px) {
	section.topics {
		margin: 0 auto 5.5%;
		padding: 4.54%;
	}
}
@media only screen and (max-width: 700px) {
	section.topics {
		margin: 0 auto;
		padding: 6% 5% 7%;
	}
	section.topics h2 {
		font-size: 3.6vw;
		padding-bottom: 5.4%;
	}
	section.topics h2 span {
		font-size: 6.45vw;
		margin-right: 3.5%;
	}
	section.topics dl {
		font-size: 4.9vw;
		flex-wrap: wrap;
		margin-bottom: 30px;
	}
	section.topics dt {
		width: 100%;
		padding-right: 0;
		font-weight: 500;
		line-height: 1.2;
		color: #777;
		font-size: 3.8vw;
	}
	section.topics dd {
		width: 100%;
		font-size: 4.3vw;
		padding-right: 0;
		padding-top: 2.7%;
	}
	section.topics dl::after {
		width: 18%;
		height: 8px;
		top: -5%;
		right: 0%;
	}
	section.topics a { margin-bottom: 6%;}
}
@media only screen and (max-width: 500px) {
	section.topics dt { letter-spacing: 0;}
	section.topics dd {
		font-size: 3.8vw;
		line-height: 1.8;
	}
}
/* TOP　topics end*/

/* TOP summary */
section.summary {
	max-width: 980px;
	width: 89.3333%;
	margin: 0 auto;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
	padding-top: 0;
}
section.summary article {
	width: 48.9795%;
	border-radius: 10px;
	border: 1px solid #F5F5F5;
	background: var(--bgcolor-top02);
	box-shadow: 0px 15px 32px 0px rgba(0, 0, 0, 0.02), 0px 59px 59px 0px rgba(0, 0, 0, 0.03), 0px 132px 79px 0px rgba(0, 0, 0, 0.01), 0px 235px 94px 0px rgba(0, 0, 0, 0.00), 0px 368px 103px 0px rgba(0, 0, 0, 0.00);
	padding: 24px 24px 30px;
    margin-top: 0;
    margin-bottom: 20px;
	text-align: center;
}
section.summary article h3 {
	font-size: 16px;
	line-height: 1.6;
}
section.summary article.earth h3 { color: var(--color-earth01);}
section.summary article.wellness h3 { color: var(--color-wellness01);}
section.summary article.community h3 { color: var(--color-community01);}
section.summary article.work h3 { color: var(--color-work01);}

section.summary article h3 span {
	font-size: 24px;
	font-weight: 700;
	line-height: 2;
	display: block;
	margin-bottom: -6px;
}
section.summary article h3::after {
	content: "";
	display: block;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}
section.summary article.earth h3::after {
	background-image: url(../img/top/icon_summary01.svg);
	width: 56px;
	height: 45px;
	margin: 9px auto 10px;
}
section.summary article.wellness h3::after {
	background-image: url(../img/top/icon_summary02.svg);
	width: 73px;
	height: 35px;
	margin: 14px auto 15px;
}
section.summary article.community h3::after {
	background-image: url(../img/top/icon_summary03.svg);
	width: 53px;
	height: 53px;
	margin: 3px auto 8px;
}
section.summary article.work h3::after {
	background-image: url(../img/top/icon_summary04.svg);
	width: 68px;
	height: 50px;
	margin: 6px auto 8px;
}
section.summary article p {
	height: 78px;
	margin-bottom: 10px;
	color: #777;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.6;
}
section.summary article:nth-of-type(3) p,
section.summary article:nth-of-type(4) p {
	height: 125px;
}
section.summary article div.btn {
	width: 240px;
	height: 40px;
	border-radius: 76px;
	margin: 0 auto;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
}
section.summary article.earth div.btn { border: 1.5px solid var(--color-earth01);}
section.summary article.wellness div.btn { border: 1.5px solid var(--color-wellness01);}
section.summary article.community div.btn { border: 1.5px solid var(--color-community01);}
section.summary article.work div.btn { border: 1.5px solid var(--color-work01);}

section.summary article div.btn span {
	font-size: 16px;
	font-weight: 500;
	display: inline-block;
	width: 87%;
	padding-right: 0%;
    padding-left: 0%;
}
section.summary article.earth div.btn span { color: var(--color-earth01);}
section.summary article.wellness div.btn span { color: var(--color-wellness01);}
section.summary article.community div.btn span { color: var(--color-community01);}
section.summary article.work div.btn span { color: var(--color-work01);}

section.summary article div.btn .i_box {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    right: 5%;
    width: 30px;
    height: 30px;
    margin-top: -14px;
}
section.summary article div.btn .i_box .one_i {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 9px;
    height: 9px;
}

section.summary article div.btn .i_box .one_i:before,
section.summary article div.btn .i_box .one_i::after {
    content: '';
    border-radius: 10px;
    width: 8.485px;
    height: 1.5px;
    position: absolute;
    top: 0px;
    left: 0px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(45deg);
    transform-origin: center center;
}
section.summary article.earth div.btn .i_box .one_i:before,
section.summary article.earth div.btn .i_box .one_i::after { background-color: var(--color-earth01);}
section.summary article.wellness div.btn .i_box .one_i:before,
section.summary article.wellness div.btn .i_box .one_i::after { background-color: var(--color-wellness01);}
section.summary article.community div.btn .i_box .one_i:before,
section.summary article.community div.btn .i_box .one_i::after { background-color: var(--color-community01);}
section.summary article.work div.btn .i_box .one_i:before,
section.summary article.work div.btn .i_box .one_i::after { background-color: var(--color-work01);}

section.summary article div.btn .i_box .one_i::before {
    width: 1.5px;
    height: 8.485px;
	top: 2px;
    left: 4px;
}
section.bnr-area {
    max-width: 980px;
	width: 89.3333%;
    margin: 40px auto 0;
	padding: 0;
}
section.bnr-area a { display: block;}
section.bnr-area a:nth-child(2) { padding-top: 40px;}
section.bnr-area img {
	box-shadow: 0px 9.30612px 21.06122px 0px rgba(0, 0, 0, 0.07), 0px 38.20408px 38.20408px 0px rgba(0, 0, 0, 0.05), 0px 85.71429px 51.42857px 0px rgba(0, 0, 0, 0.03), 0px 152.81633px 61.22449px 0px rgba(0, 0, 0, 0.01), 0px 238.53061px 66.61224px 0px rgba(0, 0, 0, 0.00);
}
@media only screen and (max-width: 1100px) {
	section.summary article h3 span { font-size: 2.18vw;}
	section.summary article { padding: 2.45% 2.45% 3.1%;}
	section.summary article p { height: 100px;}
	section.bnr-area a:nth-child(2) { padding-top: 4.1%;}
}
@media only screen and (max-width: 700px) {
	section.summary { display: block;}
	section.summary article {
		width: 100%;
		padding: 4.45% 6% 6%;
		margin-bottom: 3.2%;
	}
	section.summary article h3 {
	    font-weight: 500;
		font-size: 3.5vw;
	}
	section.summary article h3 span { font-size: 5.3vw;}
	section.summary article.earth h3::after {
		width: 17%;
		height: auto;
		padding: 6.4%;
		margin: 3% auto;
	}
	section.summary article p {
		height: auto;
		font-size: 3.5vw;
		letter-spacing: 0.5px;
		margin-bottom: 4.5%;
	}
	section.summary article:nth-of-type(3) p,
	section.summary article:nth-of-type(4) p {
		height: auto;
	}
	section.summary article div.btn span {
		font-size: 4.1vw;
		font-weight: 500;
	}
	section.summary article div.btn {
		width: 100%;
		height: 0;
	    padding: 8% 0;
	}
	section.summary article.earth div.btn {	border: 2px solid var(--color-earth01);}
	section.summary article.wellness div.btn {	border: 2px solid var(--color-wellness01);}
	section.summary article.community div.btn {	border: 2px solid var(--color-community01);}
	section.summary article.work div.btn {	border: 2px solid var(--color-work01);}

	section.summary article div.btn .i_box {
		top: 42%;
		right: 8%;
		width: auto;
		height: auto;
		margin-top: 0;
	}
	section.summary article div.btn .i_box .one_i {
		width: auto;
		height: auto;
	}
	section.summary article div.btn .i_box .one_i::before {
		width: 0.3vw;
		height: 3vw;
		top: 0.6vw;
		left: 1.4vw;
	}
	section.summary article div.btn .i_box .one_i::after {
		width: 3vw;
		height: 0.3vw;
	}
	section.summary article.wellness h3::after {
		width: 23.3%;
		height: 0;
		padding-top: 11.5%;
		margin: 3.8% auto 6%;
	}
	section.summary article.community h3::after {
		width: 15.6%;
	    height: 0;
    	padding-top: 19.5%;
    	margin: -1% auto 1.5%;
	}
	section.summary article.community h3 span {
		padding: 2% 0;
		line-height: 1.3;
	}
	section.summary article.work h3 span {
		padding: 2% 0;
		line-height: 1.3;
	}
	section.summary article.work h3::after {
		width: 19.7%;
		height: 0;
		padding-top: 14.6%;
		margin: 1.8% auto 5.1%;
	}
	section.bnr-area a:nth-child(2) { padding-top: 4.2%;}
}
@media only screen and (max-width: 500px) {
	section.summary article p { line-height: 1.8;}
}
/* TOP summary end */

/* 下層 */
#anchor01, #anchor02, #anchor03, #anchor04, #anchor05 {
	display: block;
	padding-top: 100px;
	margin-top: -100px;
}

.underlayer section.readarea {
	max-width: inherit;
    padding: 0 0 10px 0;
}
.underlayer section.readarea h2 { padding: 56px 0 30px;}
.underlayer section.readarea h2 span { font-size: 32px;}
.underlayer section.readarea h2 span.subtitle {
	font-size: 16px;
	font-weight: 500;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}
.underlayer section.readarea h2 + p { margin-top: 0;}

.underlayer section.readarea h2 span.subtitle::before,
.underlayer section.readarea h2 span.subtitle::after {
	content:"";
	display: inline-block;
	width: 44.5px;
	height: 1px;
	margin: 0 10px;
}
.underlayer section.readarea h2 span.subtitle::after { margin: 0 10px 0 5px;}

.underlayer section.contarea {
	max-width: 980px;
	width: 89.3333%;
	margin: 0 auto;
	padding-top: 14px;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
}
.underlayer section.contarea dl.contbox {
	max-width: 480px;
	width: 48.979592%;
    margin: 0 0 42px;
}
.underlayer section.contarea dl:nth-of-type(3),
.underlayer section.contarea dl:nth-of-type(4) {
    margin: 0;
}
.underlayer section.contarea dd {
	height: 280px;
    margin: 17px 0 0;
	border-radius: 10px;
	position: relative;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}
.underlayer section.contarea h3 {
	font-size: 20px;
	font-weight: 700;
	line-height: 1;
	border-left: solid 4px;
	padding-left: 9px;
}
.underlayer section.contarea h3 span { font-weight: 700;}
.underlayer section.contarea .contbox div.btn {
	width: 240px;
	height: 60px;
	line-height: 1.6;
	border-radius: 76px;
	margin: 0 auto;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	bottom: 7%;
	left: 50%;
	transform: translate(-50%, 0%);
	color: #FFF;
}
.underlayer section.contarea .contbox div.btn span {
	font-size: 16px;
	font-weight: 500;
	display: inline-block;
	width: 87%;
	padding-right: 0%;
    padding-left: 0%;
	text-align: center;
}
.underlayer section.contarea .contbox div.btn .i_box {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 41%;
    right: 13%;
}
.underlayer section.contarea .contbox div.btn .i_box .one_i {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.underlayer section.contarea .contbox div.btn .i_box .one_i:before,
.underlayer section.contarea .contbox div.btn .i_box .one_i::after {
    content: '';
    border-radius: 10px;
    width: 9px;
    height: 2px;
    position: absolute;
    top: 0px;
    left: 0px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(45deg);
    transform-origin: center center;
}
.underlayer section.contarea .contbox div.btn .i_box .one_i::before {
	width: 2px;
    height: 9px;
    top: 2px;
    left: 4px;
}

/* detail */
.underlayer .contarea-detail {
	max-width: 980px;
	width: 89.3333%;
	margin: 0 auto 80px;
	background-color: #FFF;
	border-radius: 10px;
	padding: 50px 50px 20px;
}
.underlayer .contarea-detail:last-child { margin: 0 auto 0;}
.underlayer .contarea_header {
	display: flex;
	flex-direction: row-reverse;
	justify-content: space-between;
	align-items: flex-start;
	margin-bottom: 20px;
}
.underlayer .contarea_header h3 {
	font-size: 26px;
	font-weight: 700;
	line-height: 1;
    border-left: solid 4px;
    padding-left: 14px;
}
.underlayer .contarea_header h3 span {
	font-size: 16px;
	font-weight: 700;
}
.underlayer .contarea_header p {
	font-size: 18px;
	font-weight: 500;
	line-height: 1.6;
	padding-top: 34px;
}
.underlayer ul.sdgsIconList {
	display: flex;
	flex-direction: row;
	justify-content: right;
	align-items: flex-start;
	margin-left: 3%;
}
.underlayer ul.sdgsIconList li {
	width: 130px;
	margin: 0 5px;
}
.underlayer ul.sdgsIconList li:last-child { margin: 0 0 0 5px;}
.underlayer ul.sdgsIconList li img { width: 100%;}
.underlayer .contarea-detail dl { padding-bottom: 30px;}
.underlayer .contarea-detail dt {
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 8px;
}
.underlayer .contarea-detail dd {
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
}
.underlayer .contarea-detail .contarea_pickup {
	margin: 10px 0 20px;
	display: flex;
}
.underlayer .contarea-detail .contarea_pickup span {
	display: inline-block;
	padding: 0 40px;
	color: #FFF;
	font-size: 16px;
	font-weight: 700;
	border-radius: 40px;
}
.underlayer .contarea-detail .contarea_pickup span.sp { display: none;}
.underlayer .contarea-detail .contarea_pickup dl {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	margin: 20px 0 0;
	box-sizing: border-box;
	padding-bottom: 0;
}
.underlayer .contarea-detail .contarea_pickup dt {
	width: 50px;
	margin-bottom: 5px;
	line-height: 1.6;
	font-weight: 400;
	font-size: 16px;
}
.underlayer .contarea-detail .contarea_pickup a dd {
	text-decoration-line: underline;
	text-decoration-color: #777;
}
.underlayer .contarea-detail .contarea_pickup dd {
	width: 85%;
	margin-bottom: 5px;
	line-height: 1.6;
	color: #777;
}
.underlayer .contarea-detail .contarea_pickup dd span { font-size: 14px;}
.underlayer .contarea-detail .contarea_pickup div:nth-of-type(1) { width: 67.045455%;}
.underlayer .contarea-detail .contarea_pickup div:nth-of-type(2) { width: 32.954545%;}
.underlayer .contarea_pickup ul {
	font-size: 16px;
	line-height: 1.6;
	margin-top: 20px;
	color: #777;
}
.underlayer .contarea_pickup a ul {
	text-decoration-line: underline;
	text-decoration-color: #777;
}
@media only screen and (max-width: 1100px) {
	#anchor01, #anchor02, #anchor03, #anchor04, #anchor05 {
		padding-top: 15%;
		margin-top: -15%;
	}
	.underlayer section.contarea h3 { font-size: 1.818vw;}
	.underlayer section.readarea { padding: 0;}
	.underlayer section.contarea dd {
		height: 0;
		padding: 29.35%;
		margin: 3.5% 0 8.8%;
	}
	.underlayer section.contarea { padding-top: 14px;}
	.underlayer .contarea-detail {
		max-width: 980px;
		width: 89.3333%;
		margin: 0 auto 7.25%;
		background-color: #FFF;
		border-radius: 10px;
		padding: 4.55% 4.55% 1.85%;
	}
	.underlayer .contarea_header { margin-bottom: 2.25%;}
	.underlayer .contarea_header h3 {
		padding-left: 2.42%;
		line-height: 1.3;
	}
	.underlayer .contarea_header p {
		padding-top: 5.3%;
		margin-bottom: 0.9%;
	}
	.underlayer ul.sdgsIconList li { width: 100px;}
	.underlayer .contarea-detail dt { margin-bottom: 0.9%;}
}
@media only screen and (max-width: 980px) {
	.underlayer ul.sdgsIconList li { width: 85px;}
}
@media only screen and (max-width: 700px) {
	.underlayer section.readarea h2 { padding: 9.7% 0 3%;}
	.underlayer section.readarea h2 span.subtitle::before,
	.underlayer section.readarea h2 span.subtitle::after {
		content: none;
		background-image: none;
	}
	.underlayer section.readarea h2 span.subtitle::after { margin:0;}
	.underlayer section.readarea h2 span { font-size: 5.85vw;}
	.underlayer section.readarea h2 span.subtitle {
		font-size: 3.5vw;
		padding-top: 0.7%;
	}
	.underlayer section.readarea h2 + p { text-align: center;}
	.underlayer section.contarea { display: block;	}
	.underlayer section.contarea h3 {
		font-size: 4.8vw;
		border-left: solid 0.87vw;
		padding-left: 2%;
	}
	.underlayer section.contarea h3 span { font-size: 3.45vw;}
	.underlayer section.contarea dl.contbox {
		max-width: 100%;
		width: 100%;
		margin: 0 0 10%;
	}
	.underlayer section.contarea dl.contbox:nth-of-type(4) { margin: 0;}
	.underlayer section.contarea dl.contbox dt { width: 100%;}
	.underlayer section.contarea dd {
		padding: 29.05%;
		margin: 2.7% 0 0;
	}
	.underlayer section.contarea .contbox div.btn {
		width: 88%;
		height: 0;
		padding: 7.2% 0;
		bottom: 9%;
	}
	.underlayer section.contarea .contbox div.btn span {
		font-size: 4.2vw;
		font-weight: 500;
	}
	.underlayer section.contarea .contbox div.btn .i_box {
		top: 42%;
		right: 8%;
		width: auto;
		height: auto;
		margin-top: 0;
	}
	.underlayer section.contarea .contbox div.btn .i_box .one_i {
		width: auto;
		height: auto;
	}
	.underlayer section.contarea .contbox div.btn .i_box .one_i::before {
		width: 0.3vw;
		height: 3vw;
		top: 0.6vw;
		left: 1.4vw;
	}
	.underlayer section.contarea .contbox div.btn .i_box .one_i::after {
		width: 3vw;
		height: 0.3vw;
	}
	.underlayer .contarea_header {
		flex-direction: column;
	}
	.underlayer .contarea-detail {
		padding: 7.7% 5.4% 1.85%;
	}
	.underlayer ul.sdgsIconList {
		margin-left: 0;
		justify-content: left;
		width: 100%;
		padding-bottom: 5%;
	}
	.underlayer ul.sdgsIconList li {
		width: 25.6%;
		padding-right: 2%;
		margin: 0;
	}
	.underlayer ul.sdgsIconList li:last-child { margin: 0;}
	.underlayer .contarea_header h3 {
		font-size: 4.85vw;
		border-left: solid 0.8vw;
	}
	.underlayer .contarea_header p {
		font-size: 4.33vw;
		padding-top: 2.5%;
		line-height: 1.55;
	}
	.underlayer .contarea-detail dl { padding-bottom: 6.5%;}
	.underlayer .contarea-detail dt, .underlayer .contarea-detail dd { font-size: 4.25vw;}
	.underlayer .contarea-detail .contarea_pickup {
		margin: 1% 0 6%;
		flex-direction: column-reverse;
	}
	.underlayer .contarea-detail .contarea_pickup span {
		font-size: 4.2vw;
		padding: 0 12%;
	}
	.underlayer .contarea-detail .contarea_pickup span.pc { display: none;}
	.underlayer .contarea-detail .contarea_pickup span.sp {
		display: inline-block;
		padding: 0 8%;
		margin-bottom: 4%;
	}
	.underlayer .contarea-detail .contarea_pickup div:nth-of-type(1) { width: 100%;}
	.underlayer .contarea-detail .contarea_pickup div:nth-of-type(2) { width: 100%;}
	.underlayer .contarea-detail .contarea_pickup dl { margin: 3% 0 0;}
	.underlayer .contarea-detail .contarea_pickup dt {
		width: 16%;
		margin-bottom: 1%;
		font-size: 4vw;
	}
	.underlayer .contarea-detail .contarea_pickup dd {
		width: 84%;
		margin-bottom: 1%;
		line-height: 1.6;
	}
	.underlayer .contarea_pickup ul {
		font-size: 4vw;
		margin-top: 3.6%;
		margin-bottom: 3%;
	}
	.underlayer .contarea_header h3 span { font-size: 3.75vw;}
}
@media only screen and (max-width: 500px) {
	.underlayer section.contarea .contbox div.btn {	padding: 25px 0;}
	.underlayer .contarea_header p { font-size: 3.8vw;}
	.underlayer .contarea-detail .contarea_pickup dt { letter-spacing: 0;}
	.underlayer .contarea-detail dt, .underlayer .contarea-detail dd { font-size: 3.8vw;}
}
/* 下層 end*/

/* Friendly for the Earth */
.earth { background-color: var(--bgcolor-earth01);}
.earth section.readarea h2 { color: var(--color-earth01);}

.earth section.readarea h2 span.subtitle::before,
.earth section.readarea h2 span.subtitle::after {
	background-image: linear-gradient(to right, var(--color-earth01) 100%, transparent 0);
}
.earth section.contarea h3 { color: var(--color-earth01);}

.earth section.contarea dl:first-of-type dd { background-image: url(../img/earth/top_image_pc01.webp);}
.earth section.contarea dl:nth-of-type(2) dd { background-image: url(../img/earth/top_image_pc02.webp);}
.earth section.contarea dl:nth-of-type(3) dd { background-image: url(../img/earth/top_image_pc03.webp);}
.earth section.contarea dl:nth-of-type(4) dd { background-image: url(../img/earth/top_image_pc04.webp);}

.earth section.contarea .contbox div.btn {
	border: 1.5px solid var(--color-earth01);
	background-color: var(--color-earth01);
}

.earth section.contarea .contbox div.btn .i_box .one_i:before,
.earth section.contarea .contbox div.btn .i_box .one_i::after { background-color: #FFF;}

.earth .contarea_header h3 { color: var(--color-earth01);}
.earth .contarea-detail dt { color: var(--color-earth01);}
.earth .contarea-detail .contarea_pickup span { background-color: var(--color-earth01);}

@media only screen and (max-width: 700px) {
	.earth section.contarea dl:first-of-type dd { background-image: url(../img/earth/top_image_sp01.webp);}
	.earth section.contarea dl:nth-of-type(2) dd { background-image: url(../img/earth/top_image_sp02.webp);}
	.earth section.contarea dl:nth-of-type(3) dd { background-image: url(../img/earth/top_image_sp03.webp);}
	.earth section.contarea dl:nth-of-type(4) dd { background-image: url(../img/earth/top_image_sp04.webp);}
	.earth section.contarea .contbox div.btn { border: 2px solid var(--color-earth01);}
}
/* Friendly for the Earth end */

/* Wellness for Everyone */
.wellness { background-color: var(--bgcolor-wellness01);}
.wellness section.readarea h2 { color: var(--color-wellness01);}

.wellness section.readarea h2 span.subtitle::before,
.wellness section.readarea h2 span.subtitle::after {
	background-image: linear-gradient(to right, var(--color-wellness01) 100%, transparent 0);
}
.wellness section.contarea h3 { color: var(--color-wellness01);}
.wellness section.contarea dl:nth-child(2) h3 { line-height: 1.4;}

.wellness section.contarea dl:first-of-type dd { background-image: url(../img/wellness/top_image_pc01.webp);}
.wellness section.contarea dl:nth-of-type(2) dd { background-image: url(../img/wellness/top_image_pc02.webp);}
.wellness section.contarea dl:nth-of-type(3) dd { background-image: url(../img/wellness/top_image_pc03.webp);}
.wellness section.contarea dl:nth-of-type(4) dd { background-image: url(../img/wellness/top_image_pc04.webp);}

.wellness section.contarea .contbox div.btn {
	border: 1.5px solid var(--color-wellness01);
	background-color: var(--color-wellness01);
}
.wellness section.contarea .contbox div.btn .i_box .one_i:before,
.wellness section.contarea .contbox div.btn .i_box .one_i::after { background-color: #FFF;}

.wellness .contarea_header h3 { color: var(--color-wellness01);}
.wellness .contarea-detail dt { color: var(--color-wellness01);}
.wellness .contarea-detail .contarea_pickup span { background-color: var(--color-wellness01);}

@media only screen and (max-width: 700px) {
	.wellness section.contarea dl:first-of-type dd { background-image: url(../img/wellness/top_image_sp01.webp);}
	.wellness section.contarea dl:nth-of-type(2) dd { background-image: url(../img/wellness/top_image_sp02.webp);}
	.wellness section.contarea dl:nth-of-type(3) dd { background-image: url(../img/wellness/top_image_sp03.webp);}
	.wellness section.contarea dl:nth-of-type(4) dd { background-image: url(../img/wellness/top_image_sp04.webp);}
	.wellness section.contarea .contbox div.btn { border: 2px solid var(--color-wellness01);}
}
/* Wellness for Everyone end */

/* Together with the Community */
.community { background-color: var(--bgcolor-community01);}
.community section.readarea h2 { color: var(--color-community01);}

.community section.readarea h2 span.subtitle::before,
.community section.readarea h2 span.subtitle::after {
	background-image: linear-gradient(to right, var(--color-community01) 100%, transparent 0);
}
.community section.contarea h3 { color: var(--color-community01);}

.underlayer section.contarea dl:nth-of-type(3),
.underlayer section.contarea dl:nth-of-type(4) { margin: 0 0 42px;}
.underlayer section.contarea dl:nth-of-type(5) { margin: 0;}

.community section.contarea dl:first-of-type dd { background-image: url(../img/community/top_image_pc01.webp);}
.community section.contarea dl:nth-of-type(2) dd { background-image: url(../img/community/top_image_pc02.webp);}
.community section.contarea dl:nth-of-type(3) dd { background-image: url(../img/community/top_image_pc03.webp);}
.community section.contarea dl:nth-of-type(4) dd { background-image: url(../img/community/top_image_pc04.webp);}
.community section.contarea dl:nth-of-type(5) dd { background-image: url(../img/community/top_image_pc05.webp);}

.community section.contarea .contbox div.btn {
	background-color: var(--color-community01);
	border: 1.5px solid var(--color-community01);
}
.community section.contarea .contbox div.btn .i_box .one_i:before,
.community section.contarea .contbox div.btn .i_box .one_i::after { background-color: #FFF;}

.community .contarea_header h3 { color: var(--color-community01);}
.community .contarea-detail dt { color: var(--color-community01);}
.community .contarea-detail .contarea_pickup span { background-color: var(--color-community01);}

@media only screen and (max-width: 700px) {
	.community section.contarea dl:nth-child(1) h3,
	.community section.contarea dl:nth-child(2) h3 { line-height: 1.4;}
	.community section.contarea dl:first-of-type dd { background-image: url(../img/community/top_image_sp01.webp);}
	.community section.contarea dl:nth-of-type(2) dd { background-image: url(../img/community/top_image_sp02.webp);}
	.community section.contarea dl:nth-of-type(3) dd { background-image: url(../img/community/top_image_sp03.webp);}
	.community section.contarea dl:nth-of-type(4) dd { background-image: url(../img/community/top_image_sp04.webp);}
	.community section.contarea dl:nth-of-type(5) dd { background-image: url(../img/community/top_image_sp05.webp);}
	.underlayer section.contarea dl.contbox:nth-of-type(4) { margin: 0 0 10%;}
	.underlayer section.contarea dl.contbox:nth-of-type(5) { margin: 0;}
	.community section.contarea .contbox div.btn { border: 2px solid var(--color-community01);}
}
/* Together with the Community end */

/* Growth Through Rewarding Work */
.work { background-color: var(--bgcolor-work01);}
.work section.readarea h2 { color: var(--color-work01);}

.work section.readarea h2 span.subtitle::before,
.work section.readarea h2 span.subtitle::after {
	background-image: linear-gradient(to right, var(--color-work01) 100%, transparent 0);
}
.work section.contarea h3 { color: var(--color-work01);}

.work section.contarea dl:first-of-type dd { background-image: url(../img/work/top_image_pc01.webp);}
.work section.contarea dl:nth-of-type(2) dd { background-image: url(../img/work/top_image_pc02.webp);}
.work section.contarea dl:nth-of-type(3) dd { background-image: url(../img/work/top_image_pc03.webp);}
.work section.contarea dl:nth-of-type(4) dd { background-image: url(../img/work/top_image_pc04.webp);}

.work section.contarea .contbox div.btn {
	border: 1.5px solid var(--color-work01);
	background-color: var(--color-work01)
}
.work section.contarea .contbox div.btn .i_box .one_i:before,
.work section.contarea .contbox div.btn .i_box .one_i::after { background-color: #FFF;}

.work .contarea_header h3 { color: var(--color-work01);}
.work .contarea-detail dt { color: var(--color-work01);}
.work .contarea-detail .contarea_pickup span { background-color: var(--color-work01);}

.work .contarea-detail .contarea_pickup ul + dl { margin: 0 0 0;}

@media only screen and (max-width: 700px) {
	.work section.contarea dl:first-of-type dd { background-image: url(../img/work/top_image_sp01.webp);}
	.work section.contarea dl:nth-of-type(2) dd { background-image: url(../img/work/top_image_sp02.webp);}
	.work section.contarea dl:nth-of-type(3) dd { background-image: url(../img/work/top_image_sp03.webp);}
	.work section.contarea dl:nth-of-type(4) dd { background-image: url(../img/work/top_image_sp04.webp);}
	.work section.contarea .contbox div.btn { border: 2px solid var(--color-work01);}
}
/* Growth Through Rewarding Work end */

@media only screen and (max-width: 700px) {
	/* 下層 */
	.underlayer .contbox dd{
		width: auto;
		display: block;
		padding: 0;
		margin: 20px auto 0;
	}
	/* 下層 end*/
}
/* mthr */
.mthr { background-color: var(--bgcolor-top01);}

.mthr section.readarea { margin: 0 auto 10px;}

.mthr .contarea-detail {
	clear: both;
	overflow: hidden;
	padding: 50px 50px 40px;
}
.mthr .contarea_header {
    display: block;
    margin-bottom: 20px;
}
.mthr .contarea_header h3 {
	width: 52.272727%;
    padding-right: 2.272727%;
	padding-left: 10px;
	color: var(--color-earth01);
	font-size: 24px;
	float: left;
}
.mthr .contarea-detail:last-child h3 { line-height: 1.6;}

.mthr .contarea_header picture {
	display: block;
	width: 45.454545%;
	float: right;
}
.mthr .contarea_header p {
	width: 52.272727%;
    padding-right: 2.272727%;
	padding-top: 22px;
	float: left;
}
.mthr .contarea_main {
	clear: both;
	padding-top: 22px;
}
.mthr h4 {
	color: var(--color-earth01);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.6;
	text-align: center;
	margin-bottom: 16px;
}
.mthr h4::before,
.mthr h4::after {
	content:"";
	display: inline-block;
	width: 60px;
	height: 1px;
	margin: 0 12px 6px;
	background-image: linear-gradient(to right, var(--color-earth01) 100%, transparent 0);
}
.mthr h4::after { margin: 0 10px 6px 11px;}

.mthr h5 {
	color: #666;
	text-align: center;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.44;
	margin-bottom: 10px;
	padding-left: 17%;
}
.mthr h5 span {
	font-size: 18px;
	font-weight: 700;
}
.mthr .flex-box {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
	padding: 0 3.41%;
}
.mthr div.graph { width: 29.757%;}
.mthr div.graph:nth-of-type(2) { width: 31.465%;}

.mthr .flex-box-inner {
	width: 100%;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	padding-bottom: 10px;
}
.mthr .flex-box-inner p {
	width: calc(100% - 81.967213%);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.1;
}
.mthr div.graph:nth-of-type(2) .flex-box-inner p {
	width: calc(100% - 77.51938%);
}
.mthr .flex-box-inner:first-of-type p { color: #3A6C1D;}
.mthr .flex-box-inner:last-of-type p { color: #A96F13;}

.mthr .flex-box-inner picture {
	width: 81.967213%;
	display: flex;
	align-items: flex-start;
}
.mthr div.graph:nth-of-type(2) .flex-box-inner picture { width: 77.51938%;}

.mthr .with-icon {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}
.mthr .with-icon figure.size30 { width: 13.17%;}
.mthr .with-icon figure.size33 { width: 14.37%;}
.mthr .with-icon figure.size34 { width: 14.115%;}
.mthr .with-icon figure.size35 { width: 15.365%;}
.mthr .with-icon figure.size36 { width: 15.805%;}

.mthr .with-icon h5 {
	text-align: left;
	padding-left: 6%;
}
.mthr .with-icon + .flex-box-inner { display: block;}
.mthr .with-icon + .flex-box-inner picture,
.mthr div.graph:nth-of-type(2) .with-icon + .flex-box-inner picture {
    width: 83.03%;
    margin: 0 auto;
}
.mthr .flex-box { padding: 0 6.5%;}

/*table共通*/
.mthr table {
	width: 100%;
	border-radius: 10px;
	border-spacing: 0;
	border-collapse: separate;
    border: none;
	font-size: 16px;
	line-height: 1.6;
	text-align: center;
	margin-bottom: 12px;
}
.mthr th,
.mthr td {
	width: 25%;
	vertical-align: middle;
	padding: 1.3% 2%;
	font-weight: 500;
}
.mthr td.small {
	font-size: 12px;
	font-weight: 500;
	line-height: 1.2;
	padding: 0.5% 0;
}
.mthr sub {
	font-size: 14px;
	color: #656565;
}
.mthr .table-caution {
	font-size: 12px;
	text-align: center;
	color: #656565;
}

/*ボーダー*/
.mthr table {
	border-top: 1px solid #D9D9D9;
	border-left: 1px solid #D9D9D9;
}
.mthr th, .mthr td {
	border-right: 1px solid #D9D9D9;
	border-bottom: 1px solid #D9D9D9;
}

/*セル色*/
.mthr table th:first-child { background-color: var(--color-earth01);}
.mthr table th { background-color: #87B170;}
.mthr table td:first-child { background-color: #87B170;}
.mthr table tbody tr:nth-child(odd) td:first-child { background-color: #87B170;}
.mthr table tbody tr:nth-child(even) td:first-child { background-color: var(--color-earth01);}
.mthr table tbody tr:nth-child(odd) td { background-color: #FFF;}
.mthr table tbody tr:nth-child(even) td { background-color: #F9F9F9;}

/*文字色*/
.mthr table th { color:#FFF;}
.mthr table tbody td:first-child { color:#FFF;}

/*角丸*/
.mthr th:first-child { border-radius: 10px 0 0 0;}
.mthr th:last-child { border-radius: 0 10px 0 0;}
.mthr tr:last-child td:first-child { border-radius: 0 0 0 10px;}
.mthr tr:last-child td:last-child { border-radius: 0 0 10px 0;}

@media only screen and (max-width: 1100px) {
	.mthr h5 { font-size: 1.25vw;}
	.mthr h5 span {	font-size: 1.63vw;}
	.mthr .flex-box-inner p { font-size: 1.25vw;}
}
@media only screen and (max-width: 700px) {
	.mthr section.readarea h2 {
		width: 89.333333%;
		margin: 0 auto;
		padding: 6.7% 0 8%;
	}
	.mthr .contarea_header h3,
	.mthr .contarea_header picture,
	.mthr .contarea_header p {
		float: none;
		width: 100%;
	}
	.mthr .contarea_header h3 {
		font-size: 5.3vw;
		line-height: 1;
		margin-bottom: 4.5%;
		padding-right: 0;
	}
	.mthr .contarea_header p {
		padding-top: 2%;
		padding-right: 0;
	}
	.mthr .contarea-detail {
		padding: 7.7% 5.4%;
		margin: 0 auto 3.25%;
	}
	.mthr h4 {
		font-size: 3.5vw;
		margin-bottom: 4%;
	}
	.mthr h4::before, .mthr h4::after {
		width: 14%;
		margin: 0 3% 1.4%;
	}
	.mthr table { font-size: 3.2vw;}
	.mthr th, .mthr td {
		padding: 3.65% 2%;
		letter-spacing: 0;
	}
	.mthr table tbody tr td:first-child {
		text-align: left;
		line-height: 1.2;
	}
	.mthr sub {
		font-size:2.5vw;
		padding-left: 4%;
	}
	.mthr td.small {
		font-size: 2.5vw;
		padding: 1.5% 1%;
		letter-spacing: 1px;
	}
	.mthr tbody tr:nth-child(2) td:last-child { line-height: 1.2;}
	.mthr .table-caution { font-size: 2.4vw;}
	.mthr .flex-box { display: block;}
	.mthr div.graph,
	.mthr div.graph:nth-of-type(2) {
		width: 100%;
		margin: 0 auto 3.5%;
	}
	.mthr div.graph:last-of-type { margin: 0 auto 0;}
	.mthr .flex-box-inner {	padding-bottom: 4%;}
	.mthr .flex-box-inner p {
		width: 16.5%;
		font-size: 3.7vw;
		text-align: right;
	}
	.mthr div.graph:nth-of-type(2) .flex-box-inner p { width: 19.5%;}
	.mthr .flex-box-inner picture {	width: 77.51938%;}
	.mthr h5 {
		font-size: 3.4vw;
	    margin-bottom: 3.3%;
		padding-left: 0;
	}
	.mthr h5 span {
		font-size: 4.2vw;
		display: inline;
	}
	.mthr .ver2 div.graph,
	.mthr .ver2 div.graph:nth-of-type(2) { width: 100%;}

	.mthr .ver2 .flex-box {	padding: 0 0;}
	.mthr .ver2 .flex-box-inner picture { display: block;}

	.mthr .with-icon + .flex-box-inner picture,
	.mthr div.graph:nth-of-type(2) .with-icon + .flex-box-inner picture {
		width: 100%;
	}
	.mthr .with-icon {
		justify-content: flex-start;
		padding-left: 2.5%;
	}
	.mthr .with-icon figure.size30 { width: 9.17%;}
	.mthr .with-icon figure.size33 { width: 9.5%;}
	.mthr .with-icon figure.size34 { width: 7.7%;}
	.mthr .with-icon figure.size35 { width: 9%;}
	.mthr .with-icon figure.size36 { width: 10.5%;}

	.mthr .with-icon h5 { padding-left: 4%;}
	.mthr .ver2 h4 { margin-bottom: 6%;}
	.mthr .ver2 .flex-box-inner { padding-bottom: 1%;}
	.mthr .contarea-detail:last-child h3 {line-height: 1.4;}
}
@media only screen and (max-width: 700px) {
	.mthr h4::before, .mthr h4::after { width: 10%;}
}
/* mthr end */