@view-transition {
  navigation: auto;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-ultralight.woff2") format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-ultralightItalic.woff2") format("woff2");
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-thin.woff2") format("woff2");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-thinitalic.woff2") format("woff2");
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-lightitalic.woff2") format("woff2");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-regularitalic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-mediumitalic.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-semibold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-semibolditalic.woff2") format("woff2");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-bolditalic.woff2") format("woff2");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-heavy.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-heavyitalic.woff2") format("woff2");
  font-weight: 800;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-black.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../assets/fonts/sf-pro-display-blackitalic.woff2") format("woff2");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

:root {
  --red: #ed1c24;
  --navy: #272361;
  --ink: #3d3d3d;
  --muted: #7d7d7d;
  --gray-100: #f3f3f3;
  --gray-300: #c7c7c7;
  --copyright: #565656;
  --white: #ffffff;

  --circle-1-bg: #fdf2f3;
  --circle-2-bg: #fed8dc;
  --circle-3-bg: #ed1c24;

  --grad-section: linear-gradient(180deg, #f0f0f0 0%, #f6f6f6 240px, #ffffff 100%);
  --grad-card: linear-gradient(180deg, #e6e6e6 0%, rgba(255, 255, 255, 0) 100%);
  --grad-chairman: linear-gradient(180deg, #db3931 0%, #7d2220 100%);

  --content-w: 1170px;
  --side: calc((100% - var(--content-w)) / 2);

  --font:
    "SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Arial,
    sans-serif;

  --lsb: 0em;
}

body[data-chapter="3"],
body[data-chapter="4"],
body[data-chapter="5"],
body[data-chapter="6"] {
  --lsb: 0.025em;
}

body[data-chapter="3"]
  :is(
    .description_label,
    .quote__name,
    .mcard__block-label,
    .mcard__row-label,
    .ccc-stat__label,
    .ccc-h,
    .ccc-chart__cap,
    .ccc-chart__cap-red,
    .cibg-col__h,
    .cibg-box__sub,
    .chalcard__title,
    .rbg-subhead,
    .rbg-solutions__title
  ),
body[data-chapter="4"]
  :is(
    .description_label,
    .quote__name,
    .mcard__block-label,
    .mcard__row-label,
    .ccc-stat__label,
    .ccc-h,
    .ccc-chart__cap,
    .ccc-chart__cap-red,
    .cibg-col__h,
    .cibg-box__sub,
    .chalcard__title,
    .rbg-subhead,
    .rbg-solutions__title
  ),
body[data-chapter="5"]
  :is(
    .description_label,
    .quote__name,
    .mcard__block-label,
    .mcard__row-label,
    .ccc-stat__label,
    .ccc-h,
    .ccc-chart__cap,
    .ccc-chart__cap-red,
    .cibg-col__h,
    .cibg-box__sub,
    .chalcard__title,
    .rbg-subhead,
    .rbg-solutions__title
  ),
body[data-chapter="6"]
  :is(
    .description_label,
    .quote__name,
    .mcard__block-label,
    .mcard__row-label,
    .ccc-stat__label,
    .ccc-h,
    .ccc-chart__cap,
    .ccc-chart__cap-red,
    .cibg-col__h,
    .cibg-box__sub,
    .chalcard__title,
    .rbg-subhead,
    .rbg-solutions__title
  ) {
  --lsb: 0.025em;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font);
  color: var(--ink);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img {
  display: block;
  max-width: 100%;
}
a {
  text-decoration: none;
  color: inherit;
}
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
p {
  margin: 0;
}
h1,
h2,
h3 {
  margin: 0;
  font-weight: 600;
}

.js .reveal {
  opacity: 0;
  transform: translateY(72px);
  transition:
    opacity 1.1s ease,
    transform 1.3s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
.js .reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.js .reveal-zoom {
  opacity: 0;
  transform: scale(var(--zoom, 1.2));
  transform-origin: center;
  transition:
    opacity 1.2s ease,
    transform 1.5s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
.js .reveal-zoom.is-visible {
  opacity: 1;
  transform: scale(1);
}
.js .quote__photo.reveal-zoom {
  --zoom: 1.26;
  transform-origin: bottom center;
}

.layout {
  width: 100%;
  min-width: var(--content-w);
  overflow: hidden;
  background: var(--white);
}

.container {
  width: var(--content-w);
  margin-inline: auto;
}

.section {
  width: 100%;
  padding-bottom: 72px;
}
.section--grad {
  background: var(--grad-section);
}
.section--pad {
  padding: 72px 0;
}

.title {
  font-size: 36px;
  line-height: 42px;
  letter-spacing: calc(-0.02em + var(--lsb));
  font-weight: 500;
  color: var(--navy);
}

.text-body,
.paragraph,
.story1__intro, .s3__bullet p,
.tab-desc, .s6__intro, .s6__col p,
.s7__p, .s7sec__p {
  font-size: 16px;
  line-height: 24px;
  letter-spacing: calc(-0.01em + var(--lsb));
  color: var(--ink);
  text-align: justify;
}

.two-col {
  display: flex;
  gap: 30px;
}
.two-col__aside {
  width: 370px;
  flex: none;
}
.two-col__main {
  width: 770px;
  flex: none;
}