/* Additions scoped to the four service pages; shared commercial styles stay intact. */
.serviceMobileBreak { display: none; }
.serviceDetail .serviceMv img {
  display: block;
  height: clamp(280px, 38vw, 560px);
  object-fit: cover;
  object-position: center;
}
.serviceDetail .serviceWedo li {
  padding: 12px 10px;
  text-align: center;
  overflow-wrap: anywhere;
}
.serviceDetail .serviceProjectIntro { margin-bottom: 40px; }
.serviceDetail .serviceProjects_item figure img {
  height: auto;
  aspect-ratio: 163 / 109;
}
.serviceDetail .serviceFaq_question {
  width: 100%;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-align: left;
}
.serviceDetail .serviceFaq_question:focus-visible,
.serviceDetail a:focus-visible,
.serviceDetail .headerBtn:focus-visible {
  outline: 2px solid #073088;
  outline-offset: 5px;
}
.serviceDetail .sectionBg01 a:focus-visible { outline-color: #fff; }
.serviceDetail .serviceFaq_answer .faqText { line-height: 2; }
.serviceDetail .serviceDetail_intro { margin-bottom: 40px; }
.serviceDetail .serviceApproach_item,
.serviceDetail .servicePreparation > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  gap: 24px 60px;
  padding-block: 32px;
  border-top: 1px solid var(--border-gray);
}
.serviceDetail .serviceApproach_item h3 {
  font-family: var(--font-mincho);
  font-size: 23px;
  line-height: 1.8;
}
.serviceDetail .serviceApproach_item p,
.serviceDetail .serviceFlow p,
.serviceDetail .servicePreparation dd { line-height: 2.2; }
.serviceDetail .serviceApproach_item .serviceApproach_points {
  margin-top: 16px;
  font-size: 12px;
  color: var(--color-main);
}
.serviceDetail .serviceFlow {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 32px 50px;
  list-style: none;
}
.serviceDetail .serviceFlow li {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 20px;
  border-top: 1px solid var(--border-gray);
  padding-top: 24px;
}
.serviceDetail .serviceFlow_num {
  font-family: var(--font-inter);
  font-size: 32px;
  color: var(--color-main);
  line-height: 1.3;
}
.serviceDetail .serviceFlow h3 {
  font-size: 17px;
  font-weight: 500;
  line-height: 1.8;
  margin-bottom: 12px;
}
.serviceDetail .servicePreparation dt {
  font-size: 17px;
  font-weight: 500;
  line-height: 1.8;
}
@media (max-width: 768px) {
  .serviceDetail .serviceApproach_item,
  .serviceDetail .servicePreparation > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    padding-block: 24px;
  }
  .serviceDetail .serviceApproach_item h3 { font-size: 20px; }
  .serviceDetail .serviceFlow { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .serviceDetail .serviceFlow li { grid-template-columns: 36px minmax(0, 1fr); gap: 16px; }
  .serviceDetail .serviceFlow_num { font-size: 27px; }
  .serviceMobileBreak { display: initial; }
  .serviceDetail .pageTitle .en { font-size: clamp(24px, 6.5vw, 30px); }
  .serviceDetail .breadcrumbList { flex-wrap: wrap; }
  .serviceDetail .serviceWedo ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .serviceDetail .serviceProjects_list { grid-template-columns: minmax(0, 1fr); }
  .serviceDetail .serviceFaq_question,
  .serviceDetail .serviceFaq_answer { column-gap: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .serviceDetail *, .serviceDetail *::before, .serviceDetail *::after {
    transition: none !important;
    scroll-behavior: auto !important;
  }
}