@charset "UTF-8";
/* form */
.introDuction {
  display: flex;
  flex-direction: column;
  row-gap: 3.5rem;
  margin-bottom: 5rem;
}
.introDuction__title {
  display: flex;
  flex-direction: column;
  row-gap: 0.725rem;
  text-align: center;
  font-size: 2rem;
  line-height: 2.725rem;
  font-weight: 700;
  color: #004C97;
}
.introDuction__title span {
  display: block;
  line-height: 2rem;
}
.introDuction__title {
  /*  span:has(strong) {
       font-size: 2rem;
   } */
}
.introDuction > p {
  font-size: 1.5rem;
  line-height: 2rem;
}

.pageItem {
  margin: 0 auto 5rem;
  line-height: 1.3;
}
.pageItem:last-of-type {
  margin-bottom: 0;
}
.pageItem__inner {
  width: 1000px;
  margin: 0 auto 3.5rem;
}
.pageItem__inner:last-of-type {
  margin-bottom: 0;
}

.animationPointJs {
  visibility: visible;
  opacity: 0;
  transform: translateY(40px);
}
.animationPointJs.show {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.64s ease-out, transform 0.44s ease-out;
  will-change: opacity, transform;
}

.animationFadeJs {
  visibility: visible;
  opacity: 0;
}
.animationFadeJs.show {
  opacity: 1;
  transition: opacity 1.64s ease-in-out !important;
  will-change: opacity, transform;
}

.salutation__inner {
  display: grid;
  grid-template-columns: 1fr 330px;
  row-gap: 3.5rem;
  -moz-column-gap: 3.5rem;
       column-gap: 3.5rem;
  width: 1152px;
}
.salutation__inner .text > p {
  font-size: 1.125rem;
  margin-bottom: 1rem;
}
.salutation__inner .text > p:last-of-type {
  margin-bottom: 0;
}
.salutation__inner .text p.separator {
  margin-bottom: 3.5rem;
}
.salutation__inner .subHead {
  display: flex;
  flex-direction: column;
}

.business .introDuction .button {
  color: #FFFFFF;
  background-color: #004C97;
  border: 1px solid #004C97;
  border-radius: 0.125rem; /*2px*/
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
  transition: background-color 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), border-color 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), color 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  color: #FFFFFF;
}
.business .introDuction .button:hover {
  background-color: #002A50;
}
.business .introDuction .button {
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  border-radius: 62px;
  margin: 0 auto;
  text-align: center;
  width: 26.25rem;
}
.business .introDuction .button__text {
  width: 100%;
  text-align: center;
  position: relative;
  font-size: 1rem;
  line-height: 1.5;
  padding: 1.74rem 0;
}
.business .introDuction .button__text .icon {
  position: absolute;
  top: 2.25rlh;
  left: 90%;
}
.business .introDuction .button svg {
  fill: #FFFFFF;
}
.business__product .title {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 1.25rem;
  font-size: 2.25rem;
  font-weight: 700;
  color: #004C97;
  text-align: center;
  margin-bottom: 3.5rem;
}
.business__product .title::after {
  content: "";
  display: block;
  width: 5rem;
  height: 3px;
  background-color: #004C97;
}
.business__product .productName {
  font-size: 1.75rem;
  margin-bottom: 2.5rem;
  border-left: 3px solid #004C97;
  padding-left: 1rem;
  line-height: 2.5rem;
  font-size: 1.5rem;
  font-weight: 500;
  margin-bottom: 2rem;
}
.business__product .productContent {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  -moz-column-gap: 2rem;
       column-gap: 2rem;
}
.business__product .productContent__text {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.business__product .productContent__text .textName {
  display: flex;
  justify-content: center;
  align-items: center;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  font-size: 1.25rem;
  font-weight: 500;
  color: #004C97;
  margin-bottom: 1rem;
}
.business__product .productContent__text .textName::before, .business__product .productContent__text .textName::after {
  content: "";
  width: 3rem;
  height: 2px;
  background-color: #004C97;
}
.business__product .productContent__text ul.textItem {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
  background-color: #e4ecf7;
  padding: 2rem;
}
.business__product .productContent__text ul.textItem > li {
  display: flex;
  color: #000000;
}
.business__product .productContent__text ul.textItem > li::before {
  content: "・";
}
.business__product .productContent__img {
  display: flex;
  justify-content: center;
}
.business__product .productContent__img > figure {
  text-align: center;
}
.business__product .productContent__img > figure img:not(.productContent--maintenanceSolutions img) {
  filter: drop-shadow(0 0 0.5rem #BCC0C2);
  /* animation: type-image-shadow 5s ease infinite;

  @keyframes type-image-shadow {
      0% {
          filter: drop-shadow(0 0 0.25rem root.$sumitomo-gray-500);
      }

      50% {
          filter: drop-shadow(0 0 0.5rem root.$sumitomo-gray-700);
      }

      100% {
          filter: drop-shadow(0 0 0.25rem root.$sumitomo-gray-500);
      }
  } */
}
.business__product .productContent__img > figure > figcaption {
  font-size: 80%;
}
.business__product .productContent--maintenanceSolutions {
  align-items: center;
}
.business__product .productContent--maintenanceSolutions .productContent__text {
  height: 10rlh;
}
.business__product .productContent--maintenanceSolutions__img {
  display: block;
}
.business__product .productContent--driveSystem .productContent__text {
  justify-content: flex-start;
  margin-top: 1rlh;
}
.business__product .productContent--driveSystem__img {
  display: grid;
  grid-template-columns: 1fr 210px;
  align-items: center;
}
.business__product .productContent--driveSystem__img .drive-system-01 {
  position: relative;
}
.business__product .productContent--driveSystem__img .drive-system-01 figcaption {
  position: absolute;
  top: 6.5rlh;
}
.business__product .contentBorder {
  width: 100%;
  height: 1px;
  background-color: #E4E6E7;
  border: none;
  margin: 2.5rem 0;
}
.business__product .contentBorder:last-of-type {
  margin-bottom: 0;
}
.business__service .title {
  position: relative;
  padding-top: 1.25rem;
  margin-bottom: 3.5rem;
}
.business__service .title__arrow {
  width: 55px;
  height: 42px;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  background-color: #e4ecf7;
  position: absolute;
  top: 0;
  left: calc(50% - 27.5px);
  z-index: 1;
}
.business__service .title__text {
  background-color: #e4ecf7;
  clip-path: polygon(calc(50% - 23.5px) 0%, 50% 35px, calc(50% + 23.5px) 0, 100% 0%, 100% 100%, 0% 100%, 0 0);
  border-radius: 20px;
  padding: 3rem;
  position: relative;
  z-index: 0;
}
.business__service .title__text > h4 {
  font-size: 1.75rem;
  color: #004C97;
  font-weight: 700;
}
.business .city .map-wrapper {
  position: relative;
  /* 重ね合わせの基準 */
  width: 100%;
  max-width: 1000px;
  /* 必要に応じて調整 */
  margin: 0 auto;
}
.business .city .map-bg {
  width: 100%;
  height: auto;
  display: block;
}
.business .city .map-overlay {
  position: absolute;
  /* 背景画像の上に絶対配置 */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  /* SVGの透明部分がクリックを邪魔しないようにする */
}
.business .city .map-overlay #zoom-group-1 {
  pointer-events: auto;
  cursor: pointer;
}
.business .city .map-overlay #zoom-group-1 #zoom-1 {
  /* SVGの拡大で必須の設定（中心から拡大） */
  transform-origin: center;
  transform-box: fill-box;
  transition: transform 0.3s ease;
  /* 滑らかに動かす */
}
.business .city .map-overlay #zoom-group-1:hover #zoom-1 {
  transform: scale(1.2);
  z-index: 100;
}
.business .city .map-overlay #zoom-group-2 {
  pointer-events: auto;
  cursor: pointer;
}
.business .city .map-overlay #zoom-group-2 #zoom-2 {
  /* SVGの拡大で必須の設定（中心から拡大） */
  transform-origin: center;
  transform-box: fill-box;
  transition: transform 0.3s ease;
  /* 滑らかに動かす */
}
.business .city .map-overlay #zoom-group-2:hover #zoom-2 {
  transform: scale(1.2);
  z-index: 100;
}
.business .city .map-overlay #zoom-group-3 {
  pointer-events: auto;
  cursor: pointer;
}
.business .city .map-overlay #zoom-group-3 #zoom-3 {
  /* SVGの拡大で必須の設定（中心から拡大） */
  transform-origin: center;
  transform-box: fill-box;
  transition: transform 0.3s ease;
  /* 滑らかに動かす */
}
.business .city .map-overlay #zoom-group-3:hover #zoom-3 {
  transform: scale(1.2);
  z-index: 100;
}
.business .city .map-overlay #zoom-group-4 {
  pointer-events: auto;
  cursor: pointer;
}
.business .city .map-overlay #zoom-group-4 #zoom-4 {
  /* SVGの拡大で必須の設定（中心から拡大） */
  transform-origin: center;
  transform-box: fill-box;
  transition: transform 0.3s ease;
  /* 滑らかに動かす */
}
.business .city .map-overlay #zoom-group-4:hover #zoom-4 {
  transform: scale(1.2);
  z-index: 100;
}
.business .city .map-overlay #zoom-group-5 {
  pointer-events: auto;
  cursor: pointer;
}
.business .city .map-overlay #zoom-group-5 #zoom-5 {
  /* SVGの拡大で必須の設定（中心から拡大） */
  transform-origin: center;
  transform-box: fill-box;
  transition: transform 0.3s ease;
  /* 滑らかに動かす */
}
.business .city .map-overlay #zoom-group-5:hover #zoom-5 {
  transform: scale(1.2);
  z-index: 100;
}

/* @mixin missionPageTitle {
    padding: 2rem;
    background-color: #ffffffD4;
    position: absolute;
    bottom: 2.5rem;
    left: 2.5rem;
} */
.mission-mainVisual {
  width: 1152px;
  text-align: center;
  position: relative;
  margin: 0 auto;
  margin-top: -2.5rem;
  margin-bottom: 5rem;
  /* &__pageTitle {
      @include missionPageTitle;
  } */
}

.mission__title {
  display: inline-block;
  font-size: 2rem;
  color: #004C97;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  margin-bottom: 3.5rem;
}
.mission__title::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background-color: #004C97;
  margin-top: 1rem;
}
.mission .mission-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  row-gap: 2rem;
}
.mission .mission-text p {
  font-size: 1.5rem;
  line-height: 1.5;
}
.mission .mission-text p.en {
  font-size: 1.5rem;
}
.mission .roll-message-container {
  /* --- 設定（ここを変えるだけで調整できます） --- */
  min-height: calc(26.25rem + 0px);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  overflow: hidden;
  box-sizing: border-box;
  row-gap: 0;
  line-height: 1.5;
}
.mission .roll-message-container.show .fade-line {
  animation: slideUp 1s ease-out forwards;
}
.mission .roll-message-container .fade-line {
  /* 初期状態：透明にして下にずらしておく */
  opacity: 0;
  transform: translateY(1.75rem);
  display: block;
  text-align: center;
  /* --- ループ処理：行ごとの delay を自動生成 --- */
}
.mission .roll-message-container .fade-line:nth-child(1) {
  /* 計算式: 初期待ち時間 + ( (行番号 - 1) × 間隔 ) */
  /* 例: 1行目=0.5s, 2行目=1.7s, 3行目=2.9s... */
  animation-delay: 0.5s;
}
.mission .roll-message-container .fade-line:nth-child(2) {
  /* 計算式: 初期待ち時間 + ( (行番号 - 1) × 間隔 ) */
  /* 例: 1行目=0.5s, 2行目=1.7s, 3行目=2.9s... */
  animation-delay: 1.7s;
}
.mission .roll-message-container .fade-line:nth-child(3) {
  /* 計算式: 初期待ち時間 + ( (行番号 - 1) × 間隔 ) */
  /* 例: 1行目=0.5s, 2行目=1.7s, 3行目=2.9s... */
  animation-delay: 2.9s;
}
.mission .roll-message-container .fade-line:nth-child(4) {
  /* 計算式: 初期待ち時間 + ( (行番号 - 1) × 間隔 ) */
  /* 例: 1行目=0.5s, 2行目=1.7s, 3行目=2.9s... */
  animation-delay: 4.1s;
}
.mission .roll-message-container .fade-line:nth-child(5) {
  /* 計算式: 初期待ち時間 + ( (行番号 - 1) × 間隔 ) */
  /* 例: 1行目=0.5s, 2行目=1.7s, 3行目=2.9s... */
  animation-delay: 5.3s;
}
.mission .roll-message-container .fade-line:nth-child(6) {
  /* 計算式: 初期待ち時間 + ( (行番号 - 1) × 間隔 ) */
  /* 例: 1行目=0.5s, 2行目=1.7s, 3行目=2.9s... */
  animation-delay: 6.5s;
}
.mission .roll-message-container .fade-line:nth-child(7) {
  /* 計算式: 初期待ち時間 + ( (行番号 - 1) × 間隔 ) */
  /* 例: 1行目=0.5s, 2行目=1.7s, 3行目=2.9s... */
  animation-delay: 7.7s;
}
.mission .roll-message-container .fade-line:nth-child(8) {
  /* 計算式: 初期待ち時間 + ( (行番号 - 1) × 間隔 ) */
  /* 例: 1行目=0.5s, 2行目=1.7s, 3行目=2.9s... */
  animation-delay: 8.9s;
}
.mission .roll-message-container .fade-line:nth-child(9) {
  /* 計算式: 初期待ち時間 + ( (行番号 - 1) × 間隔 ) */
  /* 例: 1行目=0.5s, 2行目=1.7s, 3行目=2.9s... */
  animation-delay: 10.1s;
}
.mission .roll-message-container .fade-line:nth-child(10) {
  /* 計算式: 初期待ち時間 + ( (行番号 - 1) × 間隔 ) */
  /* 例: 1行目=0.5s, 2行目=1.7s, 3行目=2.9s... */
  animation-delay: 11.3s;
}
.mission .roll-message-container .paragraph {
  margin-bottom: 1.5rem;
}
.mission .roll-message-container {
  /* --- 動きの定義 --- */
}
@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(1.75rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.mission__englishVersion {
  width: 1152px;
  text-align: center;
  position: relative;
  margin: 0 auto 3rem;
  /* .titleEn {
      @include missionPageTitle;
  } */
}
.mission .titleWrapper {
  display: grid;
  grid-template-columns: 1fr 468px;
  justify-content: space-between;
  align-items: start;
  margin-bottom: 5rem;
  -moz-column-gap: 2rem;
       column-gap: 2rem;
}
.mission .titleWrapper.en {
  margin-bottom: 50px;
}

.pankuzu__title--brand {
  padding-top: 1rlh;
}
.pankuzu__title--brand > span {
  display: block;
  font-size: 80%;
}

.brand .introDuction__title {
  color: #004C97;
  line-height: 2.725rem;
  /* .normal {
      color: root.$sumitomo-gray-800;
      line-height: 2.725rem;
  } */
}
.brand .introDuction__title .SumitomoDriveTechnologies {
  font-size: 3.5rem;
  line-height: 3.5rem;
}
.brand .introDuction > p {
  font-weight: normal;
  color: #000000;
  text-align: center;
}
.brand hr.contentBorder {
  width: 100%;
  height: 1px;
  background-color: #E4E6E7;
  border: none;
  margin: 2.5rem 0;
  margin-top: 0;
}
.brand .pageItem .logo {
  text-align: center;
  margin: 0 auto;
  margin-top: 3.5rem;
  margin-bottom: 2rem;
}
.brand .pageItem .brand-statement {
  margin: 2rem auto;
  display: block;
  text-align: center;
  font-size: 2rem;
  font-weight: 700;
  color: #004C97;
}
.brand .pageItem .brand-statement::after {
  content: "";
  background-color: #004C97;
  height: 2px;
  width: 5rem;
  display: block;
  margin: 1rem auto;
}
.brand .pageItem .brand-statementText {
  display: flex;
  flex-direction: column;
  justify-content: center;
  row-gap: 1.5rem;
  font-size: 1.125rem;
  line-height: 1.5;
  text-align: center;
  color: #004C97;
  margin: 0 auto;
}

html {
  scroll-behavior: smooth;
  /* ヘッダーの高さ分だけズラす（例: 80px） */
  scroll-padding-top: calc((62px + 1.25rem) * -1);
}

.history .pageFlame {
  scroll-behavior: smooth;
}
.history .pageFlame__point {
  display: block;
  margin-top: -4.5rem;
  padding-top: 4.5rem;
}
.history .pageItem {
  margin-top: -4.5rem;
  padding-top: 4.5rem;
}
.history .pageItem:last-of-type {
  margin-bottom: 8rem;
}
.history__index {
  margin-bottom: 8rem;
}
.history__index .eachAge {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
}
.history__index .eachAge.show > li .history__select__link {
  opacity: 1;
}
.history__index .eachAge > li {
  position: relative;
}
.history__index .eachAge > li .history__select__link {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  row-gap: 0.5rem;
  width: 282px;
  height: 282px;
  overflow: hidden;
  padding: 0 1rem;
  position: relative;
  opacity: 0; /* ★最初は見えない状態 */
  transition: opacity 0.6s cubic-bezier(0.39, 0.575, 0.565, 1); /* フェードインの動き */
  will-change: opacity; /* 描画最適化 */
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.history__index .eachAge > li .history__select__link--1888 {
  background-image: url("/assets/ver4.0/images/pages/about-us/history/index_1888-1939.png");
  transition-delay: 1s;
}
.history__index .eachAge > li .history__select__link--1961 {
  background-image: url("/assets/ver4.0/images/pages/about-us/history/index_1952-1997.png");
  transition-delay: 1.2s;
}
.history__index .eachAge > li .history__select__link--2003 {
  background-image: url("/assets/ver4.0/images/pages/about-us/history/index_2003-2010.png");
  transition-delay: 1.1s;
}
.history__index .eachAge > li .history__select__link--2011 {
  background-image: url("/assets/ver4.0/images/pages/about-us/history/index_2011.png");
  transition-delay: 1.3s;
}
.history__index .eachAge > li .history__select__link {
  /* --- ▼ テキストを前面に出す設定 ▼ --- */
}
.history__index .eachAge > li .history__select__link .text-Age,
.history__index .eachAge > li .history__select__link .text {
  position: relative;
  z-index: 2;
  font-weight: 700;
  color: #FFFFFF;
}
.history__index .eachAge > li .history__select__link .text-Age {
  font-size: 2.25rem;
}
.history__index .eachAge > li .history__select__link .text {
  font-size: 1.125rem;
  line-height: 1.35;
}
.history__index .eachAge > li .history__select__link {
  /* --- ▼ 黒い膜の設定 ▼ --- */
}
.history__index .eachAge > li .history__select__link::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  background-color: rgba(0, 0, 0, 0.5);
  transition: background-color 0.3s;
}
.history__index .eachAge > li .history__select__link:hover::before {
  background-color: rgba(0, 0, 0, 0.3);
}
.history__chronology {
  margin-bottom: 8rem;
}
.history__chronology .title {
  font-size: 5rem;
  font-weight: 700;
  color: #004C97;
  text-align: center;
  margin-bottom: 2rem;
}
.history__chronology .title > span {
  display: inline-block;
}
.history__chronology .title [data-char] {
  opacity: 0;
  display: inline-block; /* アニメーションのために必要 */
  will-change: opacity;
  transition: opacity 0.4s ease; /* transitionでやる場合 */
}
.history__chronology {
  /* .is-showがつくとフワッと現れる */
}
.history__chronology .title [data-char].is-show {
  /* もしアニメーション(fadeIn)を使うなら以下 */
  animation: fadeIn 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) forwards;
}
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.history__chronology .description {
  display: flex;
  justify-content: center;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  align-items: center;
  font-size: 2rem;
  font-weight: 500;
  margin-bottom: 3.5rem;
}
.history__chronology .description::before, .history__chronology .description::after {
  content: "";
  width: 3rem;
  height: 3px;
  background-color: #000000;
}
.history__chronology .chronology {
  margin-bottom: 3.5rem;
}
.history__chronology .chronology:last-of-type {
  margin-bottom: 0;
}
.history__chronology .chronology__age {
  border-bottom: 3px #000000 solid;
  margin-bottom: 1rem;
}
.history__chronology .chronology__age::before {
  content: "";
  width: 2rem;
  height: 2rem;
  display: inline-block;
  border-top: 3px solid transparent;
  border-right: 3px solid #000000;
  transform: rotate(30deg);
  border-radius: 2px;
  position: relative;
  left: -21px;
  top: 3px;
}
.history__chronology .chronology__age span {
  font-size: 1.75rem;
  font-weight: 500;
}
.history__chronology .chronology__text {
  display: flex;
  font-size: 1.5rem;
  padding-left: 3rem;
  margin-bottom: 0.5rem;
}
.history__chronology .chronology__text:last-of-type {
  margin-bottom: 0;
}
.history__chronology .chronology__text::before {
  content: "・";
}
.history__chronology {
  /* 1. 外側の枠組み（ここで線を引く） */
}
.history__chronology .history_outline {
  position: relative; /* 基準点 */
  padding-left: 40px; /* 線とドットの分、中身を右にずらす */
  margin-left: 5.25rem;
}
.history__chronology {
  /* 線の設定（border-leftの代わり） */
}
.history__chronology .history_outline::before {
  content: "";
  position: absolute;
  top: 15px;
  left: 9px; /* ドットの中心を通るように調整 */
  width: 1px; /* 線の太さ */
  height: 100%; /* 全体の高さ */
  background-color: #e0e0e0; /* 線の色（薄いグレーなど） */
}
.history__chronology {
  /* 2. 各行のレイアウト */
}
.history__chronology .history_outline dl {
  position: relative; /* ドットの基準点 */
  display: flex; /* 年号と内容を横並びにする場合 */
  align-items: flex-start;
  margin-bottom: 40px; /* 行ごとの間隔 */
}
.history__chronology {
  /* 3. 青いドット（丸）の設定 */
}
.history__chronology .history_outline dl::after {
  content: "";
  position: absolute;
  top: 12px; /* 年号の高さに合わせて微調整 */
  left: -40px; /* 親のpadding-left分戻して配置 */
  width: 18px; /* 丸の大きさ */
  height: 18px; /* 丸の大きさ */
  background-color: #004C97; /* 丸の色（青） */
  border-radius: 50%; /* 丸くする */
  z-index: 1; /* 線より手前に表示 */
}
.history__chronology {
  /* 4. 年号エリアの調整 */
}
.history__chronology .history_outline dt {
  width: 100px; /* 年号の幅を固定 */
  flex-shrink: 0; /* 縮まないようにする */
}
.history__chronology .history_outline dt h5 {
  font-size: 1.75rem;
  font-weight: 500;
}
.history__chronology .history_outline dd {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  font-size: 1.25rem;
  padding-left: 3rem;
  margin-bottom: 0.5rem;
}
.history__sideNavi {
  position: fixed;
  right: 2rem;
  top: calc((100vh - 254.4px) / 2);
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
}
.history__sideNavi li {
  font-size: 12px;
  font-weight: 500;
  color: #BCC0C2;
  padding: 0.5rem;
}
.history__sideNavi li:hover {
  color: #000000;
  transform: scale(1.5);
  transition: all 0.7s;
  cursor: pointer;
}
.history__sideNavi li a {
  transition: all 0.7s ease;
}
.history__sideNavi li a.active {
  font-weight: 700;
  color: #000000;
}/*# sourceMappingURL=style.css.map */