/* Page-specific CSS */
/* serviceページのみタイトルサイズ調整 */
.p-service .c-page-title {
  font-size: clamp(20px, 2.0vw, 28px);
}


/* ===== 列車画像 3列 ===== */
.p-train-gallery{
  margin-top: 40px;
}

.p-train-gallery__grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.p-train-gallery__item{
  overflow: hidden;
}

.p-train-gallery__item img{
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
}


@media (max-width: 768px){
  .p-train-gallery__grid{
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .p-train-gallery__item img{
    height: auto;
  }
}


/* ===== 業務案内 ===== */
.p-service-list{
  padding: 80px 0;
}

.p-service-list__title{
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 48px;
  position: relative;
  padding-left: 16px;
}

.p-service-list__title::before{
  content:"";
  position:absolute;
  left:0;
  top:6px;
  width:6px;
  height:28px;
  background:#d60f1d;
}

.p-service-item{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:40px;
  align-items:center;
  margin-bottom:64px;
}

.p-service-item--reverse{
  direction: rtl;
}
.p-service-item--reverse > *{
  direction: ltr;
}

.p-service-item__image img{
  width:100%;
  height:auto;
  object-fit:cover;
}

.p-service-item__text h3{
  font-size:24px;
  margin-bottom:10px;
}

.p-service-item__lead{
  font-weight:700;
  margin-bottom:12px;
}

.p-service-item__text p{
  font-size:14px;
  line-height:1.9;
  color:#444;
}

@media (max-width:768px){
  .p-service-item{
    grid-template-columns:1fr;
    gap:20px;
  }
}


/* テキスト左揃え */
.p-service-item__text{
  text-align: left;
}


/* 見出しも左揃え */
.p-service-list__title{
  text-align: left;
}


/* 業務案内見出しのライン位置調整 */
.p-service-list__title{
  display: flex;
  align-items: center;
  gap: 14px;
  padding-left: 0;
  line-height: 1.2;
}

.p-service-list__title::before{
  position: static;
  top: auto;
  left: auto;
  width: 6px;
  height: 28px;
  flex: 0 0 6px;
}

/* リード文と説明文の文字サイズ調整 */
.p-service-item__lead{
  font-size: 18px;
  line-height: 1.8;
  margin-bottom: 14px;
}

.p-service-item__text p{
  font-size: 16px;
  line-height: 2;
}

@media (max-width: 768px){
  .p-service-list__title{
    gap: 12px;
  }

  .p-service-list__title::before{
    height: 24px;
  }

  .p-service-item__lead{
    font-size: 16px;
    line-height: 1.75;
  }

  .p-service-item__text p{
    font-size: 15px;
    line-height: 1.9;
  }
}


/* 下層ページ キャッチ統一サイズ */
.p-service .p-service-intro__title{
  font-size: clamp(28px, 3vw, 40px);
  line-height: 1.4;
}


/* ===== train gallery 1200px + white background fix ===== */
body,
main,
.p-service,
.p-service-intro,
.p-service-list,
.p-top-pickup-intro,
.pickup-head,
.pickup-cards{
  background: #fff !important;
}

.p-service-intro__inner{
  width: min(100% - 40px, 1200px) !important;
  max-width: 1200px !important;
  margin-inline: auto !important;
}

.pickup-cards{
  width: min(100% - 40px, 1200px) !important;
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

@media (max-width: 1024px){
  .pickup-cards{
    width: min(100% - 40px, 1200px) !important;
    max-width: 1200px !important;
  }
}

@media (max-width: 768px){
  body,
  main,
  .p-service,
  .p-service-intro,
  .p-service-list,
  .p-top-pickup-intro,
  .pickup-head,
  .pickup-cards{
    background: #fff !important;
  }

  .p-service-intro__inner,
  .pickup-cards{
    width: min(100% - 24px, 1200px) !important;
    max-width: 1200px !important;
  }
}


/* ===== actual train gallery width fix ===== */
.p-service-intro__inner{
  width: min(100% - 40px, 1200px) !important;
  max-width: 1200px !important;
  margin-inline: auto !important;
}

.p-service-intro__text{
  width: 100% !important;
  max-width: 1200px !important;
  margin-inline: auto !important;
  box-sizing: border-box !important;
}

.p-train-gallery{
  width: 100% !important;
  max-width: 1200px !important;
  margin: 40px auto 0 !important;
  box-sizing: border-box !important;
}

.p-train-gallery__grid{
  width: 100% !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  box-sizing: border-box !important;
}

.p-train-gallery__item{
  width: 100% !important;
  min-width: 0 !important;
}

@media (max-width: 768px){
  .p-service-intro__inner{
    width: min(100% - 24px, 1200px) !important;
  }

  .p-service-intro__text,
  .p-train-gallery,
  .p-train-gallery__grid{
    max-width: 100% !important;
  }
}
