.termsArea .terms .header {
  padding: 24px 16px;
  background-color: var(--color-gray-25);
}
@media screen and (min-width: 768px) {
  .termsArea .terms .header {
    padding: 28px 46px;
  }
}
@media screen and (min-width: 1200px) {
  .termsArea .terms .header {
    padding: 28px 60px;
  }
}
.termsArea .terms .header .breadcrumbs {
  margin-bottom: 16px;
  line-height: 19px;
}
@media screen and (min-width: 768px) {
  .termsArea .terms .header .breadcrumbs {
    margin-bottom: 20px;
  }
}
.termsArea .terms .header .breadcrumbs li {
  display: inline;
  color: var(--color-gray-7);
}
.termsArea .terms .header .breadcrumbs li a, .termsArea .terms .header .breadcrumbs li p {
  font-size: 13px;
  line-height: 19px;
  font-weight: normal;
  display: inline;
  color: var(--color-gray-7);
}
@media screen and (min-width: 768px) {
  .termsArea .terms .header .breadcrumbs li a, .termsArea .terms .header .breadcrumbs li p {
    font-size: 15px;
    line-height: 22px;
  }
}
.termsArea .terms .header .breadcrumbs li a:hover {
  color: var(--color-white);
}
.termsArea .terms .header h1 {
  font-weight: 400;
  font-size: 24px;
  line-height: 35px;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .termsArea .terms .header h1 {
    font-size: 34px;
    line-height: 49px;
  }
}
.termsArea .terms .termsList {
  padding: 16px 16px 32px;
}
@media screen and (min-width: 768px) {
  .termsArea .terms .termsList {
    padding: 24px 46px 64px;
  }
}
@media screen and (min-width: 1200px) {
  .termsArea .terms .termsList {
    padding: 24px 60px 64px;
  }
}
.termsArea .terms .termsList li, .termsArea .terms .termsList p {
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: var(--color-gray-7);
}
.termsArea .terms .termsList h2 {
  font-weight: 700;
  font-size: 18px;
  line-height: 26px;
  color: var(--color-white);
  margin-top: 32px;
  margin-bottom: 8px;
}
@media screen and (min-width: 768px) {
  .termsArea .terms .termsList h2 {
    font-size: 24px;
    line-height: 35px;
    margin-top: 46px;
    margin-bottom: 12px;
  }
}
.termsArea .terms .termsList a {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.termsArea .terms .termsList a:hover {
  color: var(--color-white);
}
.termsArea .terms .termsList p + ol {
  margin-top: 4px;
}
@media screen and (min-width: 768px) {
  .termsArea .terms .termsList p + ol {
    margin-top: 8px;
  }
}
.termsArea .terms .termsList ol {
  color: var(--color-gray-7);
  list-style: decimal;
  margin-left: 18px;
}
.termsArea .terms .termsList ol li {
  margin-bottom: 4px;
  list-style: decimal;
}
@media screen and (min-width: 768px) {
  .termsArea .terms .termsList ol li {
    margin-bottom: 8px;
  }
}
.termsArea .terms .termsList ol li ul {
  margin-top: 4px;
  margin-left: 18px;
  list-style: disc;
}
@media screen and (min-width: 768px) {
  .termsArea .terms .termsList ol li ul {
    margin-top: 8px;
  }
}
.termsArea .terms .termsList ol li ul li {
  list-style: disc;
}
.termsArea .terms .termsList ol li ul li::marker {
  font-size: 12px;
}
.termsArea .terms .termsList ol li ul li ol {
  margin-top: 4px;
  margin-left: 18px;
  list-style: lower-roman;
}
@media screen and (min-width: 768px) {
  .termsArea .terms .termsList ol li ul li ol {
    margin-top: 8px;
  }
}
.termsArea .terms .termsList ol li ul li ol li {
  list-style: lower-roman;
}