.solution-page-container {
  position: relative;
}

.solution-page-inner {
  position: relative;
  z-index: 1;
}

ul.c-solution__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-bottom: 30px;
}
ul.c-solution__list li.c-solution__item {
  display: flex;
  flex-direction: column;
  align-items: stretch; /* 高さを揃える */
  height: 100%; /* 必要に応じて */
}
ul.c-solution__list li.c-solution__item a {
  display: flex;
  flex-direction: column;
  justify-content: flex-start; /* 上揃え */
  align-items: flex-start; /* 上揃え */
  flex-grow: 1; /* 可能な限り伸ばす */
  background-color: #d0d0ca;
}
ul.c-solution__list.c-solution__list-2 li.c-solution__item a {
  background-color: #e8e8e4;
}
ul.c-solution__list li.c-solution__item a,
ul.c-solution__list li.c-solution__item a .c-solution__item__text,
ul.c-solution__list li.c-solution__item a .c-solution__item__ttl,
ul.c-solution__list li.c-solution__item a .c-solution__item__desc {
  transition: 0.3s ease-in-out; /* スムーズなフェード */
}
ul.c-solution__list li.c-solution__item a .c-solution__item__text {
  padding: 10px;
}
ul.c-solution__list.c-solution__list-1 li.c-solution__item a:hover,
ul.c-solution__list.c-solution__list-2 li.c-solution__item a:hover,
ul.c-solution__list.c-solution__list-3 li.c-solution__item a:hover {
  background-color: #696969;
}
ul.c-solution__list li.c-solution__item a:hover .c-solution__item__ttl,
ul.c-solution__list li.c-solution__item a:hover .c-solution__item__desc {
  color: #fff;
}
ul.c-solution__list li.c-solution__item a .c-solution__item__ttl {
  font-size: 16px;
  font-weight: bold;
  margin: 10px;
  line-height: 1.5;
  color: #242424;
}
ul.c-solution__list li.c-solution__item a .c-solution__item__desc {
  font-size: 14px;
  margin: 10px;
  line-height: 1.5;
  color: #242424;
}
/* 画像を右寄せにする */
ul.c-solution__list.c-solution__list-2 li.c-solution__item a {
  display: flex; /* 横並び配置を可能に */
  justify-content: space-between; /* テキストと画像を両端に配置 */
  min-height: 200px;
}

ul.c-solution__list.c-solution__list-2 li.c-solution__item a img {
  display: block;
  width: auto; /* 必要に応じて調整 */
  margin-left: auto; /* 画像を右寄せ */
  transition: opacity 0.3s ease-in-out; /* 滑らかなフェード */
}
/* 各画像ごとにホバー時の `-hover` 画像を設定 */
ul.c-solution__list.c-solution__list-2 li:nth-child(1) a:hover img {
  content: url("https://kagu.plus.co.jp/kagu/wp-content/themes/kagu_plus/assets/images/common/top-icon-01-hover.png");
}
ul.c-solution__list.c-solution__list-2 li:nth-child(2) a:hover img {
  content: url("https://kagu.plus.co.jp/kagu/wp-content/themes/kagu_plus/assets/images/common/top-icon-03-hover.png");
}
ul.c-solution__list.c-solution__list-2 li:nth-child(3) a:hover img {
  content: url("https://kagu.plus.co.jp/kagu/wp-content/themes/kagu_plus/assets/images/common/top-icon-04-hover.png");
}
ul.c-solution__list.c-solution__list-2 li:nth-child(4) a:hover img {
  content: url("https://kagu.plus.co.jp/kagu/wp-content/themes/kagu_plus/assets/images/common/top-icon-06-hover.png");
}
ul.c-solution__list li.c-solution__item a,
ul.c-solution__list li.c-solution__item a .c-solution__item__text,
ul.c-solution__list li.c-solution__item a .c-solution__item__ttl,
ul.c-solution__list li.c-solution__item a .c-solution__item__desc {
  transition: all 0.4s ease-out;
}

@media screen and (max-width: 640px) {
  ul.c-solution__list {
    grid-template-columns: 1fr; /* 1カラム表示 */
  }
  #top-page-title ul.c-solution__list.c-solution__list-2,
  #top-page-title ul.c-solution__list.c-solution__list-3 {
    display: none;
  }
  ul.c-solution__list.c-solution__list-2 .c-solution__item__text {
    position: relative;
    display: flex;
    align-items: center;
    /* アイテムを中央揃え */
  }

  ul.c-solution__list.c-solution__list-2 li.c-solution__item a {
    min-height: auto !important;
  }

  ul.c-solution__list.c-solution__list-2
    li.c-solution__item
    .c-solution__item__text
    img {
    position: absolute;
    left: 10px;
    /* 左側に配置 */
    top: 50%;
    /* 親要素の中央 */
    transform: translateY(-50%);
    /* 画像の高さの半分だけ上に移動 */
    width: 90px;
  }

  ul.c-solution__list.c-solution__list-2
    li.c-solution__item
    .c-solution__item__ttl {
    padding-left: 90px;
    margin-bottom: 0;
  }

  ul.c-solution__list.c-solution__list-2
    li.c-solution__item
    .c-solution__item__desc {
    padding-left: 90px;
    margin-top: 5px;
    font-size: 12px;
  }
}