/*
 * Client review 2026-08-27: unified shared frame and styling for every non-home page.
 * Standardized to match the /columbus/rentalroom reference design.
 *
 * 1. Exact identical page header height and typography across all subpages.
 * 2. Exact identical breadcrumb height, spacing, and styling across all subpages.
 * 3. Exact identical outer container width (1048px) and top padding (55px desktop / 48px tablet / 36px mobile).
 * 4. Exact alignment between main content title and sidebar header across all two-column pages.
 * 5. Tight, standardized spacing between the page title (.additional-section-title) and the first section heading.
 * 6. Standardized 5px solid vibrant red bar (#b52a23) with #f3f3f3 background on all section headings.
 */

/* ==========================================================================
   1. Standardized Subpage Header Band
   ========================================================================== */
body:not(.home) #main-content .additional-page-header {
  display: flex;
  height: 132px;
  min-height: 132px;
  max-height: 132px;
  box-sizing: border-box;
  align-items: center;
  color: #222;
  border-top: 0;
  border-right: 0;
  border-bottom: 1px solid #b52a23;
  border-left: 0;
  background: #fff;
  margin: 0;
  padding: 0;
}

body:not(.home) #main-content .additional-page-header > .additional-page-shell {
  display: flex;
  align-items: center;
  height: 132px;
  min-height: 132px;
  max-height: 132px;
  width: min(calc(100% - 48px), 1048px);
  max-width: 1048px;
  box-sizing: border-box;
  padding-right: 13px;
  padding-left: 0;
  margin-right: auto;
  margin-left: auto;
}

body:not(.home) #main-content .additional-page-header h1,
body:not(.home) #main-content article.additional-page header.additional-page-header h1,
body:not(.home) #main-content article.additional-page header.additional-page-header div.additional-page-shell > h1,
body[class*="page-id-"] #main-content article.additional-page header.additional-page-header div.additional-page-shell > h1,
body.page-id-124 #main-content header.additional-page-header h1,
body.page-id-34 #main-content header.additional-page-header h1,
body.page-id-35 #main-content header.additional-page-header h1,
body.page-id-36 #main-content header.additional-page-header h1,
body.page-id-37 #main-content header.additional-page-header h1,
body.page-id-38 #main-content header.additional-page-header h1,
body.page-id-39 #main-content header.additional-page-header h1,
body.page-id-40 #main-content header.additional-page-header h1,
body.page-id-41 #main-content header.additional-page-header h1,
body.page-id-42 #main-content header.additional-page-header h1 {
  margin: 0;
  padding: 0;
  color: #222;
  font-size: 27px;
  font-weight: 700;
  letter-spacing: 2.7px;
  line-height: 1.3;
}

/* ==========================================================================
   2. Standardized Subpage Breadcrumb
   ========================================================================== */
body:not(.home) #main-content .additional-breadcrumb {
  display: block;
  border: 0;
  background: #fff;
  font-size: 14px;
  letter-spacing: normal;
  margin: 0;
  padding: 0;
}

body:not(.home) #main-content .additional-breadcrumb > .additional-page-shell {
  display: flex;
  flex-wrap: wrap;
  height: 52px;
  min-height: 52px;
  max-height: none;
  align-items: center;
  justify-content: flex-start;
  gap: 4px 10px;
  width: min(calc(100% - 48px), 1048px);
  max-width: 1048px;
  box-sizing: border-box;
  padding: 0 13px 0 0;
  margin-right: auto;
  margin-left: auto;
  white-space: normal;
}

body:not(.home) #main-content .additional-breadcrumb a,
body:not(.home) #main-content .additional-breadcrumb span,
body:not(.home) #main-content .additional-breadcrumb span[aria-current="page"],
body:not(.home) #main-content .additional-breadcrumb [aria-current="page"] {
  flex: 0 0 auto;
  min-width: 0;
  max-width: none;
  margin: 0;
}

body:not(.home) #main-content .additional-breadcrumb span[aria-hidden="true"],
body:not(.home) #main-content .additional-breadcrumb .breadcrumb-separator {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0;
  border-top: 1px solid #333333;
  border-right: 1px solid #333333;
  transform: rotate(45deg);
  vertical-align: middle;
  font-size: 0;
  line-height: 0;
  color: transparent;
  flex: 0 0 auto;
  min-width: 6px;
  max-width: 6px;
  user-select: none;
}

body:not(.home) #main-content .additional-breadcrumb a {
  color: #14399e;
  text-decoration: underline;
  font-size: 14px;
  letter-spacing: 0.04em;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

body:not(.home) #main-content .additional-breadcrumb a:hover,
body:not(.home) #main-content .additional-breadcrumb a:focus-visible {
  color: #cb2c00;
  text-decoration: none;
}

body:not(.home) #main-content .additional-breadcrumb span {
  color: #333333;
  font-size: 14px;
  letter-spacing: 0.04em;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

body:not(.home) #main-content .additional-breadcrumb span[aria-current="page"],
body:not(.home) #main-content .additional-breadcrumb [aria-current="page"] {
  font-weight: 400;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

/* ==========================================================================
   3. Standardized Outer Shell & Spacing to Content
   ========================================================================== */
body:not(.home) #main-content .additional-page-shell {
  width: min(calc(100% - 48px), 1048px);
  max-width: 1048px;
  box-sizing: border-box;
  margin-right: auto;
  margin-left: auto;
}

body:not(.home) #main-content :is(
  .additional-page-layout,
  .design-page__body,
  .rentalroom-page,
  .rentalroom-layout,
  .contact-page,
  .magazine-layout,
  .starter-section,
  .site-search-page,
  .subpage-generic__body,
  .design-page--stories .additional-page-layout,
  .design-page--support .design-page__body,
  .design-page--with-sidebar .additional-page-layout,
  .design-page--support-detail .additional-page-layout,
  .design-page--consultation-detail .additional-page-layout,
  .design-page--folder9-group .additional-page-layout,
  .design-page--folder9-detail .additional-page-layout,
  .additional-page--profile .additional-page-layout,
  .additional-page--history .additional-page-layout,
  .additional-page--access .additional-page-layout,
  .additional-page--disclosure .additional-page-layout,
  .additional-page--design-subpage .additional-page-layout
),
body:not(.home) #main-content > :is(article, section).additional-page > .additional-breadcrumb + .additional-page-shell,
body:not(.home) #main-content > :is(article, section).additional-page > .additional-breadcrumb + .additional-page-layout,
body:not(.home) #main-content > :is(article, section).additional-page > .additional-breadcrumb + div {
  box-sizing: border-box;
  padding-top: 48px;
}

/* ==========================================================================
   4. Two-Column Page Layout & Sidebar Alignment
   ========================================================================== */
body:not(.home) #main-content .additional-page-layout {
  display: grid;
  grid-template-columns: minmax(0, 760px) minmax(0, 240px);
  gap: 40px;
  align-items: start;
  padding-right: 0;
  padding-left: 0;
}

body:not(.home) #main-content .additional-page-main {
  min-height: 0;
  margin-top: 0;
  padding-top: 0;
}

body:not(.home) #main-content .additional-page-sidebar {
  margin-top: 0;
  padding-top: 0;
  transform: none;
}

/* Sidebar Top Header (支援一覧 / 産業創造機構について) */
body:not(.home) #main-content :is(.design-side-nav__title, .about-section-nav__title) {
  display: flex;
  align-items: center;
  min-height: 52px;
  height: 52px;
  box-sizing: border-box;
  padding: 0 16px;
  margin-top: 0;
  margin-bottom: 0;
  border: 0;
  background: #b52a23;
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 1.7px;
  line-height: 1.4;
}

/* Sidebar Navigation & Child Links: ALWAYS 1-column vertical accordion list */
body:not(.home) #main-content .design-side-nav {
  box-sizing: border-box;
  width: 100%;
  padding: 10px;
  background: #f4f4f4;
}

body:not(.home) #main-content .design-side-nav > ul,
body:not(.home) #main-content .design-side-nav ul {
  display: block;
  grid-template-columns: none;
  gap: 0;
  width: 100%;
  max-width: 100%;
  padding: 0;
  margin: 0;
  list-style: none;
  box-sizing: border-box;
  border: 0;
  background: transparent;
}

body:not(.home) #main-content .design-side-nav > ul > li {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin-top: 6px;
}

body:not(.home) #main-content .design-side-nav > ul > li:first-child {
  margin-top: 0;
}

body:not(.home) #main-content .design-side-nav ul.design-side-nav__children {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  padding: 4px 12px 8px 16px;
  background: #fff;
  overflow: hidden;
  border: 0;
}

body:not(.home) #main-content .design-side-nav ul.design-side-nav__children[hidden],
body:not(.home) #main-content .design-side-nav .design-side-nav__group:not(.is-open) > ul.design-side-nav__children,
body:not(.home) #main-content .design-side-nav .design-side-nav__group:not(.is-open) > .design-side-nav__children {
  display: none;
}

body:not(.home) #main-content .design-side-nav__children li {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin: 0;
}

body:not(.home) #main-content .design-side-nav__children a {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-height: 42px;
  height: auto;
  padding: 10px 4px 10px 14px;
  border-bottom: 1px solid #999;
  color: #242424;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
  text-decoration: none;
  white-space: normal;
  word-break: break-all;
  overflow-wrap: anywhere;
}

body:not(.home) #main-content .design-side-nav a[aria-current="page"] > span,
body:not(.home) #main-content > article.additional-page.design-page.design-page--with-sidebar.design-page--support-sidebar > div.additional-page-shell.additional-page-layout > aside.additional-page-sidebar > nav.design-side-nav > ul > li.design-side-nav__group > a.design-side-nav__group-link[aria-current="page"] > span.design-side-nav__label {
  font-weight: 700;
}

body:not(.home) #main-content .design-side-nav__children a[aria-current="page"] > span {
  color: #242424;
}

body:not(.home) #main-content .design-side-nav__children a::before {
  position: absolute;
  top: 16px;
  left: 2px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #b52a23;
  content: "";
}

body:not(.home) #main-content .design-side-nav ul.design-side-nav__children > li > a > span {
  display: block;
  width: 100%;
  min-width: 0;
  white-space: normal;
  word-break: break-all;
  overflow-wrap: anywhere;
  line-height: 1.5;
}

body:not(.home) #main-content .design-side-nav__children li:last-child a {
  border-bottom: 0;
}

body:not(.home) #main-content .about-section-nav a,
body:not(.home) #main-content .design-side-nav__group-link {
  white-space: normal;
  word-break: break-all;
  overflow-wrap: anywhere;
}

/* ==========================================================================
   4b. Support Landing Page Card Headers (.support-design-card)
   ========================================================================== */
body:not(.home) #main-content .support-design-card strong,
body:not(.home) #main-content #semiconductor strong,
body.page-id-5 #main-content .design-page--support .support-design-card strong,
body.page-id-5 #main-content #semiconductor strong,
body.page-id-5 #main-content :is(#business, #procurement, #research, #semiconductor, #training) .support-design-card strong {
  position: relative;
  display: flex;
  min-height: 58px;
  align-items: center;
  width: calc(100% + 36px);
  max-width: calc(100% + 36px);
  box-sizing: border-box;
  padding: 10px 38px 10px 18px;
  margin: 0 -18px 14px -18px;
  border: 0;
  border-top: 0;
  border-right: 0;
  border-left: 0;
  border-bottom: 0;
  background: #ededed;
  background-color: #ededed;
  color: #222;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.45;
  text-align: left;
}

@media screen and (min-width: 1200px) {
  body:not(.home) #main-content .support-design-card strong,
  body:not(.home) #main-content #semiconductor strong,
  body.page-id-5 #main-content .design-page--support .support-design-card strong,
  body.page-id-5 #main-content #semiconductor strong,
  body.page-id-5 #main-content :is(#business, #procurement, #research, #semiconductor, #training) .support-design-card strong {
    min-height: 68px;
    width: calc(100% + 36px);
    max-width: calc(100% + 36px);
    box-sizing: border-box;
    padding: 6px 38px 6px 18px;
    margin: 0 -18px 14px -18px;
    background: #ededed;
    background-color: #ededed;
    font-size: 16px;
    line-height: 1.45;
  }
}

/* ==========================================================================
   4c. Support Landing Page Sections & Card Grid (.design-page--support)
   ========================================================================== */
body:not(.home) #main-content :is(.design-page--support .support-group, .support-group, #semiconductor) {
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  min-height: 0;
  box-sizing: border-box;
  padding: 0 20px 24px;
  margin: 54px 0 0 0;
  background: #f5f5f5;
  background-color: #f5f5f5;
  transform: none;
  grid-template-columns: none;
  grid-template-rows: none;
  grid-area: auto;
  align-content: stretch;
  clear: both;
  overflow: visible;
}

body:not(.home) #main-content :is(.design-page--support .support-group:first-of-type, .support-group:first-of-type) {
  margin-top: 48px;
}

body:not(.home) #main-content :is(.design-page--support .support-group::before, .design-page--support .support-group::after, .support-group::before, .support-group::after) {
  display: none;
  content: none;
}

body:not(.home) #main-content :is(.design-page--support .support-group > h2, .support-group > h2) {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(100% + 40px);
  height: 88px;
  min-height: 88px;
  max-height: 88px;
  box-sizing: border-box;
  padding: 0 20px;
  margin: 0 -20px 24px -20px;
  border: 0;
  background: #b52a23;
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: .14em;
  line-height: 1.3;
  text-align: center;
  overflow: hidden;
  isolation: isolate;
}

body:not(.home) #main-content :is(.design-page--support .support-group > h2::before, .support-group > h2::before) {
  position: absolute;
  top: 0;
  right: 0;
  width: 84%;
  height: 100%;
  background: #980700;
  clip-path: polygon(42% 0, 100% 0, 100% 100%, 0 100%);
  content: "";
  z-index: -1;
}

body:not(.home) #main-content :is(.design-page--support .support-group > h2::after, .support-group > h2::after) {
  display: none;
  content: none;
}

body:not(.home) #main-content .design-page--support .support-card-grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: none;
  grid-area: auto;
  gap: 20px 22px;
  width: 100%;
  height: auto;
  min-height: 0;
  box-sizing: border-box;
}

body:not(.home) #main-content .support-design-card,
body.page-id-5 #main-content .support-design-card,
body.page-id-5 #main-content :is(#business, #procurement, #research, #semiconductor, #training) .support-design-card {
  position: relative;
  display: block;
  height: auto;
  min-height: 208px;
  box-sizing: border-box;
  padding: 0 18px 20px;
  border: 1px solid #bcbcbc;
  background: #fff;
  background-color: #fff;
  color: #242424;
  text-decoration: none;
  box-shadow: none;
  overflow: hidden;
}

body:not(.home) #main-content .design-page--support .support-design-card__icon {
  display: none;
}

body:not(.home) #main-content .design-page--support .support-design-card > span:not(.support-design-card__icon) {
  display: block;
  margin: 0;
  color: #222;
  font-size: 13.5px;
  line-height: 1.75;
  text-align: left;
}

body:not(.home) #main-content .support-design-card strong::after,
body.page-id-5 #main-content .design-page--support .support-design-card strong::after,
body.page-id-5 #main-content :is(#business, #procurement, #research, #semiconductor, #training) .support-design-card strong::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  transform: translateY(-50%);
  width: 7px;
  height: 12px;
  display: block;
  background: url('../images/support-card-arrow.svg') no-repeat center center / contain;
  flex-shrink: 0;
  pointer-events: none;
}

/* ==========================================================================
   5. Page Section Title (.additional-section-title) & Content Rhythm
   ========================================================================== */
body:not(.home) #main-content .additional-section-title,
body:not(.home) #main-content article.additional-page div.additional-page-main > h2.additional-section-title,
body:not(.home) #main-content article.additional-page .additional-page-main > h2,
body:not(.home) #main-content article.additional-page .additional-page-main > h1,
body:not(.home) #main-content article.additional-page > div.additional-page-shell.additional-page-layout > div.additional-page-main > h2.additional-section-title,
body:not(.home) #main-content article.additional-page > div.additional-page-shell.additional-page-layout > div.additional-page-main > h2,
body[class*="page-id-"] #main-content article.additional-page div.additional-page-main > h2.additional-section-title,
body[class*="postid-"] #main-content article.additional-page div.additional-page-main > h2.additional-section-title,
body.page-id-34 #main-content h2.additional-section-title,
body.page-id-35 #main-content h2.additional-section-title,
body.page-id-36 #main-content h2.additional-section-title,
body.page-id-37 #main-content h2.additional-section-title,
body.page-id-38 #main-content h2.additional-section-title,
body.page-id-39 #main-content h2.additional-section-title,
body.page-id-40 #main-content h2.additional-section-title,
body.page-id-41 #main-content h2.additional-section-title,
body.page-id-42 #main-content h2.additional-section-title,
body:not(.home) #main-content .design-page-main > h2,
body:not(.home) #main-content .additional-page-main > h2 {
  display: block;
  margin-top: 0;
  margin-bottom: 48px;
  padding: 0;
  border: 0;
  color: #222;
  font-size: 27px;
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1.35;
}

body:not(.home) #main-content .additional-section-title::after {
  display: none;
}

/* ==========================================================================
   6. Standardized Section Heading Red Bar Style (Standardized to rentalroom)
   ========================================================================== */
body:not(.home) #main-content {
  --columbus-section-heading-background: #f3f3f3;
  --columbus-section-heading-border: #b52a23;
  --columbus-section-heading-color: #222;
  --columbus-section-heading-min-height: 44px;
  --columbus-section-heading-padding: 7px 16px;
  --columbus-section-heading-font-size: 21px;
}

body:not(.home) #main-content :is(
  .advertising-custom-body h2,
  .subpage-generic__content h2,
  .support-detail-content h2,
  .design-long-content h2,
  .support-folder9-content h2,
  .support-folder9-content .folder9-section-title,
  .design-page--support-detail .support-detail-content h2,
  .history-timeline__title,
  .profile-overview > h3,
  .organization-chart > h3,
  .newsletter-registration > h2,
  .newsletter-benefits > h2,
  .access-map-section > h3,
  .design-bar-title,
  .disclosure-content h2,
  .rentalroom-section > h2,
  .faq-group > h2,
  .advertising-rate-section > h2,
  .design-contact-box > h2,
  .design-contact-box h2,
  .support-contact > h2,
  .support-contact h2,
  .sitemap-design-section h2,
  .security-policy-content h2,
  .support-related__title, .design-simple-heading
) {
  position: relative;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  min-height: var(--columbus-section-heading-min-height);
  padding: var(--columbus-section-heading-padding);
  margin: 54px 0 24px;
  border-top: 0;
  border-right: 0;
  border-bottom: 0;
  border-left: 5px solid var(--columbus-section-heading-border);
  background: var(--columbus-section-heading-background);
  color: var(--columbus-section-heading-color);
  font-size: var(--columbus-section-heading-font-size);
  font-weight: 700;
  letter-spacing: .05em;
  line-height: 1.4;
  text-align: left;
}

body:not(.home) #main-content :is(
  .subpage-generic__content h2,
  .support-detail-content h2,
  .design-long-content h2,
  .support-folder9-content h2,
  .support-folder9-content .folder9-section-title,
  .design-page--support-detail .support-detail-content h2,
  .history-timeline__title,
  .profile-overview > h3,
  .organization-chart > h3,
  .newsletter-registration > h2,
  .newsletter-benefits > h2,
  .access-map-section > h3,
  .design-bar-title,
  .disclosure-content h2,
  .rentalroom-section > h2,
  .faq-group > h2,
  .advertising-rate-section > h2,
  .design-contact-box > h2,
  .design-contact-box h2,
  .support-contact > h2,
  .support-contact h2,
  .sitemap-design-section h2,
  .security-policy-content h2,
  .support-related__title, .design-simple-heading
)::before,
body:not(.home) #main-content :is(
  .subpage-generic__content h2,
  .support-detail-content h2,
  .design-long-content h2,
  .support-folder9-content h2,
  .support-folder9-content .folder9-section-title,
  .design-page--support-detail .support-detail-content h2,
  .history-timeline__title,
  .profile-overview > h3,
  .organization-chart > h3,
  .newsletter-registration > h2,
  .newsletter-benefits > h2,
  .access-map-section > h3,
  .design-bar-title,
  .disclosure-content h2,
  .rentalroom-section > h2,
  .faq-group > h2,
  .advertising-rate-section > h2,
  .design-contact-box > h2,
  .design-contact-box h2,
  .support-contact > h2,
  .support-contact h2,
  .sitemap-design-section h2,
  .security-policy-content h2,
  .support-related__title, .design-simple-heading
)::after {
  display: none;
  content: none;
}

/* Eliminate awkward top margin for the first heading in content */
body:not(.home) #main-content :is(
  .support-detail-content > h2:first-child,
  .support-detail-content > *:first-child h2:first-child,
  .design-long-content > h2:first-child,
  .support-folder9-content > h2:first-child,
  .support-folder9-content > .folder9-section-title:first-child,
  .profile-overview:first-child > h3,
  .organization-chart:first-child > h3,
  .access-map-section:first-child > h3,
  .disclosure-content > h2:first-child,
  .disclosure-content > *:first-child h2:first-child,
  .history-timeline:first-child > h3:first-child,
  .history-timeline > .history-timeline__title:first-child,
  .rentalroom-section:first-of-type > h2
) {
  margin-top: 0;
}

/* Earlier Illustrator page rules still resolve to this shared component. */
body:not(.home).page #main-content > article.additional-page.design-page.design-page--with-sidebar.design-page--support-sidebar > div.additional-page-shell.additional-page-layout > div.additional-page-main > .content-prose.content-prose.design-long-content > h2,
body:not(.home).page #main-content > article.additional-page.design-page.design-page--with-sidebar.design-page--support-sidebar > div.additional-page-shell.additional-page-layout > div.additional-page-main > .content-prose.content-prose.design-long-content.support-detail-content > h2,
body:not(.home).page #main-content > article.additional-page.design-page.design-page--sitemap .sitemap-design-section > h2:not(.screen-reader-text) {
  box-sizing: border-box;
  min-height: var(--columbus-section-heading-min-height);
  padding: var(--columbus-section-heading-padding);
  border-top: 0;
  border-right: 0;
  border-bottom: 0;
  border-left: 5px solid var(--columbus-section-heading-border);
  background: var(--columbus-section-heading-background);
  color: var(--columbus-section-heading-color);
  font-size: var(--columbus-section-heading-font-size);
  font-weight: 700;
  letter-spacing: .05em;
  line-height: 1.4;
  text-align: left;
}

/* Specific fix for History timeline title so it behaves as a normal heading spanning full width */
body.columbus-design-reference-about-history .history-timeline__title,
body #main-content .history-timeline__title {
  position: relative;
  top: auto;
  left: auto;
  grid-column: 1 / -1;
  width: 100%;
  height: auto;
  margin-bottom: 24px;
}

/* Standard inter-section spacing */
body:not(.home) #main-content :is(
  .organization-chart,
  .access-overview,
  .access-map-image,
  .access-route-grid,
  .disclosure-documents
) {
  margin-top: 54px;
}

/* Subpage generic content defaults */
.subpage-generic__body {
  padding-bottom: 100px;
}

.subpage-generic__content {
  color: #222;
  font-size: 16px;
  line-height: 1.9;
}

.subpage-generic__content > :first-child {
  margin-top: 0;
}

.subpage-generic__content > :last-child {
  margin-bottom: 0;
}

/* ==========================================================================
   7. Responsive Breakpoints
   ========================================================================== */
@media screen and (min-width: 1200px) {
  body:not(.home) #main-content .additional-page-header {
    height: 154px;
    min-height: 154px;
    max-height: 154px;
  }

  body:not(.home) #main-content .additional-page-header > .additional-page-shell {
    height: 154px;
    min-height: 154px;
    max-height: 154px;
  }

  body:not(.home) #main-content .additional-page-header h1 {
    font-size: 27px;
    letter-spacing: 2.7px;
    line-height: 1.25;
  }

  body:not(.home) #main-content .additional-breadcrumb > .additional-page-shell {
    height: 54px;
    min-height: 54px;
    max-height: 54px;
  }

  body:not(.home) #main-content :is(
    .additional-page-layout,
    .design-page__body,
    .rentalroom-page,
    .rentalroom-layout,
    .contact-page,
    .magazine-layout,
    .starter-section,
    .site-search-page,
    .subpage-generic__body,
    .design-page--stories .additional-page-layout,
    .design-page--support .design-page__body,
    .design-page--with-sidebar .additional-page-layout,
    .design-page--support-detail .additional-page-layout,
    .design-page--consultation-detail .additional-page-layout,
    .design-page--folder9-group .additional-page-layout,
    .design-page--folder9-detail .additional-page-layout,
    .additional-page--profile .additional-page-layout,
    .additional-page--history .additional-page-layout,
    .additional-page--access .additional-page-layout,
    .additional-page--disclosure .additional-page-layout,
    .additional-page--design-subpage .additional-page-layout
  ),
  body:not(.home) #main-content > :is(article, section).additional-page > .additional-breadcrumb + .additional-page-shell,
  body:not(.home) #main-content > :is(article, section).additional-page > .additional-breadcrumb + .additional-page-layout,
  body:not(.home) #main-content > :is(article, section).additional-page > .additional-breadcrumb + div {
    padding-top: 55px;
  }

  body:not(.home) #main-content .additional-section-title {
    margin-bottom: 52px;
  }

  /* Magazine publication cards: staggered grid layout with compact auto height. */
  body.page-id-10 #main-content .publication-grid {
    padding-bottom: 358px;
  }

  body.page-id-10 #main-content .publication-card {
    height: auto;
    min-height: 0;
    align-self: start;
  }

  body.page-id-10 #main-content .publication-card:nth-child(even) {
    transform: translateY(319px);
  }

  /* Banner advertising: center the 23px arrow in the image/table gutter. */
  body.page-id-18 #main-content .advertising-rate-layout {
    grid-template-columns: 214px 46px 23px 46px minmax(0, 592px);
  }

  body.page-id-18 #main-content .advertising-rate-arrow {
    width: 23px;
    height: 46px;
    border: 0;
    background: #6bb93f;
    clip-path: polygon(100% 0, 100% 100%, 0 50%);
  }

  body.page-id-18 #main-content .advertising-rate-section--insert .advertising-rate-arrow {
    transform: translateX(-12.75px);
  }
}

@media screen and (max-width: 900px) {
  body:not(.home) #main-content .additional-page-layout {
    display: block;
  }

  body:not(.home) #main-content .additional-page-sidebar {
    width: 100%;
    max-width: 410px;
    margin-top: 48px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
  }

  body:not(.home) #main-content .design-page--support .support-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }

  body:not(.home) #main-content .design-side-nav,
  body:not(.home) #main-content .about-section-nav {
    width: 100%;
    max-width: 410px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
  }

  body:not(.home) #main-content :is(.design-side-nav__title, .about-section-nav__title) {
    width: 100%;
    max-width: 410px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
  }

  body:not(.home) #main-content .design-side-nav,
  body:not(.home) #main-content .design-side-nav > ul,
  body:not(.home) #main-content .design-side-nav ul,
  body:not(.home) #main-content .design-side-nav ul.design-side-nav__children {
    display: block;
    grid-template-columns: none;
    gap: 0;
    width: 100%;
    max-width: 100%;
  }

  body:not(.home) #main-content .design-side-nav > ul > li {
    display: block;
    width: 100%;
    max-width: 100%;
    margin-top: 6px;
  }
}

@media screen and (max-width: 767.98px) {
  body:not(.home) #main-content {
    --columbus-section-heading-background: #f3f3f3;
    --columbus-section-heading-border: #b52a23;
    --columbus-section-heading-color: #222;
    --columbus-section-heading-min-height: 36px;
    --columbus-section-heading-padding: 6px 10px;
    --columbus-section-heading-font-size: clamp(15px, 4vw, 16px);
  }
}

/* Client review: readable publication contents with content-sized cards. */
body.page-id-10 #main-content .additional-page--magazine .publication-card__contents {
  font-size: 14px;
  line-height: 1.7;
}

body.page-id-10 #main-content .additional-page--magazine .publication-card__contents :is(p, span, li, div) {
  font-size: inherit;
  line-height: inherit;
}

@media screen and (min-width: 1200px) {
  body .site-header .site-brand {
    width: 336px;
  }
}

@media screen and (max-width: 620px) {
  body:not(.home) #main-content {
    --columbus-section-heading-background: #f3f3f3;
    --columbus-section-heading-border: #b52a23;
    --columbus-section-heading-color: #222;
    --columbus-section-heading-min-height: 36px;
    --columbus-section-heading-padding: 6px 10px;
    --columbus-section-heading-font-size: clamp(15px, 4vw, 16px);
  }

  body:not(.home) #main-content .additional-page-header {
    height: auto;
    min-height: 86px;
    max-height: none;
    padding-top: 16px;
    padding-bottom: 16px;
    box-sizing: border-box;
  }

  body:not(.home) #main-content .additional-page-header > .additional-page-shell {
    height: auto;
    min-height: 0;
    max-height: none;
    width: min(calc(100% - 32px), 1048px);
    padding-top: 0;
    padding-bottom: 0;
    padding-right: 4px;
    padding-left: 4px;
    box-sizing: border-box;
  }

  body:not(.home) #main-content .additional-breadcrumb > .additional-page-shell,
  body:not(.home) #main-content .additional-page-shell {
    width: min(calc(100% - 32px), 1048px);
    padding-right: 4px;
    padding-left: 4px;
  }

  body:not(.home) #main-content .additional-page-header h1,
  body:not(.home) #main-content article.additional-page header.additional-page-header div.additional-page-shell > h1,
  body:not(.home) #main-content :is(.additional-page, .additional-page--design-subpage, .additional-page--access, .additional-page--profile, .additional-page--history, .additional-page--disclosure) .additional-page-header h1,
  body.page-id-25 #main-content .additional-page-header h1,
  body[class*="page-id-"] #main-content .additional-page-header h1 {
    font-size: clamp(20px, 6vw, 22px);
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.35;
    word-break: break-word;
    overflow-wrap: break-word;
  }

  body:not(.home) #main-content .additional-breadcrumb > .additional-page-shell {
    height: auto;
    min-height: 36px;
    max-height: none;
    gap: 3px 6px;
    padding-top: 6px;
    padding-bottom: 6px;
    white-space: normal;
  }

  body:not(.home) #main-content .design-page--support-detail .additional-breadcrumb > .additional-page-shell {
    column-gap: 10px;
  }

  body:not(.home) #main-content .additional-breadcrumb a,
  body:not(.home) #main-content .additional-breadcrumb span {
    font-size: 13px;
    line-height: 1.45;
  }

  body:not(.home) #main-content :is(
    .additional-page-layout,
    .design-page__body,
    .rentalroom-page,
    .rentalroom-layout,
    .contact-page,
    .magazine-layout,
    .starter-section,
    .site-search-page,
    .subpage-generic__body,
    .design-page--stories .additional-page-layout,
    .design-page--support .design-page__body,
    .design-page--with-sidebar .additional-page-layout,
    .design-page--support-detail .additional-page-layout,
    .design-page--consultation-detail .additional-page-layout,
    .design-page--folder9-group .additional-page-layout,
    .design-page--folder9-detail .additional-page-layout,
    .additional-page--profile .additional-page-layout,
    .additional-page--history .additional-page-layout,
    .additional-page--access .additional-page-layout,
    .additional-page--disclosure .additional-page-layout,
    .additional-page--design-subpage .additional-page-layout
  ),
  body:not(.home) #main-content > :is(article, section).additional-page > .additional-breadcrumb + .additional-page-shell,
  body:not(.home) #main-content > :is(article, section).additional-page > .additional-breadcrumb + .additional-page-layout,
  body:not(.home) #main-content > :is(article, section).additional-page > .additional-breadcrumb + div {
    padding-top: 20px;
  }

  body#page:not(.home) #main-content > article.additional-page.design-page--support-detail > .additional-breadcrumb + .additional-page-shell.additional-page-layout {
    padding-top: 32px;
  }

  body:not(.home) #main-content .additional-section-title,
  body:not(.home) #main-content article.additional-page div.additional-page-main > h2.additional-section-title,
  body:not(.home) #main-content article.additional-page > div.additional-page-shell.additional-page-layout > div.additional-page-main > h2.additional-section-title,
  body:not(.home) #main-content :is(.additional-page, .additional-page--design-subpage, .additional-page--access, .additional-page--profile, .additional-page--history, .additional-page--disclosure) .additional-section-title,
  body.page-id-25 #main-content .additional-section-title,
  body[class*="page-id-"] #main-content .additional-section-title {
    font-size: clamp(23px, 7vw, 25px);
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 24px;
    line-height: 1.35;
    letter-spacing: 0.03em;
  }

  /* Subpage intro headings (e.g. 挑戦する企業に、最適な支援を。) on all subpages */
  body:not(.home) #main-content :is(
    .support-introduction .design-introduction h2,
    .design-introduction h2,
    .design-introduction.content-prose > h2,
    .design-page__intro h2,
    .design-page-intro h2,
    .rentalroom-introduction h2,
    .magazine-intro h2,
    .magazine-intro h3,
    .consultation-detail-intro h2,
    .folder9-intro h2,
    .advertising-kicker,
    .design-hero-title,
    .corporate-profile-intro h2,
    .access-intro h2,
    .disclosure-intro h2,
    .contact-intro h2,
    .faq-intro h2,
    .newsletter-intro h2
  ),
  body.columbus-design-reference-consulting .support-introduction .design-introduction h2 {
    font-size: clamp(17px, 4.8vw, 20px);
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.03em;
    margin: 0 0 16px;
    word-break: break-word;
    overflow-wrap: break-word;
  }

  /* Subpage intro paragraphs across all subpages */
  body:not(.home) #main-content :is(
    .support-introduction .design-introduction p,
    .design-introduction p,
    .design-introduction.content-prose > p,
    .design-page__intro p,
    .design-page-intro p,
    .rentalroom-introduction p,
    .magazine-intro p,
    .consultation-detail-intro p,
    .folder9-intro p,
    .corporate-profile-intro p,
    .access-intro p,
    .disclosure-intro p,
    .contact-intro p,
    .faq-intro p,
    .newsletter-intro p
  ),
  body.columbus-design-reference-consulting .support-introduction .design-introduction p {
    font-size: clamp(13px, 3.6vw, 14.5px);
    line-height: 1.7;
    margin: 0 0 16px;
    word-break: break-word;
    overflow-wrap: break-word;
  }

  body:not(.home) #main-content .design-lead,
  body:not(.home) #main-content :is(.design-page, .additional-page) .design-lead,
  body:not(.home) #main-content .design-page--membership .design-lead,
  body:not(.home) #main-content .design-introduction.content-prose > p {
    font-size: clamp(13.5px, 3.8vw, 15px);
    font-weight: 700;
    line-height: 1.65;
    margin-bottom: 20px;
    letter-spacing: 0.02em;
    word-break: break-word;
    overflow-wrap: break-word;
  }

  body:not(.home) #main-content :is(.design-page--support .support-group, .support-group) {
    padding: 0 14px 18px;
    margin-top: 36px;
  }

  body:not(.home) #main-content :is(.design-page--support .support-group:first-of-type, .support-group:first-of-type) {
    margin-top: 28px;
  }

  body:not(.home) #main-content :is(.design-page--support .support-group > h2, .support-group > h2) {
    width: calc(100% + 28px);
    min-height: 52px;
    height: auto;
    max-height: none;
    padding: 8px 12px;
    margin: 0 -14px 16px -14px;
    font-size: clamp(15px, 4.2vw, 17px);
    letter-spacing: .03em;
    line-height: 1.35;
    display: flex;
    align-items: center;
    box-sizing: border-box;
  }

  body:not(.home) #main-content .design-page--support .support-card-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  body:not(.home) #main-content .design-page--support .support-design-card,
  body:not(.home) #main-content .support-design-card {
    min-height: 0;
    padding: 0 14px 14px;
    overflow: hidden;
  }

  body:not(.home) #main-content .support-design-card strong,
  body:not(.home) #main-content .design-page--support .support-design-card strong {
    width: calc(100% + 28px);
    max-width: calc(100% + 28px);
    box-sizing: border-box;
    margin: 0 -14px 12px -14px;
    padding: 8px 30px 8px 14px;
  }

  /* FAQ: remove fixed height so 2-line question titles don't overflow the item box */
  body:not(.home) #main-content .design-page--faq .faq-item {
    height: auto;
  }

  body:not(.home) #main-content .design-page--faq .faq-item summary {
    height: auto;
    min-height: 56px;
    padding: 0 14px 0 0;
    align-items: stretch;
    grid-template-columns: 44px minmax(0, 1fr) 30px;
  }

  body:not(.home) #main-content .design-page--faq .faq-mark {
    width: 44px;
    height: auto;
    min-height: 44px;
    align-self: stretch;
    border-radius: 0;
    flex-shrink: 0;
  }

  body:not(.home) #main-content .design-page--faq .faq-mark--a {
    width: 44px;
    height: auto;
    min-height: 44px;
    align-self: stretch;
    flex-shrink: 0;
  }

  body:not(.home) #main-content .design-page--faq .faq-item > div {
    grid-template-columns: 44px minmax(0, 1fr);
    min-height: 0;
    padding: 0;
    align-items: stretch;
  }

  body:not(.home) #main-content .design-page--faq .faq-item summary strong {
    display: flex;
    align-items: center;
    padding: 12px 10px;
    font-size: 14px;
    line-height: 1.65;
  }

  body:not(.home) #main-content .design-page--faq .faq-answer {
    display: flex;
    align-items: center;
    padding: 12px 14px;
    font-size: 14px;
    line-height: 1.65;
  }

  body:not(.home) #main-content :is(
    .advertising-custom-body h2,
    .subpage-generic__content h2,
    .support-detail-content h2,
    .design-long-content h2,
    .support-folder9-content h2,
    .support-folder9-content .folder9-section-title,
    .design-page--support-detail .support-detail-content h2,
    .design-page--consultation-detail .design-long-content h2,
    .history-timeline__title,
    .profile-overview > h3,
    .organization-chart > h3,
    .newsletter-registration > h2,
    .newsletter-benefits > h2,
    .access-map-section > h3,
    .design-bar-title,
    .disclosure-content h2,
    .rentalroom-section > h2,
    .faq-group > h2,
    .advertising-rate-section > h2,
    .design-contact-box > h2,
    .design-contact-box h2,
    .support-contact > h2,
    .support-contact h2,
    .sitemap-design-section h2,
    .security-policy-content h2,
    .support-related__title, .design-simple-heading
  ),
  body.columbus-design-reference-consulting-management-consultation #main-content .design-page--consultation-detail .design-long-content h2 {
    font-size: clamp(15px, 4vw, 16px);
    min-height: auto;
    height: auto;
    padding: 7px 10px;
    margin: 24px 0 14px;
    line-height: 1.45;
    letter-spacing: 0.02em;
    word-break: normal;
    overflow-wrap: break-word;
    box-sizing: border-box;
  }

  .subpage-generic__body {
    padding-bottom: 84px;
  }

  .subpage-generic__content {
    font-size: 15px;
  }

  /* Newsletter badge mobile sizing and vertical spacing */
  .newsletter-badge {
    width: 90px;
    height: 90px;
    top: -42px;
    right: 12px;
  }

  .newsletter-badge strong,
  body.page-id-159 .newsletter-badge > strong {
    font-size: 12.5px;
    line-height: 1.15;
    padding: 5px 2px 3px;
    margin: 0;
  }

  .newsletter-badge small,
  body.page-id-159 .newsletter-badge > small {
    font-size: 7.5px;
    line-height: 1.15;
    padding: 3px 2px 5px;
    margin: 0;
  }

  /* Sub-headings h3 on all subpages */
  body:not(.home) #main-content :is(
    .content-prose h3,
    .design-long-content h3,
    .support-detail-content h3,
    .consultation-detail-box h3,
    .access-route-card h3,
    .profile-overview > h4,
    .disclosure-content h3,
    .rentalroom-section:not(.rentalroom-section--parking) h3
  ) {
    font-size: clamp(15px, 4vw, 17px);
    line-height: 1.45;
    margin: 20px 0 10px;
    letter-spacing: 0.03em;
    word-break: break-word;
    overflow-wrap: break-word;
  }

  body:not(.home) #main-content .rentalroom-parking__detail h3,
  body.page-id-8 #main-content .rentalroom-parking__detail h3,
  body:not(.home) #main-content .rentalroom-section .rentalroom-parking__detail h3 {
    margin: 0;
    margin-top: 0;
    margin-bottom: 0;
  }

  /* Sub-headings h4 on all subpages */
  body:not(.home) #main-content :is(
    .content-prose h4,
    .design-long-content h4,
    .access-route-card h4,
    .support-detail-content h4
  ) {
    font-size: clamp(14px, 3.8vw, 15px);
    line-height: 1.45;
    margin: 16px 0 8px;
    letter-spacing: 0.02em;
    word-break: break-word;
    overflow-wrap: break-word;
  }

  /* Body paragraphs and lists on all subpages */
  body:not(.home) #main-content :is(
    .content-prose p,
    .content-prose li,
    .design-long-content p,
    .design-long-content li,
    .subpage-generic__content p,
    .subpage-generic__content li,
    .additional-page p,
    .additional-page li
  ) {
    font-size: clamp(14px, 3.8vw, 15px);
    line-height: 1.75;
    word-break: break-word;
    overflow-wrap: break-word;
  }

  /* Tables on all subpages */
  body:not(.home) #main-content :is(
    table,
    .membership-fee-table,
    .rentalroom-price-table,
    .advertising-fee-table,
    .disclosure-table,
    .profile-table,
    .corporate-table
  ) {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  body:not(.home) #main-content :is(
    table,
    .membership-fee-table,
    .rentalroom-price-table,
    .advertising-fee-table,
    .disclosure-table,
    .profile-table,
    .corporate-table
  ) :is(th, td) {
    font-size: clamp(12.5px, 3.6vw, 14px);
    padding: 10px 8px;
    line-height: 1.5;
    word-break: break-word;
    overflow-wrap: break-word;
  }

  /* Magazine titles & layout on mobile: 20px side padding */
  body:not(.home) #main-content :is(.publication-card__title, .magazine-card__title) {
    font-size: clamp(15px, 4.4vw, 18px);
    line-height: 1.4;
    word-break: break-word;
    overflow-wrap: break-word;
  }

  body.page-id-10 .additional-page--magazine .magazine-intro,
  body:not(.home) #main-content .additional-page--magazine .magazine-intro {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-bottom: 28px;
    height: auto;
    min-height: 0;
  }

  body.page-id-10 .additional-page--magazine .magazine-wordmark,
  body:not(.home) #main-content .additional-page--magazine .magazine-wordmark {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
    padding: 0;
    border: 0;
  }

  body.page-id-10 .additional-page--magazine .magazine-wordmark img,
  body:not(.home) #main-content .additional-page--magazine .magazine-wordmark img {
    display: block;
    width: clamp(120px, 36vw, 145px);
    max-width: 100%;
    height: auto;
    margin: 0 auto;
    object-fit: contain;
  }

  body.page-id-10 .additional-page--magazine .magazine-intro__content,
  body:not(.home) #main-content .additional-page--magazine .magazine-intro__content {
    width: 100%;
    margin-top: 0;
  }

  body.page-id-10 .additional-page--magazine .magazine-page,
  body.page-id-10 .additional-page--magazine .magazine-publications,
  body.page-id-10 .additional-page--magazine .magazine-publications__inner,
  body:not(.home) #main-content .additional-page--magazine .magazine-page,
  body:not(.home) #main-content .additional-page--magazine .magazine-publications,
  body:not(.home) #main-content .additional-page--magazine .magazine-publications__inner,
  body:not(.home) #main-content .additional-page--magazine .publication-grid {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
    margin-left: auto;
    margin-right: auto;
  }

  body.page-id-10 .additional-page--magazine .publication-card,
  body:not(.home) #main-content .additional-page--magazine .publication-card {
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 20px;
  }

  /* Buttons on all subpages */
  body:not(.home) #main-content :is(
    .design-download-button,
    .design-text-link,
    .button-primary,
    .btn-primary,
    .btn
  ) {
    font-size: clamp(13px, 3.8vw, 15px);
    min-height: 44px;
    box-sizing: border-box;
    word-break: break-word;
    overflow-wrap: break-word;
  }
}

/* ==========================================================================
   6. Newsletter Badge Shared Vertical Centering & Spacing
   ========================================================================== */

/* sitemap.ai has its own compact desktop rhythm; keep it separate from the
   shared subpage heading cadence above. */
@media screen and (min-width: 1200px) {
  body.page-id-19.columbus-design-reference-sitemap:not(.home) #main-content .design-page--sitemap .sitemap-design-grid {
    padding: 74px 0 193px;
  }

  body.columbus-design-reference-sitemap:not(.home) #main-content .design-page--sitemap .sitemap-design-section > h2:not(.screen-reader-text) {
    display: block;
    box-sizing: border-box;
    height: 43px;
    min-height: 0;
    padding: 6px 18px;
    margin: 0 0 35px;
    border-left: 5px solid #b52a23;
    background: #f6f6f6;
    color: #231916;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 31px;
  }

  body.columbus-design-reference-sitemap:not(.home) #main-content .design-page--sitemap .sitemap-design-section--main > h2.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    min-height: 0;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    border: 0;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }
}

/* sitemap.ai: the Training and About section bodies sit on a white background. */
body.page-id-19.columbus-design-reference-sitemap #main-content .design-page--sitemap :is(
  .sitemap-design-section--training,
  .sitemap-design-section--about
) {
  background: #fff;
}

/* Keep the History title, breadcrumb, and content column on one vertical axis. */
body.page-id-49.columbus-design-reference-about-history #main-content .additional-page-header > .additional-page-shell,
body.page-id-49.columbus-design-reference-about-history #main-content .additional-breadcrumb > .additional-page-shell {
  padding-left: 0;
}

@media screen and (max-width: 620px) {
  body.page-id-49.columbus-design-reference-about-history #main-content .additional-page-header > .additional-page-shell,
  body.page-id-49.columbus-design-reference-about-history #main-content .additional-breadcrumb > .additional-page-shell {
    padding-left: 4px;
  }
}

/* History: keep the editable section title separate from the supplied diagram image. */
body.page-id-49.columbus-design-reference-about-history #main-content > article.additional-page--history .additional-page-main > .history-timeline__title {
  width: 100%;
  margin-bottom: 45px;
}

body.page-id-49.columbus-design-reference-about-history #main-content .history-timeline::before {
  aspect-ratio: 1294 / 1008;
  background-position: center top;
  background-size: contain;
}

.newsletter-badge {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  box-sizing: border-box;
}

.newsletter-badge strong,
body.page-id-159 .newsletter-badge > strong {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 50%;
  width: 100%;
  box-sizing: border-box;
  margin: 0;
  padding: 8px 4px 4px;
}

.newsletter-badge small,
body.page-id-159 .newsletter-badge > small {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 50%;
  width: 100%;
  box-sizing: border-box;
  margin: 0;
  padding: 4px 4px 8px;
}

/* Keep the first content block on the same vertical rhythm after breadcrumbs. */
body:not(.home) #main-content > :is(article, section).additional-page > .additional-breadcrumb + .additional-page-shell > :is(h1, h2, h3):first-child,
body:not(.home) #main-content > :is(article, section).additional-page > .additional-breadcrumb + .additional-page-shell > :first-child > :is(h1, h2, h3):first-child {
  margin-top: 0;
}

@media screen and (min-width: 1200px) {
  body.page-id-19.columbus-design-reference-sitemap:not(.home) #main-content .design-page--sitemap .sitemap-design-grid {
    padding-top: 55px;
  }
}

/* Keep in-page anchor headings visible below the fixed/sticky header. */
body {
  --columbus-anchor-scroll-offset: 131px;
}

body.admin-bar {
  --columbus-anchor-scroll-offset: 163px;
}

#main-content :target,
body:not(.home) #main-content .design-page--faq .faq-group,
body:not(.home) #main-content .design-page--faq .faq-group > h2 {
  scroll-margin-top: var(--columbus-anchor-scroll-offset);
}

@media screen and (max-width: 1199px) {
  body {
    --columbus-anchor-scroll-offset: 92px;
  }

  body.admin-bar {
    --columbus-anchor-scroll-offset: 124px;
  }
}

@media screen and (max-width: 782px) {
  body.admin-bar {
    --columbus-anchor-scroll-offset: 138px;
  }
}

/* Support action buttons: ensure white text across all subpages */
body:not(.home) #main-content .design-page--support-detail .support-detail-content a.support-action,
body:not(.home) #main-content .design-page--support-detail .support-detail-content a.support-action:visited,
body:not(.home) #main-content .design-page--support-detail a.support-action,
body:not(.home) #main-content .design-page--support-detail a.support-action:visited,
body:not(.home) #main-content .support-detail-content a.support-action,
body:not(.home) #main-content .support-detail-content a.support-action:visited,
body:not(.home) #main-content a.support-action,
body:not(.home) #main-content a.support-action:visited {
  color: #fff;
}

body:not(.home) #main-content .design-page--support-detail .support-detail-content a.support-action:hover,
body:not(.home) #main-content .design-page--support-detail .support-detail-content a.support-action:focus-visible,
body:not(.home) #main-content .design-page--support-detail a.support-action:hover,
body:not(.home) #main-content .design-page--support-detail a.support-action:focus-visible,
body:not(.home) #main-content .support-detail-content a.support-action:hover,
body:not(.home) #main-content .support-detail-content a.support-action:focus-visible,
body:not(.home) #main-content a.support-action:hover,
body:not(.home) #main-content a.support-action:focus-visible {
  color: var(--design-red, #a60a00);
  background: #fff;
}

body:not(.home) #main-content .design-page--support-detail .support-detail-content a.support-action.support-action--dark:hover,
body:not(.home) #main-content .design-page--support-detail .support-detail-content a.support-action.support-action--dark:focus-visible,
body:not(.home) #main-content a.support-action.support-action--dark:hover,
body:not(.home) #main-content a.support-action.support-action--dark:focus-visible {
  color: #3f3b3a;
  background: #fff;
}

/* Banner advertising and subpage contact box layout */
body:not(.home) #main-content .design-page--advertising .design-contact-box,
body:not(.home) #main-content .design-contact-box {
  width: 100%;
  max-width: 100%;
  padding: 0;
  margin-top: 54px;
  background: transparent;
  color: #231916;
  text-align: left;
}

body:not(.home) #main-content .design-page--advertising .design-contact-box > h2,
body:not(.home) #main-content .design-contact-box > h2 {
  width: 100%;
  max-width: 100%;
}

body:not(.home) #main-content .design-page--advertising .design-contact-box > p,
body:not(.home) #main-content .design-contact-box > p {
  margin: 0;
  font-size: 16px;
  line-height: 1.75;
}

body:not(.home) #main-content .design-page--advertising .design-contact-box > p + p,
body:not(.home) #main-content .design-contact-box > p + p {
  margin-top: 4px;
}

body:not(.home) #main-content .design-page--advertising .design-contact-box a,
body:not(.home) #main-content .design-contact-box a {
  color: inherit;
  text-decoration: none;
}

/* FAQ: Remove horizontal border between Question and Answer */
body:not(.home) #main-content .design-page--faq .faq-item > div,
body:not(.home) #main-content .design-page--faq .faq-item > div.faq-answer-wrap,
body:not(.home) #main-content .design-page--faq .faq-item .faq-answer-wrap,
body:not(.home) #main-content .faq-item > div,
body:not(.home) #main-content .faq-item .faq-answer-wrap {
  border-top: 0;
  border-top-width: 0;
  border-top-color: transparent;
}

/* About page: responsive grid and cards (3 items per row on desktop) */
body:not(.home) #main-content .additional-page--about .about-landing__content h2 {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.5;
  color: #222;
  margin: 0 0 24px;
  letter-spacing: 0.02em;
}

body:not(.home) #main-content .additional-page--about .about-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px 20px;
  width: 100%;
  box-sizing: border-box;
}

body:not(.home) #main-content .additional-page--about .about-card {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 165px auto;
  min-height: 0;
  border: 1px solid #bcbcbc;
  background: #fff;
  overflow: hidden;
  text-decoration: none;
  box-shadow: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

body:not(.home) #main-content .additional-page--about .about-card:hover,
body:not(.home) #main-content .additional-page--about .about-card:focus-visible {
  border-color: #af2e25;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

body:not(.home) #main-content .additional-page--about .about-card > img {
  width: 100%;
  height: 165px;
  object-fit: cover;
  display: block;
}

body:not(.home) #main-content .additional-page--about .about-card__body {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 72px;
  padding: 12px 38px 12px 16px;
  border-left: 5px solid var(--columbus-brand, #a60a00);
  background: #fff;
  box-sizing: border-box;
}

body:not(.home) #main-content .additional-page--about .about-card__body strong {
  margin: 0 0 4px;
  color: #222;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
}

body:not(.home) #main-content .additional-page--about .about-card__body span {
  font-size: 13px;
  color: #666;
  line-height: 1.5;
}

body:not(.home) #main-content .additional-page--about .about-card__arrow {
  position: absolute;
  top: 50%;
  right: 14px;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
}

body:not(.home) #main-content .additional-page--about .about-card__arrow img {
  width: 9px;
  height: 15px;
  display: block;
}

@media screen and (max-width: 900px) {
  body:not(.home) #main-content .additional-page--about .about-landing {
    padding: 24px 16px 40px;
  }

  body:not(.home) #main-content .additional-page--about .about-landing__hero {
    height: auto;
    aspect-ratio: 16 / 9;
    max-height: 320px;
  }

  body:not(.home) #main-content .additional-page--about .about-landing__content {
    margin: 36px 0 40px;
  }

  body:not(.home) #main-content .additional-page--about .about-landing__content h2 {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.45;
  }

  body:not(.home) #main-content .additional-page--about .about-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }

  body:not(.home) #main-content .additional-page--about .about-card {
    grid-template-rows: 150px auto;
  }

  body:not(.home) #main-content .additional-page--about .about-card > img {
    height: 150px;
  }
}

@media screen and (max-width: 620px) {
  body:not(.home) #main-content .additional-page--about .about-landing {
    padding: 20px 0 48px;
  }

  body:not(.home) #main-content .additional-page--about .about-landing__hero {
    height: auto;
    aspect-ratio: 16 / 9;
    max-height: 220px;
    margin: 0 0 20px;
  }

  body:not(.home) #main-content .additional-page--about .about-landing__content {
    margin: 20px 0 28px;
  }

  body:not(.home) #main-content .additional-page--about .about-landing__content h2 {
    font-size: clamp(17px, 4.8vw, 20px);
    font-weight: 700;
    line-height: 1.45;
    margin-bottom: 12px;
  }

  body:not(.home) #main-content .additional-page--about .about-landing__content p {
    font-size: 15px;
    line-height: 1.8;
  }

  body:not(.home) #main-content .additional-page--about .about-card-grid {
    grid-template-columns: 1fr;
    max-width: 410px;
    margin: 0 auto;
    gap: 14px;
  }

  body:not(.home) #main-content .additional-page--about .about-card {
    grid-template-rows: 150px auto;
    width: 100%;
  }

  body:not(.home) #main-content .additional-page--about .about-card > img {
    height: 150px;
  }

  body:not(.home) #main-content .additional-page--about .about-card__body {
    min-height: 52px;
    padding: 12px 38px 12px 16px;
  }

  body:not(.home) #main-content .additional-page--about .about-card__body strong {
    font-size: 16px;
    font-weight: 700;
  }
}

/* Stories (case-studies & voices) introduction title styling matching design */
body:not(.home) #main-content .stories-introduction {
  margin-bottom: 48px;
}

body:not(.home) #main-content .stories-introduction h2 {
  position: static;
  display: block;
  min-height: 0;
  padding: 0;
  margin: 0 0 24px;
  border: 0;
  border-left: 0;
  background: transparent;
  color: #231916;
  font-size: 25px;
  font-weight: 700;
  letter-spacing: .03em;
  line-height: 1.45;
  text-align: left;
}

body:not(.home) #main-content .stories-introduction h2::before,
body:not(.home) #main-content .stories-introduction h2::after {
  display: none;
  content: none;
}

body:not(.home) #main-content .stories-introduction p {
  margin: 0 0 16px;
  font-size: 16px;
  line-height: 1.8;
  color: #231916;
}

body:not(.home) #main-content .stories-introduction p:last-child {
  margin-bottom: 0;
}

@media screen and (max-width: 900px) {
  body:not(.home) #main-content .stories-introduction {
    margin-bottom: 36px;
  }

  body:not(.home) #main-content .stories-introduction h2 {
    font-size: 22px;
    margin-bottom: 18px;
  }
}

@media screen and (max-width: 620px) {
  body:not(.home) #main-content .stories-introduction {
    margin-bottom: 30px;
  }

  body:not(.home) #main-content .stories-introduction h2 {
    font-size: 20px;
    margin-bottom: 14px;
    line-height: 1.4;
  }

  body:not(.home) #main-content .stories-introduction p {
    font-size: 15px;
    line-height: 1.75;
  }
}

/* Sidebar navigation consistency for About section navigation (.about-section-nav) */
body:not(.home) #main-content .about-section-nav {
  box-sizing: border-box;
  width: 100%;
  padding: 8px;
  background: #f4f4f4;
  border: 0;
}

body:not(.home) #main-content .about-section-nav > ul {
  display: block;
  padding: 0;
  margin: 0;
  border: 0;
  list-style: none;
  background: transparent;
}

body:not(.home) #main-content .about-section-nav > ul > li {
  display: block;
  padding: 0;
  margin: 0;
  list-style: none;
}

body:not(.home) #main-content .about-section-nav > ul > li + li {
  margin-top: 6px;
}

body:not(.home) #main-content .about-section-nav > ul > li > a {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: 49px;
  height: auto;
  box-sizing: border-box;
  padding: 12px 14px;
  border: 0;
  border-bottom: 0;
  color: #242424;
  background: #fff;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.45;
  text-decoration: none;
  white-space: normal;
  word-break: break-all;
  overflow-wrap: anywhere;
  transition: color 160ms ease, background-color 160ms ease;
}

body:not(.home) #main-content .about-section-nav > ul > li > a:not(.is-current) {
  color: #242424;
  background: #fff;
}

body:not(.home) #main-content .about-section-nav > ul > li > a:not(.is-current):hover,
body:not(.home) #main-content .about-section-nav > ul > li > a:not(.is-current):focus-visible {
  color: #b52a23;
  background: #fff;
}

body:not(.home) #main-content .about-section-nav > ul > li > a.is-current {
  color: #fff;
  background: #3f3b3a;
  font-weight: 700;
}

body:not(.home) #main-content .about-section-nav > ul > li > a.is-current > span {
  color: #fff;
}

body:not(.home) #main-content .about-section-nav > ul > li > a:not(.is-current) > span {
  color: #242424;
}

@media screen and (max-width: 620px) {
  body:not(.home) #main-content .about-section-nav {
    padding: 8px;
  }

  body:not(.home) #main-content .about-section-nav > ul {
    display: block;
  }

  body:not(.home) #main-content .about-section-nav > ul > li + li {
    margin-top: 6px;
  }

  body:not(.home) #main-content .about-section-nav > ul > li > a {
    min-height: 46px;
    padding: 10px 14px;
    font-size: 14px;
  }
}

/* Management cards on support category pages: use standardized SVG arrow */
body:not(.home) #main-content .management-card b,
body:not(.home) #main-content .design-page--with-sidebar .management-card b {
  position: absolute;
  top: 29px;
  right: 16px;
  transform: translateY(-50%);
  width: 7px;
  height: 12px;
  display: block;
  background: url('../images/support-card-arrow.svg') no-repeat center center / contain;
  color: transparent;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  padding: 0;
  margin: 0;
  pointer-events: none;
}

/* Corporate profile overview (機構概要) mobile 1-column layout */
@media screen and (max-width: 620px) {
  body:not(.home) #main-content .profile-overview dl > div,
  body:not(.home) #main-content .additional-page--profile .profile-overview dl > div {
    display: block;
    grid-template-columns: 1fr;
    padding: 14px 16px;
  }

  body:not(.home) #main-content .profile-overview dt,
  body:not(.home) #main-content .additional-page--profile .profile-overview dt {
    display: block;
    padding: 0 0 6px 0;
    font-size: 14px;
    font-weight: 700;
    color: #242424;
    background: transparent;
  }

  body:not(.home) #main-content .profile-overview dd,
  body:not(.home) #main-content .additional-page--profile .profile-overview dd {
    display: block;
    padding: 0;
    font-size: 15px;
    line-height: 1.6;
    color: #242424;
    background: transparent;
    word-break: break-word;
    overflow-wrap: anywhere;
  }
}

/* ==========================================================================
   Unified Subpage Content-to-Footer Spacing (250px on PC, 100px on mobile)
   ========================================================================== */
body:not(.home) #main-content,
body:not(.home) .site-main {
  min-height: 0;
  margin-bottom: 0;
  padding-bottom: 0;
}

body:not(.home) #main-content > :is(article, section, div),
body:not(.home) .site-main > :is(article, section, div) {
  min-height: 0;
  margin-bottom: 0;
}

body:not(.home) .site-main > article.additional-page > :is(.additional-page-shell, .additional-page-layout, .design-page__body, div):last-child,
body:not(.home) .site-main > .starter-section,
body.search .site-main > .site-search-page {
  padding-bottom: 250px;
}

@media screen and (max-width: 767.98px) {
  body:not(.home) .site-main > article.additional-page > :is(.additional-page-shell, .additional-page-layout, .design-page__body, div):last-child,
  body:not(.home) .site-main > .starter-section,
  body.search .site-main > .site-search-page {
    padding-bottom: 100px;
  }
}

/* Unified Check grid & Example grid across ALL viewports (PC, Tablet, Mobile) */
body:not(.home) #main-content :is(
  .design-check-grid,
  .support-example-grid,
  .content-prose .design-check-grid,
  .content-prose .support-example-grid,
  .design-long-content .design-check-grid,
  .design-long-content .support-example-grid,
  .support-detail-content .design-check-grid,
  .support-detail-content .support-example-grid,
  .support-folder9-content .design-check-grid,
  .support-folder9-content .support-example-grid
) {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 12px;
  width: 100%;
  max-width: 100%;
  margin: 20px 0 32px;
  margin-left: 0;
  padding: 0;
  list-style: none;
  box-sizing: border-box;
}

body:not(.home) #main-content :is(
  .design-check-grid li,
  .support-example-grid li,
  .content-prose .design-check-grid li,
  .content-prose .support-example-grid li,
  .design-long-content .design-check-grid li,
  .design-long-content .support-example-grid li,
  .support-detail-content .design-check-grid li,
  .support-detail-content .support-example-grid li,
  .support-folder9-content .design-check-grid li,
  .support-folder9-content .support-example-grid li
) {
  position: static;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 58px;
  height: auto;
  box-sizing: border-box;
  margin: 0;
  margin-top: 0;
  padding: 10px 14px;
  border: 1px solid #231916;
  background: #fff;
  color: #231916;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.45;
  letter-spacing: 0;
  word-break: break-word;
}

body:not(.home) #main-content :is(
  .design-check-grid li::before,
  .support-example-grid li::before,
  .content-prose .design-check-grid li::before,
  .content-prose .support-example-grid li::before,
  .design-long-content .design-check-grid li::before,
  .design-long-content .support-example-grid li::before,
  .support-detail-content .design-check-grid li::before,
  .support-detail-content .support-example-grid li::before,
  .support-folder9-content .design-check-grid li::before,
  .support-folder9-content .support-example-grid li::before
) {
  display: none;
  content: none;
}

/* Check grid, Example grid & Card grid on mobile (1 item 1 row / 1 column) */
@media screen and (max-width: 767.98px) {
  body:not(.home) #main-content :is(
    .design-check-grid,
    .support-example-grid,
    .support-card-grid,
    .design-card-grid,
    .content-prose .design-check-grid,
    .content-prose .support-example-grid,
    .content-prose .support-card-grid,
    .design-long-content .design-check-grid,
    .design-long-content .support-example-grid,
    .design-long-content .support-card-grid,
    .support-detail-content .design-check-grid,
    .support-detail-content .support-example-grid,
    .support-detail-content .support-card-grid,
    .support-folder9-content .design-check-grid,
    .support-folder9-content .support-example-grid,
    .design-page--support .support-card-grid,
    .design-page--support-detail .support-card-grid,
    .design-page--support-detail .support-example-grid,
    .design-page--support-detail .design-check-grid
  ),
  body.page-id-34 .design-check-grid,
  body.page-id-35 .support-example-grid,
  body.page-id-36 .support-card-grid,
  body[class*="page-id-"] #main-content .support-card-grid,
  body[class*="page-id-"] #main-content .support-example-grid,
  body[class*="page-id-"] #main-content .design-check-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    width: 100%;
    max-width: 100%;
    margin: 14px 0 24px;
    margin-left: 0;
    padding-left: 0;
    box-sizing: border-box;
  }

  body:not(.home) #main-content :is(
    .design-check-grid li,
    .support-example-grid li,
    .content-prose .design-check-grid li,
    .content-prose .support-example-grid li,
    .design-long-content .design-check-grid li,
    .design-long-content .support-example-grid li,
    .support-detail-content .design-check-grid li,
    .support-detail-content .support-example-grid li,
    .support-folder9-content .design-check-grid li,
    .support-folder9-content .support-example-grid
  ),
  body.page-id-34 .design-check-grid li,
  body.page-id-35 .support-example-grid li,
  body[class*="page-id-"] #main-content .support-example-grid li,
  body[class*="page-id-"] #main-content .design-check-grid li {
    width: 100%;
    max-width: 100%;
    min-height: 44px;
    margin: 0;
    margin-top: 0;
    padding: 10px 14px;
    box-sizing: border-box;
    font-size: clamp(13px, 3.8vw, 14px);
    text-align: center;
  }

  body:not(.home) #main-content .support-card-grid section,
  body.page-id-36 .support-card-grid section,
  body[class*="page-id-"] #main-content .support-card-grid section {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 18px 16px;
    border: 1px solid #d8d8d8;
    background: #fff;
    margin: 0;
  }

  body:not(.home) #main-content .support-card-grid section h3,
  body.page-id-36 .support-card-grid section h3,
  body[class*="page-id-"] #main-content .support-card-grid section h3 {
    margin-top: 0;
    margin-bottom: 12px;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
  }

  body:not(.home) #main-content .support-card-grid section p,
  body.page-id-36 .support-card-grid section p,
  body[class*="page-id-"] #main-content .support-card-grid section p {
    margin: 0;
    font-size: 14px;
    line-height: 1.7;
    color: #333;
  }
/* Diagram images: Keep intact and responsive across PC and Mobile */
body.page-id-37 .support-flow,
body:not(.home) #main-content .design-page--support-detail .support-flow,
body:not(.home) #main-content .design-page--support-detail-order-expansion .support-flow,
body:not(.home) #main-content .support-detail-content .support-flow,
body:not(.home) #main-content .support-flow {
  display: block;
  width: 100%;
  max-width: 760px;
  height: auto;
  aspect-ratio: 760 / 300;
  padding: 0;
  border: 0;
  margin: 32px auto;
  background: url("../images/additional-pages-20260806/support-order-expansion-diagram.png") center / contain no-repeat;
  overflow: hidden;
  box-sizing: border-box;
}

body.page-id-37 .support-flow > *,
body:not(.home) #main-content .design-page--support-detail .support-flow > *,
body:not(.home) #main-content .design-page--support-detail-order-expansion .support-flow > *,
body:not(.home) #main-content .support-detail-content .support-flow > *,
body:not(.home) #main-content .support-flow > * {
  display: none;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

body.page-id-38 .support-partner-map,
body:not(.home) #main-content .design-page--support-detail .support-partner-map,
body:not(.home) #main-content .design-page--support-detail-automotive .support-partner-map,
body:not(.home) #main-content .support-detail-content .support-partner-map,
body:not(.home) #main-content .support-partner-map {
  display: block;
  width: 100%;
  max-width: 760px;
  height: auto;
  aspect-ratio: 760 / 425;
  padding: 0;
  border: 0;
  margin: 32px auto;
  background: url("../images/additional-pages-20260806/support-automotive-diagram.png") center / contain no-repeat;
  overflow: hidden;
  box-sizing: border-box;
}

body.page-id-38 .support-partner-map > *,
body:not(.home) #main-content .design-page--support-detail .support-partner-map > *,
body:not(.home) #main-content .design-page--support-detail-automotive .support-partner-map > *,
body:not(.home) #main-content .support-detail-content .support-partner-map > *,
body:not(.home) #main-content .support-partner-map > * {
  display: none;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

  body:not(.home) #main-content :is(
    .consultation-detail-box,
    .folder9-rate-box,
    .folder9-contact,
    .support-box
  ) {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 18px 14px;
    margin: 20px 0;
  }

  body:not(.home) #main-content :is(
    .folder9-step-list,
    .folder9-numbered-list,
    .process-step-list
  ) > li {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 10px;
    font-size: clamp(13px, 3.8vw, 14.5px);
    line-height: 1.6;
  }

  /* Training detail: keep one 20px page gutter without nested list padding. */
  body.single-columbus_support.postid-71 #main-content .support-folder9-content > .folder9-event-list,
  body.single-columbus_support.postid-71 #main-content .support-folder9-content > .folder9-event-list > li {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding-right: 0;
    padding-left: 0;
  }

  body:not(.home) #main-content :is(
    .support-contact,
    .folder9-contact,
    .design-contact-box
  ) {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 24px 16px;
    margin-top: 36px;
    text-align: left;
  }

  body:not(.home) #main-content :is(
    .support-contact,
    .folder9-contact,
    .design-contact-box
  ) a[href^="tel:"] {
    font-size: clamp(16px, 4.8vw, 20px);
    font-weight: inherit;
  }

  /* Semiconductor detail: scale the supplied desktop diagram to the phone gutter. */
  body.single-columbus_support.postid-73 #main-content .lsi-architecture-image {
    overflow-x: visible;
  }

  body.single-columbus_support.postid-73 #main-content .lsi-architecture-image img {
    width: 100%;
    max-width: 100%;
    height: auto;
  }
}

/* Membership page layout: 2-column CSS Grid identical to Company/About pages */
body:not(.home) #main-content .design-page--membership .membership-layout,
body:not(.home) #main-content .membership-layout {
  position: static;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  gap: 36px;
  align-items: start;
  width: 100%;
  max-width: 1024px;
  margin: 0 auto;
  padding-top: 0;
  padding-bottom: 0;
  box-sizing: border-box;
}

body:not(.home) #main-content .design-page--membership .membership-layout > .design-long-content,
body:not(.home) #main-content .membership-layout > .design-long-content {
  min-width: 0;
  width: 100%;
}

body:not(.home) #main-content .design-page--membership .design-long-content h2:first-of-type {
  margin-top: 0;
}

body:not(.home) #main-content .design-page--membership .membership-download-card,
body:not(.home) #main-content .membership-download-card {
  width: 100%;
  max-width: 250px;
  margin-top: 0;
  box-sizing: border-box;
}

@media screen and (max-width: 900px) {
  body:not(.home) #main-content .design-page--membership .membership-layout,
  body:not(.home) #main-content .membership-layout {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  body:not(.home) #main-content .design-page--membership .additional-page-sidebar,
  body:not(.home) #main-content .design-page--membership .membership-download-card,
  body:not(.home) #main-content .membership-download-card {
    position: static;
    max-height: none;
    overflow-y: visible;
    width: 100%;
    max-width: 410px;
    margin-top: 0;
    margin-left: auto;
    margin-right: auto;
  }

  body:not(.home) #main-content .design-page--membership .membership-application-inline,
  body:not(.home) #main-content .membership-application-inline {
    margin: 28px auto 0;
    width: 230px;
    max-width: 100%;
    align-items: center;
    box-sizing: border-box;
  }

  body:not(.home) #main-content .design-page--membership .membership-application-inline img,
  body:not(.home) #main-content .membership-application-inline img {
    margin: 0 auto;
    display: block;
  }

  body:not(.home) #main-content .design-page--membership .membership-application-inline .design-download-button,
  body:not(.home) #main-content .membership-application-inline .design-download-button {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
    text-align: center;
  }

}

@media screen and (max-width: 900px) {
  /* Match other responsive pages: Membership content first, section menu last. */
  body.page-id-6 #main-content .membership-layout > .additional-page-sidebar {
    order: 1;
  }

  body.page-id-6 #main-content .membership-benefits-list span {
    padding-left: 0;
  }
}

@media screen and (min-width: 768px) and (max-width: 900px) {
  body:not(.home) #main-content .design-page--membership .membership-layout,
  body:not(.home) #main-content .membership-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Footer navigation links: generous spacing between items on all screen sizes, NO underline/border */
body .site-footer .site-footer__nav,
.site-footer .site-footer__nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 16px 36px;
  column-gap: 36px;
  row-gap: 16px;
  box-sizing: border-box;
}

body .site-footer .site-footer__nav a,
.site-footer .site-footer__nav a {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  box-sizing: border-box;
  border: 0;
  border-bottom: 0;
  text-decoration: none;
  color: #222;
  font-size: 14px;
  line-height: 1.5;
  transition: color 140ms ease;
}

body .site-footer .site-footer__nav a:hover,
body .site-footer .site-footer__nav a:focus-visible,
.site-footer .site-footer__nav a:hover,
.site-footer .site-footer__nav a:focus-visible {
  border: 0;
  border-bottom: 0;
  text-decoration: none;
  color: #b52a23;
}

@media screen and (min-width: 1200px) {
  body .site-footer .site-footer__nav,
  .site-footer .site-footer__nav {
    flex-wrap: nowrap;
    justify-content: space-between;
    gap: 0;
  }

  body .site-footer .site-footer__nav a,
  .site-footer .site-footer__nav a {
    padding-right: 0;
    padding-left: 0;
  }
}

@media screen and (max-width: 767.98px) {
  body .site-footer .site-footer__nav,
  .site-footer .site-footer__nav {
    width: min(calc(100% - 32px), 720px);
    margin: 40px auto 0;
    gap: 12px 24px;
    column-gap: 24px;
    row-gap: 12px;
  }

  body .site-footer .site-footer__nav a,
  .site-footer .site-footer__nav a {
    min-height: 44px;
    padding: 10px 8px;
    border: 0;
    border-bottom: 0;
    text-decoration: none;
    font-size: 13.5px;
  }
}

@media screen and (max-width: 1199.98px) {
  body .site-footer .site-footer__menu-heading,
  body .site-footer .site-footer__menu-items a,
  body .site-footer .site-footer__quick-links a,
  .site-footer .site-footer__menu-heading,
  .site-footer .site-footer__menu-items a,
  .site-footer .site-footer__quick-links a {
    min-height: 44px;
    box-sizing: border-box;
  }
}
/* Footer identity & address: perfectly centered horizontally across all screen sizes */
body .site-footer .site-footer__identity,
.site-footer .site-footer__identity {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: min(calc(100% - 32px), 600px);
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  box-sizing: border-box;
}

body .site-footer .site-footer__brand,
.site-footer .site-footer__brand {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(100%, 390px);
  max-width: 390px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

body .site-footer .site-footer__brand img,
.site-footer .site-footer__brand img {
  display: block;
  width: 100%;
  max-width: 390px;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  object-fit: contain;
}

body .site-footer .site-footer__identity address,
.site-footer .site-footer__identity address {
  display: block;
  width: 100%;
  max-width: 560px;
  margin-top: 24px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  line-height: 1.6;
}

body .site-footer .site-footer__social,
.site-footer .site-footer__social {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 16px;
  margin-left: auto;
  margin-right: auto;
}


/* ==========================================================================
   24. Desktop Site Search Consistency Across All Subpages
   ========================================================================== */
body .site-header .site-search--desktop,
.site-header .site-search--desktop {
  display: flex;
  position: absolute;
  z-index: 20;
  top: calc(100% + 17px);
  right: 31px;
}

@media screen and (max-width: 1199.98px) {
  body .site-header .site-search--desktop,
  .site-header .site-search--desktop {
    display: none;
  }
}

/* ==========================================================================
   25. Subpage Header & Body Content Typography Standardization
   ========================================================================== */
body:not(.home) #main-content .additional-page-header h1 {
  font-weight: 700;
}

body:not(.home) #main-content :is(.content-prose, .design-long-content, .support-folder9-content, .support-detail-content) > p {
  font-size: 15px;
  line-height: 1.8;
  color: #242424;
  margin-bottom: 20px;
}

body:not(.home) #main-content :is(.content-prose, .design-long-content, .support-folder9-content, .support-detail-content) > p:last-child {
  margin-bottom: 0;
}


/* ==========================================================================
   26. Responsive Video & Social Media (SNS) Embeds
   ========================================================================== */
.wp-block-embed,
.embed-container,
body:not(.home) #main-content :is(.content-prose, .design-long-content, .support-folder9-content, .support-detail-content) iframe[src*="youtube.com"],
body:not(.home) #main-content :is(.content-prose, .design-long-content, .support-folder9-content, .support-detail-content) iframe[src*="youtu.be"],
body:not(.home) #main-content :is(.content-prose, .design-long-content, .support-folder9-content, .support-detail-content) iframe[src*="vimeo.com"] {
  position: relative;
  width: 100%;
  max-width: 100%;
  margin: 24px 0;
}

.wp-block-embed-youtube .wp-block-embed__wrapper,
.wp-block-embed-vimeo .wp-block-embed__wrapper,
.wp-has-aspect-ratio .wp-block-embed__wrapper,
.embed-responsive-16by9,
.embed-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}

.wp-block-embed-youtube iframe,
.wp-block-embed-vimeo iframe,
.wp-has-aspect-ratio iframe,
.embed-responsive-16by9 iframe,
.embed-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Twitter / X & Instagram embeds */
.twitter-tweet,
.instagram-media {
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
}

/* ==========================================================================
   27. Magazine Advertising Card (pape.ai source design)
   ========================================================================== */
body:not(.home) #main-content .additional-page--magazine .magazine-advertising,
body.page-id-10 #main-content .additional-page--magazine .magazine-advertising {
  position: static;
  z-index: 2;
  display: grid;
  width: min(calc(100% - 40px), 440px);
  min-height: 248px;
  box-sizing: border-box;
  grid-template-rows: auto 1fr auto;
  gap: 0;
  padding: 0;
  margin: 0 auto 54px;
  overflow: hidden;
  color: #222;
  border: 1px solid #777;
  background: #fff;
  text-decoration: none;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

body:not(.home) #main-content .additional-page--magazine .magazine-advertising:hover,
body:not(.home) #main-content .additional-page--magazine .magazine-advertising:focus-visible {
  filter: none;
  border-color: #373434;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.14);
}

body:not(.home) #main-content .additional-page--magazine .magazine-advertising > span:first-child {
  display: contents;
}

body:not(.home) #main-content .additional-page--magazine .magazine-advertising strong {
  display: block;
  grid-row: 1;
  padding: 17px 20px;
  color: #fff;
  background: #373434;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
}

body:not(.home) #main-content .additional-page--magazine .magazine-advertising small {
  display: block;
  grid-row: 2;
  padding: 12px 14px 4px;
  color: #222;
  font-size: 16px;
  line-height: 1.7;
}

body:not(.home) #main-content .additional-page--magazine .magazine-advertising > span:last-child {
  display: flex;
  grid-row: 3;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 12px 20px 26px;
  border-left: 0;
  border-top: 0;
  color: #222;
  font-size: 16px;
  font-weight: 700;
  white-space: nowrap;
}

body:not(.home) #main-content .additional-page--magazine .magazine-advertising__arrow {
  display: block;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  filter: none;
}

@media screen and (min-width: 1200px) {
  body:not(.home) #main-content .additional-page--magazine .magazine-advertising,
  body.page-id-10 #main-content .additional-page--magazine .magazine-advertising {
    position: absolute;
    top: -36px;
    right: 84px;
    width: 440px;
    margin: 0;
  }
}

@media screen and (max-width: 359.98px) {
  body:not(.home) #main-content .additional-page--magazine .magazine-advertising,
  body.page-id-10 #main-content .additional-page--magazine .magazine-advertising {
    width: calc(100% - 36px);
    min-height: 224px;
    margin-bottom: 36px;
  }

  body:not(.home) #main-content .additional-page--magazine .magazine-advertising strong {
    padding: 14px 16px;
    font-size: 18px;
  }

  body:not(.home) #main-content .additional-page--magazine .magazine-advertising small {
    padding: 10px 14px 2px;
    font-size: 14px;
  }

  body:not(.home) #main-content .additional-page--magazine .magazine-advertising > span:last-child {
    padding: 10px 16px 20px;
    font-size: 15px;
  }
}

@media screen and (max-width: 1199.98px) {
  /* Magazine responsive cards: keep the cover full width and inset the copy. */
  body.page-id-10 #main-content .additional-page--magazine .publication-card > :is(
    .publication-card__label,
    h2,
    .publication-card__contents,
    .publication-card__actions
  ) {
    box-sizing: border-box;
    width: 100%;
    padding-right: 20px;
    padding-left: 20px;
  }
}

/* ==========================================================================
   28. Access Page Phone Number Large Typography Standard
   ========================================================================== */
body:not(.home) #main-content .access-details__phone,
body.page-id-25 #main-content .access-details__phone,
body.additional-page--access #main-content .access-details__phone {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 24px;
  margin-bottom: 12px;
  color: var(--additional-red, #b52a23);
  font-family: "Noto Sans CJK JP", "noto-sans-cjk-jp", "Noto Sans JP", sans-serif;
  font-size: 34px;
  font-weight: 700;
  letter-spacing: .03em;
  line-height: 1.2;
}

body:not(.home) #main-content .access-details__phone a,
body.page-id-25 #main-content .access-details__phone a,
body.additional-page--access #main-content .access-details__phone a {
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  text-decoration: none;
}

body:not(.home) #main-content .access-details__phone-icon,
body.page-id-25 #main-content .access-details__phone-icon,
body.additional-page--access #main-content .access-details__phone-icon {
  display: block;
  width: 29px;
  height: 30px;
  flex: 0 0 29px;
  background: currentColor;
  -webkit-mask: url("../images/contact-phone-icon.svg") center / contain no-repeat;
  mask: url("../images/contact-phone-icon.svg") center / contain no-repeat;
}

@media screen and (max-width: 620px) {
  body.page-id-25 #main-content article.additional-page.additional-page--access .access-details__phone {
    font-size: clamp(21px, 6.5vw, 24px);
    gap: 8px;
  }

  body.page-id-25 #main-content article.additional-page.additional-page--access .access-details__phone a {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
  }

  body.page-id-25 #main-content article.additional-page.additional-page--access .access-details__phone-icon {
    width: 24px;
    height: 25px;
    flex-basis: 24px;
  }
}

/* ==========================================================================
   29. Access Route Cards Spacing Standard
   ========================================================================== */
body:not(.home) #main-content .access-route-grid,
body.page-id-25 #main-content .access-route-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 36px;
}

body:not(.home) #main-content .access-route-card,
body.page-id-25 #main-content .access-route-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin: 0;
}

body:not(.home) #main-content .access-route-card img,
body.page-id-25 #main-content .access-route-card img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

body:not(.home) #main-content .access-route-card figcaption,
body.page-id-25 #main-content .access-route-card figcaption {
  padding: 10px 4px 0;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.45;
  text-align: center;
  color: #222;
}

@media screen and (max-width: 767.98px) {
  body:not(.home) #main-content .access-route-grid,
  body.page-id-25 #main-content .access-route-grid {
    grid-template-columns: 1fr;
    gap: 28px;
    margin-top: 24px;
  }

  body:not(.home) #main-content .access-route-card,
  body.page-id-25 #main-content .access-route-card {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
  }
}

/* ========================================================================== 
   30. Pamphlet & Brochure Card Standard (Transparent background & Responsive Typography)
   ========================================================================== */
body.page-id-26 #main-content .brochure-card > a.design-download-button,
body.page-id-26 #main-content .brochure-card > a.design-download-button:visited,
body.page-id-26 #main-content .brochure-card > a.design-download-button:hover,
body.page-id-26 #main-content .brochure-card > a.design-download-button:focus-visible,
body.page-id-26 #main-content .brochure-card > a.design-download-button:active {
  color: #fff;
}

body:not(.home) #main-content .brochure-card__cover,
body.page-id-26 #main-content .brochure-card__cover,
body.design-page--brochure #main-content .brochure-card__cover,
body.design-page--pamphlet #main-content .brochure-card__cover {
  background: transparent;
  padding: 0;
  height: 380px;
  align-items: center;
  justify-content: center;
}

body:not(.home) #main-content .brochure-card__cover img,
body.page-id-26 #main-content .brochure-card__cover img,
body.design-page--brochure #main-content .brochure-card__cover img,
body.design-page--pamphlet #main-content .brochure-card__cover img {
  width: auto;
  max-width: 100%;
  height: 100%;
  object-fit: contain;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
  border: 1px solid rgba(0, 0, 0, 0.06);
}

body:not(.home) #main-content .brochure-card h2,
body.page-id-26 #main-content .brochure-card h2,
body.page-id-26 #main-content article.brochure-card > h2,
body.design-page--brochure #main-content .brochure-card h2,
body.design-page--pamphlet #main-content .brochure-card h2 {
  font-size: 16.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.5;
  color: #222;
  margin: 18px 0 14px;
  text-align: center;
  word-break: normal;
  overflow-wrap: break-word;
}

@media screen and (max-width: 767.98px) {
  body:not(.home) #main-content .brochure-grid,
  body.page-id-26 #main-content .brochure-grid,
  body.design-page--brochure #main-content .brochure-grid,
  body.design-page--pamphlet #main-content .brochure-grid {
    grid-template-columns: 1fr;
    gap: 64px;
    width: 100%;
    max-width: 340px;
    margin: 0 auto;
  }

  body:not(.home) #main-content .brochure-card,
  body.page-id-26 #main-content .brochure-card,
  body.design-page--brochure #main-content .brochure-card,
  body.design-page--pamphlet #main-content .brochure-card {
    width: 100%;
    max-width: 320px;
    margin: 0 auto;
    align-items: center;
  }

  body:not(.home) #main-content .brochure-card__cover,
  body.page-id-26 #main-content .brochure-card__cover,
  body.design-page--brochure #main-content .brochure-card__cover,
  body.design-page--pamphlet #main-content .brochure-card__cover {
    background: transparent;
    padding: 0;
    height: auto;
    min-height: 0;
    width: 100%;
    display: flex;
    justify-content: center;
  }

  body:not(.home) #main-content .brochure-card__cover img,
  body.page-id-26 #main-content .brochure-card__cover img,
  body.design-page--brochure #main-content .brochure-card__cover img,
  body.design-page--pamphlet #main-content .brochure-card__cover img {
    width: 100%;
    max-width: 320px;
    height: auto;
    max-height: none;
    object-fit: contain;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
    border: 1px solid rgba(0, 0, 0, 0.06);
  }

  body:not(.home) #main-content .brochure-card h2,
  body.page-id-26 #main-content .brochure-card h2,
  body.page-id-26 #main-content article.brochure-card > h2,
  body.design-page--brochure #main-content .brochure-card h2,
  body.design-page--pamphlet #main-content .brochure-card h2 {
    font-size: clamp(14px, 4.2vw, 16px);
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1.5;
    margin: 16px auto 14px;
    max-width: 280px;
    word-break: normal;
    overflow-wrap: break-word;
  }

  body:not(.home) #main-content .brochure-card .design-download-button,
  body.page-id-26 #main-content .brochure-card .design-download-button,
  body.design-page--brochure #main-content .brochure-card .design-download-button,
  body.design-page--pamphlet #main-content .brochure-card .design-download-button {
    width: 100%;
    max-width: 250px;
    margin: 0 auto;
  }
}

/* ==========================================================================
   31. Sitemap Page Vertical Rhythm & Balanced Spacing Standard
   ========================================================================== */
body:not(.home) #main-content .design-page--sitemap .sitemap-design-section li {
  margin-bottom: 8px;
  line-height: 1.6;
}

body:not(.home) #main-content .design-page--sitemap .sitemap-design-section li:last-child {
  margin-bottom: 0;
}

@media screen and (max-width: 767.98px) {
  body:not(.home) #main-content .design-page--sitemap .sitemap-design-grid {
    display: flex;
    flex-direction: column;
    gap: 28px;
    padding-top: 10px;
    padding-bottom: 60px;
  }

  body:not(.home) #main-content .design-page--sitemap .sitemap-design-section {
    margin: 0;
    padding: 0;
  }

  body:not(.home) #main-content .design-page--sitemap .sitemap-design-section h2:not(.screen-reader-text) {
    margin: 0 0 14px;
    min-height: 38px;
    padding: 7px 14px;
    font-size: 17px;
  }

  body:not(.home) #main-content .design-page--sitemap .sitemap-design-section ul {
    margin: 10px 0 0;
    padding: 0;
    columns: 1;
  }

  body:not(.home) #main-content .design-page--sitemap .sitemap-design-section--main {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin: 0;
    padding: 0;
    border: 0;
  }

  body:not(.home) #main-content .design-page--sitemap .sitemap-main-group {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 0;
    margin: 0;
    border: 0;
  }

  body:not(.home) #main-content .design-page--sitemap .sitemap-main-group ul {
    margin: 0;
    padding: 0;
  }
}

/* ==========================================================================
   32. Membership Page Hero Spacing & Header Title Responsive Standard
   ========================================================================== */
body:not(.home) #main-content .design-page--membership .design-page__body,
body.page-id-6 #main-content .design-page--membership .design-page__body {
  padding-top: 48px;
}

body:not(.home) #main-content .design-page--membership .design-hero,
body:not(.home) #main-content .design-page--membership .design-hero--wide,
body.page-id-6 #main-content .design-hero {
  margin-top: 0;
  margin-bottom: 40px;
}

@media screen and (max-width: 767.98px) {
  body:not(.home) #main-content .design-page--membership .design-page__body,
  body.page-id-6 #main-content .design-page--membership .design-page__body {
    padding-top: 36px;
  }

  body:not(.home) #main-content .design-page--membership .design-hero,
  body:not(.home) #main-content .design-page--membership .design-hero--wide,
  body.page-id-6 #main-content .design-hero {
    margin-top: 0;
    margin-bottom: 28px;
    height: auto;
    max-height: 260px;
  }

  body:not(.home) #main-content .design-page--membership .design-hero img,
  body.page-id-6 #main-content .design-hero img {
    height: auto;
    max-height: 260px;
    object-fit: cover;
  }

  body:not(.home) #main-content .design-page--membership .additional-page-header h1,
  body.page-id-6 #main-content .additional-page-header h1 {
    font-size: clamp(15px, 4.3vw, 19px);
    letter-spacing: 0.02em;
    line-height: 1.35;
    word-break: normal;
    overflow-wrap: break-word;
  }
}

/* ==========================================================================
   33. Consulting Sidebar Navigation Standard (Identical to Server Design)
   ========================================================================== */
body:not(.home) #main-content .additional-page-sidebar,
body:not(.home) #main-content .design-page--support-sidebar .additional-page-sidebar,
body:not(.home) #main-content .design-page--consultation-detail .additional-page-sidebar,
body:not(.home) #main-content .design-page--with-sidebar .additional-page-sidebar,
body:not(.home) #main-content .design-page--folder9-detail .additional-page-sidebar,
body:not(.home) #main-content .design-page--folder9-group .additional-page-sidebar {
  width: 100%;
  max-width: 250px;
  min-width: 0;
  box-sizing: border-box;
}

/* Sidebar Top Header (支援一覧 / インフォメーション) */
body:not(.home) #main-content :is(.design-side-nav__title, .about-section-nav__title),
body:not(.home) #main-content .design-page--support-sidebar .design-side-nav__title,
body:not(.home) #main-content .design-page--consultation-detail .design-side-nav__title,
body:not(.home) #main-content .design-page--with-sidebar .design-side-nav__title,
body:not(.home) #main-content .design-page--folder9-detail .design-side-nav__title,
body:not(.home) #main-content .design-page--folder9-group .design-side-nav__title {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: 52px;
  height: 52px;
  box-sizing: border-box;
  padding: 0 16px;
  margin-top: 0;
  margin-bottom: 0;
  border: 0;
  background: #b52a23;
  color: #fff;
  font-family: noto-sans-cjk-jp, "Noto Sans CJK JP", "Noto Sans JP", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 1.7px;
  line-height: 1.4;
}

/* Sidebar Navigation Box */
body:not(.home) #main-content .design-side-nav,
body:not(.home) #main-content .design-page--support-sidebar .design-side-nav,
body:not(.home) #main-content .design-page--consultation-detail .design-side-nav,
body:not(.home) #main-content .design-page--with-sidebar .design-side-nav,
body:not(.home) #main-content .design-page--folder9-detail .design-side-nav,
body:not(.home) #main-content .design-page--folder9-group .design-side-nav {
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: 10px;
  background: #f4f4f4;
}

body:not(.home) #main-content .design-side-nav > ul,
body:not(.home) #main-content .design-side-nav ul {
  display: block;
  grid-template-columns: none;
  gap: 0;
  width: 100%;
  max-width: 100%;
  padding: 0;
  margin: 0;
  list-style: none;
  box-sizing: border-box;
  border: 0;
  background: transparent;
}

body:not(.home) #main-content .design-side-nav > ul > li {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 0;
  padding: 0;
}

body:not(.home) #main-content .design-side-nav > ul > li:first-child {
  margin-top: 0;
}

/* Sidebar Category Group Link */
body:not(.home) #main-content .design-side-nav__group-link,
body:not(.home) #main-content .design-page--support-sidebar .design-side-nav__group-link,
body:not(.home) #main-content .design-page--consultation-detail .design-side-nav__group-link,
body:not(.home) #main-content .design-page--with-sidebar .design-side-nav__group-link,
body:not(.home) #main-content .design-page--folder9-detail .design-side-nav__group-link,
body:not(.home) #main-content .design-page--folder9-group .design-side-nav__group-link {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 52px;
  height: auto;
  padding: 0 14px;
  background: #3f3b3a;
  color: #fff;
  text-decoration: none;
  box-sizing: border-box;
  white-space: normal;
  word-break: break-all;
  overflow-wrap: anywhere;
}

body:not(.home) #main-content .design-side-nav__label,
body:not(.home) #main-content .design-page--support-sidebar .design-side-nav__label,
body:not(.home) #main-content .design-page--consultation-detail .design-side-nav__label,
body:not(.home) #main-content .design-page--with-sidebar .design-side-nav__label,
body:not(.home) #main-content .design-page--folder9-detail .design-side-nav__label,
body:not(.home) #main-content .design-page--folder9-group .design-side-nav__label,
body:not(.home) #main-content .design-side-nav .design-side-nav__group-link > span,
body:not(.home) #main-content .design-page--support-sidebar .design-side-nav .design-side-nav__group-link > span {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 52px;
  height: auto;
  color: #fff;
  font-family: noto-sans-cjk-jp, "Noto Sans CJK JP", "Noto Sans JP", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.05em;
  box-sizing: border-box;
}

/* Keep the research category on one line without duplicating the link padding. */
body:not(.home) #main-content .design-side-nav .design-side-nav__group-link[href*="/consulting/research"] > span.design-side-nav__label {
  padding-inline: 0;
  white-space: nowrap;
}

/* Sidebar Toggle Accordion Button */
body:not(.home) #main-content .design-side-nav__toggle,
body:not(.home) #main-content .design-page--support-sidebar .design-side-nav__toggle,
body:not(.home) #main-content .design-page--consultation-detail .design-side-nav__toggle,
body:not(.home) #main-content .design-page--with-sidebar .design-side-nav__toggle,
body:not(.home) #main-content .design-page--folder9-detail .design-side-nav__toggle,
body:not(.home) #main-content .design-page--folder9-group .design-side-nav__toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 28px;
  padding: 0;
  background: #fff;
  border: 0;
  cursor: pointer;
  box-sizing: border-box;
}

body:not(.home) #main-content .design-side-nav__indicator {
  position: relative;
  display: block;
  width: 13px;
  height: 13px;
}

body:not(.home) #main-content .design-side-nav__indicator::before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  border-right: 2px solid #111;
  border-bottom: 2px solid #111;
  content: "";
  transform: translate(-50%, -70%) rotate(45deg);
  transition: transform 150ms ease;
}

body:not(.home) #main-content .design-side-nav .design-side-nav__group.is-open .design-side-nav__indicator::before,
body:not(.home) #main-content .design-side-nav .design-side-nav__toggle[aria-expanded="true"] .design-side-nav__indicator::before {
  transform: translate(-50%, -30%) rotate(225deg);
}

/* Sidebar Children Submenu */
body:not(.home) #main-content .design-side-nav ul.design-side-nav__children,
body:not(.home) #main-content .design-side-nav [id^="design-side-nav-children-"],
body:not(.home) #main-content .design-page--support-sidebar .design-side-nav ul.design-side-nav__children,
body:not(.home) #main-content .design-page--consultation-detail .design-side-nav ul.design-side-nav__children,
body:not(.home) #main-content .design-page--with-sidebar .design-side-nav ul.design-side-nav__children,
body:not(.home) #main-content .design-page--folder9-detail .design-side-nav ul.design-side-nav__children,
body:not(.home) #main-content .design-page--folder9-group .design-side-nav ul.design-side-nav__children {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  padding: 4px 12px 8px 16px;
  background: #fff;
  overflow: hidden;
  border: 0;
  margin: 0;
}

body:not(.home) #main-content .design-side-nav ul.design-side-nav__children[hidden],
body:not(.home) #main-content .design-side-nav .design-side-nav__group:not(.is-open) > ul.design-side-nav__children,
body:not(.home) #main-content .design-side-nav .design-side-nav__group:not(.is-open) > .design-side-nav__children,
body:not(.home) #main-content .design-side-nav [id^="design-side-nav-children-"][hidden],
body:not(.home) #main-content .design-page--folder9-detail .design-side-nav .design-side-nav__group:not(.is-open) > ul.design-side-nav__children,
body:not(.home) #main-content .design-page--folder9-group .design-side-nav .design-side-nav__group:not(.is-open) > ul.design-side-nav__children {
  display: none;
}

body:not(.home) #main-content .design-side-nav__children li,
body:not(.home) #main-content .design-side-nav [id^="design-side-nav-children-"] > li {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
}

body:not(.home) #main-content .design-side-nav__children a,
body:not(.home) #main-content .design-side-nav [id^="design-side-nav-children-"] > li > a,
body:not(.home) #main-content .design-page--support-sidebar .design-side-nav__children a,
body:not(.home) #main-content .design-page--consultation-detail .design-side-nav__children a,
body:not(.home) #main-content .design-page--with-sidebar .design-side-nav__children a,
body:not(.home) #main-content .design-page--folder9-detail .design-side-nav__children a,
body:not(.home) #main-content .design-page--folder9-group .design-side-nav__children a {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-height: 42px;
  height: auto;
  padding: 10px 4px 10px 14px;
  border-bottom: 1px solid #ddd;
  color: #242424;
  font-family: noto-sans-cjk-jp, "Noto Sans CJK JP", "Noto Sans JP", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  text-decoration: none;
  white-space: normal;
  word-break: break-all;
  overflow-wrap: anywhere;
}

body:not(.home) #main-content .design-side-nav__children a span,
body:not(.home) #main-content .design-side-nav [id^="design-side-nav-children-"] > li > a > span,
body:not(.home) #main-content .design-page--support-sidebar .design-side-nav__children a span,
body:not(.home) #main-content .design-page--consultation-detail .design-side-nav__children a span,
body:not(.home) #main-content .design-page--with-sidebar .design-side-nav__children a span,
body:not(.home) #main-content .design-page--folder9-detail .design-side-nav__children a span,
body:not(.home) #main-content .design-page--folder9-group .design-side-nav__children a span {
  display: block;
  width: 100%;
  min-width: 0;
  white-space: normal;
  word-break: break-all;
  overflow-wrap: anywhere;
  line-height: 1.5;
  font-family: noto-sans-cjk-jp, "Noto Sans CJK JP", "Noto Sans JP", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: #242424;
}

body:not(.home) #main-content .design-side-nav__children a::before,
body:not(.home) #main-content .design-side-nav [id^="design-side-nav-children-"] > li > a::before {
  position: absolute;
  top: 16px;
  left: 2px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #b52a23;
  content: "";
}

body:not(.home) #main-content .design-side-nav__children li:last-child a,
body:not(.home) #main-content .design-side-nav [id^="design-side-nav-children-"] > li:last-child > a {
  border-bottom: 0;
}

body:not(.home) #main-content .design-side-nav__children a.is-current-page,
body:not(.home) #main-content .design-side-nav__children a[aria-current="page"],
body:not(.home) #main-content .design-side-nav__children a.is-current-page span,
body:not(.home) #main-content .design-side-nav__children a[aria-current="page"] span,
body:not(.home) #main-content .design-side-nav [id^="design-side-nav-children-"] > li > a.is-current-page,
body:not(.home) #main-content .design-side-nav [id^="design-side-nav-children-"] > li > a.is-current-page > span {
  font-weight: 700;
  color: #242424;
}

@media screen and (max-width: 1199.98px) {
  body:not(.home) #main-content .design-side-nav__toggle,
  body:not(.home) #main-content .design-page--support-sidebar .design-side-nav__toggle,
  body:not(.home) #main-content .design-page--consultation-detail .design-side-nav__toggle,
  body:not(.home) #main-content .design-page--with-sidebar .design-side-nav__toggle,
  body:not(.home) #main-content .design-page--folder9-detail .design-side-nav__toggle,
  body:not(.home) #main-content .design-page--folder9-group .design-side-nav__toggle {
    height: 44px;
  }

  body:not(.home) #main-content .design-side-nav__children a,
  body:not(.home) #main-content .design-side-nav [id^="design-side-nav-children-"] > li > a {
    min-height: 44px;
  }
}

/* Responsive content gutters: one 20px inset, without nested padding. */
@media screen and (max-width: 1199.98px) {
  body#page:not(.home) #main-content .additional-page-shell {
    width: 100%;
    max-width: none;
    margin-right: 0;
    margin-left: 0;
    padding-right: 20px;
    padding-left: 20px;
  }

  body#page:not(.home) #main-content .additional-page-shell .additional-page-shell {
    padding-right: 0;
    padding-left: 0;
  }

  /* Order expansion: use the approved desktop diagram at every responsive width. */
  body#page.page-id-37 #main-content .support-flow {
    display: block;
    width: 100%;
    max-width: 760px;
    height: auto;
    aspect-ratio: 760 / 300;
    padding: 0;
    border: 0;
    margin: 32px auto;
    background: url("../images/additional-pages-20260806/support-order-expansion-diagram.png") center / contain no-repeat;
    overflow: hidden;
    box-sizing: border-box;
  }

  body#page.page-id-37 #main-content .support-flow > * {
    display: none;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    height: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
  }

  /* Automotive: use the approved desktop diagram at every responsive width. */
  body#page.page-id-38 #main-content .support-partner-map {
    display: block;
    width: 100%;
    max-width: 760px;
    height: auto;
    aspect-ratio: 760 / 425;
    padding: 0;
    border: 0;
    margin: 32px auto;
    background: url("../images/additional-pages-20260806/support-automotive-diagram.png") center / contain no-repeat;
    overflow: hidden;
    box-sizing: border-box;
  }

  body#page.page-id-38 #main-content .support-partner-map > * {
    display: none;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    height: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
  }

  /* Stacked support sidebars should share the same 20px page gutter. */
  body#page:not(.home) #main-content .design-page--support-sidebar .design-side-nav__title {
    width: 100%;
    max-width: none;
    margin-right: 0;
    margin-left: 0;
  }

  /* Publication wrappers were each adding another 20px on both sides. */
  body#page #main-content .additional-page--magazine :is(
    .magazine-publications,
    .magazine-publications__inner,
    .publication-grid,
    .publication-card
  ) {
    padding-right: 0;
    padding-left: 0;
  }

  body#page #main-content .design-page--consultation-detail .consultation-detail-box {
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin: 20px 0;
    top: auto;
  }

  body#page #main-content .consultation-detail-box > :first-child {
    margin-top: 0;
  }

  body#page #main-content .consultation-detail-box > :last-child {
    margin-bottom: 0;
  }

  /* Unframed contact sections share the same text edge as the main copy. */
  body#page #main-content :is(.support-contact, .design-contact-box, .folder9-contact) {
    padding: 0;
    margin-top: 32px;
  }

  body#page #main-content .design-long-content > p[data-responsive-spacer="true"] {
    display: none;
  }

  body#page.home #main-content :is(
    .support-services,
    .feature-banners,
    .home-news,
    .home-voices,
    .home-faq,
    .home-contact,
    .home-social,
    .home-partners
  ) {
    padding-right: 20px;
    padding-left: 20px;
  }

  body#page.home #main-content :is(
    .support-services__inner,
    .feature-banners__inner,
    .home-news__inner,
    .home-voices__inner,
    .home-faq__inner,
    .home-contact__inner,
    .home-social__inner,
    .home-partners__inner
  ) {
    width: 100%;
    max-width: none;
    margin-right: 0;
    margin-left: 0;
    padding-right: 0;
    padding-left: 0;
  }

  body#page .site-footer {
    padding-right: 20px;
    padding-left: 20px;
  }

  body#page .site-footer > :is(.site-footer__menu, .site-footer__identity, .site-footer__nav) {
    width: 100%;
    max-width: none;
    margin-right: 0;
    margin-left: 0;
  }
}

@media screen and (max-width: 900px) {
  body#page #main-content :is(.additional-page-sidebar, .design-side-nav, .about-section-nav) {
    max-width: 100%;
  }

  /* Banner advertising has one cover, so it should not retain the old two-column image width. */
  body#page.page-id-18 #main-content .advertising-covers {
    width: min(100%, 220px);
  }

  body#page.page-id-18 #main-content .advertising-covers img {
    width: 100%;
    height: auto;
    max-height: none;
    object-fit: contain;
  }
}

@media screen and (min-width: 621px) and (max-width: 900px) {
  body#page:not(.home) #main-content .design-page--support-sidebar .additional-page-sidebar,
  body#page:not(.home) #main-content .design-page--support-sidebar .design-side-nav {
    max-width: 560px;
    margin-right: auto;
    margin-left: auto;
  }
}

/* 2026-09-02 client-requested functional refinements (new navigation design deferred). */
.home #main-content .home-hero__link {
  display: block;
  width: 100%;
  height: 100%;
  color: inherit;
  text-decoration: none;
}

.home #main-content .home-hero__link:focus-visible {
  outline: 3px solid #b52a23;
  outline-offset: -3px;
}

.home #main-content .home-news__tabs {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

body:not(.home) #main-content .design-side-nav__children a::before,
body:not(.home) #main-content .design-side-nav [id^="design-side-nav-children-"] > li > a::before {
  top: calc(10px + .75em);
  transform: translateY(-50%);
}

body.page-id-26 #main-content .brochure-card__pdf-link {
  display: block;
  width: 100%;
  height: 100%;
}

body.page-id-26 #main-content button.brochure-card__pdf-link,
body.page-id-26 #main-content ._df_button.brochure-card__pdf-link {
  padding: 0;
  margin: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
}

body.page-id-26 #main-content .brochure-card__pdf-link img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

body.page-id-26 #main-content .brochure-card__pdf-link:focus-visible {
  outline: 3px solid #b52a23;
  outline-offset: 3px;
}

body.page-id-10 #main-content .publication-cover-flipbook,
body.page-id-10 #main-content ._df_button.publication-cover-flipbook {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
}

body.page-id-10 #main-content .publication-cover-flipbook img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.page-id-10 #main-content .publication-cover-flipbook:hover img,
body.page-id-10 #main-content .publication-cover-flipbook:focus-visible img {
  filter: brightness(1.04);
}

body.page-id-10 #main-content .publication-cover-flipbook:focus-visible {
  outline: 3px solid #b52a23;
  outline-offset: 3px;
}

body.page-id-25 #main-content .access-details__department-contacts {
  margin: 20px 0;
  font-size: 15px;
  line-height: 1.9;
}

/* Sticky Sidebar for all subpages with sidebar on desktop and tablet landscape */
@media screen and (min-width: 901px) {
  body:not(.home) #main-content {
    overflow: visible;
  }

  body:not(.home) #main-content .additional-page-sidebar {
    position: sticky;
    top: var(--columbus-anchor-scroll-offset);
    align-self: flex-start;
    max-height: calc(100vh - var(--columbus-anchor-scroll-offset) - 10px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: none;
    -ms-overflow-style: none;
    z-index: 20;
    box-sizing: border-box;
    padding-bottom: 30px;
  }

  @media screen and (min-height: 600px) {
    body:not(.home) #main-content .additional-page-sidebar {
      max-height: none;
      overflow-y: visible;
      padding-bottom: 0;
    }
  }

  body:not(.home) #main-content .additional-page-sidebar::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
  }
}

@media screen and (max-width: 900px) {
  body:not(.home) #main-content .additional-page-sidebar {
    position: static;
    max-height: none;
    overflow-y: visible;
  }
}

@media screen and (min-width: 1200px) {
  body.page-id-10 #main-content .additional-page--magazine .publication-card__actions {
    position: absolute;
    top: 259px;
    left: 20px;
    display: grid;
    width: 155px;
    grid-template-rows: none;
    grid-row: auto;
    grid-column: auto;
    gap: 10px;
    align-self: auto;
    margin: 0;
  }

  body.page-id-10 #main-content .additional-page--magazine .publication-card__actions .publication-download,
  body.page-id-10 #main-content .additional-page--magazine .publication-card__actions .publication-flipbook-trigger {
    position: static;
    top: auto;
    left: auto;
    width: 155px;
    min-height: 44px;
    margin: 0;
  }
}

@media screen and (max-width: 620px) {
  .home #main-content .home-news__tab {
    font-size: 12px;
  }

  body.page-id-25 #main-content .access-details__department-contacts {
    font-size: 14px;
    line-height: 1.75;
  }
}

/* Public telephone and email contacts stay actionable without underlines. */
body#page #main-content a[href^="tel:"],
body#page #main-content a[href^="mailto:"] {
  text-decoration: none !important;
}

/* Automatic TEL links preserve the typography and color of their source text. */
body#page #main-content a.contact-telephone {
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
}

/* Shared inquiry section: Exhibitions is the reference at every viewport. */
body#page #main-content .columbus-contact {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 0;
  margin: 72px 0 0;
  background: transparent;
  color: #242424;
  font-family: inherit;
  font-size: 16px;
  line-height: 1.7;
  text-align: left;
}
body#page #main-content .columbus-contact > h2 {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  width: 100%;
  min-height: var(--columbus-section-heading-min-height);
  margin: 54px 0 24px;
  padding: var(--columbus-section-heading-padding);
  border: 0;
  border-left: 5px solid var(--columbus-section-heading-border);
  background: var(--columbus-section-heading-background);
  color: var(--columbus-section-heading-color);
  font-family: inherit;
  font-size: var(--columbus-section-heading-font-size);
  font-weight: 700;
  letter-spacing: .05em;
  line-height: 1.4;
  text-align: left;
}
body#page #main-content .columbus-contact > p,
body#page #main-content .columbus-contact > p + p {
  margin: 0;
  padding: 0;
  color: inherit;
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: .035em;
  line-height: 1.7;
}
body#page #main-content .columbus-contact > p a {
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-decoration: none;
}
@media (max-width: 1199.98px) {
  body#page #main-content .columbus-contact { margin-top: 32px; }
}
@media (max-width: 767.98px) {
  body#page #main-content .columbus-contact > h2 {
    min-height: 0;
    margin: 24px 0 14px;
    padding: 7px 10px;
    font-size: clamp(15px, 4vw, 18px);
    letter-spacing: .02em;
    line-height: 1.45;
  }
  body#page #main-content .columbus-contact > p,
  body#page #main-content .columbus-contact > p + p {
    font-size: clamp(14px, 3.8vw, 16px);
    line-height: 1.75;
  }
}

/* Client request: clearer heading/body hierarchy in smartphone news articles. */
@media screen and (max-width: 620px) {
  body.single-post #main-content .subpage-generic--single .subpage-generic__content h2 {
    font-size: 18px;
  }

  body.single-post #main-content .subpage-generic--single .subpage-generic__content p.has-medium-font-size {
    --wp--preset--font-size--medium: 16px;
  }
}