/* =========================================================
   事業活動ページ専用CSS（business.css）
   対象ページ：business.html
========================================================= */

/* ----------------------------------------
   01. アンダーメインの余白調整
---------------------------------------- */
#undermain {
  margin-bottom: 50px;
}

/* ----------------------------------------
   02. 導入文の余白調整
---------------------------------------- */
.article-block p {
  margin-bottom: 18px;
}

/* ----------------------------------------
   03. 関連リスト（relation-list）
---------------------------------------- */
.relation-list {
  margin: 20px 0 30px 1.2em;
  padding: 0;
}

.relation-list li {
  margin-bottom: 10px;
  line-height: 1.7;
}

/* ----------------------------------------
   04. 3R図解の余白調整
---------------------------------------- */
.three-r-image {
  margin: 25px 0 30px;
}

/* ----------------------------------------
   05. SDGsリスト（sdgs-list）
---------------------------------------- */
.sdgs-list {
  margin: 20px 0 30px 1.2em;
  padding: 0;
}

.sdgs-list li {
  margin-bottom: 10px;
  line-height: 1.7;
}

/* ----------------------------------------
   06. 事業内容カード（img-text3）
---------------------------------------- */
.img-text3 ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.img-text3 ul li {
  margin-bottom: 40px !important;
}

.img-text3 figure {
  margin-bottom: 12px;
}

.link-title {
  font-size: 1.2rem;
  font-weight: 600;
  color: #145a32;
  text-decoration: none;
}

.link-title:hover {
  text-decoration: underline;
  color: #0f4a28;
}

/* ----------------------------------------
   07. 3R関連説明（relation-3r）
---------------------------------------- */
.relation-3r {
  margin-top: 12px;
  padding: 12px 15px;
  background: #f7faf7;
  border-left: 4px solid #145a32;
  border-radius: 6px;
  font-size: 0.95rem;
  line-height: 1.7;
}

/* ----------------------------------------
   08. 今後の取り組みとビジョンの余白調整
---------------------------------------- */
.article-block h2 {
  margin-bottom: 20px;
}

/* =========================================================
   3R図解（business.html）崩れ防止
========================================================= */
.three-r-image img {
  width: 100%;
  height: auto !important; /* ← 高さ固定を解除 */
  object-fit: contain !important; /* ← 縦横比を維持 */
  display: block;
  margin: 0 auto;
  max-width: 900px; /* ← 図解の横幅を制限（任意） */
  border-radius: 6px;
  border: 1px solid #ddd;
}