@charset "utf-8";
/* un_suTop */
.un_suTop_bg{
  background: url("/en/sustainability/img/index/bg_main.jpg") center no-repeat;
  text-align: center;
  padding: 100px 0 100px;
}
.un_suTop_tit{
  font-size: 22px;
  letter-spacing: 1px;
  line-height: 1.5;
}
@media only screen and (max-width:767px){
  .un_suTop_bg{
    height: auto;
    padding: 60px 5% 60px;
  }
  .un_suTop_tit{
    font-size: 18px;
  }  
}
/* un_suBnr */
.un_suBnr{
  display: flex;
  margin: -133px auto 0;
  background: rgba(255,255,255,.7);
  color: #333;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
}
.un_suBnr:hover{
  opacity: 1;
  background: rgba(255,255,255,1);  
}
.un_suBnr_right{
  text-align: center;
  padding: 62px 0 0;
}
.un_suBnr_right_tit{
  font-size: 24px;
  letter-spacing: 1px;
  font-weight: 500;
  margin: 20px auto 0;
}
.un_suBnr_right_btn{
  width: 367px;
  margin: 40px auto 0;
}
.un_suBnr .el_linkBtn{
  transition: all 0.2s ease-out;
}
.un_suBnr:hover .el_linkBtn{
  background: #3B9827!important;
  color: #FFF;
}
@media only screen and (max-width:767px){
  .un_suBnr{
    display: block;
    margin: -50px auto 0;
  }
  .un_suBnr_right{
    padding: 10px 5% 40px;
  }
  .un_suBnr_right_img{
    width: 50%;
    margin: 0 auto;
  }
  .un_suBnr_right_tit{
    font-size: 18px;
    margin: 0 auto 0;
  }
  .un_suBnr_right_btn{
    width: 80%;
    margin: 30px auto 0;
  }
}

/* un_suContents */
.un_suContents{
	display: flex;
  background: linear-gradient(180deg, #FFF 0%, #FFF 50%, #F3F3F3 50%, #F3F3F3 100%);
}
.un_suContents_item{
	width: calc(100% / 3);
	height: 580px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.un_suContents_item__1{
	background: url("/en/sustainability/img/index/img_contents_01.jpg") center /cover;
	margin-top: 200px;
}
.un_suContents_item__2{
	background: url("/en/sustainability/img/index/img_contents_02.jpg") center /cover;
	margin-top: 100px;
}
.un_suContents_item__3{
	background: url("/en/sustainability/img/index/img_contents_03.jpg") center /cover;
}
.un_suContents_item:hover{
  opacity: 1;
  background-size: cover;
}
.un_suContents_tit{
	font-size: 30px;
	color: #FFF;
	font-weight: 700;
	letter-spacing: 1px;
	margin: 25px auto 0;
}
.un_suContents_btnIndex{
	width: 370px;
	margin: 50px auto 0;
}
.un_suContents_item .el_linkBtn{
  transition: all 0.2s ease-out;
}
.un_suContents_item:hover .el_linkBtn{
  background: #3B9827!important;
  color: #FFF;
  border-color: #FFF;
}
.un_suContents_item:hover .el_linkBtn::before{
  background: #FFF;
}
.un_suContents_item:hover .el_linkBtn::after{
  border-left-color: #FFF;
}

@media only screen and (max-width:1500px){
	.un_suContents_item{
		height: 460px;
	}
}
@media only screen and (max-width:767px){
	.un_suContents{
		display: block;
	}
	.un_suContents_item{
		width: 100%;
		height: auto;
		min-height: 350px;
		padding: 30px 20px 40px;
	}
	.un_suContents_item__1{
		margin-top: 0;
	}
	.un_suContents_item__2{
		margin-top: 1px;
	}
	.un_suContents_item__3{
		margin-top: 1px;
	}
	.un_suContents_btnIndex{
		width: 100%;
	}
}