/*
 * Illustrator folder 13: research support detail pages.
 * Scope: /consulting/iot/, /consulting/academia/, /consulting/sixth-industry/.
 */

body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .additional-section-title {
  margin-bottom: 58px;
  font-family: "Noto Sans JP", noto-sans-cjk-jp, sans-serif;
  font-size: 27px;
  font-weight: 700;
  letter-spacing: .1em;
  line-height: 1.75;
}

body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-detail-content {
  color: #000;
  font-family: "Noto Sans JP", noto-sans-cjk-jp, sans-serif;
  font-size: 16px;
  letter-spacing: .1em;
  line-height: 1.75;
}

body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-detail-content h2 {
  padding: 7px 14px 8px;
  margin: 68px 0 26px;
  border-left: 4px solid #b52922;
  color: #000;
  background: #f6f7f7;
  font-size: 21px;
  font-weight: 700;
  letter-spacing: .1em;
  line-height: 1.43;
}

body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-detail-content > h2:first-child {
  margin-top: 0;
}

body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-detail-content h3 {
  margin: 0 0 4px;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .1em;
  line-height: 1.75;
}

body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-detail-content p {
  margin: 0 0 22px;
}

body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-detail-content a {
  color: #2565b0;
  overflow-wrap: anywhere;
  text-decoration: underline;
  text-underline-offset: 3px;
}

body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-detail-list,
body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-resource-list {
  padding: 0;
  margin: 0 0 22px;
  list-style: none;
}

body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-detail-list > li + li {
  margin-top: 22px;
}

body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-detail-list--compact > li + li,
body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-resource-list li + li {
  margin-top: 0;
}

body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-detail-subsection {
  margin-top: 24px;
}

body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-contact {
  padding: 0;
  margin: 68px 0 0;
  border: 0;
  background: transparent;
}

body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-contact h2 {
  margin-top: 0;
}

body:is(
  .columbus-design-reference-consulting-iot,
  .columbus-design-reference-consulting-academia,
  .columbus-design-reference-consulting-sixth-industry
) .design-page--support-detail .support-contact p {
  margin: 0;
  font-size: 15px;
  letter-spacing: 0;
  line-height: 1.75;
}

@media screen and (min-width: 1200px) {
  body:is(
    .columbus-design-reference-consulting-iot,
    .columbus-design-reference-consulting-academia,
    .columbus-design-reference-consulting-sixth-industry
  ) .design-page.design-page--support-sidebar .additional-page-layout {
    width: 1040px;
    max-width: calc(100% - 32px);
    grid-template-columns: minmax(0, 760px) minmax(0, 240px);
    gap: 40px;
    padding-top: 50px;
    padding-right: 0;
    padding-left: 0;
  }

  body:is(
    .columbus-design-reference-consulting-iot,
    .columbus-design-reference-consulting-academia,
    .columbus-design-reference-consulting-sixth-industry
  ) .design-page--support-detail .additional-section-title {
    margin-bottom: 33px;
  }

  /* Match the consulting sidebar typography used by the approved sample page. */
  body:is(
    .columbus-design-reference-consulting-iot,
    .columbus-design-reference-consulting-academia,
    .columbus-design-reference-consulting-sixth-industry
  ) #main-content .design-page--support-sidebar .design-side-nav__title {
    font-size: 17.0138px;
    font-weight: 400;
    letter-spacing: 1.7014px;
  }

  body:is(
    .columbus-design-reference-consulting-iot,
    .columbus-design-reference-consulting-academia,
    .columbus-design-reference-consulting-sixth-industry
  ) #main-content .design-page--support-sidebar .design-side-nav__label {
    font-size: 15.0122px;
    font-weight: 500;
    letter-spacing: 1.5012px;
  }

  body:is(
    .columbus-design-reference-consulting-iot,
    .columbus-design-reference-consulting-academia,
    .columbus-design-reference-consulting-sixth-industry
  ) #main-content .design-page--support-sidebar .design-side-nav__children > li > a > span {
    font-size: 15.0122px;
    font-weight: 400;
    letter-spacing: 0;
  }

  body:is(
    .columbus-design-reference-consulting-iot,
    .columbus-design-reference-consulting-academia,
    .columbus-design-reference-consulting-sixth-industry
  ) #main-content .design-page--support-sidebar .design-side-nav__children > li > a[aria-current="page"] > span {
    font-weight: 700;
  }

}

@media screen and (max-width: 900px) {
  body:is(
    .columbus-design-reference-consulting-iot,
    .columbus-design-reference-consulting-academia,
    .columbus-design-reference-consulting-sixth-industry
  ) .design-page--support-detail .additional-section-title {
    margin-bottom: 40px;
    font-size: clamp(23px, 5vw, 27px);
  }

}

@media screen and (max-width: 620px) {
  body:is(
    .columbus-design-reference-consulting-iot,
    .columbus-design-reference-consulting-academia,
    .columbus-design-reference-consulting-sixth-industry
  ) .design-page--support-detail .support-detail-content {
    font-size: 15px;
    letter-spacing: .04em;
  }

  body:is(
    .columbus-design-reference-consulting-iot,
    .columbus-design-reference-consulting-academia,
    .columbus-design-reference-consulting-sixth-industry
  ) .design-page--support-detail .support-detail-content h2 {
    margin-top: 48px;
    font-size: 19px;
  }

  body:is(
    .columbus-design-reference-consulting-iot,
    .columbus-design-reference-consulting-academia,
    .columbus-design-reference-consulting-sixth-industry
  ) .design-page--support-detail .support-detail-content h3 {
    font-size: 15px;
    letter-spacing: .04em;
  }

  body:is(
    .columbus-design-reference-consulting-iot,
    .columbus-design-reference-consulting-academia,
    .columbus-design-reference-consulting-sixth-industry
  ) .design-page--support-detail .support-contact p {
    font-size: 14px;
  }
}