@charset "UTF-8";

/* サステナビリティ */
.sus .main-visual img {
	width: 100%;
}

.sus .content__wrapper {
	margin-top: 0;
}

.sus .box {
	padding: 40px 4%;
}

.sus .box p {
	padding-bottom: 20px;
}

.sus .m-title {
	color: var(--color-blue);
}

.sus .line-top__box .line-top__item:first-of-type {border-top: var(--color-lightgray) 1px solid;}

.sus .p-block__text h3{
	position: relative;
	padding-left: 50px;
	max-width: 480px;
}

.sus .p-block__text h3:before {
	position: absolute;
	content: "";
	width: 40px;
	height: 40px;
	background: url("../images/sust/ico_sust_act1.png") no-repeat center top;
	background-size: contain;
	top: -6px;
	left: 0;
	display: block;
}

.sus .no2 .p-block__text h3:before {
	background-image: url("../images/sust/ico_sust_act2.png");
}
.sus .no3 .p-block__text h3:before {
	background-image: url("../images/sust/ico_sust_act3.png");
}
.sus .no4 .p-block__text h3:before {
	background-image: url("../images/sust/ico_sust_act4.png");
}
.sus .no5 .p-block__text h3:before {
	background-image: url("../images/sust/ico_sust_act5.png");
}
.sus .no6 .p-block__text h3:before {
	background-image: url("../images/sust/ico_sust_act6.png");
}
.sus .no7 .p-block__text h3:before {
	background-image: url("../images/sust/ico_sust_act7.png");
}

.sus .line-top__item .tmb {
	width: 100%;
	padding: 20px 10% 0; 
}

.sus .line-top__item .tmb img {
  border-radius: 0;
	width: 31%;
	margin-right: 2%;
	margin-bottom: 2%;
}

.sus .link-btn {
	position: relative;
	margin-top: 20px;
}

.sus .link-btn a:before {
	display: inline-block;
	content: '\003E';
	margin-right: 3px;
	font-weight: bold;
}

.sus .link-btn a {
	display: inline-block;
	padding: 8px;
	font-size: var(--f16-size);
	font-weight: 600;
	letter-spacing: 2px;
	text-align: center;
	background: var(--color-blue);
	border-radius: 5px;
	color: var(--color-white);
	width: 100%;
}

.sus .sus-future h3 {
	font-size: var(--f22-size);
	color: var(--color-darkgray);
	margin-bottom: 5px;
}

.sus .sus-future .link-btn a {
	display: inline-block;
	width: 100%;
	padding: 10px 20px;
	font-size: var(--f16-size);
	font-weight: 600;
	letter-spacing: 2px;	
	text-align: center;
	background: var(--color-darkred);
	border-radius: 8px;
	color: var(--color-white);
}

.sus .sus-future {
	width: 100%;
	height: 0;
	padding-top: 52.9%;
	border-radius: 10px;
	position: relative;
	background: url('../images/sust/bg_future-80.jpg') no-repeat left top;
	background-size: contain;
	margin: 30px auto 260px;
}

.sus .sus-future .caption {
	width: 92%;
	padding: 8%;
	margin: -80px auto 80px;
	background: rgba(255,255,255,0.6);
	position: relative;
	box-shadow: 0px 0px 15px -5px var(--color-gray);
}

.sus .sus-future p {
	font-size: var(--f14-size);
}

.sus .l-wide .caption {
	width: 380px;
	padding-right: 0;
	float: left;
}

/* 雇用・労働への取り組み */
.employ p.intro-icon {
	position: relative;
	display: block;
	background: var(--color-whitesmoke);
	border-radius: 14px;
	margin: 0 auto;
	padding: 8px 10px;
	width: 340px;
	text-align: center;
	font-size: var(--f20-size);
	color: var(--color-gray);
	font-weight: 900;
}

.employ p.intro-icon:before {
	position: absolute;
	content: "";
	width:40px;
	height: 40px;
	display: block;
	background: url(../images/sust/ico_cat_employment.png) no-repeat left top;
	left: 20px;
	top: 58%;
	transform: translate(0, -50%);
	background-size: contain;
}

.employ p.intro-icon.-work:before {
	background-image: url(../images/sust/ico_cat_work.png);
}

.employ .l-title {
	font-size: var(--f32-size);
	margin-top: 16px;
	margin-bottom: -16px;
}

.employ .l-title {
	font-size: var(--f32-size);
	margin-top: 16px;
	margin-bottom: -16px;
}

.employ .catch-eruboshi {
	position: relative;
}

.employ .catch-eruboshi::after {
	position: absolute;
	content: "";
	width:76px;
	height: 73px;
	display: block;
	background: url(../images/sust/img_eruboshi.png) no-repeat left top;
	right: 5%;
	top: 30%;
	transform: translate(0, -50%);
	background-size: contain;
}

@media (min-width: 768px) {
	.employ .catch-eruboshi::after {
		width:88px;
		height: 97px;
	}
}

@media (min-width: 960px) {
	.employ .catch-eruboshi::after {
		right: -80px;
		top: -10%;
	}
}

/* 768px〜（スマホ＆タブレット用）
---------------------------*/
@media (min-width: 768px) {
	.sus .line-top__item {
		padding-left: 5%;
	}
	
	.sus .line-top__item .tmb {
		padding: 20px 0 0 8%;
	}
	
  .sus .flex .link-btn a {
		max-width: 214px;
	}

	.sus .link-btn a {
		padding: 4px;
		font-size: var(--f13-size);
	}
}

/* 960px〜（タブレット＆PC用）
---------------------------*/
@media (min-width: 960px) {
	.sus .box {
		max-width: 660px;
		margin: 0 auto;
		padding: 64px 2%;
	}
	
	.sus .box p {
		padding: 20px 0 40px;
	}
	
	.sus .sus-future {
		padding-top: 0;
		width: 760px;
		height: 400px;
		border-radius: 20px;
		margin-bottom: 0;
	}
	
	.sus .sus-future .caption {
		width: 340px;
		padding: 30px;
		position: absolute;
		top: 50%;
		left: 5%;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);	
		margin: 0 auto;
	}
	
  .sus .flex .link-btn a {
		max-width: 214px;
	}
	
	.sus .line-top__item .tmb img {
		width: 100px;
	}

	/* 雇用・労働への取り組み */
	
	.employ .flex {align-items: flex-start;}
	
	.flex .p-block__text.-half {
		width: 46%;
	}
	
	.flex .p-block__text.-half:first-child {
		margin-right: 8%;
	}
}
