@charset "UTF-8";

.main {width:100%;height:300px;background-image:url("../sustainability/images/main.jpg");background-position:center;background-size:cover;position:relative;text-align:center;}
.main h1 {width:100%;font-size:44px;line-height:54px;color:#ffffff;font-family:'Noto Serif JP',serif;position:absolute;top:50%;left:50%;transform:translateY(-50%) translateX(-50%);-webkit-transform:translateY(-50%) translateX(-50%);}
.main h1 span {font-size:32px;line-height:42px;display:block;}
@media screen and (max-width:1060px) {
}
@media screen and (max-width:767px) {
.main {height:120px;}
.main h1 {font-size:18px;line-height:28px;color:#ffffff;}
.main h1 span {font-size:14px;line-height:20px;}
}

.sustainability{padding:60px 0;}
.sustainability > .inner{}
.sustainability .inner .top_title{ max-width:1080px;margin: 0 auto; box-sizing: border-box; font-size:35px;line-height:55px;color:#ca0915;font-weight:700;letter-spacing:2px;padding:0px 0px 5px;border-bottom:3px solid #ca0915 ;text-align:left;}
.sustainability .inner .text_box{}
.sustainability .inner .text_box p{font-size:16px;font-weight:700;line-height:28px; display: block;}
.sustainability .inner .text_box .caption{font-size:13px;font-weight:400;padding:0;}
.sustainability .inner .text_box.top_text{max-width:1080px;box-sizing: border-box; padding:25px;background:#f6ddde; margin: 0 auto 80px;}
.sustainability .inner .text_box.top_text p{font-size:21px;line-height:1.6;background:#f6ddde;text-align:center;padding:30px;}

.sustainability .inner .title_box{text-align: center; padding: 30px 0 0;}
.sustainability .inner .title{  text-align:center;line-height:1;display:inline-block;  border-bottom:3px solid;  border-image:linear-gradient(to right, #f5deb3 0%, #ca0915 100%);  border-image-slice:1;padding:10px;margin:0 auto 30px!important; background: #FFF;}
.sustainability .inner .title span{font-size:28px;font-weight:700;margin-bottom:20px;  letter-spacing:0.1em;}
.sustainability .inner ul{display: block; padding: 0 0 80px;}
.sustainability .inner ul li{box-sizing:border-box; padding:0 10px;}
.sustainability .inner ul li > .inner{background:#FFF;padding:40px 40px; max-width:1080px; margin:0 auto; text-align:left; box-sizing: border-box;}
.sustainability .inner ul li:nth-child(odd) .inner{background:#f1f1f1;}
.sustainability .inner ul li > .inner h3{font-size:28px;font-weight:700;margin-bottom:20px;  letter-spacing:0.1em;}
.sustainability .inner ul li > .inner h4{font-size:22px;font-weight:700;margin-bottom:20px;  letter-spacing:0.1em;}
.sustainability .inner ul li .icon{padding:0 0 20px; text-align: center;}
.sustainability .inner ul li .icon img{ width:100%; max-width:120px; height:auto; margin: 0 0 15px;}
.sustainability .inner ul li .icon img + img{ margin-left:15px;}


.sustainability .inner .sustainability_list{margin:0 auto 30px; width: 100%; max-width:1080px;}
.sustainability .inner .sustainability_list .img_box{margin:0 auto 30px;width:100%;max-width:600px; padding:0 10px; box-sizing:border-box;}
.sustainability .inner .sustainability_list .img_box img{width:100%;height:auto;}
.sustainability .inner .sustainability_list ul{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:flex-start;padding:0 5px;}
.sustainability .inner .sustainability_list ul li{width:12.5%;box-sizing:border-box;padding:0 5px;}
.sustainability .inner .sustainability_list ul li:nth-child(6n){margin-right:0;}
.sustainability .inner .sustainability_list ul li .photo_box{}
.sustainability .inner .sustainability_list ul li .photo_box img{width:100%;height:auto;position:relative;overflow:hidden;margin-bottom:15px;}

.sustainability .inner .flex{display: flex; align-items: center;padding:60px 0 0; flex-direction: row-reverse;}
.sustainability .inner .flex .text_box{width:50%; box-sizing: border-box;padding:0 30px 0 0;}
.sustainability .inner .flex .text_box .under_line{display: inline-block; padding: 0 0 5px; margin:0 0 5px; border-bottom:1px solid #000;}
.sustainability .inner .flex .img_box{width:50%; box-sizing: border-box;}
.sustainability .inner .flex .img_box img{width: 100%; max-width:600px; height: auto; box-sizing: border-box; padding: 10px; border: 1px solid #CCC;}

@media screen and (max-width:767px) {
.sustainability .inner .flex{display:block;padding:30px 0 0;}
.sustainability .inner .flex .text_box{width:auto;padding:0;}
.sustainability .inner .flex .img_box{width:auto;padding:0 0 20px;}
.sustainability .inner .flex .img_box img{}	
}

/*
.sustainability .inner .bg_color{background:#f1f1f1; padding:80px 0 0; margin: 0 0 80px;}
.sustainability .inner .bg_color ul{margin: 0 0 40px;}
.sustainability .inner .bg_color ul li > .inner{border-top: 1px solid #CCC;}
.sustainability .inner .bg_color ul li:nth-child(odd) .inner{background:#FFF;}
.sustainability .inner .bg_color ul li:nth-child(even) .inner{background:#f1f1f1;}
*/
@media screen and (max-width:1060px) {
}

@media screen and (max-width:767px) {
.sustainability{padding:30px 0;}
.sustainability > .inner{}
.sustainability .inner .top_title{font-size:20px;line-height:1.2;letter-spacing:0.3em;padding:0px 10px 5px;border-bottom:3px solid #ca0915;}

.sustainability .inner .title_box .title{margin-bottom:0!important;}
.sustainability .inner .text_box{}
.sustainability .inner .text_box p{font-size:14px;line-height:1.6;}
.sustainability .inner .text_box .caption{font-size:11px;padding: 0 5px;}
.sustainability .inner .text_box.top_text{padding:20px 10px; margin: 0 auto 40px;}
.sustainability .inner .text_box.top_text p{font-size:16px;padding:0; text-align: left;}
.sustainability .inner .text_box.top_text p br{display: none;}
.sustainability .inner .title{padding:10px;margin: 0 10px 20px;}
.sustainability .inner .title span{font-size:18px;margin-bottom:20px;}
.sustainability .inner ul{padding:0;}
.sustainability .inner ul li{}
.sustainability .inner ul li > .inner{padding:20px 20px 30px;}
.sustainability .inner ul li:nth-child(odd) .inner{}
.sustainability .inner ul li > .inner h3{font-size:18px;margin-bottom:10px;line-height: 1.2;}
.sustainability .inner ul li > .inner h4{font-size:16px;margin-bottom:10px;line-height: 1.2;}
.sustainability .inner ul li .icon{padding:0 0 20px;}
.sustainability .inner ul li .icon img{max-width:90px;margin: 0 0 10px;}
.sustainability .inner ul li .icon img + img{ margin-left:5px;}


.sustainability .inner .sustainability_list .img_box{max-width:300px;}
.sustainability .inner .sustainability_list ul li{width:25%;}

.sustainability .inner .bg_color{padding:40px 0 0;}	
/*
.sustainability .inner .bg_color{padding:40px 0 0; margin: 0 0 40px;}
.sustainability .inner .bg_color ul li > .inner{border-top:none;}
.sustainability .inner .bg_color ul li:nth-child(odd) .inner{}
.sustainability .inner .bg_color ul li:nth-child(even) .inner{}
	*/
}
