@charset "UTF-8";
/* =====================
  MV
===================== */
.mv {
  background-image: url('/assets/image/business/mv_2x.png');
}
/* =====================
  事業内容
===================== */
.business {
  position: relative;
}
.business::before {
  content: '';
  display: block;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-image: url('/assets/image/business/business_bg_2x.png');
  width: 100%;
  height: 56vw;
  position: absolute;
  top: 47.6vw;
  pointer-events: none;
}
.business .business-wrap {
  position: relative;
  margin-inline: auto;
  z-index: 2;
  overflow: hidden;
}
/* ==== BUSINESS 01 ==== */
.business .business-wrap .business-unit[data-id='1'] {
  width: 94.66666666666667vw;
  padding-top: 17.866666666666667vw;
}
.business .business-wrap .business-unit[data-id='1'] .business-img picture img {
  display: block;
  width: 94.66666666666667vw;
  height: 46.666666666666664vw;
}
.business .business-wrap .business-unit[data-id='1'] .business-about {
  padding-inline: 5.333333333333333vw 0;
  padding-block: 8.533333333333333vw 14.4vw;
  background-color: #fff;
  margin-top: 9.866666666666667vw;
  position: relative;
  z-index: 3;
}
.business .business-wrap .business-unit[data-id='1'] .business-img::after {
  content: '';
  display: block;
  width: 97.33333333333333vw;
  height: 106.8vw;
  background-color: #dbe3ef;
  position: absolute;
  z-index: -1;
  top: 77.06666666666666vw;
  left: 0;
}
.business .business-wrap .business-unit[data-id='1'] .business-about h3 {
  font-size: 4.8vw;
  font-weight: 600;
  line-height: 2;
  margin-top: 8.533333333333333vw;
}
.business .business-wrap .business-unit[data-id='1'] .business-about p {
  line-height: 2;
  margin-top: 4.266666666666667vw;
}
/* ==== 管更生工とは？ ==== */
.business .business-wrap .business-unit[data-id='2'] {
  position: relative;
  background-color: #f9f9f9;
  padding-block: 9.5vw 17.066666666666666vw;
  margin-top: 2.6666666666666665vw;
}
.business .business-wrap .business-unit[data-id='2'] h3 {
  font-size: 4.8vw;
  font-weight: 600;
  line-height: 2;
  margin-top: 0.8vw;
}
.business .business-wrap .business-unit[data-id='2'] p {
  line-height: 2;
  margin-top: 4.266666666666667vw;
}
/* ==== 施工の流れ ==== */
.business .construction {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-image: url('/assets/image/business/flow_bg_2x.png');
  width: 100%;
  height: 322vw;
  padding-top: 9.4vw;
}
.business .construction h3 {
  font-size: 4.8vw;
  font-weight: 600;
  line-height: 2;
  margin-top: 0.7vw;
}
.business .construction ol {
  margin-top: 4.266666666666667vw;
}
.business .construction ol li {
  position: relative;
}
.business .construction ol li picture img {
  display: block;
  width: 89.33333333333333vw;
  height: 46.666666666666664vw;
}
.business .construction ol li + li {
  margin-top: 15.1vw;
}
.business .construction ol li + li::before {
  content: '';
  display: block;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url('/assets/image/business/flow-arrow_2x.png');
  width: 10.4vw;
  height: 6.266666666666667vw;
  position: absolute;
  top: -10.533333333333333vw;
  left: 50%;
  transform: translateX(-50%);
}
.business .construction ol li .flow-num {
  display: flex;
  align-items: center;
  gap: 4.666666666666667vw;
  margin-top: 5.2vw;
}
.business .construction ol li .flow-num span {
  position: relative;
}
.business .construction ol li .flow-num span::after {
  content: '';
  display: block;
  width: 2.533333333333333vw;
  height: 2.533333333333333vw;
  border-top: 0.26666666666666666vw solid var(--blue);
  border-right: 0.26666666666666666vw solid var(--blue);
  position: absolute;
  top: -1.4vw;
  left: 4vw;
}
.business .construction ol li .flow-num h4 {
  font-size: 4vw;
  font-weight: 600;
}
.business .construction ol li p {
  line-height: 2;
  margin-top: 3.2vw;
}
/* ==== BUSINESS 02 ==== */
.business[data-id='2']::before {
  top: 38.266666666666666vw;
}
.business[data-id='2'] .business-wrap .business-unit[data-id='1'] {
  padding-top: 8.533333333333333vw;
  padding-bottom: 2.6666666666666665vw;
}
.business[data-id='2'] .business-wrap .business-unit[data-id='1'] .business-img::after {
  content: '';
  display: block;
  width: 97.33333333333333vw;
  height: 122vw;
  background-color: #dbe3ef;
  position: absolute;
  z-index: -1;
  top: 67.73333333333333vw;
  left: 0;
}
.business[data-id='2'] .business-wrap .business-unit[data-id='1'] .business-about .link-btn {
  margin-top: 8.533333333333333vw;
}