.serviceTextBox {
  margin-bottom: 12rem;
  text-align: center;
}
.serviceTextBox h2 {
  font-size: var(--fz24);
  font-weight: 600;
  margin-bottom: 1rem;
}
.serviceListBox {
  display: flex;
  gap: 5rem;
  margin-bottom: 7rem;
}
.serviceListBox .serviceListText {
  flex: 1.5;
}
.serviceListBox .serviceListText .pointText {
  font-size: var(--fz32);
}
.serviceListBox .serviceListText .pointText span {
  font-size: var(--fz16);
  margin-right: 0.5rem;
}
.serviceListBox .serviceListText h3 {
  font-size: var(--fz24);
  font-weight: 600;
  margin-bottom: 1.5rem;
}
.serviceListBox .serviceListImg {
  flex: 1;
  text-align: center;
}
.serviceListBox .serviceListImg img {
  width: 100%;
  max-width: 450px;
}
@media screen and (max-width: 820px) {
  .serviceListBox {
    flex-wrap: wrap;
    justify-content: center;
  }
  .serviceListBox:nth-last-of-type(2n) {
    flex-direction: column-reverse;
  }
  .serviceListBox .serviceListText {
    flex: auto;
  }
  .serviceListBox .serviceListImg {
    flex: auto;
  }
}
@media screen and (max-width: 640px) {
  .serviceTextBox {
    margin-bottom: 6rem;
  }
}