.cms_pc, .cms_sp {
  background-color: #f9f4eb;
}
@media screen and (min-width: 768px) {
  .fs16 {
    font-size: 18px;
    line-height: 1.7;
  }
}
/* セクションは縦に長い(300vh)。中身がstickyで100vh分画面に貼り付く */
#bg_uonuma1, #bg_uonuma2, #bg_uonuma3, #bg_uonuma4 {
  position: relative;
  width: 100%;
  height: 300vh;
  background-color: transparent;
}
/* 2番目以降のセクションは100vh分上に重ねて、前セクションの「stickyが剥がれた後の空白」を覆う */
#bg_uonuma2, #bg_uonuma3, #bg_uonuma4 {
  margin-top: -100vh;
}
/* sticky内側コンテナ: 画面に100vh分貼り付く */
#bg_uonuma1 .sticky-inner, #bg_uonuma2 .sticky-inner, #bg_uonuma3 .sticky-inner, #bg_uonuma4 .sticky-inner {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}
/* z-index: 後ろのセクションほど手前 */
#bg_uonuma1 {
  z-index: 1;
}
#bg_uonuma2 {
  z-index: 2;
}
#bg_uonuma3 {
  z-index: 3;
}
#bg_uonuma4 {
  z-index: 4;
}
/* 背景画像: 絶対配置 */
#bg_uonuma1 .sticky-inner > .cms_cover, #bg_uonuma2 .sticky-inner > .cms_cover, #bg_uonuma3 .sticky-inner > .cms_cover, #bg_uonuma4 .sticky-inner > .cms_cover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 1;
  will-change: transform;
}
/* 黒オーバーレイ: databoxが表示されるタイミングで暗くする */
#bg_uonuma1 .sticky-inner > .cms_cover::after, #bg_uonuma2 .sticky-inner > .cms_cover::after, #bg_uonuma3 .sticky-inner > .cms_cover::after, #bg_uonuma4 .sticky-inner > .cms_cover::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  opacity: 0;
  transition: opacity 0.6s ease-out;
  pointer-events: none;
}
/* databoxが表示状態の時、同セクションの背景を暗くする */
#bg_uonuma1.is-darkened .sticky-inner > .cms_cover::after, #bg_uonuma2.is-darkened .sticky-inner > .cms_cover::after, #bg_uonuma3.is-darkened .sticky-inner > .cms_cover::after, #bg_uonuma4.is-darkened .sticky-inner > .cms_cover::after {
  opacity: 1;
}
/* bg_uonuma2以降の背景: 初期は画面下に隠す。JSでtranslateYを動的に変更 */
#bg_uonuma2 .sticky-inner > .cms_cover, #bg_uonuma3 .sticky-inner > .cms_cover, #bg_uonuma4 .sticky-inner > .cms_cover {
  transform: translateY(100%);
}
/* テキストラッパー */
#bg_uonuma1 .cms_layout_minwidth0, #bg_uonuma2 .cms_layout_minwidth0, #bg_uonuma3 .cms_layout_minwidth0, #bg_uonuma4 .cms_layout_minwidth0 {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  pointer-events: none;
  overflow: hidden;
}
/* databox: JSでtranslateYで動かす */
#bg_uonuma1 .cms_databox, #bg_uonuma2 .cms_databox, #bg_uonuma3 .cms_databox, #bg_uonuma4 .cms_databox {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  will-change: transform, opacity;
  pointer-events: auto;
  padding: 40px 20px;
  opacity: 0;
  --fade-duration: 0.5s;
  --fade-delay: 0s;
  transition: opacity var(--fade-duration) ease-out var(--fade-delay);
}
/* JSで表示状態を切り替え */
#bg_uonuma1 .cms_databox.is-visible, #bg_uonuma2 .cms_databox.is-visible, #bg_uonuma3 .cms_databox.is-visible, #bg_uonuma4 .cms_databox.is-visible {
  opacity: 1;
}
@media screen and (min-width: 768px) {
  #bg_uonuma1 .cms_text_copy, #bg_uonuma2 .cms_text_copy, #bg_uonuma3 .cms_text_copy, #bg_uonuma4 .cms_text_copy {
    width: 100%;
    max-width: 1205px;
    margin: 0 auto;
  }
}
#bg_uonuma1 .cms_dataexp, #bg_uonuma2 .cms_dataexp, #bg_uonuma3 .cms_dataexp, #bg_uonuma4 .cms_dataexp {
  word-break: keep-all;
}
@media screen and (max-width: 767px) {
  #bg_uonuma1, #bg_uonuma2, #bg_uonuma3, #bg_uonuma4 {
    overflow: visible;
  }
  #bg_uonuma1 .cms_databox, #bg_uonuma2 .cms_databox, #bg_uonuma3 .cms_databox, #bg_uonuma4 .cms_databox {
    padding: 40px 0;
  }
}