@charset "utf-8";


body{
 font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック","MS PGothic", sans-serif;
 }


button {
  border: none;
  background: none;
  padding: 0;
  appearance: none;
  -webkit-appearance: none;
}

.inline_bk{display: inline-block;}

.sus_bg{
/*outline: 2px dashed red;*/
background: url("/corporate/sustainability/figure/index/img_01.png") no-repeat center top;
background-size: contain;
padding-top: 18.229vw;
}

@media only screen and (max-width:1920px){
.sus_bg{
background-size: 1920px auto;
padding-top: 350px;
}
}/*1920*/

@media only screen and (max-width: 767px) {
.sus_bg{
background: url("/corporate/sustainability/figure/index/img_01.png") no-repeat center top;
background-size:contain;
padding-top: 20vw;
width: 100%;
}

}/*767*/


.sus_bg .in_container{
/*outline: 2px dashed red;*/
width:1000px;
margin-left: auto;
margin-right: auto;
}
@media only screen and (max-width: 767px) {
.sus_bg .in_container{
width:auto;
margin-left: 2.667vw;
margin-right: 2.667vw;
}

}/*767*/

.sus_bg .in_container .lead{
font-size: 2.6rem;
color: #003894;
font-weight: bold;
text-align: center;
}
@media only screen and (max-width: 767px) {
.sus_bg .in_container .lead{
font-size:clamp(18px, calc(1.02vw + 14.173px), 22px);
}

}/*767*/


.fs_80per{font-size: 80%;}





/* メッセージ　特集　about
=========================================== */
.sus_bg .about{
}

.sus_bg .about .in_container{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
	align-items:stretch; 
}
.sus_bg .about .in_container>div a{
border:5px solid #FCC800;
display: block;
border-radius: 5px;
text-decoration: none;
background: #FCC800;
}

.sus_bg .about .in_container>div a:hover{
opacity: .7;
}

.sus_bg .about .in_container>div .txt{
padding: 10px;
background:#FCC800;
min-height: 147px;
}

.sus_bg .about .in_container>div .txt h2{
font-size: 20px;
font-weight: bold;
color:#003894;
}
.sus_bg .about .in_container>div .txt h2::after{
content:'';
display:inline-block;
background:url(/corporate/sustainability/figure/index/arrow_G.svg) no-repeat center center;
height:16px;
width:16px;
margin-left: 5px;
}

.sus_bg .about .in_container>div .txt p{
font-size: 16px;
font-weight: bold;
color: #000;
margin-top: .5em;
}


@media only screen and (max-width: 767px) {

.sus_bg .about .in_container{
grid-template-columns: 1fr;
gap: 3rem;
width:90%;
margin-left:auto;
margin-right:auto;
}
.sus_bg .about .in_container>div.massage .txt{
min-height: auto;
}
.sus_bg .about .in_container>div.slide_wrapper .txt{
min-height: auto;
}

}/*767*/


@media only screen and (max-width: 500px) {
.sus_bg .about .in_container>div.slide_wrapper .txt{
min-height:163px;
}
}/*500*/

@media only screen and (max-width: 390px) {
.sus_bg .about .in_container{
width:auto;
margin-left: 2.667vw;
margin-right: 2.667vw;
}

.sus_bg .about .in_container>div.slide_wrapper .txt{
min-height:163px;
}

}/*390*/



/* スライダー用  ===================== */
.slide_wrapper {
  overflow: hidden;
  position: relative;
}

.slide_track {
  display: flex;
  transition: transform 0.5s ease;
  will-change: transform;
}

.slide_item {
  min-width: 100%;
  box-sizing: border-box;
}

.slide_nav {
  display: flex;
  justify-content: center;
  margin-top: 1rem;
}

/*　●●●●●　*/

.slide_nav button {
  width: 10px;
  height: 10px;
  margin: 0 5px;
  border-radius: 50%;
  border: none;
  background-color: #ccc;
  cursor: pointer;
}
.slide_nav button.active {
  background-color: #003894;
}


/*　左右　＜＞　*/
.slide_arrow {
  position: absolute;
  top: 30%;
  width: 35px;
  height: 70px;
  background-color: #FCC800;
  border: none;
  cursor: pointer;
  z-index: 10;
  padding: 0;
}

/* 矢印は疑似要素にする */
.slide_arrow::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url('/corporate/sustainability/figure/index/arrow_E.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

/* 左 */
.slide_arrow.prev {
  left: 0;
  border-top-right-radius: 40px;
  border-bottom-right-radius: 40px;
}

/* ← ここだけ反転 */
.slide_arrow.prev::before {
  transform: scaleX(-1);
}

/* 右 */
.slide_arrow.next {
  right: 0;
  border-top-left-radius: 40px;
  border-bottom-left-radius: 40px;
}




/* news
=========================================== */
.sus_bg .news .in_container{
border:2px solid #003894;
border-radius:30px;
padding: 28px 22px;
}

.sus_bg .news .in_container .news_h2{
/*outline: 1px dashed red;*/
height: 60px;
display: flex;
justify-content: space-between;
gap: 20px;
align-items: flex-end; /*画像の間延び禁止*/

background:url(/corporate/sustainability/figure/index/img_04.png) no-repeat left bottom / contain;
border-bottom:2px solid #80B927;
}

.sus_bg .news .in_container .news_h2 h2{
font-size: 20px;
color: #15489C;
font-weight: bold;
margin-left: 90px;
}

.sus_bg .news .in_container .news_h2 button{
margin-bottom:8px;
}

.sus_bg .news .in_container .news_h2 button a{
font-size: 14px;
font-weight: bold;
background: #fff;
color: #15489C;
display: block;
border:1px solid #003894;
border-radius: 5px;
padding: 7px 10px;
text-decoration: none;
}
.sus_bg .news .in_container .news_h2 button a:hover{
outline:1px solid #003894;
}

.ico_next{
display: inline-block;
background:url(/corporate/sustainability/figure/index/arrow_G.svg) no-repeat center center;
height:14px;
width:14px;
margin-left: 5px;
vertical-align:-10%;
}

/* ul */
.sus_bg .news .in_container ul{
/*outline: 1px dashed red;*/
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap:20px ;
margin-top: 30px;
}

.sus_bg .news .in_container ul>li{
}


.sus_bg .news .in_container ul > li a {
border:1px solid #023894;
border-radius: 20px;
padding: 20px;
  display: block;
  color: inherit;
  text-decoration: none;
  height: 100%;
}
.sus_bg .news .in_container ul > li a:hover{
outline: 1px solid #023894;
}

.sus_bg .news .in_container ul > li figure {
  margin: 0 0 20px;
	border:1px solid #ddd;
}

.sus_bg .news .in_container ul > li figure img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  display: block;
	
}

.sus_bg .news .in_container ul > li .tag {
  font-size:14px;
  font-weight: 400;
  color: #fff;
	background: #FFAB00;
  margin-bottom:10px;
	display: inline-block;
	padding: 2px .5em;
}

.sus_bg .news .in_container ul > li time {
  display: block;
  font-size:14px;
  color: #000;
  margin-bottom: 0.5rem;
}

.sus_bg .news .in_container ul > li .title {
  font-size: 15px;
  line-height: 1.5;
	font-weight: bold;
  margin-bottom: 0.5rem;
  color: #000;
}

.sus_bg .news .in_container ul > li p:last-of-type {
  font-size:12px;
  color: #000;text-align: right;
}

.sus_bg .news .in_container ul > li p:last-of-type::after {
content: "";
background: url(/site_common/img/com_ic05.png) no-repeat;
background-size: auto;
background-size: 25px auto;
display: inline-block;
margin-left: 5px;
margin-right: 5px;
height: 12px;
width: 26px;
}


@media only screen and (max-width: 767px) {

.sus_bg .news .in_container .news_h2 button a{
width: 6em;
}


.sus_bg .news .in_container ul{
display: grid;
grid-template-columns: 1fr;
gap:20px ;
margin-top: 30px;
}
.sus_bg .news .in_container ul > li a {
border:1px solid #023894;
border-radius: 15px;
padding: 20px;
height:auto;
}



}/*767*/




@media only screen and (max-width: 480px) {
.sus_bg .news .in_container .news_h2{
background:url(/corporate/sustainability/figure/index/img_04.png) no-repeat left bottom / 55px auto;
}

.sus_bg .news .in_container .news_h2 h2{
font-size:18px;
margin-left: 65px;
line-height: 1.4;
}

.sus_bg .news .in_container .news_h2 button{
margin-bottom:8px;
}

.sus_bg .news .in_container .news_h2 button a{
font-size:13px;
padding: 5px 8px;
}

.ico_next{
display: inline-block;
background:url(/corporate/sustainability/figure/index/arrow_G.svg) no-repeat center center;
height:13px;
width:13px;
margin-left: 5px;
vertical-align:-10%;
}



}/*480*/







/* 　2026-04-09　　================　*/


.sus_bg .news2 .in_container{
border:2px solid #003894;
border-radius:30px;
padding: 28px 22px;
}

.sus_bg .news2 .in_container .news_h2{
/*outline: 1px dashed red;*/
height: 60px;
display: flex;
justify-content: space-between;
gap: 20px;
align-items: flex-end; /*画像の間延び禁止*/

background:url(/corporate/sustainability/figure/index/img_04.png) no-repeat left bottom / contain;
border-bottom:2px solid #80B927;
}

.sus_bg .news2 .in_container .news_h2 h2{
font-size: 20px;
color: #15489C;
font-weight: bold;
margin-left: 90px;
}

.sus_bg .news2 .in_container .news_h2 button{
margin-bottom:8px;
}

.sus_bg .news2 .in_container .news_h2 button a{
font-size: 14px;
font-weight: bold;
background: #fff;
color: #15489C;
display: block;
border:1px solid #003894;
border-radius: 5px;
padding: 7px 10px;
text-decoration: none;
}
.sus_bg .news2 .in_container .news_h2 button a:hover{
outline:1px solid #003894;
}

.ico_next{
display: inline-block;
background:url(/corporate/sustainability/figure/index/arrow_G.svg) no-repeat center center;
height:14px;
width:14px;
margin-left: 5px;
vertical-align:-10%;
}




/* list ul grid ※既存から変更 */
.sus_bg .news2 .in_container ul {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 55px 35px;
margin-top: 45px;
}

/* li */
.sus_bg .news2 .in_container ul > li a {
border: none;
border-radius: 0;
padding: 0;
display: block;
color: inherit;
text-decoration: none;
height: 100%;
}
/*
.sus_bg .news2 .in_container ul > li a:hover {
outline: none;
opacity: 0.8;
}
*/

/* figure */
.sus_bg .news2 .in_container ul > li figure {
position: relative;
margin: 0 0 12px;
border: none;
aspect-ratio: 4 / 3;
overflow: visible;
background: #ddd; /* 画像なし時のフォールバック */
}

.sus_bg .news2 .in_container ul > li figure img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
border-radius: 0;
border:1px solid #ccc;
}

/* NEWバッジ */
.sus_bg .news2 .in_container ul > li figure .badge-new {
position: absolute;
top: -20px;
left:-10px;
background: #FFAB00;
color: #fff;
font-size: 12px;
font-weight: bold;
border-radius: 50%;
width: 44px;
height: 44px;
display: flex;
align-items: center;
justify-content: center;
line-height: 1;
z-index: 1;
}
.sus_bg .news2 .in_container ul > li a:hover figure .badge-new {
background: #E54000;
}

/* 日付 */
.sus_bg .news2 .in_container ul > li time {
display: block;
font-size: 14px;
color: #DF4915; /* オレンジ赤 */
margin-bottom: 6px;
font-weight: bold;
}
.sus_bg .news2 .in_container ul > li a:hover time {
color: #B60000;
}

/* タイトル */
.sus_bg .news2 .in_container ul > li .title {
font-size: 15px;
line-height: 1.5;
font-weight: bold;
color: #398FDF;
margin-bottom: 10px;
}
.sus_bg .news2 .in_container ul > li a:hover .title {
color: #003894;
}


/* タグ群 */
.sus_bg .news2 .in_container ul > li .tags {
display: flex;
flex-wrap: wrap;
gap: 6px;
}

/* タグ共通 */
.sus_bg .news2 .in_container ul > li .tag {
font-size: 14px;
font-weight: 700;
display: inline-block;
padding: 2px 8px;
border-radius: 5px;
border: 2px solid currentColor;
background: #fff;
color: #000;
}

/* タグ色分け */
.sus_bg .news2 .in_container ul > li .tag[data-category="CO₂削減"]      { border-color: #2BA804; }
.sus_bg .news2 .in_container ul > li .tag[data-category="食品ロス削減"]  { border-color: #C9C327; }
.sus_bg .news2 .in_container ul > li .tag[data-category="プラスチック削減"] { border-color: #84DCFE; }
.sus_bg .news2 .in_container ul > li .tag[data-category="生物多様性"]    { border-color: #46F03B; }
.sus_bg .news2 .in_container ul > li .tag[data-category="健康"]          { border-color: #44B3E1; }
.sus_bg .news2 .in_container ul > li .tag[data-category="安全・安心"]    { border-color: #053FA6; }
.sus_bg .news2 .in_container ul > li .tag[data-category="募金"]          { border-color: #FDA5D4; }
.sus_bg .news2 .in_container ul > li .tag[data-category="地域"]          { border-color: #875E2A; }
.sus_bg .news2 .in_container ul > li .tag[data-category="店舗"]          { border-color: #FFAB00; }
.sus_bg .news2 .in_container ul > li .tag[data-category="商品"]          { border-color: #E34DE5; }
.sus_bg .news2 .in_container ul > li .tag[data-category="ダイバーシティ"] { border-color: #43CA60; }
.sus_bg .news2 .in_container ul > li .tag[data-category="イベント"]      { border-color: #FC76BE; }
.sus_bg .news2 .in_container ul > li .tag[data-category="お知らせ"]      { border-color: #CC0000; }
.sus_bg .news2 .in_container ul > li .tag[data-category="その他"]        { border-color: #7F837E; }


/* 767px以下 */
@media only screen and (max-width: 767px) {

.sus_bg .news2 .in_container {
width: 90%;
margin-left: auto;
margin-right: auto;
}

.sus_bg .news2 .in_container .news_h2 button a{
width: 6em;
}

/*　LIST */
.sus_bg .news2 .in_container ul {
grid-template-columns: 1fr;
gap: 30px;
}

.sus_bg .news2 .in_container ul > li:nth-child(n + 2){
margin-top: 40px;
}
	
}/*767*/

/* 480px以下 */
@media only screen and (max-width: 480px) {

.sus_bg .news2 .in_container .news_h2{
background:url(/corporate/sustainability/figure/index/img_04.png) no-repeat left bottom / 55px auto;
}
.ico_next{
display: inline-block;
background:url(/corporate/sustainability/figure/index/arrow_G.svg) no-repeat center center;
height:13px;
width:13px;
margin-left: 5px;
vertical-align:-10%;
}

/*　LIST */
.sus_bg .news2 .in_container ul > li time {
font-size: 13px;
}
.sus_bg .news2 .in_container ul > li .title {
font-size: 14px;
}
.sus_bg .news2 .in_container ul > li .tag {
font-size: 11px;
  }
	
}







/* sustainability-duo サスマネ　マテリアリティ
=========================================== */

.sustainability_duo .in_container{
/*outline: 1px dashed red;*/
}

.sustainability_duo .in_container ul{
display: grid;
grid-template-columns: 1fr 1fr;
gap:40px;
}
.sustainability_duo .in_container ul>li{
/*outline: 1px dashed red;*/
}

.sustainability_duo .in_container ul>li>a{
border:4px solid #FCC800;
display: block;
border-radius:5px;
}

.sustainability_duo .in_container ul>li>a{
display: block;
text-decoration: none;
background:#FCC800;
}
.sustainability_duo .in_container ul>li>a:hover{
opacity: .7;
}

.sustainability_duo .in_container ul>li>a .img_block{
width: 100%;
margin: auto;
height: 280px;
background: #fff;
}
.sustainability_duo .in_container ul>li>a .img_block img{
margin: auto;
display: block;
padding-top: 25px;
padding-bottom: 25px;
width: 230px;
height:auto;
}

.sustainability_duo .in_container ul>li>a p{
font-size: 20px;
font-weight: bold;
color:#003894;
padding: 15px 10px;
background: #FCC800;
}

.sustainability_duo .in_container ul>li>a p::after {
  content: '';
  display: inline-block;
  background: url(/corporate/sustainability/figure/index/arrow_G.svg) no-repeat center center;
  height: 16px;
  width: 16px;
}

.sustainability_duo .in_container .list_block{
padding: 22px;
min-height: 280px;
background: #fff url(/corporate/sustainability/figure/index/img_06.png) no-repeat right 5px bottom;
background-size: auto 100px;
}

/*
.sustainability_duo .in_container .list_block ol{
outline: 1px dashed red;
}
*/

.sustainability_duo .in_container .list_block ol li{
display: flex;
font-size: 17px;
font-weight: bold;
color:#003894;
margin-top:20px;
}
.sustainability_duo .in_container .list_block ol li:first-child{
margin-top:0;
}
.sustainability_duo .in_container .list_block ol li .number{
width: 26px; height: 26px;
background: #FCC800;
display: inline-block;
text-align: center;
margin-right: .5em;
border-radius: 50%;
font-size: 15px;
}

@media only screen and (max-width: 767px) {

.sustainability_duo .in_container{
width: 90%;
margin-left: auto;
margin-right: auto;
}

.sustainability_duo .in_container ul{
grid-template-columns: 1fr;
gap:3rem;
}
.sustainability_duo .in_container ul>li>a .img_block{
height:auto;
}

.sustainability_duo .in_container ul>li>a .img_block img{
/*width: 230px auto;*/
}

.sustainability_duo .in_container .list_block ol li:nth-child(n + 5) .wording{
width: calc(100% - 120px) !important;
}

}/*767*/

@media only screen and (max-width: 390px) {
.sustainability_duo .in_container{
width:auto;
margin-left: 2.667vw;
margin-right: 2.667vw;
}
}/*390*/



/* ESG sus_esg
=========================================== */

.sus_esg .in_container{
}

/*
.sus_esg .list_esg{
outline: 1px dashed red;
}
*/

.sus_esg .list_esg>li{
/*outline: 1px dashed red;*/
margin-top: 40px;
padding: 25px;
background: #999;
border-radius: 30px;
}
.sus_esg .list_esg>li.env{
background: #6BB256 url(/corporate/sustainability/figure/index/img_07.svg) no-repeat right 15px top 15px;
}
.sus_esg .list_esg>li.soc{
background: #C6C432 url(/corporate/sustainability/figure/index/img_08.svg) no-repeat right 15px top 15px;
}
.sus_esg .list_esg>li.gov{
background: #4AC6F0 url(/corporate/sustainability/figure/index/img_09.svg) no-repeat right 15px top 15px;
}


.sus_esg .list_esg>li .esg-heading a {
  display: inline-flex;
  align-items: flex-end; 
  font-size: 25px;
  font-weight: bold;
  color: #fff;
  margin-bottom: 20px;
  gap: 0.5em;
  position: relative;
	text-shadow: 1px 1px 0 rgba(0,0,0,.3);
	text-decoration: none;
}
.sus_esg .list_esg>li .esg-heading a::after {
  content: '';
  display: inline-block;
  background: url(/corporate/sustainability/figure/index/arrow_white.svg) no-repeat center center;
  background-size: contain;
  width: 16px;
  height: 16px;
  flex-shrink: 0; 
	padding-bottom:22px;
	margin-left:-.25em;
}
.sus_esg .list_esg>li .esg-heading a:hover{opacity: .7;}
.sus_esg .list_esg>li .esg-heading span.initials {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  background-color: #298241;
  border-radius: 50%;
  font-size: 50px;
  color: #fff;
  flex-shrink: 0;
  margin-right: -.45em;
}

.sus_esg .list_esg>li.soc .esg-heading span.initials {
background-color: #AF903E;
}
.sus_esg .list_esg>li.gov .esg-heading span.initials {
background-color: #2D8ECC;
}
.sus_esg .list_esg>li .esg-heading span.fs_80per {
padding-bottom:2px;
font-size: 70%;
}


@media only screen and (max-width: 480px) {

.sus_esg .list_esg>li.env,
.sus_esg .list_esg>li.soc,
.sus_esg .list_esg>li.gov{
background-size:auto 40px;
}


.sus_esg .list_esg>li .esg-heading a {
  font-size: 22px;
  margin-bottom: 20px;
	gap: 0.25em;
}
.sus_esg .list_esg>li .esg-heading a::after {
  width: 14px;
  height: 14px;
	padding-bottom:20px;
}

.sus_esg .list_esg>li .esg-heading span.initials {
  width: 50px;
  height:50px;
  font-size: 40px;
  margin-right: -.35em;
}




}/*480*/



/* drop down 
------------------------------*/

.card-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 17px 20px;
}

.card-grid .single_link a{
display: block;
width: 100%;
font-weight: bold;
text-decoration: none;
color:#0B5E58;
font-size: 16px;
padding: 1.3rem;
background: #fff url(/corporate/sustainability/figure/index/arrow_E.svg) no-repeat right 10px center;
box-shadow: 0 2px 4px rgba(0,0,0,.15);
}
.sus_esg .list_esg>li.soc .card-grid .single_link a{
color:#794E15;
background: #fff url(/corporate/sustainability/figure/index/arrow_S.svg) no-repeat right 10px center;
}
.sus_esg .list_esg>li.gov .card-grid .single_link a{
color:#023894;
background: #fff url(/corporate/sustainability/figure/index/arrow_G.svg) no-repeat right 10px center;
}

.card-grid .single_link a:hover{opacity: .9;}

.card {
  background: #fff;
  /*padding: 1rem;*/
  border-radius: 5px;
  position: relative;
  text-align: left;
  font-weight: bold;
  cursor: pointer;
  transition: background 0.1s;
}


.dropdown-toggle {
  display: flex;
  justify-content: space-between;
  align-items: center;
	border-radius: 5px;
  width: 100%;
  height: 100%;
  font-weight: bold;
  font-size: 16px;
  color: #0B5E58;
  padding: 1rem;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .15);
  position: relative;
  z-index: 2;
	cursor: pointer;
  background: #fff; /* 必要なら */
  border: none;     /* 必要なら */
}

.z_index3{z-index: 3 !important;}
.z_index4{z-index: 4 !important;}
.z_index5{z-index: 5 !important;}
.z_index6{z-index: 6 !important;}
.z_index7{z-index: 7 !important;}
.z_index8{z-index: 8 !important;}
.z_index9{z-index: 9 !important;}
.z_index10{z-index: 10 !important;}


.dropdown-toggle::after {
  content: '';
  background: url(/corporate/sustainability/figure/index/arrow_E.svg) no-repeat center center;
  background-size: 16px auto;
  width: 31px;
  height: 31px;
  border-radius: 50%;
  border: 1px solid #0B5E58;
 transform: scale(1, -1) rotate(-90deg);
  /* flexの中で自動配置されるので、margin系は基本不要 */
  flex-shrink: 0;
}
.sus_esg .list_esg>li.soc .dropdown-toggle::after {
  background: url(/corporate/sustainability/figure/index/arrow_S.svg) no-repeat center center;
	border: 1px solid #794E15;
}
.sus_esg .list_esg>li.gov .dropdown-toggle::after {
  background: url(/corporate/sustainability/figure/index/arrow_G.svg) no-repeat center center;
	border: 1px solid #023894;
}

.dropdown.open .dropdown-toggle::after {
transform: scale(-1, 1) rotate(-90deg);
}




.sus_esg .list_esg>li.soc .dropdown-toggle{
color:#794E15;
}
.sus_esg .list_esg>li.gov .dropdown-toggle{
color:#023894;
}


.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  background: #fff;
  border-radius: 4px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  overflow: hidden;

  /* 初期状態（非表示＋上にずれてる） */
  opacity: 0;
  transform: translateY(-20px);
  pointer-events: none;
  transition: all 0.0s ease;
  z-index: 1;
}

.dropdown.open .dropdown-menu {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}


.dropdown.open .dropdown-menu {
  display: block;
	transition:all .3s;
}
.dropdown.open .dropdown-menu a{
display: block;
border-radius: none;
font-weight: normal !important;
text-decoration: none;
color: #000;
padding: 1rem;
border-top:1px solid #ccc;
}
.dropdown.open .dropdown-menu a:first-child{
border-top:none;
}

.dropdown.open .dropdown-menu a:hover{
margin-left: 5px;
}
.dropdown.open .dropdown-menu a::before{
  content: '';
  display: inline-block;
  background: url(/corporate/sustainability/figure/index/arrow_1px.svg) no-repeat center center;
  background-size: contain;
  width: 16px;
  height: 16px;
  flex-shrink: 0; 
	/*padding-bottom:18px;*/
	margin-right:.4em;
}

.dropdown-toggle{}


/*
@media only screen and (max-width: 767px) {
.card-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 17px 20px;
}

}767*/


@media only screen and (max-width: 767px) {

.card-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 17px 20px;
}
.dropdown-menu {
    position: static !important;  /* ← これが一番重要！ */
    display: block !important;
    /*transform: none !important;*/
    opacity: 1 !important;
    pointer-events: auto !important;
    box-shadow: none !important;
    /*transition: none !important;*/
    margin: 0;
    padding: 0;
    z-index: auto;
		transition:all .3s;
  }

  .dropdown:not(.open) .dropdown-menu {
    display: none !important; /* 閉じた時にだけ非表示 */

  }

  .dropdown.open .dropdown-menu {
    display: block !important;
		transform: translateY(0);
		transition:all .3s ;
		pointer-events: auto;
  }

  .dropdown.open .dropdown-menu a {
    display: block;
    padding: 1rem;
    text-decoration: none;
    border-top: 1px solid #ccc;
    color: #000;
  }

  .dropdown-toggle {
    height: auto !important; /* 高さを制限しない */
    min-height: 3.5em;        /* 任意の高さ確保 */
  }
}/*767*/


/* sus_info  
=========================================== */

/*
.sus_bg .sus_info .in_container{
outline: 1px dashed red;
}
*/

.sus_bg .sus_info .col_3{
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 30px;
text-align: center;
}

.sus_bg .sus_info .col_3 li a{
display: block;
text-decoration: none;
}

.sus_bg .sus_info .col_3 .img_block{
border:#FCC800 2px solid;
border-radius: 5px;
}

.sus_bg .sus_info .col_3 .title{
font-size: 16px;
font-weight: bold;
color: #000;
margin-top: 10px;
}

@media only screen and (max-width: 767px) {

.sus_bg .sus_info .col_3{
display: grid;
grid-template-columns: 1fr 1fr;
gap:4rem 2rem;
}

}/*767*/



@media only screen and (max-width: 480px) {
.sus_bg .sus_info .col_3{
gap:3rem 1rem;
}



}/*480*/








