.l-business_about {
  position: relative;
  padding-top: 12rem;
  overflow: hidden;
}

.l-business_about::after {
  display: block;
  position: absolute;
  bottom: 0;
  left: 50%;
  width: calc(100% - 9rem);
  height: var(--border-1px);
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background: var(--color-black);
  content: "";
}

.l-business_about_ttl {
  --ttl-mb: 3.8rem;
}

.l-business_about_txt {
  margin-bottom: 17rem;
}

.l-business_about_item {
  display: grid;
  z-index: 1;
  position: relative;
  grid-template-columns: 43.2rem 41.2rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-left: 10.8rem;
  gap: 0 10.8rem;
}

.l-business_about_item::before {
  display: block;
  display: none;
  z-index: -1;
  position: absolute;
  top: 3.5rem;
  left: 0;
  width: 100vw;
  height: calc(100% - 7rem);
  background-color: var(--color-light-gray-95);
  content: "";
}

.l-business_about_item:nth-child(even) {
  grid-template-columns: 41.2rem 43.2rem;
  padding-left: 0;
}

.l-business_about_item:nth-child(even)::before {
  display: block;
  display: none;
  z-index: -1;
  position: absolute;
  top: 3.5rem;
  left: -15rem;
  width: calc(100% + 15rem);
  height: calc(100% - 7rem);
  background-color: var(--color-light-gray-95);
  content: "";
}

.l-business_about_item:nth-child(even) .l-business_about_item_ttl_num {
  right: -10.5rem;
  left: auto;
  padding-right: 1.9rem;
}

.l-business_about_item:nth-child(even) .l-business_about_item_ttl_num::before {
  right: 0;
  left: auto;
}

.l-business_about_item:nth-child(even) .l-business_about_item_txt_wrapper {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}

.l-business_about_item:nth-child(even) .l-business_about_item_txt_wrapper::before {
  right: -10.5rem;
  left: auto;
}

.l-business_about_item_wrapper {
  display: grid;
  gap: 16.7rem 0;
}

.l-business_about_item_ttl_num {
  display: block;
  position: absolute;
  top: -12.2rem;
  left: -10.5rem;
  padding: 0 0 0 1.9rem;
}

.l-business_about_item_ttl_num::before {
  position: absolute;
  top: 45%;
  left: 0;
  width: 1.2rem;
  height: 1.2rem;
  translate: 0 -50%;
  border-radius: 50%;
  background: var(--color-gray-40);
  content: "";
}

.l-business_about_item_txt_wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: -webkit-max-content;
  height: -moz-max-content;
  height: max-content;
  min-height: 24.6rem;
  gap: 3.2rem;
}

.l-business_about_item_txt_wrapper::before {
  display: block;
  z-index: -1;
  position: absolute;
  top: -8rem;
  left: -10.5rem;
  width: 100vw;
  height: calc(100% + 16rem);
  background-color: var(--color-light-gray-95);
  content: "";
}

.l-business_about_item_txt_wrapper div {
  display: grid;
  gap: .8rem;
}

.l-business_about_item_img_wrapper {
  display: grid;
  position: relative;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "l-business_about_item_img_top l-business_about_item_img_top" "l-business_about_item_img_left l-business_about_item_img_right";
  gap: 2rem 2rem;
}

.l-business_about_item_img_top {
  grid-area: l-business_about_item_img_top;
  width: 41.2rem;
}

.l-business_about_item_img_left {
  grid-area: l-business_about_item_img_left;
  width: 19.6rem;
}

.l-business_about_item_img_right {
  grid-area: l-business_about_item_img_right;
  width: 19.6rem;
}

.l-business_about_item_btn {
  --btn-width: 30.4rem;
  border: 1px solid var(--color-black);
  -webkit-transition: background-color var(--easing) var(--duration),color var(--easing) var(--duration);
  transition: background-color var(--easing) var(--duration),color var(--easing) var(--duration);
}

.l-business_about_item_btn svg path {
  -webkit-transition: stroke var(--easing) var(--duration);
  transition: stroke var(--easing) var(--duration);
}

.l-business_field {
  padding-top: 21.6rem;
}

.l-business_field_wrapper {
  display: grid;
  position: relative;
  grid-template-columns: 30.4rem auto;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  padding-right: 4.5rem;
  padding-left: 6.5rem;
  gap: 0 10.8rem;
}

.l-business_field_left {
  position: -webkit-sticky;
  position: sticky;
  top: 10rem;
}

.l-business_field_left_ttl {
  --ttl-mb: 5.6rem;
}

.l-business_field_right_wrapper {
  display: grid;
  gap: 16rem 0;
}

.l-business_field_right_item {
  display: grid;
  grid-template-columns: 28.4rem 52rem;
  gap: 0 4rem;
}

.l-business_field_right_item_num {
  display: block;
  position: relative;
  margin-bottom: 12rem;
  padding: 0 0 0 2.1rem;
}

.l-business_field_right_item_num::before {
  position: absolute;
  top: 45%;
  left: 0;
  width: 1.2rem;
  height: 1.2rem;
  translate: 0 -50%;
  border-radius: 50%;
  background: var(--color-gray-40);
  content: "";
}

.l-business_field_right_item_ttl {
  margin-bottom: 1.6rem;
}

.l-business_field_right_item_txt_wrapper {
  position: relative;
}

.l-business_field_right_item_txt_wrapper::after {
  display: block;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: var(--border-1px);
  background: var(--color-black);
  content: "";
}

@media screen and (max-width: 48em) {
  .l-business_about {
    padding-top: 8rem;
  }
  .l-business_about::after {
    width: calc(100% - 4rem);
  }
  .l-business_about_ttl {
    --ttl-mb: 4.8rem;
  }
  .l-business_about_txt {
    margin-bottom: 8rem;
  }
  .l-business_about_item {
    grid-template-columns: 1fr;
    padding-left: 0;
    gap: 5.6rem 0;
  }
  .l-business_about_item::before {
    display: block;
    height: calc(100% - 7.5rem);
  }
  .l-business_about_item:nth-child(even) {
    grid-template-columns: 1fr;
  }
  .l-business_about_item:nth-child(even)::before {
    display: block;
    z-index: -1;
    top: 3.5rem;
    left: 0;
    width: 100vw;
    height: calc(100% - 7.5rem);
    background-color: var(--color-light-gray-95);
    content: "";
  }
  .l-business_about_item:nth-child(even) .l-business_about_item_ttl_num {
    left: 0;
    padding-right: 0;
  }
  .l-business_about_item:nth-child(even) .l-business_about_item_ttl_num::before {
    right: auto;
    left: 0;
  }
  .l-business_about_item:nth-child(even) .l-business_about_item_txt_wrapper {
    -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
            order: 0;
  }
  .l-business_about_item_wrapper {
    gap: 7.7rem 0;
  }
  .l-business_about_item_ttl_num {
    top: .2rem;
    left: 0;
  }
  .l-business_about_item_ttl_num::before {
    top: 47%;
  }
  .l-business_about_item_txt_wrapper {
    padding: 9.1rem 2rem 0rem 4rem;
    gap: 2.4rem 0;
  }
  .l-business_about_item_txt_wrapper::before {
    display: none;
  }
  .l-business_about_item_img_wrapper {
    left: -2rem;
    gap: 1.6rem;
  }
  .l-business_about_item_img_top {
    width: 33.5rem;
  }
  .l-business_about_item_img_left {
    width: 16rem;
  }
  .l-business_about_item_img_right {
    width: 16rem;
  }
  .l-business_about_item_btn {
    width: 100%;
  }
  .l-business_field {
    padding-top: 12rem;
  }
  .l-business_field_wrapper {
    grid-template-columns: 1fr;
    padding-right: 2rem;
    padding-left: 2rem;
    gap: 8rem 0;
  }
  .l-business_field_left {
    position: initial;
  }
  .l-business_field_left_ttl {
    --ttl-mb: 4.8rem;
  }
  .l-business_field_right_wrapper {
    gap: 8rem 0;
  }
  .l-business_field_right_item {
    position: relative;
    grid-template-columns: 1fr;
    gap: 2.4rem 0;
  }
  .l-business_field_right_item_num {
    margin-bottom: 2.4rem;
  }
  .l-business_field_right_item_num::before {
    top: 45%;
  }
  .l-business_field_right_item_ttl {
    margin-bottom: .8rem;
  }
  .l-business_field_right_item_txt_wrapper {
    padding-top: 1.2rem;
  }
  .l-business_field_right_item_txt_wrapper::after {
    top: 0;
    bottom: auto;
  }
}

@media (hover: hover) {
  .l-business_about_item_btn:hover {
    border: 1px solid var(--btn-border-color, var(--color-black));
    background-color: var(--btn-bg-color, transparent);
    color: var(--btn-font-color, var(--color-black));
  }
  .l-business_about_item_btn:hover svg path {
    stroke: var(--btn-arrow-color, var(--color-black));
  }
}
