/* ===== アートボード親コンテナ：基準系 ===== */
.page-pc{
  position: relative;
  width: 900px;
  margin: 0 auto;
  opacity: 1;
}


/* ===== ファーストビュー ===== */
.page-pc .first-view{
  position: relative;
  width: 900px;
  height: 1050px;
  margin: 0 auto;
  opacity: 1;
}

/* .page-pc .first-view{
  margin-top: 34px;
} */

.sp-br{
  display: none;
}

/* @media (min-width: 992px){
  .page-pc .first-view{
    margin-top: 50px;
  }
} */

.page-pc .kv-clip{
  position: absolute;
  left: 0;
  top: 0;
  width: 900px;
  height: 784px;
}

.page-pc .kv-cd{
  display: block;
  width: 900px;
  height: 784px;
  object-fit: cover;
}

.page-pc .fv-bar{
  position: absolute;
  left: 0;
  top: 710px;
  width: 900px;
  background: #FEE100;
  padding: 0 40px 40px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  box-sizing: border-box;
}

.page-pc .kv-pc{
  width: 740px;
  height: auto;
  display: block;
  margin-left: 40px;
}

.page-pc .fv-note{
  width: 820px;
  min-height: 58px;
  margin: 0 auto;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-size: 26px;
  line-height: 150%;
  letter-spacing: 0;
  text-align: center;
  color: #221815;
}

/* ===== メニュー ===== */
.more-wrapper{
  display: none;
}

.page-pc .menu{
  width: 900px;
  height: 96px;
  background: #FEE100;
  display: flex;
  gap: 4px;
  box-sizing: border-box;
  margin-top: 0;
}

.page-pc .menu .button{
  width: 297.333px;
  height: 96px;
  position: relative;
  padding: 0 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  text-decoration: none;
  background: #221815;
  box-sizing: border-box;
}

.page-pc .menu .text{
  width: 257.333px;
  position: relative;
  transform: translateY(-6px);
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 180%;
  letter-spacing: 0;
  text-align: center;
  color: #FFFFFF;
}

.page-pc .menu .ls-23,
.page-pc .menu .ls-20{
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
}

.page-pc .menu .ls-23{
  letter-spacing: -0.23em;
}

.page-pc .menu .ls-20{
  letter-spacing: -0.20em;
}

.page-pc .menu .icon{
  width: 12px;
  height: 7px;
  display: block;
  position: absolute;
  left: 50%;
  bottom: 22px;
  transform: translateX(-50%);
}

/* PC だけホバー演出 */
@media (min-width: 768px) and (hover: hover) and (pointer: fine){
  .page-pc .menu .button{
    transition: background-color 0.25s ease;
  }
  .page-pc .menu .button .text{
    transition: transform 0.25s ease;
  }
  .page-pc .menu .button .icon{
    transition: transform 0.25s ease, opacity 0.25s ease;
  }

  .page-pc .menu .button:hover{
    background: #E74C3C;
  }

  .page-pc .menu .button:hover .text{
    transform: translateY(-2px);
  }

  .page-pc .menu .button:hover .icon{
    transform: translate(-50%, -4px);
  }
}

/* ===== Sec1 ===== */
.page-pc .sec1{
  width: 900px;
  height: 1153px;
  background: #FFE100;
  padding: 72px 40px 64px 40px;
  display: block;
  box-sizing: border-box;
  opacity: 1;
  margin-top: 0;
}

.page-pc .sec1-frame43{
  width: 820px;
  height: 82px;
  padding-bottom: 56px;
  box-sizing: border-box;
  margin: 0 auto;
}

.page-pc .sec1-ttl{
  width: 820px;
  height: 26px;
  margin: 0 auto;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 36px;
  line-height: 50%;
  letter-spacing: 0;
  text-align: center;
  color: #221815;
}

.page-pc .sec1-frame2{
  width: 820px;
  height: 935px;
  min-width: 0;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 36px;
  box-sizing: border-box;
  opacity: 1;
}

.page-pc .sec1-g{
  width: 392px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.page-pc .group1{
  height: 297px;
}

.page-pc .group6{
  height: auto;
}

.page-pc .g-frame1{
  width: 392px;
  height: 221px;
}

.page-pc .g-img{
  width: 392px;
  height: 221px;
  display: block;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid rgba(34,24,21,0.5);
  box-sizing: border-box;
}

.page-pc .g-text{
  width: 392px;
  margin: 0;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  letter-spacing: 0;
  color: #221815;
}

.page-pc .g-text.g-text--60{
  height: 60px;
}

.page-pc .g-text.g-text--36{
  height: 36px;
}

.page-pc .sec1-frame13{
  width: 820px;
  height: 221px;
  display: flex;
  gap: 36px;
  align-items: flex-start;
}

.page-pc .g-text.g-text--bold18{
  width: 392px;
  height: 94px;
  margin: 0;
  align-self: center;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 150%;
  letter-spacing: 0;
  color: #221815;
}

/* ===== 動画公開中！ ===== */
#railway_crossing .crossing_movie {
  margin-top: 24px;
}

#railway_crossing .crossing_title {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 28px;
  line-height: 150%;
  letter-spacing: 0;
  text-align: center;
  color: #221815;
  margin: 0 0 16px;
}

#railway_crossing .crossing_movie .box_paint01.movie img.object-fit-img {
  display: block;
  width: 50%;
  margin: 0 auto;
  height: auto;
  object-fit: contain;
}

/* ===== Sec2 ===== */
.page-pc .sec2{
  width: 900px;
  height: 687px;
  background: #FFFFFF;
  padding: 56px 40px 64px 40px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  box-sizing: border-box;
  margin-top: 40px;
}

.page-pc .sec2-frame4{
  width: 820px;
  height: 90px;
  display: flex;
  flex-direction: column;
  gap: 36px;
  align-items: center;
  margin: -16px auto 0;
}

.page-pc .sec2-title{
  width: 820px;
  height: 26px;
  margin: 0;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 36px;
  line-height: 150%;
  letter-spacing: 0;
  text-align: center;
  color: #221815;
}

.page-pc .sec2-subtitle{
  width: 392px;
  height: 24px;
  margin: 0 auto;
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 100%;
  letter-spacing: 0;
  text-align: center;
  color: #221815;
}

.page-pc .sec2-frame12{
  width: 820px;
  height: 440px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.page-pc .sec2-img{
  width: 820px;
  height: 296px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid rgba(34,24,21,0.5);
}

.page-pc .sec2-frame38{
  width: 820px;
  height: 120px;
  display: flex;
  flex-direction: row;
  gap: 36px;
  padding: 6px 0;
  box-sizing: border-box;
}

.page-pc .sec2-text{
  width: 392px;
  height: 108px;
  margin: 0;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  letter-spacing: 0;
  color: #221815;
}

/* ===== Sec3 ===== */
.page-pc .sec3{
  width: 900px;
  height: auto;
  background: #EDECE4;
  padding: 72px 40px 64px 40px;
  display: flex;
  flex-direction: column;
  gap: 48px;
  box-sizing: border-box;
  opacity: 1;
  margin-top: 40px;
}

.page-pc .sec3-title{
  width: 820px;
  height: 36px;
  margin: 0 auto;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 36px;
  line-height: 100%;
  letter-spacing: 0;
  text-align: center;
  color: #221815;
}

.page-pc .sec3-frame41{
  width: 820px;
  height: 900px;
  margin: 0 auto;
  padding: 56px;
  background: #FFFFFF;
  border-radius: 16px;
  display: flex;
  box-sizing: border-box;
}

.page-pc .sec3-frame7{
  width: 708px;
  margin: 0 auto;
  display: flex;
}

.page-pc .sec3-frame6{
  width: 708px;
  padding: 1px 0;
  display: flex;
  flex-direction: column;
  gap: 40px;
  box-sizing: border-box;
}

.page-pc .sec3-frame15{
  width: 708px;
  height: 296px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.page-pc .f22{
  width: 146px;
  height: 220px;
  display: block;
  object-fit: cover;
  border-radius: 8px;
}

.page-pc .f15-texts{
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.page-pc .q-22{
  width: 286px;
  margin: 0;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 22px;
  line-height: 150%;
  letter-spacing: 0;
  color: #221815;
}

.page-pc .p-16{
  width: 525px;
  margin: 0;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  letter-spacing: 0;
  color: #221815;
}

.page-pc .sec3-frame14{
  width: 708px;
  height: 76px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* .page-pc .w708{ width: 708px; } */
.page-pc .sec3-frame14 .q-22{
  width: 708px;
  height: 16px;
}

.page-pc .sec3-frame14 .p-16{
  width: 708px;
  height: 36px;
}

.page-pc .sec3-frame16{
  width: 708px;
  height: 242.6667px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.page-pc .sec3-frame21{
  width: 708px;
  height: 166.6667px;
  display: flex;
  gap: 24px;
}

.page-pc .sec3-card{
  width: 220px;
  height: 166.6667px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.page-pc .card-img{
  width: 220px;
  height: 146.6667px;
  display: block;
  object-fit: cover;
  border-radius: 8px;
}

.page-pc .card-cap{
  width: 220px;
  height: 10px;
  margin: 0;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 150%;
  letter-spacing: 0;
  color: #221815;
}

/* ===== Sec4B（クロージング） ===== */
.page-pc .sec4{
  width: 900px;
  height: 506.25px;
  background: #98BAD9;
  padding: 245px 150px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-sizing: border-box;
  opacity: 1;
  margin-top: 40px;
}

.page-pc .sec4-text{
  width: 240px;
  height: 15px;
  margin: 0;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 150%;
  letter-spacing: 0;
  text-align: center;
  color: #221815;
}

.page-pc .footer{
  width: 900px;
  height: 101px;
  background: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0px 40px 40px 40px;
  box-sizing: border-box;
  opacity: 1;
  margin-top: 40px;
}

.page-pc .sec4b{
  width: 900px;
  height: 696px;
  padding-top: 64px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-sizing: border-box;
  margin: 0 auto;
}

.page-pc .sec4b-frame4{
  width: 820px;
  height: 118px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: center;
  margin: 0 auto;
  box-sizing: border-box;
}

.page-pc .sec4b-title{
  width: 820px;
  height: 38px;
  margin: 0;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 52px;
  line-height: 100%;
  letter-spacing: 0;
  text-align: center;
  color: #221815;
}

.page-pc .sec4b-subtitle{
  width: 820px;
  height: 43px;
  margin: 0;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 140%;
  letter-spacing: 0;
  text-align: center;
  color: #221815;
}

.page-pc .sec4b-img{
  width: 900px;
  height: 506px;
  display: block;
  object-fit: cover;
  border: none;
}

/* ===== Footer (page) ===== */
.page-pc .footer .footer-copy{
  margin: 0;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-size: 11px;
  line-height: 150%;
  letter-spacing: 0;
  color: #221815;  
  white-space: nowrap; 
}

.page-pc .footer .footer-logo{
  width: 101px;
  height: 61px;
  display: block;
  object-fit: cover;
}

.l-railway {
    padding-bottom: 0px;
}

html, body {
  margin: 0;
  padding: 0;
}

html { scroll-behavior: smooth; }

/* 系统开启“减少动态效果”时自动关闭动画 */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

#sec1, #sec2, #sec3 { scroll-margin-top: 16px; }

#wrapper, .l-railway, .page-pc, .first-view {
  margin-top: 0;
  padding-top: 0;
}


/* =========================
   SP 用（≤767px）
   ========================= */
@media (max-width: 767px){
  .page-pc{
    width: 375px;
    margin: 0 auto;
  }

  
  /* --- ファーストビュー --- */

  .page-pc .first-view{
    width: 375px;
    height: auto;
    margin-top: 0;
    position: static;
    margin-bottom: -30px;
  }

  .page-pc .fv-bar{
    position: relative;
    top: -30px;
    z-index: 1;
    width: 375px;
    background: #FEE100;
    padding: 8px 16px 24px 16px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    box-sizing: border-box;
  }

  .page-pc .kv-clip{
    position: static;
    width: 375px;
    height: 327px;
  }

  .page-pc .kv-cd{
    width: 375px;
    height: 327px;
    display: block;
    object-fit: cover;
  }

  .page-pc .kv-pc{
    width: 343px;
    height: 97.448219px;
    margin: 0 auto;
    display: block;
    object-fit: cover;
  }

  .page-pc .fv-note{
    width: 343px;
    height: 55px;
    margin: 0 auto;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: 14.5px;
    line-height: 150%;
    text-align: center;
    color: #221815;
  }

  .page-pc .menu{
    width: 375px;
    height: 79.8px;
    background: #FEE100;
    gap: 2px;
    margin-top: 0;
  }

  .sp-br{
    display: inline;
  }

  .page-pc .menu .button{
    flex: 1;
    height: 79.8px;
    padding: 16px 8px 10px 8px;
    gap: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    background: #221815;
    box-sizing: border-box;
  }

  /* 3つ目のボタン：gap 20（Figma 指定） */
  .page-pc .menu .button:nth-child(3){
    gap: 20px;
  }

  .page-pc .menu .icon{
    width: 12px;
    height: 7px;
    position: static;
    margin: 0 auto 0;
    transform: translateY(-6px);
  }

  .page-pc .menu .button:nth-child(3){
    gap: 20px;
  }

  .page-pc .menu .button:nth-child(3) .text{
    margin-top: 10px;
  }

  .page-pc .menu .text{
    width: 107.6667px;
    margin: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 140%;
    text-align: center;
    color: #fff;
    transform: none;
    position: static;
    white-space: normal;
    display: inline-block;
  }

  /* --- Sec1 --- */
  .page-pc .sec1{
    width: 375px;
    height: auto;
    background: #FFE100;
    padding: 48px 20px 48px;
    box-sizing: border-box;
    gap: 0;
  }

  .page-pc .sec1-frame43{
    width: 335px;
    height: 59px;
    padding-bottom: 70px;
    margin: 0 auto;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .page-pc .sec1-ttl{
    width: 260px;
    height: 19px;
    margin: 0 auto;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 26px;
    line-height: 110%;
    text-align: center;
    color: #221815;
  }

  .page-pc .sec1-frame2{
    width: 335px;
    height: auto;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 32px;
    flex-wrap: nowrap;
  }

  .page-pc .sec1-g{
    width: 335px;
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .page-pc .g-frame1{
    width: 335px;
    height: 188.8648px;
  }

  .page-pc .g-img{
    width: 335px;
    height: 188.4375px;
    display: block;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid rgba(34,24,21,0.5);
  }

  .page-pc .g-text{
    width: 335px;
    height: auto;
    margin: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: #221815;
  }

  .page-pc .g-text.g-text--60{
    height: auto;
  }

  .page-pc .g-text.g-text--36{
    height: auto;
  }

  .page-pc .sec1-frame13{
    width: 335px;
    height: auto;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
  }

  .page-pc .sec1-frame13 .g-img{
    width: 335px;
    height: auto;
  }

  .page-pc .g-text.g-text--bold18{
    width: 335px;
    height: auto;
    margin: 0;
    align-self: center;
    text-align: left;
  }

  /* 「もっと見る」ボタンのラッパー */
  .more-wrapper{
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 12px;
  }

  .more-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 155px;
    height: 47px;
    box-sizing: border-box;
    padding: 12px 40px;
    background: #FEE100;
    border: 1px solid #000;
    border-radius: 4px;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 15px;
    line-height: 150%;
    letter-spacing: 0;
    text-align: center;
    color: #000;
    white-space: nowrap;
    cursor: pointer;

    /* タップ時のハイライト縁を抑制 */
    -webkit-tap-highlight-color: transparent;
    -webkit-appearance: none;
    appearance: none;
    outline: none;
    box-shadow: none;
    background-clip: padding-box;
  }

  /* もっと見る の文字色を純黒に固定（グローバル button 色を上書き） */
  #more-toggle.more-btn{
    color: #000 !important;
    opacity: 1;
    -webkit-font-smoothing: auto;
    -moz-osx-font-smoothing: auto;
    text-rendering: optimizeSpeed;
  }

  .more-btn:focus,
  .more-btn:focus-visible,
  .more-btn:active{
    outline: none;
    box-shadow: none;
  }

  .more-btn::-moz-focus-inner{
    border: 0;
  }

  /* --- 動画公開中！ --- */
  #railway_crossing .crossing_movie .box_paint01.movie img.object-fit-img {
    width: 100%;
  }

  #railway_crossing .crossing_title{
    width: 335px;
    position: relative;
    top: 3px;
    font-weight: 700;
    font-size: 18px;
    line-height: 150%;
    text-align: center;
    color: #000;
    margin: 0 auto 12px;
  }

  /* --- Sec2 --- */
  .page-pc .sec2{
    width: 375px;
    height: auto;
    background: #fff;
    padding: 12px 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .page-pc .sec2-frame4{
    width: 335px;
    height: 57px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
    justify-content: flex-start;
  }

  .page-pc .sec2-title{
    width: 335px;
    height: 19px;
    margin: 0;
    position: relative;
    top: 3px;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 26px;
    line-height: 150%;
    text-align: center;
    color: #221815;
  }

  .page-pc .sec2-subtitle{
    width: 335px;
    height: 12px;
    margin: 0;
    position: relative;
    top: 8px;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    text-align: center;
    color: #221815;
  }

  .page-pc .sec2-frame12{
    width: 375px;
    height: auto;
    margin: 0 auto;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 32px;
    align-items: center;
    box-sizing: border-box;
  }

  .page-pc .sec2-img{
    width: 375px;
    height: 138px;
    display: block;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid rgba(34,24,21,0.5);
  }

  .page-pc .sec2-frame38{
    width: 335px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    padding: 0;
    box-sizing: border-box;
  }

  .page-pc .sec2-text{
    width: 335px;
    height: auto;
    margin: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: #221815;
  }

  /* --- Sec3 --- */
  .page-pc .sec3{
    width: 375px;
    height: auto;
    background: #EDECE4;
    padding: 48px 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-top: 220px;
  }

  .page-pc .sec3-title{
    width: 335px;
    height: 19px;
    margin: 0 auto;
    position: relative;
    top: -14px;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 26px;
    line-height: 150%;
    text-align: center;
    color: #221815;
  }

  .page-pc .sec3-frame41{
    width: 335px;
    height: auto;
    margin: 0 auto;
    padding: 20px;
    background: #fff;
    border-radius: 16px;
    display: flex;
    box-sizing: border-box;
  }

  .page-pc .sec3-frame7{
    width: 100%;
    margin: 0;
  }

  .page-pc .sec3-frame6{
    width: 100%;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .page-pc .sec3-frame15{
    width: 295px;
    height: auto;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .page-pc .sec3-frame15 .q-22{
    width: 100%;
    height: auto;
    margin: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 150%;
    color: #221815;
  }

  .page-pc .sec3-frame15 .p-16{
    width: 100%;
    height: auto;
    margin: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: #221815;
  }

  .page-pc .f22{
    width: 183.4545px;
    height: 276.4383px;
    display: block;
    object-fit: cover;
    border-radius: 8px;
    padding: 8px;
  }

  .page-pc .sec3-frame14{
    width: 295px;
    height: auto;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .page-pc .sec3-frame14 .q-22{
    width: 100%;
    height: auto;
  }

  .page-pc .sec3-frame14 .p-16{
    width: 100%;
    height: auto;
  }

  .page-pc .sec3-frame16{
    width: 295px;
    height: auto;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .page-pc .sec3-frame16 .q-22{
    margin-top: 12px;
  }

  .page-pc .sec3-frame16 .p-16{
    width: 100%;
    height: auto;
  }

  .page-pc .sec3-frame21{
    width: 295px;
    height: auto;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .page-pc .sec3-card{
    width: 295px;
    height: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .page-pc .card-img{
    width: 295px;
    height: 196.6667px;
    display: block;
    object-fit: cover;
    border-radius: 8px;
  }

  .page-pc .card-cap{
    width: 295px;
    height: auto;
    margin: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
    font-size: 13px;
    line-height: 150%;
    color: #221815;
    text-align: left;
  }

  /* --- Sec4B --- */
  .page-pc .sec4b{
    width: 375px;
    height: auto;
    padding-top: 48px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    box-sizing: border-box;
    margin: 0 auto;
  }

  .page-pc .sec4b-frame4{
    width: 375px;
    height: 103px;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
    box-sizing: border-box;
    margin: 0 auto;
  }

  .page-pc .sec4b-title{
    width: 335px;
    height: 19px;
    margin: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 26px;
    line-height: 150%;
    letter-spacing: 0;
    text-align: center;
    color: #221815;
  }

  .page-pc .sec4b-subtitle{
    width: 335px;
    height: 60px;
    margin: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0;
    text-align: left;
    color: #221815;
  }

  .page-pc .sec4b-subtitle br.pc-br{
    display: none;
  }

  .page-pc .sec4b-img{
    width: 375px;
    height: 210.9375px;
    display: block;
    object-fit: cover;
    border: none;
  }

  /* ===== Footer (page) ===== */
  .page-pc .footer{
    width: 375px;
    min-height: 77px;
    padding: 8px 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 45px;
    margin: 0 auto;
    background: #fff;
  }

  .page-pc .footer .footer-logo{
    width: 101px;
    height: 61px;
    object-fit: cover;
    display: block;
  }

  .page-pc .footer .footer-copy{
    width: 190px;
    margin: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
    font-size: 11px;
    line-height: 150%;
    letter-spacing: 0;
    color: #221815;
    white-space: normal;
  }
}

/* ===== 全幅の背景 ===== */
:root{
  --crossing-yellow:#FEE100;
  --crossing-gray:#EDECE4;
}

.page-pc .first-view,
.page-pc .menu,
.page-pc .sec1,
.page-pc .sec2,
.page-pc .sec3,
.page-pc .sec4b{
  position: relative;
  z-index: 0;
  isolation: isolate;
}

.page-pc .first-view::before,
.page-pc .menu::before,
.page-pc .sec1::before,
.page-pc .sec2::before,
.page-pc .sec3::before,
.page-pc .sec4b::before{
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  left: 50%;
  right: auto;
  width: 100dvw;
  max-width: 100vw;
  transform: translateX(-50%);
  z-index: -1;
  pointer-events: none;
}

.page-pc .first-view::before,
.page-pc .menu::before,
.page-pc .sec1::before{ background: var(--crossing-yellow); }
.page-pc .sec2::before,
.page-pc .sec4b::before{ background: #fff; }
.page-pc .sec3::before{ background: var(--crossing-gray); }

@media (max-width: 767px){
  .page-pc .first-view,
  .page-pc .menu{
    position: relative;
  }
}

#railway_crossing .page-pc .first-view::before,
#railway_crossing .page-pc .menu::before,
#railway_crossing .page-pc .sec1::before,
#railway_crossing .page-pc .sec2::before,
#railway_crossing .page-pc .sec3::before,
#railway_crossing .page-pc .sec4b::before{
  content: "";
  position: absolute;
  inset: 0 !important;
  transform: none !important;
  width: auto !important;
  max-width: none !important;
  z-index: -1;
  box-shadow: 0 0 0 100vmax var(--_bg) !important;
  clip-path: inset(0 -100vmax);
}

#railway_crossing .page-pc .first-view::before,
#railway_crossing .page-pc .menu::before,
#railway_crossing .page-pc .sec1::before{ --_bg: var(--crossing-yellow); }
#railway_crossing .page-pc .sec2::before,
#railway_crossing .page-pc .sec4b::before{ --_bg: #fff; }
#railway_crossing .page-pc .sec3::before{ --_bg: var(--crossing-gray); }

html { scrollbar-gutter: stable; }

#railway_crossing { scrollbar-gutter: stable !important; }

/* 20250916追加 */
@media (min-width: 767px){
  #railway_crossing .page-pc .sec1{ height: auto; }
  #railway_crossing .page-pc .sec1-frame2{ height: auto; }
}