:root {
  --scale-px: 1px;
  --scale-rem: 1rem;
  --scale-em: 1em;
  --scale-perc: 1%;
  --spacing: var(--md, calc(var(--scale-px) * 40)) var(--n-md, calc(var(--scale-px) * 20));
  --sm: ;
  --n-sm: initial;
  --md: ;
  --n-md: initial;
  --lg: ;
  --n-lg: initial;
  --xl: ;
  --n-xl: initial;
  --xxl: ;
  --n-xxl: initial;
  --xxxl: ;
  --n-xxxl: initial;

  --viewport-height: 100vh;
  --viewport-height-actual: 100vh;
}

@media (min-aspect-ratio: 13 / 9),
(min-width: 568px) {
  :root {
    --n-sm: ;
    --sm: initial;
  }
}

@media (min-width: 568px) and (max-aspect-ratio: 13 / 9),
(min-width: 668px) and (min-height: 416px),
(min-width: 980px) {
  :root {
    --n-md: ;
    --md: initial;
  }
}

@media (min-width: 980px) {
  :root {
    --n-lg: ;
    --lg: initial;
  }
}

@media (min-width: 1200px) and (min-height: 600px) {
  :root {
    --n-xl: ;
    --xl: initial;
  }
}

@media (min-width: 1440px) and (min-height: 600px) {
  :root {
    --n-xxl: ;
    --xxl: initial;
  }
}

@media (min-width: 1920px) and (min-height: 600px) {
  :root {
    --n-xxxl: ;
    --xxxl: initial;
  }
}

:root {
  --c-white: #fff;
  --c-white-rgb: 255, 255, 255;
  --c-red: #C69E36;
  --c-red-rgb: 171, 5, 45;
  --c-red-light: #d00e3d;
  --c-red-light-rgb: 208, 14, 61;
  --c-grey: #394854;
  --c-grey-rgb: 57, 72, 84;
  --c-grey-dark: #2b3944;
  --c-grey-dark-rgb: 43, 57, 68;
  --c-grey-middle: #9099a0;
  --c-grey-middle-rgb: 144, 153, 160;
  --c-grey-light: #aeb8c0;
  --c-grey-light-rgb: 174, 184, 192;
  --c-super-light: #f8f8f9;
  --c-super-light-rgb: 248, 248, 249;
  --c-print: #000;
  --c-print-rgb: 0, 0, 0;
  --c-error: #C69E36;
  --c-error-rgb: 171, 5, 45;
}

.ui-light,
:root {
  --t-background: var(--c-white);
  --t-background-rgb: var(--c-white-rgb);
  --t-line: rgba(var(--c-grey-rgb), 0.15);
  --t-line-light: rgba(var(--c-grey-rgb), 0.1);
  --t-small: var(--c-grey-middle);
  --t-small-rgb: var(--c-grey-middle-rgb);
  --t-text: var(--c-grey);
  --t-text-rgb: var(--c-grey-rgb);
  --t-heading: var(--c-grey);
  --t-heading-rgb: var(--c-grey-rgb);
  --t-primary: var(--c-red);
  --t-primary-rgb: var(--c-red-rgb);
  --t-secondary: var(--c-grey);
  --t-secondary-rgb: var(--c-grey-rgb);
  --t-background-alt: var(--c-super-light);
  --t-background-alt-rgb: var(--c-super-light-rgb);
  --t-link-normal: var(--c-grey);
  --t-link-normal-rgb: var(--c-grey-rgb);
  --t-link-hover: var(--c-grey);
  --t-link-hover-rgb: var(--c-grey-rgb);
  --t-title: var(--c-red);
  --t-title-rgb: var(--c-red-rgb);
  --t-card-back: var(--c-super-light);
  --t-card-back-rgb: var(--c-super-light-rgb);
  --t-circle: var(--c-grey-dark);
  --t-circle-rgb: var(--c-grey-dark-rgb);
  --t-border: var(--c-grey-light);
  --t-border-rgb: var(--c-grey-light-rgb);
  --t-primary-light: var(--c-red-light);
  --t-primary-light-rgb: var(--c-red-light-rgb);
  --t-invert: var(--c-white);
  --t-invert-rgb: var(--c-white-rgb);
}

.fhs-history .row {
  display: flex;
  flex-wrap: wrap;
}

.fhs-history .history-layout__content {
  padding-top: var(--md, calc(var(--scale-px)* 94)) var(--n-md, 0);
}



.fhs-history .history-sticky {
  width: 45%;
}

.fhs-history .sticky {
  --sticky-content-height: 0px;
  --sticky-full-height: 0px;
  --sticky-margin: min(0px, calc(var(--sticky-content-height) / 2 - var(--viewport-height) / 2));
  --sticky-padding: max(0px, calc(var(--viewport-height) / 2 - var(--sticky-content-height) / 2));
  position: relative;
  margin-top: var(--sticky-margin);
  margin-bottom: var(--sticky-margin);
  height: var(--sticky-full-height);
}



.fhs-history .sticky__sticky {
  position: sticky;
  top: 0;
  height: var(--viewport-height);
  padding-top: var(--sticky-padding);
  padding-bottom: var(--sticky-padding);
  overflow: hidden;
  overflow: clip;
}

.fhs-history .history-sticky__sticky {
  height: calc(var(--sticky-content-height) + var(--sticky-padding)* 2);
}

.fhs-history .sticky {
  position: sticky;
  top: 0;
}

.fhs-history .history-years-vertical {
  position: relative;
}

.fhs-history .history-years-vertical__circle {
  position: relative;
  z-index: 1;
  width: calc(var(--scale-px)* 480);
  height: calc(var(--scale-px)* 480);
  margin-left: calc(var(--scale-px)* 166);
}

.fhs-history .history-years-vertical__circle {
  width: 425px;
  height: 425px;
  margin-left: 108px;
  top: 12px;
}

.fhs-history .history-years-vertical__circle rect+rect {
  stroke: var(--t-primary);
  stroke-dashoffset: .999;
  stroke-width: .75;
  opacity: 1;
}

.fhs-history .history-years-vertical__circle rect {
  transition-duration: .4s;
  transition-timing-function: cubic-bezier(.25, .74, .22, .99);
  transition-property: stroke-dashoffset;
  fill: none;
  stroke: var(--t-circle);
  stroke-width: 1.25;
  stroke-dasharray: 1;
  stroke-dashoffset: 2;
  rx: calc(var(--scale-px)* 240);
  ry: calc(var(--scale-px)* 240);
  opacity: .15;
  transform-origin: 50% 50%;
  width: calc(100% - 2px);
  height: calc(100% - 2px);
}



.fhs-history .history-years-vertical__years {
  position: absolute;
  width: 100%;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: stretch;
}

.fhs-history .history-years-vertical__years__left {
  position: relative;
  z-index: 1;
  color: var(--t-primary);
}

.fhs-history .history-years-vertical__years__left {
  font-size: 180px;
  letter-spacing: -0.1rem;
}

.fhs-history .history-years-vertical__years__right {
  position: relative;
  flex-grow: 1;
  will-change: transform;
}

.fhs-history .history-years-vertical__years__right__list {
  position: absolute;
}

.fhs-history .history-years-vertical__years__right__list {
  transition: all .5s ease;
}

.fhs-history .history-years-vertical__years__right__item {
  color: var(--t-card-back);
  transition-duration: .4s;
  transition-timing-function: cubic-bezier(.25, .74, .22, .99);
  transition-property: color;
}

.fhs-history .history-years-vertical__years__right__item {
  font-size: 180px;
  letter-spacing: 0;
	line-height: normal;
}

.fhs-history .history-years-vertical__years__right__item.is-active {
  color: var(--t-primary);
}

.fhs-history .history-events {
  padding-top: calc(var(--scale-px)* 140);
}

.fhs-history .history-events {
  width: 55%;
  padding-left: 67px;
}

.fhs-history .history-events__item {
  border-top: 1px solid;
  border-top-color: rgba(var(--t-circle-rgb), .15);
  padding: var(--md, calc(var(--spacing)* 1.5) 0 calc(var(--spacing)* 2)) var(--n-md, 0);
}

.fhs-history .history-events__item {
  padding-top: 39px;
  padding-bottom: 51px;
}

.fhs-history .history-events__item:first-child {
  padding-top: 50px;
}

.fhs-history .text--color-small {
  color: var(--t-small);
}

.fhs-history .history-events__item__id {
  margin-bottom: var(--spacing);
  display: block;
}

.fhs-history .history-events__item__id {
  color: #C69E36;
  font-size: 24px;
  margin-bottom: 29px;
}

.fhs-history .leading-trim:after,
.fhs-history .leading-trim:before {
  content: "";
  display: block;
  height: 0;
  overflow: hidden;
  position: relative;
}

.fhs-history .leading-trim:before {
  margin-bottom: calc((var(--lh) - 1em) / -2 + var(--fos, 0em));
}

.fhs-history .leading-trim:after,
.fhs-history .leading-trim:before {
  content: "";
  display: block;
  height: 0;
  overflow: hidden;
  position: relative;
}

.fhs-history .leading-trim:after {
  margin-top: calc((var(--lh) - 1em) / -2 + var(--foe, 0em));
}

.fhs-history .history-layout .thumb img {
  width: 100%;
}

.fhs-history .history-events__item__text {
  display: block;
}

.fhs-history .leading-trim:after,
.fhs-history .leading-trim:before {
  content: "";
  display: block;
  height: 0;
  overflow: hidden;
  position: relative;
}

.fhs-history .history__years__carousel__circle {
  display: block;
  pointer-events: none;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  transform: translate(-50%, -50%);
  width: calc(var(--scale-px)* 140);
  height: calc(var(--scale-px)* 140);
}

.fhs-history .history__years__carousel__circle rect {
  transition-duration: .4s;
  transition-timing-function: cubic-bezier(.25, .74, .22, .99);
  transition-property: stroke-dashoffset;
  fill: none;
  stroke: var(--t-circle);
  stroke-width: 1.25;
  stroke-dasharray: 1;
  stroke-dashoffset: 2;
  rx: calc(var(--scale-px)* 70);
  ry: calc(var(--scale-px)* 70);
  opacity: .15;
  transform-origin: 50% 50%;
  width: calc(100% - 2px);
  height: calc(100% - 2px);
}

.fhs-history .history__years__carousel__circle rect+rect {
  opacity: 1;
  stroke: var(--t-primary);
  stroke-width: .75;
  stroke-dashoffset: .999;
}

@media (min-width: 568px) and (max-aspect-ratio: 13 / 9),
(min-width: 668px) and (min-height: 416px),
(min-width: 980px) {
  .fhs-history .history-years-vertical__years {
    font-size: calc(var(--scale-rem) * 25.2);
    line-height: 1em;
    --lh: 1em;
    letter-spacing: -.04em;
  }

  .fhs-history .history-events__item__id {
    font-size: calc(var(--scale-rem) * 1.4);
    line-height: 1.42857em;
    --lh: 1.42857em;
    letter-spacing: 0;
    font-weight: 400;
  }

  .fhs-history .history-events__item__text {
    font-size: calc(var(--scale-rem) * 2);
    line-height: 1.25em;
    --lh: 1.25em;
    letter-spacing: -.02em;
  }
}

.fhs-history p.history-events__item__text {
  color: #000000;
  font-size: 24px;
  line-height: 34px;
  margin-top: 27px;
}

.fhs-history .leading-trim:before {
  margin-bottom: calc((var(--lh) - 1em) / -2 + var(--fos, 0em));
}

/* -------------- */
.fhs-history .history-events__item__id {
  color: #C69E36;
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 27px;
}

.history-events__item {
  padding-top: 39px;
  padding-bottom: 51px;
}

p.history-events__item__text {
  color: #000000;
  font-size: 24px;
  line-height: 34px;
  margin-top: 32px;
}

.title-border--grey h2 {
  font-size: 30px;
}

.title-border--grey h2 {
  font-size: 54px;
  color: #2E2724;
  font-weight: 700;
}

.history-events__item:first-child {
  padding-top: 50px;
}

body {
  font-family: 'Source Han Sans SC', 'Microsoft Yahei';
}

.history-years-vertical__years__right__item {
  font-size: 180px;
  letter-spacing: 0;
}

.history-years-vertical__years__left {
  font-size: 180px;
  letter-spacing: -0.1rem;
}

.history-years-vertical__circle {
  width: 425px;
  height: 425px;
  margin-left: 108px;
  top: 12px;
}

.container-h.history-layout {
  max-width: 1380px;
  padding: 0 20px;
  margin: 0 auto;
}

.history-layout .thumb img {
  width: 100%;
}

.history-sticky {
  width: 45%;
}

.history-events {
  width: 55%;
  padding-left: 67px;
}

.fhs-history .dv-show-mb {
  display: none;
}


.sticky {
  position: sticky;
  top: 0;
}

section.section .history-layout {
  display: block;
}

section.fhs-history {
  padding: 160px 0 79px;
}

.history-years-vertical__years__right__item {
  line-height: normal;
  font-weight: 700;
}

.history-years-vertical__years__left {
  font-weight: 700;
  line-height: normal;
}

.fhs-history .history-sticky {
  height: auto !important;
}

@media screen and (max-width: 1199px) {
  .fhs-history .history-events {
    width: 45%;
  }

  .fhs-history .history-sticky {
    width: 55%;
  }

  section.fhs-history {
    padding: 80px 0 79px;
  }
}

@media screen and (max-width: 1023px) {

  .fhs-history .history-years-vertical__years__left,
  .fhs-history .history-years-vertical__years__right__item {
    font-size: 134px;
  }

  .fhs-history .history-years-vertical__circle {
    width: 254px;
    height: 254px;
    margin-left: 78px;
  }

  .fhs-history .history-sticky {
    width: 47%;
  }

  .fhs-history .history-events {
    width: 53%;
  }

  .fhs-history .history-events {
    padding-left: 40px;
  }
}

@media screen and (max-width: 767px) {
  .fhs-history .dv-show-mb {
    display: block;
  }

  .fhs-history .dv-hide-mobile {
    display: none;
  }

  .fhs-history svg.history__years__carousel__circle {
    width: 140px;
    height: 140px;
  }

  section.fhs-history {
    padding: 50px 0 10px;
    overflow: hidden;
  }

  .fhs-history p.history-events__item__text {
    font-size: 20px;
    line-height: 1.2;
  }
}

.fhs-history .history_years-mb {
  position: relative;
  margin: 80px 0;
}

.fhs-history .history__years__carousel__circle {
  width: 140px;
  height: 140px;
}

.fhs-history .history__years__carousel__circle rect {
  rx: 70px;
  ry: 70px;
}

.fhs-history .year-item-mb span {
  font-size: 92px;
  line-height: 1;
  font-weight: bold;
}

.fhs-history .year-item-mb {
  height: auto;
  padding: 0 40px;
}

.fhs-history .year-item-mb span {
  color: #f8f8f9;
}

.fhs-history .year-item-mb.slick-current span {
  color: #C69E36;
}

.fhs-history .history-events__item,
.fhs-history .history-events__item:first-child {
  padding: 37px 0 42px;
}

.fhs-history .history-events__item:first-child {
  padding: 45px 0 42px;
}

.fhs-history .year-slide-mb-content-item:first-child {
  height: auto;
}

.fhs-history .year-slide-mb-content-item {
  height: 0;
}

p.history-events__item__text,
span.history-events__item__id {
  font-size: 18px;
  line-height: 1.5;
  font-weight: 600;
}


@media screen and (max-width: 479px) {

  .fhs-history .history-events__item,
  .fhs-history .history-events__item:first-child {
    padding: 50px 10px;
  }

  .fhs-history .year-item-mb {
    padding: 0;
  }

  .fhs-history .year-slide-mb .slick-list.draggable {
    padding: 0 !important;
  }

  p.history-events__item__text,
  span.history-events__item__id {
    font-size: 16px;

  }

  .fhs-history .year-item-mb span {
    font-size: 65px;
  }

  .fhs-history .year-slide-mb {
    margin-left: -115px;
    position: relative;
    z-index: 1;
  }

  .fhs-history .year-item-mb.slick-slide.slick-current.slick-center {
    margin-right: -30px;
  }

  .fhs-history .year-item-mb.slick-slide {
    margin-right: -30px;

    margin-left: -30px;
  }
}

@media (min-width: 1024px) {
  .fhs-history .sticky__sticky {
    padding-top: 150px;
  }
}
