/* ============================
   CSR Page - 社会貢献活動
============================ */

/* ============================
   リードテキストセクション
============================ */
.csr-lead-section {
  width: clamp(21.875rem, 1.961rem + 81.7vw, 100rem); /* 350px at 390px, 1600px at 1920px */
  margin: 3.75rem auto 0 auto;
}

.csr-lead-text {
  color: #BA2A20;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(1.25rem, 1.027rem + 0.915vw, 2.125rem);
  font-style: normal;
  font-weight: 700;
  line-height: 160%;
  text-align: center;
  letter-spacing: clamp(0.125rem, 0.103rem + 0.0915vw, 0.2125rem);
  padding-left: clamp(0rem, 1.569rem - 1.307vw, 1.25rem);
  padding-right: clamp(0rem, 1.569rem - 1.307vw, 1.25rem);
  margin: 0;
}

/* リードテキストの改行制御 */
.lead-br {
  display: none;
}

/* 1700px～750px: 改行を表示 */
@media (min-width: 750px) and (max-width: 1700px) {
  .lead-br {
    display: inline;
  }
}

/* 749px以下: 左寄せ */
@media (max-width: 749px) {
  .csr-lead-text {
    text-align: left;
  }
}

/* ============================
   エンジン始動プロジェクトセクション
============================ */
.csr-engine-section {
  width: clamp(21.875rem, 1.961rem + 81.7vw, 100rem); /* 350px at 390px, 1600px at 1920px */
  margin: clamp(2.5rem, 1.194rem + 5.359vw, 7.625rem) auto 0 auto; /* 40px at 390px, 119px at 1920px */
}

.csr-engine-content {
  display: flex;
  gap: clamp(2rem, 0.204rem + 3.736vw, 4.688rem); /* 0px at 390px, 75px at 1920px */
  align-items: flex-start;
}

/* 1920px: row レイアウト、1200px以下: column-reverse レイアウト */
@media (min-width: 1201px) {
  .csr-engine-content {
    flex-direction: row;
  }
}

@media (max-width: 1200px) {
  .csr-engine-content {
    flex-direction: column-reverse;
  }
  .csr-engine-section {
    padding-left: clamp(0rem, 1.569rem - 1.307vw, 1.25rem);
    padding-right: clamp(0rem, 1.569rem - 1.307vw, 1.25rem);
  }
}

/* テキスト部分 */
.csr-engine-text {
  flex: 1;
  
}

/* タイトル */
.csr-engine-title {
  color: #000;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(1.25rem, 0.963rem + 1.176vw, 2.375rem); /* 20px at 390px, 38px at 1920px */
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: clamp(0.125rem, 0.096rem + 0.118vw, 0.2375rem); /* 2px at 390px, 3.8px at 1920px */
  margin: 0;
}

/* モバイル時の改行を表示 */
.mobile-br {
  display: none;
}

@media (max-width: 460px) {
  .mobile-br {
    display: inline;
  }
}

/* タブレット時の改行を表示（1201px〜1435px） */
.tablet-br {
  display: none;
}

@media (min-width: 1201px) and (max-width: 1435px) {
  .tablet-br {
    display: inline;
  }
}

/* サブタイトル */
.csr-engine-subtitle {
  color: #000;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(1rem, 0.841rem + 0.654vw, 1.625rem); /* 16px at 390px, 26px at 1920px */
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: clamp(0.1rem, 0.084rem + 0.065vw, 0.1625rem); /* 1.6px at 390px, 2.6px at 1920px */
  margin: clamp(1.625rem, 1.561rem + 0.261vw, 1.875rem) 0 0 0; /* 26px at 390px, 30px at 1920px */
}

/* 本文 */
.csr-engine-description {
  color: #000;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(0.875rem, 0.843rem + 0.131vw, 1rem); /* 14px at 390px, 16px at 1920px */
  font-style: normal;
  font-weight: 400;
  line-height: clamp(1.5rem, 1.373rem + 0.523vw, 2rem); /* 24px at 390px, 32px (200%) at 1920px */
  letter-spacing: clamp(0rem, 0.088rem - 0.073vw, 0.07rem); /* 1.12px at 390px, 0px at 1920px */
  margin: clamp(1.75rem, 1.463rem + 1.176vw, 2.875rem) 0 0 0; /* 28px at 390px, 46px at 1920px */
  max-width: 690px;
}

/* 画像部分 */
.csr-engine-image {
  flex-shrink: 0;
  width: clamp(19rem, -1.712rem + 43.093vw, 50rem); /* 310px at 390px, 800px at 1920px */
  height: clamp(12.9375rem, 7.728rem + 21.373vw, 33.375rem); /* 207px at 390px, 534px at 1920px */
  border-radius: clamp(1rem, 0.777rem + 0.915vw, 1.875rem); /* 16px at 390px, 30px at 1920px */
  overflow: hidden;
}

@media (max-width: 1200px) {
  .csr-engine-image {
    margin-bottom: 2.0625rem; /* 33px */
    width: clamp(19.375rem, -1.177rem + 84.316vw, 62.06rem);
  }
/* 本文 */
.csr-engine-description {
  max-width: clamp(19.375rem, -1.177rem + 84.316vw, 62.06rem);
}
}

.csr-engine-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ============================
   配布期間情報
============================ */
.csr-distribution-info {
  position: relative;
}

/* 横線（点線） */
.csr-distribution-divider {
  width: clamp(19.375rem, 13.353rem + 24.706vw, 43rem); /* 310px at 390px, 688px at 1920px */
  height: 0;
  background: none;
  border: none;
  border-top: 1px dashed #E4E4E4;
  margin: clamp(2.5rem, 2.436rem + 0.261vw, 2.625rem) 0 0 0; /* 40px at 390px, 42px at 1920px */
  padding: 0;
}

/* 配布期間詳細 */
.csr-distribution-details {
  display: flex;
  align-items: center;
  margin-top: 1.125rem;
  margin-bottom: 1.125rem;
  margin-left: clamp(0rem, -0.335rem + 1.373vw, 1.313rem);
  padding-right: clamp(0rem, -0.51rem + 2.092vw, 2rem);
}

/* 配布期間ラベル */
.csr-distribution-label {
  color: #BA2A20;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.875rem; /* 14px */
  font-style: normal;
  font-weight: 700;
  line-height: 200%; /* 28px */
  white-space: nowrap;
  align-self: center;
}

/* 縦線 */
.csr-distribution-separator {
  width: 1px;
  height: 1.75rem; /* 28px */
  background: #DC3714;
  flex-shrink: 0;
  align-self: center;
  margin-left: clamp(1.6875rem, 1.68rem + 0.03vw, 1.875rem); /* 27px at 390px, 30px at 1920px */
  margin-right: clamp(1.688rem, 1.64rem + 0.196vw, 1.875rem); /* 10px at 390px, 35px at 1920px */
}

/* 配布期間テキスト */
.csr-distribution-text {
  color: #000;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.875rem; /* 14px */
  font-style: normal;
  font-weight: 400;
  line-height: 200%; /* 54.18px for 1920px */
  letter-spacing: clamp(0rem, 0.044rem - 0.036vw, 0.04375rem); /* 0.7px at 390px, 0px at 1920px */
  margin: 0;

}

/* 1200px以下画面での調整 */
@media (max-width: 1200px) {
  .csr-distribution-details {
    align-items: stretch; /* center から変更 */
  }

  .csr-distribution-separator {
    height: auto; /* 固定値を削除 */
    align-self: stretch; /* center から変更 */
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .csr-distribution-text {
    line-height: 1.5rem; /* 24px */
    letter-spacing: 0.04375rem; /* 0.7px */
  }

  .csr-distribution-divider {
    width: clamp(19.375rem, -1.177rem + 84.316vw, 62.06rem);
    height: 0;
    background: none;
    border: none;
    border-top: 1px dashed #E4E4E4;
    margin: clamp(2.5rem, 2.436rem + 0.261vw, 2.625rem) 0 0 0; /* 40px at 390px, 42px at 1920px */
    padding: 0;
  }
}

/* 2本目の横線（配布期間テキストの下） */
.csr-distribution-divider-bottom {
  margin-top: clamp(0.5rem, 0.341rem + 0.654vw, 1.125rem);
}

/* ============================
   プロジェクト特設サイトボタン
============================ */
.csr-project-button {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: clamp(19.375rem, 15.588rem + 15.556vw, 23.063rem); /* 310px at 390px, 369px at 1920px */
  height: clamp(3.938rem, 3.91rem + 0.114vw, 3.938rem); /* 63px */
  border-radius: 1.969rem; /* 31.5px */
  border: 1px solid #000;
  background: #FFF;
  text-decoration: none;
  margin-top: 2.5rem; /* 40px */
  padding: clamp(1.188rem, 1.16rem + 0.114vw, 1.188rem) clamp(1.875rem, 1.811rem + 0.261vw, 1.875rem); /* 上下19px/18px, 左右30px */
  gap: clamp(1.313rem, 1.121rem + 0.784vw, 1.875rem); /* 21px at 390px, 30px at 1920px */
  transition: all 0.3s ease;
  position: relative;
}



/* 390px: 中央寄せ */
@media (max-width: 390px) {
  .csr-project-button {
    margin-left: auto;
    margin-right: auto;
  }
}

/* ボタンテキスト */
.csr-project-button-text {
  color: #050505;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(0.75rem, 0.718rem + 0.131vw, 0.938rem); /* 12px at 390px, 15px at 1920px */
  font-style: normal;
  font-weight: 500;
  line-height: clamp(1.5rem, 1.436rem + 0.261vw, 1.75rem); /* 24px at 390px, 28px at 1920px */
  letter-spacing: clamp(0.075rem, 0.072rem + 0.013vw, 0.094rem); /* 1.2px at 390px, 1.5px at 1920px */
  white-space: nowrap;
  width: clamp(13.188rem, 12.648rem + 2.222vw, 15.375rem); /* 211px at 390px, 246px at 1920px */
}

/* 矢印アイコン（円形） */
.csr-project-button-arrow {
  width: 2.045rem; /* 32.715px */
  height: 2.045rem; /* 32.715px */
  border: 1px solid #050505;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  background: transparent;
  overflow: hidden;
  flex-shrink: 0;
  transition: background 0.3s ease, border-color 0.3s ease;
}

/* 矢印パーツ（既存のarrow-line/arrow-tipを参照） */
.csr-project-button-arrow .arrow-line,
.csr-project-button-arrow .arrow-tip {
  position: absolute;
  top: 50%;
  transition: transform 0.3s ease, background 0.3s ease, border-color 0.3s ease;
}

/* 矢印の棒 */
.csr-project-button-arrow .arrow-line {
  left: 50%;
  width: 10px;
  height: 1.5px;
  background: #050505;
  transform: translate(-4.5px, -50%);
}

/* 矢印の先端 */
.csr-project-button-arrow .arrow-tip {
  left: 50%;
  width: 6px;
  height: 6px;
  border-top: 1.5px solid #050505;
  border-right: 1.5px solid #050505;
  transform: translate(-1.2px, -50%) rotate(45deg);
}

/* ホバーエフェクト（PC画面のみ） */
@media (min-width: 769px) {
  .csr-project-button:hover {
    background: #f5f5f5;
  }

  .csr-project-button:hover .csr-project-button-arrow {
    background: #050505;
    border-color: #050505;
  }

  .csr-project-button:hover .csr-project-button-arrow .arrow-line {
    background: #FFF;
  }

  .csr-project-button:hover .csr-project-button-arrow .arrow-tip {
    border-top-color: #FFF;
    border-right-color: #FFF;
  }
}

/* ============================
   活動の３本柱セクション
============================ */
.csr-pillars-section {
  width: clamp(21.875rem, 1.961rem + 81.7vw, 100rem); /* 350px at 390px, 1600px at 1920px */
  margin: 2.1875rem auto 0 auto; /* 40px at 390px, 35px at 1920px + csr-engine-sectionの下 */
  text-align: center;
}

@media (max-width: 1200px) {
  .csr-pillars-section {
    margin: 6.25rem auto 0 auto; /* 40px at 390px, 35px at 1920px + csr-engine-sectionの下 */
  }
}

/* タイトル */
.csr-pillars-title {
  color: #BA2A20;
  text-align: center;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(1.25rem, 1.027rem + 0.915vw, 2rem); /* 20px at 390px, 32px at 1920px */
  font-style: normal;
  font-weight: 500;
  line-height: clamp(1.813rem, 1.303rem + 2.092vw, 3.813rem); /* normal at 390px, 190% at 1920px */
  letter-spacing: clamp(0.125rem, 0.103rem + 0.092vw, 0.2rem); /* 2px at 390px, 3.2px at 1920px */
  margin: 0;
}

/* 説明文 */
.csr-pillars-description {
  color: #050505;
  text-align: center;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(0.875rem, 0.843rem + 0.131vw, 1rem); /* 14px at 390px, 16px at 1920px */
  font-style: normal;
  font-weight: 400;
  line-height: clamp(1.5rem, 1.373rem + 0.523vw, 1.8rem); /* 24px at 390px, 28.8px (180%) at 1920px */
  letter-spacing: clamp(0.07rem, 0.065rem + 0.02vw, 0.05rem); /* 1.12px at 390px, 0.8px at 1920px */
  margin: clamp(1rem, 0.618rem + 1.569vw, 2.5rem) auto 0 auto; /* 16px at 390px, 40px at 1920px */
  width: clamp(19.375rem, -1.176rem + 84.314vw, 100rem); /* 310px at 390px, 346px at 1920px */
  max-width: 100%;
}

/* ============================
   健康・福祉セクション
============================ */
.csr-health-section {
  width: 100%;
  margin: clamp(2.5rem, 1.561rem + 3.856vw, 5.375rem) auto 0 auto; /* 40px at 390px, 86px at 1920px */
  display: flex;
  flex-direction: column;
  align-items: center;
}

.csr-health-image-container {
  position: relative;
  width: 100%;
  max-width: 100.063rem; /* 1601px */
  display: flex;
  justify-content: center;
}

/* 画像 */
.csr-health-image {
  width: 100%;
  height: auto;
  display: block;
}

/* 1201px以上: PC画像サイズ */
@media (min-width: 1201px) {
  .csr-health-image-container {
    max-width: 100rem; /* 1601px */
    width: clamp(63.29rem, 1.971rem + 81.691vw, 100rem);
    margin-right: clamp(1.25rem, -0.98rem + 9.15vw, 10rem);
    margin-left: clamp(1.25rem, -0.98rem + 9.15vw, 10rem);
  }

  .csr-health-image {
    max-width: 100rem;
    width: clamp(63.29rem, 1.971rem + 81.691vw, 100rem); /* 1601px */
    height: clamp(28.24rem, 0.088rem + 37.505vw, 44.625rem);
    object-fit: cover;
    border-radius: 25px;
  }

  /* セクション全体の高さを確保 */
  /* JavaScriptで動的に設定されるため、固定のmin-heightは不要 */
  /* .csr-health-section {
    min-height: clamp(55rem, 30rem + 33.333vw, 70rem);
  } */
}

/* 769px〜1200px: 2列表示時の画像サイズ */
@media (min-width: 769px) and (max-width: 1200px) {
  .csr-health-image-container {
    max-width: 50rem;
    width: clamp(21.875rem, 8.333rem + 55.556vw, 50rem);
  }

  .csr-health-image {
    width: clamp(21.875rem, 8.333rem + 55.556vw, 50rem);
    height: clamp(30.563rem, 23.612rem + 28.518vw, 45rem);
    object-fit: cover;
    object-position: top center;
    border-radius: 25px;
  }

  /* セクション全体の高さを確保 */
  /* JavaScriptで動的に設定されるため、固定のmin-heightは不要 */
  /* .csr-health-section {
    min-height: clamp(80rem, 30rem + 104.167vw, 110rem);
  } */
}

/* 768px以下: モバイル画像サイズ */
@media (max-width: 768px) {
  .csr-health-image-container {
    max-width: 50rem;
    width: clamp(21.875rem, 8.333rem + 55.556vw, 50rem);
  }

  .csr-health-image {
    width: clamp(21.875rem, 8.333rem + 55.556vw, 50rem);
    height: clamp(30.563rem, 23.612rem + 28.518vw, 45rem);
    object-fit: cover;
    object-position: top center;
    border-radius: 25px;
  }

  /* セクション全体の高さを確保 */
  /* JavaScriptで動的に設定されるため、固定のmin-heightは不要 */
  /* .csr-health-section {
    min-height: clamp(110rem, 70rem + 164.103vw, 180rem);
  } */
}

/* コンテンツオーバーレイ */
.csr-health-content {
  position: absolute;
  top: clamp(12.938rem, 10.671rem + 9.307vw, 9rem); /* 207px at 390px, 144px at 1920px */
  left: clamp(1.75rem, -0.098rem + 7.582vw, 9rem); /* 20px at 390px, 144px at 1920px */
  z-index: 1;
}

@media (min-width: 1201px) {
.csr-health-content {
  position: absolute;
  top: clamp(5rem, -1.682rem + 8.901vw, 9rem); /* 207px at 390px, 144px at 1920px */
  left: clamp(3rem, -7rem + 13.333vw, 9rem); /* 20px at 390px, 144px at 1920px */
  z-index: 1;
}
}

/* タイトル */
.csr-health-title {
  color: #BA2A20;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(1.875rem, 1.543rem + 1.361vw, 3rem); /* 30px at 390px, 48px at 1920px */
  font-style: normal;
  font-weight: 400;
  line-height: clamp(1.913rem, 1.558rem + 1.455vw, 3.188rem); /* 30.6px at 390px, 51px at 1920px */
  letter-spacing: clamp(0.188rem, 0.154rem + 0.136vw, 0.3rem); /* 3px at 390px, 4.8px at 1920px */
  margin: 0;
}

/* タグコンテナ */
.csr-health-tags {
  display: flex;
  gap: clamp(0.563rem, 0.467rem + 0.392vw, 0.938rem); /* 9px at 390px, 15px at 1920px */
  margin-top: clamp(1.25rem, 0.868rem + 1.569vw, 2.75rem); /* 20px at 390px, 44px at 1920px */
}

/* タグ */
.csr-health-tag {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(6.037rem, 5.012rem + 4.207vw, 10.06rem); /* 100.8px at 390px, 168px at 1920px */
  height: clamp(2.213rem, 1.823rem + 1.598vw, 3.688rem); /* 35.4px at 390px, 59px at 1920px */
  border-radius: clamp(1.106rem, 0.911rem + 0.799vw, 1.844rem); /* 17.7px at 390px, 29.5px at 1920px */
  background: #FFF;
  color: #000;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(0.875rem, 0.711rem + 0.673vw, 1.5rem); /* 14px at 390px, 24px at 1920px */
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  white-space: nowrap;
}

/* テキスト */
.csr-health-text {
  color: #000;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(0.875rem, 0.843rem + 0.131vw, 1rem); /* 14px at 390px, 16px at 1920px */
  font-style: normal;
  font-weight: clamp(500, 500 - 100 * (100vw - 24.375rem) / 71.25rem, 400); /* 500 at 390px, 400 at 1920px */
  line-height: clamp(1.75rem, 1.309rem + 1.811vw, 2.563rem); /* 28px at 390px, 41px at 1920px */
  letter-spacing: clamp(0.088rem, 0.088rem, 0rem); /* 1.4px at 390px, 0px at 1920px */
  margin: clamp(0.813rem, 0.431rem + 1.569vw, 2.125rem) 0 0 0; /* 13px at 390px, 34px at 1920px */
  max-width: clamp(19.375rem, 11.569rem + 32.026vw, 50rem); /* 310px at 390px, 346px at 1920px */
}

/* 1200px以下: モバイル固有の調整 */
@media (max-width: 1200px) {
  .csr-health-text {
    color: #050505;
    font-weight: 500;
    letter-spacing: 0.088rem; /* 1.4px */
    max-width: 304px;
  }
  .csr-health-tags {
    margin-left: -8px;
  }
}

/* ============================
   健康・福祉 投稿カードセクション
============================ */
.csr-health-posts {
  display: grid;
  position: absolute;
  z-index: 2;
}

/* 1201px以上: 横並び4列 */
@media (min-width: 1201px) {
  .csr-health-posts {
    grid-template-columns: repeat(4, 1fr);
    gap: clamp(1.5rem, 0.659rem + 1.121vw, 2rem); /* 24px at 1201px, 32px at 1920px */
    top: clamp(26.875rem, 8.918rem + 23.922vw, 37.625rem);
    left: clamp(3rem, -0.073rem + 4.096vw, 5.063rem); /* 48px at 1201px, 81px at 1920px */
    width: calc(100% - clamp(6rem, -0.146rem + 8.192vw, 10.126rem)); /* 左右の余白を引く */
  }
}

/* 768px〜1200px: 横2列 */
@media (min-width: 769px) and (max-width: 1200px) {
  .csr-health-posts {
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(1.25rem, 0.179rem + 2.232vw, 1.75rem); /* 20px at 769px, 28px at 1200px */
    top: clamp(26.875rem, 21.759rem + 20.988vw, 37.5rem);
    left: 50%; /* 中央基準 */
    transform: translateX(-50%); /* 中央配置 */
    width: clamp(35rem, 8.237rem + 55.684vw, 50rem);
  }
}

/* 768px以下: 縦並び */
@media (max-width: 768px) {
  .csr-health-posts {
    grid-template-columns: 1fr;
    gap: 1.75rem; /* 28px */
    top: clamp(26.875rem, 21.759rem + 20.988vw, 37.5rem);
    left: 50%; /* 中央基準 */
    transform: translateX(-50%); /* 中央配置 */
    width: clamp(19.375rem, 4.63rem + 60.494vw, 50rem); /* 310px at 390px */
  }
}

/* 投稿カード */
.csr-post-card {
  background: #FFF;
  border: 0.5rem solid #FFF; /* 8px */
  display: flex;
  flex-direction: column;
  overflow: visible;
}

/* 1201px以上: PC版カード */
@media (min-width: 1201px) {
  .csr-post-card {
    width: 100%; /* grid内で自動調整 */
    min-height: clamp(19.06rem, 18.358rem + 2.879vw, 21.813rem); /* 288px at 1201px, 349px at 1920px */
    border-radius: clamp(1rem, 0.559rem + 0.588vw, 1.375rem); /* 16px at 1201px, 22px at 1920px */
    flex-shrink: 0;
  }
}

/* 769px〜1200px: 2列表示用カード */
@media (min-width: 769px) and (max-width: 1200px) {
  .csr-post-card {
    width: clamp(16.875rem, 4.162rem + 26.45vw, 24rem); /* 310px at 769px, 384px at 1200px */
    min-height: auto; /* 高さは自動調整 */
    border-radius: clamp(1rem, 0.674rem + 0.679vw, 1.25rem); /* 16px at 769px, 20px at 1200px */
    flex-shrink: 0;
  }
}

/* 768px以下: モバイル版カード */
@media (max-width: 768px) {
  .csr-post-card {
    width: 100%; /* grid内で自動調整 */
    min-height: clamp(13.25rem, 11.102rem + 8.821vw, 18rem); /* 212px at 390px, 288px at 768px */
    border-radius: 1rem; /* 16px */
    flex-shrink: 0;
  }
}

/* サムネイル画像コンテナ */
.csr-post-thumbnail {
  width: 100%;
  overflow: hidden;
}

/* 1201px以上: PC版サムネイル */
@media (min-width: 1201px) {
  .csr-post-thumbnail {
    height: clamp(11rem, 7.667rem + 4.444vw, 13rem); /* 176px at 1201px, 208px at 1920px */
    border-radius: clamp(0.625rem, 0.294rem + 0.441vw, 0.875rem); /* 10px at 1201px, 14px at 1920px */
  }

  .csr-post-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
}

/* 1200px以下: モバイル版サムネイル */
@media (max-width: 1200px) {
  .csr-post-thumbnail {
    /*height: clamp(12.25rem, 6.481rem + 23.672vw, 25rem); /* 196px at 390px, 400px at 1200px */
    border-radius: 0.5rem; /* 8px */
  }

  .csr-post-thumbnail img {
    width: 100%; /* カード幅に合わせる */
    height: clamp(12.25rem, 11.407rem + 3.457vw, 14rem); /* 親要素の高さに合わせる */
    object-fit: cover;
    display: block;
  }
}

/* 投稿メタ情報 */
.csr-post-meta {
  display: flex;
  flex-direction: column;
}

/* 1201px以上: PC版メタ */
@media (min-width: 1201px) {
  .csr-post-meta {
    margin-top: clamp(1.25rem, 0.809rem + 0.588vw, 1.75rem); /* 20px at 1201px, 28px at 1920px */
    
  }
}

/* 1200px以下: モバイル版メタ */
@media (max-width: 1200px) {
  .csr-post-meta {
    margin-top: 0.5rem; /* 8px */
  }
}

/* 投稿日 */
.csr-post-date {
  color: rgba(0, 0, 0, 0.46);
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.875rem; /* 14px */
  font-style: normal;
  font-weight: 500;
  line-height: 2.563rem; /* 41px, 292.857% */
  letter-spacing: 0.061rem; /* 0.98px */
}

/* 投稿タイトル */
.csr-post-title {
  color: #000;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1rem; /* 16px */
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.05rem; /* 0.8px */
  margin: 0;
}

/* 1201px以上: PC版タイトル */
@media (min-width: 1201px) {
  .csr-post-title {
    line-height: 2rem; /* 32px, 200% */
    margin-top: -6px;
    width: 103.7%; /* カード幅に合わせる */
  }
}

/* 769px〜1200px: 2列表示用タイトル */
@media (min-width: 769px) and (max-width: 1200px) {
  .csr-post-title {
    line-height: clamp(1.75rem, 1.585rem + 0.344vw, 1.875rem); /* 28px at 769px, 30px at 1200px */
    margin-top: clamp(0.063rem, -0.07rem + 0.277vw, 0.188rem); /* 1px at 769px, 3px at 1200px */
    width: 100%; /* カード幅に合わせる */
    color: #000;
  }
}

/* 768px以下: モバイル版タイトル */
@media (max-width: 768px) {
  .csr-post-title {
    line-height: 1.75rem; /* 28px, 175% */
    margin-top: -6px;
    width: 100%; /* カード幅に合わせる */
    color: #050505;
  }
  .csr-post-thumbnail img {
    height: clamp(12.25rem, 5.286rem + 28.571vw, 19rem); /* 親要素の高さに合わせる */
  }
}

/* ============================
   投稿カードの非表示/表示
============================ */
.csr-post-card {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.csr-post-hidden {
  opacity: 0;
  transform: translateY(20px);
  pointer-events: none;
  position: absolute;
  visibility: hidden;
}

/* アニメーション表示用クラス */
.csr-post-showing {
  position: relative;
  visibility: visible;
  pointer-events: auto;
}

/* ============================
   もっとみるボタン
============================ */
.csr-load-more-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(0.438rem, 0.358rem + 0.327vw, 0.5rem); /* 7px at 390px, 8px at 1920px */
  background: none;
  border: none;
  cursor: pointer;
  padding: clamp(0.625rem, 0.545rem + 0.327vw, 0.75rem); /* 10px at 390px, 12px at 1920px */
  margin-top: 0;
  margin-right: auto;
  margin-bottom: 0;
  margin-left: auto;
  transition: opacity 0.3s ease;
}

/* margin-topはJavaScriptで動的に設定されます */
/* SP版では最小マージンを保証 */
@media (max-width: 768px) {
  .csr-load-more-btn {
    margin-top: 2rem; /* 32px - 最小マージン（JavaScriptで上書き可能） */
  }
}

@media (hover: hover) {
  .csr-load-more-btn:hover {
    opacity: 0.7;
  }
}

.csr-load-more-text {
  color: #050505;
  font-family: Raleway, sans-serif;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

/* 1201px以上: デスクトップ */
@media (min-width: 1201px) {
  .csr-load-more-text {
    font-size: clamp(1.125rem, 0.941rem + 0.245vw, 1.25rem); /* 18px at 1201px, 20px at 1920px */
    letter-spacing: clamp(0.1125rem, 0.094rem + 0.025vw, 0.125rem); /* 1.8px at 1201px, 2px at 1920px */
  }
}

/* 769px〜1200px: タブレット */
@media (min-width: 769px) and (max-width: 1200px) {
  .csr-load-more-text {
    font-size: clamp(1rem, 0.836rem + 0.341vw, 1.125rem); /* 16px at 769px, 18px at 1200px */
    letter-spacing: clamp(0.1rem, 0.084rem + 0.034vw, 0.1125rem); /* 1.6px at 769px, 1.8px at 1200px */
  }
}

/* 768px以下: モバイル */
@media (max-width: 768px) {
  .csr-load-more-text {
    font-size: 1rem; /* 16px */
    letter-spacing: 0.1rem; /* 1.6px */
  }
}

.csr-load-more-icon {
  flex-shrink: 0;
}

/* 1201px以上: デスクトップ */
@media (min-width: 1201px) {
  .csr-load-more-icon {
    width: clamp(0.813rem, 0.699rem + 0.152vw, 0.875rem); /* 13px at 1201px, 14px at 1920px */
    height: clamp(0.813rem, 0.699rem + 0.152vw, 0.875rem);
  }
}

/* 769px〜1200px: タブレット */
@media (min-width: 769px) and (max-width: 1200px) {
  .csr-load-more-icon {
    width: clamp(0.709rem, 0.589rem + 0.25vw, 0.813rem); /* 11.34px at 769px, 13px at 1200px */
    height: clamp(0.709rem, 0.589rem + 0.25vw, 0.813rem);
  }
}

/* 768px以下: モバイル */
@media (max-width: 768px) {
  .csr-load-more-icon {
    width: 0.709rem; /* 11.34px */
    height: 0.709rem;
  }
}



/* ============================
   災害復興セクション
============================ */
.csr-disaster-section {
  width: 100%;
  margin: clamp(7.5rem, 7.118rem + 1.569vw, 9rem) auto 0 auto; /* 120px at 390px, 166px at 1920px (158px + 8px調整) */
  display: flex;
  flex-direction: column;
  align-items: center;
}

.csr-disaster-image-container {
  position: relative;
  width: 100%;
  max-width: 100.063rem; /* 1601px */
  display: flex;
  justify-content: center;
}

/* 画像 */
.csr-disaster-image {
  width: 100%;
  height: auto;
  display: block;
}

/* 1201px以上: PC画像サイズ */
@media (min-width: 1201px) {
  .csr-disaster-image-container {
    max-width: 100rem; /* 1601px */
    width: clamp(63.29rem, 1.971rem + 81.691vw, 100rem);
    margin-right: clamp(1.25rem, -0.98rem + 9.15vw, 10rem);
    margin-left: clamp(1.25rem, -0.98rem + 9.15vw, 10rem);
  }

  .csr-disaster-image {
    max-width: 100rem;
    width: clamp(63.29rem, 1.971rem + 81.691vw, 100rem); /* 1601px */
    height: clamp(28.24rem, 0.088rem + 37.505vw, 44.625rem);
    object-fit: cover;
   
    border-radius: 25px;
  }

  /* セクション全体の高さを確保 */
  /* JavaScriptで動的に設定されるため、固定のmin-heightは不要 */
  /* .csr-disaster-section {
    min-height: clamp(55rem, 30rem + 33.333vw, 70rem);
  } */
}

/* 769px〜1200px: 2列表示時の画像サイズ */
@media (min-width: 769px) and (max-width: 1200px) {
  .csr-disaster-image-container {
    max-width: 50rem;
    width: clamp(21.875rem, 8.333rem + 55.556vw, 50rem);
  }

  .csr-disaster-image {
    width: clamp(21.875rem, 8.333rem + 55.556vw, 50rem);
    height: clamp(30.563rem, 23.612rem + 28.518vw, 45rem);
    object-fit: cover;
    border-radius: 25px;
  }

  /* セクション全体の高さを確保 */
  /* JavaScriptで動的に設定されるため、固定のmin-heightは不要 */
  /* .csr-disaster-section {
    min-height: clamp(80rem, 30rem + 104.167vw, 110rem);
  } */
}

/* 768px以下: モバイル画像サイズ */
@media (max-width: 768px) {
  .csr-disaster-image-container {
    max-width: 50rem;
    width: clamp(21.875rem, 8.333rem + 55.556vw, 50rem);
  }

  .csr-disaster-image {
    width: clamp(21.875rem, 8.333rem + 55.556vw, 50rem);
    height: clamp(30.563rem, 23.612rem + 28.518vw, 45rem);
    object-fit: cover;
    object-position: top center;
    border-radius: 25px;
  }

  /* セクション全体の高さを確保 */
  /* JavaScriptで動的に設定されるため、固定のmin-heightは不要 */
  /* .csr-disaster-section {
    min-height: clamp(110rem, 70rem + 164.103vw, 180rem);
  } */
}

/* コンテンツオーバーレイ */
.csr-disaster-content {
  position: absolute;
  top: clamp(12.938rem, 10.671rem + 9.307vw, 9rem); /* 207px at 390px, 144px at 1920px */
  left: clamp(1.75rem, -0.098rem + 7.582vw, 9rem);
  z-index: 1;
}

@media (min-width: 1201px) {
.csr-disaster-content {
  position: absolute;
  top: clamp(5rem, -1.682rem + 8.901vw, 9rem); /* 207px at 390px, 144px at 1920px */
  left: clamp(3rem, -7rem + 13.333vw, 9rem); /* 20px at 390px, 144px at 1920px */
  z-index: 1;
}
}

/* タイトル */
.csr-disaster-title {
  color: #BA2A20;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(1.875rem, 1.543rem + 1.361vw, 3rem); /* 30px at 390px, 48px at 1920px */
  font-style: normal;
  font-weight: 400;
  line-height: clamp(1.913rem, 1.558rem + 1.455vw, 3.188rem); /* 30.6px at 390px, 51px at 1920px */
  letter-spacing: clamp(0.188rem, 0.154rem + 0.136vw, 0.3rem); /* 3px at 390px, 4.8px at 1920px */
  margin: 0;
}

/* タグコンテナ */
.csr-disaster-tags {
  display: flex;
  gap: clamp(0.563rem, 0.467rem + 0.392vw, 0.938rem); /* 9px at 390px, 15px at 1920px */
  margin-top: clamp(1.25rem, 0.968rem + 1.157vw, 2.75rem); /* 20px at 390px, 44px at 1920px */
}

/* タグ */
.csr-disaster-tag {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(6.037rem, 5.012rem + 4.207vw, 10.06rem); /* 100.8px at 390px, 168px at 1920px */
  height: clamp(2.213rem, 1.823rem + 1.598vw, 3.688rem); /* 35.4px at 390px, 59px at 1920px */
  border-radius: clamp(1.106rem, 0.911rem + 0.799vw, 1.844rem); /* 17.7px at 390px, 29.5px at 1920px */
  background: #FFF;
  color: #000;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(0.875rem, 0.711rem + 0.673vw, 1.5rem); /* 14px at 390px, 24px at 1920px */
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  white-space: nowrap;
}

/* テキスト */
.csr-disaster-text {
  color: #000; /* #050505 at 390px, #000 at 1920px */
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(0.875rem, 0.843rem + 0.131vw, 1rem); /* 14px at 390px, 16px at 1920px */
  font-style: normal;
  font-weight: clamp(500, 500 - 100 * (100vw - 24.375rem) / 71.25rem, 400); /* 500 at 390px, 400 at 1920px */
  line-height: clamp(1.75rem, 1.309rem + 1.811vw, 2.563rem); /* 28px at 390px, 41px at 1920px */
  letter-spacing: clamp(0.088rem, 0.088rem, 0rem); /* 1.4px at 390px, 0px at 1920px */
  margin: clamp(0.813rem, 0.431rem + 1.569vw, 2.125rem) 0 0 0; /* 13px at 390px, 34px at 1920px */
  max-width: clamp(19.375rem, 11.569rem + 32.026vw, 50rem); /* 310px at 390px, 346px at 1920px */
}

/* 1200px以下: モバイル固有の調整 */
@media (max-width: 1200px) {

  .csr-disaster-text {
    color: #050505;
    font-weight: 500;
    letter-spacing: 0.088rem; /* 1.4px */
    max-width: clamp(19rem, 18.518rem + 1.978vw, 20rem);
  }
  .csr-disaster-tags {
    margin-left: -8px;
  }
}

/* ============================
   災害復興 投稿カードセクション
============================ */
.csr-disaster-posts {
  display: grid;
  position: absolute;
  z-index: 2;
}

/* 1201px以上: 横並び4列 */
@media (min-width: 1201px) {
  .csr-disaster-posts {
    grid-template-columns: repeat(4, 1fr);
    gap: clamp(1.5rem, 0.659rem + 1.121vw, 2rem); /* 24px at 1201px, 32px at 1920px */
    top: clamp(26.875rem, 8.918rem + 23.922vw, 37.625rem);
    left: clamp(3rem, -0.073rem + 4.096vw, 5.063rem); /* 48px at 1201px, 81px at 1920px */
    width: calc(100% - clamp(6rem, -0.146rem + 8.192vw, 10.126rem)); /* 左右の余白を引く */
  }
}

/* 768px〜1200px: 横2列 */
@media (min-width: 769px) and (max-width: 1200px) {
  .csr-disaster-posts {
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(1.25rem, 0.179rem + 2.232vw, 1.75rem); /* 20px at 769px, 28px at 1200px */
    top: clamp(26.875rem, 21.759rem + 20.988vw, 37.5rem);
    left: 50%; /* 中央基準 */
    transform: translateX(-50%); /* 中央配置 */
    width: clamp(35rem, 8.237rem + 55.684vw, 50rem);
  }
}

/* 768px以下: 縦並び */
@media (max-width: 768px) {
  .csr-disaster-posts {
    grid-template-columns: 1fr;
    gap: 1.75rem; /* 28px */
    top: clamp(26.875rem, 21.759rem + 20.988vw, 37.5rem);
    left: 50%; /* 中央基準 */
    transform: translateX(-50%); /* 中央配置 */
    width: clamp(19.375rem, 4.63rem + 60.494vw, 50rem); /* 310px at 390px */
  }
}

/* ============================
   未来支援セクション
============================ */
.csr-future-section {
  width: 100%;
  margin: clamp(7.5rem, 7.118rem + 1.569vw, 9rem) auto 0 auto; /* 120px at 390px, 166px at 1920px (158px + 8px調整) */
  display: flex;
  flex-direction: column;
  align-items: center;
}

.csr-future-image-container {
  position: relative;
  width: 100%;
  max-width: 100.063rem; /* 1601px */
  display: flex;
  justify-content: center;
}

/* 画像 */
.csr-future-image {
  width: 100%;
  height: auto;
  display: block;
}

/* 1201px以上: PC画像サイズ */
@media (min-width: 1201px) {
  .csr-future-image-container {
    max-width: 100rem; /* 1601px */
    width: clamp(63.29rem, 1.971rem + 81.691vw, 100rem);
    margin-right: clamp(1.25rem, -0.98rem + 9.15vw, 10rem);
    margin-left: clamp(1.25rem, -0.98rem + 9.15vw, 10rem);
  }

  .csr-future-image {
    max-width: 100rem;
    width: clamp(63.29rem, 1.971rem + 81.691vw, 100rem); /* 1601px */
    height: clamp(28.24rem, 0.088rem + 37.505vw, 44.625rem);
    object-fit: cover;
   
    border-radius: 25px;
  }

  /* セクション全体の高さを確保 */
  /* JavaScriptで動的に設定されるため、固定のmin-heightは不要 */
  /* .csr-future-section {
    min-height: clamp(55rem, 30rem + 33.333vw, 70rem);
  } */
}

/* 769px〜1200px: 2列表示時の画像サイズ */
@media (min-width: 769px) and (max-width: 1200px) {
  .csr-future-image-container {
    max-width: 50rem;
    width: clamp(21.875rem, 8.333rem + 55.556vw, 50rem);
  }

  .csr-future-image {
    width: clamp(21.875rem, 8.333rem + 55.556vw, 50rem);
    height: clamp(30.563rem, 23.612rem + 28.518vw, 45rem);
    object-fit: cover;
    object-position: top center;
    border-radius: 25px;
  }

  /* セクション全体の高さを確保 */
  /* JavaScriptで動的に設定されるため、固定のmin-heightは不要 */
  /* .csr-future-section {
    min-height: clamp(80rem, 30rem + 104.167vw, 110rem);
  } */
}

/* 768px以下: モバイル画像サイズ */
@media (max-width: 768px) {
  .csr-future-image-container {
    max-width: 50rem;
    width: clamp(21.875rem, 8.333rem + 55.556vw, 50rem);
  }

  .csr-future-image {
    width: clamp(21.875rem, 8.333rem + 55.556vw, 50rem);
    height: clamp(30.563rem, 23.612rem + 28.518vw, 45rem);
    object-fit: cover;
    object-position: top center;
    border-radius: 25px;
  }

  /* セクション全体の高さを確保 */
  /* JavaScriptで動的に設定されるため、固定のmin-heightは不要 */
  /* .csr-future-section {
    min-height: clamp(110rem, 70rem + 164.103vw, 180rem);
  } */
}

/* コンテンツオーバーレイ */
.csr-future-content {
  position: absolute;
  top: clamp(9rem, 10.254rem - 0.065vw, 10rem); /* 160px at 390px, 144px at 1920px */
  left: clamp(1.75rem, -0.098rem + 7.582vw, 9rem);
  z-index: 1;
}

@media (min-width: 1201px) {
.csr-future-content {
  position: absolute;
  top: clamp(5rem, -1.682rem + 8.901vw, 9rem); /* 207px at 390px, 144px at 1920px */
  left: clamp(3rem, -7rem + 13.333vw, 9rem); /* 20px at 390px, 144px at 1920px */
  z-index: 1;
}
}

/* タイトル */
.csr-future-title {
  color: #BA2A20;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(1.875rem, 1.543rem + 1.361vw, 3rem); /* 30px at 390px, 48px at 1920px */
  font-style: normal;
  font-weight: 400;
  line-height: clamp(1.913rem, 1.558rem + 1.455vw, 3.188rem); /* 30.6px at 390px, 51px at 1920px */
  letter-spacing: clamp(0.188rem, 0.154rem + 0.136vw, 0.3rem); /* 3px at 390px, 4.8px at 1920px */
  margin: 0;
}

/* タグコンテナ */
.csr-future-tags {
  display: flex;
  gap: clamp(0.563rem, 0.467rem + 0.392vw, 0.938rem); /* 9px at 390px, 15px at 1920px */
  margin-top: clamp(1.25rem, 0.968rem + 1.157vw, 2.75rem); /* 20px at 390px, 44px at 1920px */
  flex-wrap: wrap;
}

/* タグ */
.csr-future-tag {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(6.037rem, 5.012rem + 4.207vw, 10.06rem); /* 100.8px at 390px, 168px at 1920px */
  height: clamp(2.213rem, 1.823rem + 1.598vw, 3.688rem); /* 35.4px at 390px, 59px at 1920px */
  border-radius: clamp(1.106rem, 0.911rem + 0.799vw, 1.844rem); /* 17.7px at 390px, 29.5px at 1920px */
  background: #FFF;
  color: #000;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(0.875rem, 0.711rem + 0.673vw, 1.5rem); /* 14px at 390px, 24px at 1920px */
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  white-space: nowrap;
}

/* 2行目のタグ（独自プロジェクト） */
.csr-future-tag-second-row {
  margin-top: clamp(0.813rem, 0.681rem + 0.542vw, 1.313rem); /* 13px at 390px, 21px at 1920px */
  flex-basis: 100%; /* 強制的に次の行に移動 */
}

/* テキスト */
.csr-future-text {
  color: #000; /* #050505 at 390px, #000 at 1920px */
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(0.875rem, 0.843rem + 0.131vw, 1rem); /* 14px at 390px, 16px at 1920px */
  font-style: normal;
  font-weight: clamp(500, 500 - 100 * (100vw - 24.375rem) / 71.25rem, 400); /* 500 at 390px, 400 at 1920px */
  line-height: clamp(1.75rem, 1.309rem + 1.811vw, 2.563rem); /* 28px at 390px, 41px at 1920px */
  letter-spacing: clamp(0.088rem, 0.088rem, 0rem); /* 1.4px at 390px, 0px at 1920px */
  margin: clamp(0.813rem, 0.431rem + 1.569vw, 2.125rem) 0 0 0; /* 13px at 390px, 34px at 1920px */
  max-width: clamp(19.375rem, 11.569rem + 32.026vw, 50rem); /* 310px at 390px, 346px at 1920px */
}

/* 1200px以下: モバイル固有の調整 */
@media (max-width: 1200px) {
  .csr-future-text {
    color: #050505;
    font-weight: 500;
    letter-spacing: 0.088rem; /* 1.4px */
    max-width: clamp(19rem, 18.518rem + 1.978vw, 20rem);
  }
  .csr-future-tags {
    margin-left: -8px;
  }
}

/* ============================
   未来支援 投稿カードセクション
============================ */
.csr-future-posts {
  display: grid;
  position: absolute;
  z-index: 2;
}

/* 1201px以上: 横並び4列 */
@media (min-width: 1201px) {
  .csr-future-posts {
    grid-template-columns: repeat(4, 1fr);
    gap: clamp(1.5rem, 0.659rem + 1.121vw, 2rem); /* 24px at 1201px, 32px at 1920px */
    top: clamp(26.875rem, 8.918rem + 23.922vw, 37.625rem);
    left: clamp(3rem, -0.073rem + 4.096vw, 5.063rem); /* 48px at 1201px, 81px at 1920px */
    width: calc(100% - clamp(6rem, -0.146rem + 8.192vw, 10.126rem)); /* 左右の余白を引く */
  }
}

/* 768px〜1200px: 横2列 */
@media (min-width: 769px) and (max-width: 1200px) {
  .csr-future-posts {
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(1.25rem, 0.179rem + 2.232vw, 1.75rem); /* 20px at 769px, 28px at 1200px */
    top: clamp(26.875rem, 21.759rem + 20.988vw, 37.5rem);
    left: 50%; /* 中央基準 */
    transform: translateX(-50%); /* 中央配置 */
    width: clamp(35rem, 8.237rem + 55.684vw, 50rem);
  }
}

/* 768px以下: 縦並び */
@media (max-width: 768px) {
  .csr-future-posts {
    grid-template-columns: 1fr;
    gap: 1.75rem; /* 28px */
    top: clamp(26.875rem, 21.759rem + 20.988vw, 37.5rem);
    left: 50%; /* 中央基準 */
    transform: translateX(-50%); /* 中央配置 */
    width: clamp(19.375rem, 4.63rem + 60.494vw, 50rem); /* 310px at 390px */
  }
}

/* ============================
   個別タグのカスタムサイズ
============================ */

/* 健康増進 */
.csr-tag-health-promotion {
  width: clamp(6.3rem, 5.229rem + 4.392vw, 10.5rem); /* 100.8px at 390px, 168px at 1920px */
}

/* 被災地支援 */
.csr-tag-disaster-support {
  width: clamp(7.125rem, 5.882rem + 5.098vw, 12rem); /* 114px at 390px, 192px at 1920px */
}

/* 教育 */
.csr-tag-education {
  width: clamp(4.425rem, 3.673rem + 3.085vw, 7.375rem); /* 70.8px at 390px, 118px at 1920px */
}

/* 子ども支援 */
.csr-tag-child-support {
  width: clamp(7.05rem, 5.852rem + 4.915vw, 11.75rem); /* 112.8px at 390px, 188px at 1920px */
}

/* 独自プロジェクト */
.csr-tag-original-project {
  max-width: clamp(9.675rem, 8.031rem + 6.745vw, 16.125rem); /* 154.8px at 390px, 258px at 1920px */
  width: auto; /* flex-basis: 100% の影響を受けつつ、max-widthで制限 */
}

@media (max-width: 768px) {
  /* SP版: 各セクション間のマージンを追加 */
  .csr-lead-section,
  .csr-engine-section,
  .csr-pillars-section {
    margin-bottom: 4rem;
  }
  /* 健康福祉・災害復興・未来支援セクション間の間隔を広げる */
  .csr-health-section,
  .csr-disaster-section {
    margin-bottom: 6rem; /* 96px */
  }
  .csr-future-section {
    margin: 0 auto 0 auto;
  }
  .csr-disaster-section {
    margin: 0 auto 6rem auto; /* 96px */
  }
}

/* CSRページの下部パディングを削除 */
#page-csr.page-top-under {
  padding-bottom: clamp(0rem, -0.765rem + 3.137vw, 3rem);
}

/* ============================
   エンジン始動プロジェクト: 改行制御
============================ */
@media screen and (max-width: 1660px) {
  .csr-engine-break-01 {
    display: none;
  }
}