.terms__wrap {
  display: flex;
  flex-direction: column;
  gap: 40px;
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
}

.terms__wrap .terms {
  display: flex;
  flex-direction: column;
  gap: 30px;
  word-break: keep-all;
}

.terms__wrap .terms h3 {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  color: var(--primary-300);
  margin-bottom: 20px;
}

.terms__wrap .terms > div {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.terms__wrap .terms h4 {
  font-size: var(--font-size-base) !important;
  font-weight: var(--font-weight-semibold);
}

.terms__wrap .terms p {
  font-size: var(--font-size-md);
  color: #606060;
}

.terms__wrap .terms .highlight {
  font-size: var(--font-size-xl);
  color: var(--error-red);
}

.terms__wrap .terms .number__list {
  display: flex;
  flex-direction: column;
  gap: 5px;
  list-style-type: upper-roman;
}

.terms__wrap .terms .number__list > li {
  list-style: decimal;
  font-size: var(--font-size-md);
  color: #606060;
  margin-left: 18px;
}

.terms__wrap .terms .circle__number {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.terms__wrap .terms .circle__number > li {
  text-indent: -20px;
  padding-left: 20px;
}

.terms__wrap .terms .dash__number {
  display: flex;
  flex-direction: column;
  gap: 5px;
  list-style-type: disc;
}

.terms__wrap .terms .dash__number > li {
  list-style: disc;
  font-size: var(--font-size-md);
  color: #606060;
  margin-left: 18px;
}

.terms__wrap .terms .dash__number > li strong {
  font-weight: var(--font-weight-medium);
}

.terms__wrap .terms__box {
  font-size: var(--font-size-md);
  color: #606060;
  padding: 20px;
  border-radius: var(--border-radius-sm);
  background: #F7F7F7;
}

.terms__wrap .terms__box strong {
  display: block;
  font-weight: var(--font-weight-medium);
  text-align: right;
  margin-top: 10px;
}

.terms__wrap p.comment {
  position: relative;
  display: flex;
  gap: 5px;
  margin-top: 5px;
}

.terms__wrap p.comment::before {
  content: '※';
}

.terms__wrap table {
  width: 100%;
  margin: 5px auto 0;
  border: 0;
  table-layout: fixed;
  border-collapse: collapse;
  border-top: 1px solid #606060;
}

.terms__wrap table tbody th,
.terms__wrap table tbody td {
  text-align: center;
  height: 36px;
  padding: 5px 10px;
  vertical-align: middle;
  border-right: 1px solid #DBDBDB;
  border-bottom: 1px solid #DBDBDB;
}

.terms__wrap table thead th {
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-medium);
  color: #606060;
  text-align: center;
  height: 46px;
  padding: 5px 10px;
  vertical-align: middle;
  border-bottom: 1px solid #DBDBDB;
  border-right: 1px solid #DBDBDB;
  background: #F7F7F7;
}

.terms__wrap table tbody th,
.terms__wrap table tbody td {
  font-size: var(--font-size-md);
  color: #606060;
}

.terms__wrap table thead th:last-child,
.terms__wrap table tbody td:last-child {
  border-right: 0;
}

.terms__wrap table .al {
  text-align: left;
}

@media (max-width: 765px) {
  .terms__wrap {
    gap: 20px;
  }

  .terms__wrap h3 {
    font-size: var(--font-size-base);
  }

  .terms__wrap .terms h4 {
    font-size: var(--font-size-s) !important;
  }

  .terms__wrap .terms p,
  .member__box .form__title p,
  .terms__wrap .terms .number__list > li,
  .terms__wrap .terms .dash__number > li {
    font-size: var(--font-size-xxs);
  }
}