@counter-style pad {
  system: extends decimal;
  pad: 3 "0"
}

.ani {
  transition: --num 1s ease-in-out
}

.ani--integer {
  counter-reset: v1 max(var(--num), 0)
}

.ani--integer .num-ani:before {
  content: counter(v1)
}

.ani--comma {
  --v1: max(round(down, var(--num), 1), 0);
  --v2: max((var(--num) - var(--v1)) * 1000, 0);
  counter-reset: v1 var(--v1) v2 var(--v2)
}

.ani--comma .num-ani:before {
  content: counter(v1) "," counter(v2, pad)
}

.ani--number {
  --v1: max(round(down, var(--num), 1), 0);
  --v2: max((var(--num) - var(--v1)) * 100, 0);
  counter-reset: v1 var(--v1) v2 var(--v2)
}

.ani--number .num-ani:before {
  content: counter(v1) "." counter(v2, decimal-leading-zero)
}

.ani--init {
  --num: 0 !important
}

/*! Index :: CSS Entry Point */
html {
  font-size: 62.5%
}

body {
  font-size: 1.6rem
}

main.index .award__container,
main.index .history__container,
main.index .news__container {
  inline-size: 100%
}

@media(max-width:991.98px) {

  main.index .award__container,
  main.index .history__container,
  main.index .news__container {
    padding-inline: 15px
  }
}

@media(min-width:992px) {

  main.index .award__container,
  main.index .history__container,
  main.index .news__container {
    margin-inline: auto;
    max-inline-size: 984px
  }
}

@media(max-width:991.98px) {
  main.index .history {
    margin-block-start: 55px
  }
}

@media(min-width:992px) {
  main.index .history {
    block-size: 870px;
    display: flex;
    /*margin-block-start: -130px*/
  }
}

@media(min-width:1200px) {
  main.index .history {
    block-size: 830px
  }
}

main.index .history__container {
  display: flex
}

@media(max-width:991.98px) {
  main.index .history__container {
    flex-direction: column;
    gap: 30px
  }
}

@media(min-width:992px) {
  main.index .history__container {
    gap: 50px;
    /*padding-block: 100px*/
  }
}

@media(min-width:1440px) {
  main.index .history__container {
    max-inline-size: 1150px
  }
}

@media(min-width:992px) {
  main.index .history__header {
    flex: 0 0 300px
  }
}

@media(max-width:1199.98px) {
  main.index .highlight {
    margin-block-start: 60px
  }
}

@media(min-width:1200px) {
  main.index .highlight {
    margin-block-start: -100px
  }
}

main.index .highlight__container {
  display: flex;
  flex-direction: column;
  gap: 30px
}

@media(min-width:1200px) {
  main.index .highlight__container {
    padding-block: 200px 480px
  }
}

main.index .highlight__header {
  text-align: center
}

@media(min-width:1492px) {
  main.index .highlight .tabber__content {
    margin-inline: auto;
    max-inline-size: 1492px
  }
}

@media(max-width:991.98px) {
  main.index .news {
    margin-block-start: 70px
  }
}

@media(min-width:992px) {
  main.index .news {
    margin-block-start: 125px
  }
}

@media(min-width:1200px) {
  main.index .news {
    margin-block-start: -200px
  }
}

main.index .news .tabber {
  display: inline-flex;
  flex-direction: column;
  gap: 20px;
  inline-size: 100%;
  position: relative
}

@media(min-width:1200px) {
  main.index .news .tabber {
    gap: 22px
  }
}

main.index .news__more {
  position: absolute;
  right: 0
}

@media(max-width:1199.98px) {
  main.index .news__more {
    top: 17px
  }
}

@media(min-width:1200px) {
  main.index .news__more {
    top: 9px
  }
}

main.index .news__item {
  display: inline-flex;
  gap: 1em;
  inline-size: 100%;
  padding-block: 15px
}

main.index .news__date {
  flex: 0 0 7em
}

@media(max-width:1199.98px) {
  main.index .news__date {
    display: none !important
  }
}

main.index .news__title {
  flex: 1 1 0%
}

@media(min-width:992px) {
  main.index .award {
    margin-block-start: 90px
  }
}

@media(min-width:1200px) {
  main.index .award {
    margin-block: 200px 80px
  }
}

main.index .award__container {
  display: flex;
  flex-direction: column
}

@media(max-width:991.98px) {
  main.index .award__container {
    gap: 50px;
    margin-block: 90px 113px
  }
}

@media(min-width:992px) {
  main.index .award__container {
    gap: 60px
  }
}

main.index .award__header {
  align-items: center;
  display: inline-flex;
  inline-size: 100%;
  justify-content: space-between
}

/*main.index .award__heading {
  flex: 1 1 0%
}*/

main.index .award__list {
  display: flex;
  inline-size: 100%
}

@media(max-width:991.98px) {
  main.index .award__list {
    align-items: center;
    flex-direction: column;
    gap: 50px
  }
}

@media(min-width:992px) {
  main.index .award__list {
    flex-wrap: wrap;
    gap: 42px
  }
}

main.index .award__item {
  block-size: 180px;
  inline-size: 300px
}

main.index .award__item-wrapper {
  block-size: inherit;
  clip-path: xywh(0 0 100% 100% round 10px);
  display: inherit;
  position: relative
}

main.index .award__item-wrapper:active>.award__back,
main.index .award__item-wrapper:focus>.award__back,
main.index .award__item-wrapper:hover>.award__back {
  top: 0
}

main.index .award__back,
main.index .award__front {
  align-items: center;
  block-size: 100%;
  display: flex;
  inline-size: 100%
}

main.index .award__back {
  left: 0;
  position: absolute;
  top: calc(100% + 1px);
  transition: all .35s cubic-bezier(.785, .135, .15, .86) .1s
}

main.index .award__link {
  block-size: 100%;
  display: block;
  inline-size: 100%;
  left: 0;
  position: absolute;
  top: 0
}

.index .highlight .tabber {
  display: flex;
  flex-direction: column;
  gap: 1em
}

@media(min-width:992px) {
  .index .highlight .tabber {
    gap: 2em
  }
}

@media(max-width:991.98px) {
  .index .highlight .tabber__nav {
    padding-inline: 15px
  }
}

.index .highlight .tabber__list {
  display: inline-flex;
  inline-size: 100%;
  justify-content: center
}

@media(max-width:991.98px) {
  .index .highlight .tabber__list {
    gap: 14px
  }
}

@media(min-width:992px) {
  .index .highlight .tabber__list {
    gap: 30px
  }
}

.index .news .tabber__list {
  display: inline-flex;
  gap: 20px
}

@media(min-width:992px) {
  .index .news .tabber__list {
    gap: 30px
  }
}

.index .spotlight .slider__item {
  display: inline-block;
  position: relative
}

.index .history .slider__item {
  align-items: flex-start;
  display: inline-flex;
  flex-direction: column;
  gap: 5px;
  inline-size: 100%
}

@media(min-width:992px) {
  .index .history .slider__item {
    align-items: center;
    display: flex;
    flex-direction: row;
    gap: 20px
  }
}

.index .highlight .slider__item {
  display: inline-block
}

.index .spotlight .slider__item-wrapper {
  align-items: center;
  block-size: 100%;
  display: flex;
  flex-direction: column;
  inline-size: 100%;
  left: 0;
  padding-block-start: 60px;
  position: absolute
}

@media(max-width:991.98px) {
  .index .spotlight .slider__item-wrapper {
    justify-content: center;
    top: 0
  }
}

@media(min-width:992px) {
  .index .spotlight .slider__item-wrapper {
    top: 28%
  }
}

@media(min-width:1200px) {
  .index .spotlight .slider__item-wrapper {
    padding-block-start: 90px
  }
}

.index .highlight .slider__item-wrapper {
  block-size: 300px;
  display: flex;
  flex-direction: column;
  gap: 50px;
  inline-size: 230px;
  padding: 50px 15px 0
}

.index .history .slider__date {
  display: flex;
  justify-content: center
}

@media(max-width:991.98px) {
  .index .history .slider__date {
    inline-size: 55px
  }
}

@media(min-width:992px) {
  .index .history .slider__date {
    align-items: center;
    flex: 0 0 90px
  }
}

@media(max-width:499.98px) {
  .index .history .slider__title {
    display: -webkit-box;
    line-height: 1.3125;
    overflow: hidden;
    padding: 0 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    -webkit-hyphens: auto;
    hyphens: auto
  }

  @supports not (-webkit-line-clamp:3) {
    .index .history .slider__title {
      height: 3.9375em
    }
  }

  html[class~=ie] .index .history .slider__title {
    display: block;
    height: 3.9375em
  }
}

@media(min-width:500px) {
  .index .history .slider__title {
    display: -webkit-box;
    line-height: 1.3125;
    overflow: hidden;
    padding: 0 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    -webkit-hyphens: auto;
    hyphens: auto
  }

  @supports not (-webkit-line-clamp:2) {
    .index .history .slider__title {
      height: 2.625em
    }
  }

  html[class~=ie] .index .history .slider__title {
    display: block;
    height: 2.625em
  }
}

.index .spotlight .slider__picture {
  block-size: 200px;
  display: flex;
  inline-size: 100%;
  overflow: hidden;
  position: relative;
  z-index: -1
}

.index .spotlight .slider__picture img {
  left: 50%;
  max-width: none;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

@media(min-width:992px) {
  .index .spotlight .slider__picture {
    block-size: 845px
  }
}

.tns-visually-hidden {
  display: none !important
}

.index .spotlight .tns-outer {
  position: relative
}

@media(min-width:992px) {
  .index .history .tns-outer {
    padding-block: 130px 60px
  }
}

.index .highlight .tns-outer {
  position: relative
}

.tns-ovh {
  overflow: hidden
}

@media(min-width:992px) {
  .index .highlight .tns-ovh {
    margin-inline: 70px
  }
}

@media(min-width:1492px) {
  .index .highlight .tns-ovh {
    margin-inline: 96px
  }
}

.index .highlight .tns-inner {
  padding-block: 20px 25px
}

.index .spotlight .tns-nav {
  display: inline-flex;
  gap: 10px;
  inline-size: 100%;
  justify-content: center;
  position: absolute
}

@media(max-width:991.98px) {
  .index .spotlight .tns-nav {
    bottom: -35px
  }
}

@media(min-width:992px) {
  .index .spotlight .tns-nav {
    inline-size: 580px;
    justify-content: flex-start;
    right: 10%;
    top: 58%
  }
}

@media(min-width:1440px) {
  .index .spotlight .tns-nav {
    right: 15%
  }
}

@media(min-width:992px) {
  .index .highlight .tns-nav {
    display: inline-flex;
    gap: 15px;
    inline-size: 100%;
    justify-content: center;
    padding-block: 1.5em;
    padding-inline: 70px;
    position: absolute
  }
}

.index .highlight .tns-controls button {
  align-items: center;
  block-size: 96px;
  display: flex;
  inline-size: 96px;
  justify-content: center;
  position: absolute;
  top: calc(50% - 48px);
  z-index: 1
}

.index .highlight .tns-controls button:before {
  display: flex
}

.index .highlight .tns-controls button[data-controls=prev] {
  left: 0
}

.index .highlight .tns-controls button[data-controls=prev]:before {
  transform: rotate(-90deg)
}

.index .highlight .tns-controls button[data-controls=next] {
  right: 0
}

.index .highlight .tns-controls button[data-controls=next]:before {
  transform: rotate(90deg)
}

body {
  background-color: #f2f9ff
}

@media(min-width:992px) {
  body {
    background-image: url(../images/index-bg-all.svg?f0ad7ff68999a56a4f95);
    background-position: top -70px center;
    background-repeat: no-repeat;
    background-size: 2200px auto
  }
}

@media(min-width:1200px) {
  body {
    background-position: top
  }
}

main.index .award__heading,
main.index .highlight__heading,
main.index .history__heading {
  background-image: linear-gradient(180deg, #00a6d9, #0d6fae);
  background-repeat: no-repeat;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text
}

main.index .award__heading {
  border-bottom: 2px solid #00a6d9;
}



main.index .award__header {
  border-block-end: 1px solid #00a6d9;
  position: relative
}

/* main.index .award__header:after {
  background-color: #00a6d9;
  block-size: 2px;
  bottom: 0;
  content: "";
  display: block;
  left: 0;
  position: absolute
}

@media(max-width:991.98px) {
  main.index .award__header:after {
    inline-size: 120px
  }
}*/

@media(min-width:992px) {
  main.index .award__header:after {
    inline-size: 140px
  }
}

@media(max-width:991.98px) {
  main.index .spotlight {
    border-block-end: 10px solid #fff;
    box-shadow: 0 30px 60px rgba(91, 144, 183, .25);
    transition: all .1s cubic-bezier(.785, .135, .15, .86) .1s
  }
}

main.index .highlight__container {
  block-size: inherit
}

@media(min-width:1200px) {
  main.index .highlight__container {
    background-position: top;
    background-repeat: no-repeat;
    background-size: 2200px auto;
    gap: 48px;
    justify-content: center;
    transition: all .35s cubic-bezier(.785, .135, .15, .86) .1s
  }

  main.index .highlight__container:has(.highlight__governance.active) {
    background-image: url(../images/index-highlight-governance-bg.png?2a2e19fb878e9c0bd8b2)
  }

  main.index .highlight__container:has(.highlight__rd.active) {
    background-image: url(../images/index-highlight-rd-bg.png?db2759836b331a356c73)
  }

  main.index .highlight__container:has(.highlight__social.active) {
    background-image: url(../images/index-highlight-social-bg.png?122b442c5dea27b3a1f6)
  }

  main.index .highlight__container:has(.highlight__env.active) {
    background-image: url(../images/index-highlight-env-bg.png?ab23cb242e7d85f3a796)
  }
}

main.index .highlight__heading {
  align-items: center;
  display: flex;
  flex-direction: column;
  font-weight: 700;
  gap: 8px
}

main.index .highlight__heading:after {
  background-color: #00a6d9;
  block-size: 3px;
  content: "";
  display: inherit;
  inline-size: 140px
}

@media(max-width:991.98px) {
  main.index .highlight__heading {
    font-size: 2.4rem
  }
}

@media(min-width:992px) {
  main.index .highlight__heading {
    font-size: 3.0rem
  }

  main.index .history__container {
    position: relative
  }

  main.index .history__container:before {
    background-image: linear-gradient(180deg, rgba(0, 166, 217, 0) 2%, rgba(0, 166, 217, .6) 52%, rgba(0, 166, 217, 0) 98%);
    block-size: 100%;
    content: "";
    display: block;
    inline-size: 3px;
    left: 395px;
    position: absolute;
    top: 0
  }
}

@media(max-width:991.98px) {
  main.index .history__header {
    border-block-end: 1px solid #00a6d9;
    position: relative
  }

  main.index .history__header:after {
    background-color: #00a6d9;
    block-size: 2px;
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    position: absolute
  }
}

@media(max-width:991.98px)and (max-width:991.98px) {
  main.index .history__header:after {
    inline-size: 120px
  }
}

@media(max-width:991.98px)and (min-width:992px) {
  main.index .history__header:after {
    inline-size: 140px
  }
}

@media(min-width:992px) {
  main.index .history__header {
    align-self: flex-start;
    aspect-ratio: 1;
    background-image: linear-gradient(90deg, rgba(0, 166, 217, .4), rgba(67, 211, 199, .2) 50.33%, rgba(133, 255, 182, 0));
    clip-path: circle();
    position: relative
  }

  main.index .history__header:after {
    aspect-ratio: 1;
    background-image: linear-gradient(90deg, rgba(0, 166, 217, .6), rgba(34, 189, 208, .45) 25.42%, rgba(66, 210, 199, .3) 49.58%, rgba(133, 255, 182, 0));
    clip-path: circle();
    content: "";
    display: flex;
    inline-size: 240px;
    left: 30px;
    position: absolute;
    top: 30px;
    z-index: -1
  }
}

main.index .history__heading {
  font-weight: 700
}

@media(max-width:991.98px) {
  main.index .history__heading {
    font-size: 2.4rem;
    padding-block: 10px
  }
}

@media(min-width:992px) {
  main.index .history__heading {
    align-items: center;
    block-size: 100%;
    display: flex;
    font-size: 3.0rem;
    justify-content: center;
    flex-wrap: wrap;
    width: 240px;
    margin: 0px auto;
    text-align: center;
  }
}

main.index .news__more {
  align-items: center;
  display: inline-flex;
  font-size: 1.6rem;
  gap: .25em
}

main.index .news__more:link,
main.index .news__more:visited {
  color: #919191
}

main.index .news__more:before {
  background: #919191;
  content: "";
  height: 1em;
  -webkit-mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHZpZXdCb3g9IjAgMCA1MCA1MCI+PHBhdGggZD0iTTkuOCAzNy4yIDI1IDIybDE1LjIgMTUuMiA0LjgtNC41LTIwLTIwLTIwIDIweiIvPjwvc3ZnPg==);
  mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHZpZXdCb3g9IjAgMCA1MCA1MCI+PHBhdGggZD0iTTkuOCAzNy4yIDI1IDIybDE1LjIgMTUuMiA0LjgtNC41LTIwLTIwLTIwIDIweiIvPjwvc3ZnPg==);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  transform: rotate(90deg);
  width: 1em
}

main.index .news__item {
  background-image: linear-gradient(90deg, #d7d7d7 6px, transparent 0);
  background-position: left 0 bottom 0;
  background-repeat: repeat-x;
  background-size: 9px 1px
}

html[class~=ie] main.index .news__item {
  background-image: linear-gradient(90deg, #d7d7d7 .6766666667%, transparent 0)
}

main.index .news__item.em .news__date:before {
  color: red;
  content: "*"
}

main.index .news__date {
  color: #919191;
  font-size: 1.5rem
}

main.index .news__title {
  font-size: 1.6rem
}

@media(min-width:992px) {
  main.index .news__title {
    font-size: 1.8rem
  }

  main.index .news__link {
    display: -webkit-box;
    line-height: 1.25;
    overflow: hidden;
    padding: 0 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    -webkit-hyphens: auto;
    hyphens: auto
  }
}

@media(min-width:992px) {
  @supports not (-webkit-line-clamp:1) {
    main.index .news__link {
      height: 1.25em
    }
  }

  html[class~=ie] main.index .news__link {
    display: block;
    height: 1.25em
  }
}

main.index .news__link:active,
main.index .news__link:focus,
main.index .news__link:hover {
  text-decoration: underline
}

main.index .award__heading {
  font-weight: 700;
  padding-block: 10px
}

@media(max-width:991.98px) {
  main.index .award__heading {
    font-size: 2.4rem
  }
}

@media(min-width:992px) {
  main.index .award__heading {
    font-size: 3.0rem
  }
}

main.index .award__more {
  align-items: center;
  display: inline-flex;
  gap: .25em
}

main.index .award__more:link,
main.index .award__more:visited {
  color: #919191
}

main.index .award__more:active,
main.index .award__more:focus,
main.index .award__more:hover {
  color: #919191;
  text-decoration: none
}

main.index .award__more:before {
  background: #919191;
  content: "";
  height: 1em;
  -webkit-mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHZpZXdCb3g9IjAgMCA1MCA1MCI+PHBhdGggZD0iTTkuOCAzNy4yIDI1IDIybDE1LjIgMTUuMiA0LjgtNC41LTIwLTIwLTIwIDIweiIvPjwvc3ZnPg==);
  mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHZpZXdCb3g9IjAgMCA1MCA1MCI+PHBhdGggZD0iTTkuOCAzNy4yIDI1IDIybDE1LjIgMTUuMiA0LjgtNC41LTIwLTIwLTIwIDIweiIvPjwvc3ZnPg==);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  transform: rotate(90deg);
  width: 1em
}

main.index .award__item {
  box-shadow: 0 10px 20px rgba(157, 177, 207, .1);
  transition: all .1s cubic-bezier(.785, .135, .15, .86) .1s
}

main.index .award__back,
main.index .award__front {
  border-radius: 10px
}

main.index .award__front {
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
  background-color: hsla(0, 0%, 100%, .7);
  border: 1px solid rgba(0, 166, 217, .5);
  color: #00a6d9;
  font-size: 2.6rem;
  font-weight: 700;
  padding-inline: 29px 35px
}

main.index .award__back {
  background-color: #00a6d9;
  background-image: url(../images/index-award-bg.svg?9cd7388b99ca40c06635);
  background-position: 100% 100%;
  background-repeat: no-repeat;
  background-size: 146px auto;
  color: #fff;
  text-align: left
}

main.index .award__back dl {
  display: inline-flex;
  flex-direction: column;
  font-size: 1.8rem;
  inline-size: 100%;
  justify-content: center;
  padding-inline: 29px 12px
}

main.index .award__back dt {
  font-size: 2.6rem;
  font-weight: 700
}

main.index .award__back dt .sub {
  font-size: 1.8rem;
  font-weight: 400
}

main.index .award__back dd {
  margin-block-start: 1em
}

main.index .award__back dd em {
  font-size: 2.5rem
}

.index .news .tabber__nav {
  border-block-end: 1px solid #00a6d9
}

.index .news .tabber__item {
  color: #9eb8cf;
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1
}

@media(max-width:991.98px) {
  .index .news .tabber__item {
    padding-block: 15px
  }
}

@media(min-width:992px) {
  .index .news .tabber__item {
    font-size: 3.0rem;
    padding-block-end: 15px
  }
}

.index .news .tabber__item.active,
.index .news .tabber__item:hover {
  background-image: linear-gradient(180deg, #00a6d9, #0d6fae);
  background-repeat: no-repeat;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text
}

.index .news .tabber__item.active {
  border-bottom: 2px solid #00a6d9
}

.index .highlight .tabber__link {
  border: 2px solid;
  border-radius: 20px;
  display: flex;
  font-weight: 700
}

@media(max-width:991.98px) {
  .index .highlight .tabber__link {
    font-size: 1.6rem;
    line-height: 1;
    padding: 5px 18px
  }
}

@media(min-width:992px) {
  .index .highlight .tabber__link {
    font-size: 2rem;
    line-height: 1.3;
    padding: 5px 30px
  }
}

.index .highlight .tabber__item:first-child .tabber__link {
  border-color: rgba(0, 171, 235, .5);
  color: #00abeb
}

.index .highlight .tabber__item:first-child .tabber__link:hover {
  background-color: #00abeb;
  box-shadow: 0 10px 10px rgba(0, 171, 235, .2);
  transition: all .1s cubic-bezier(.785, .135, .15, .86) .1s
}

.index .highlight .tabber__item:nth-child(2) .tabber__link {
  border-color: rgba(237, 106, 2, .5);
  color: #ed6a02
}

.index .highlight .tabber__item:nth-child(2) .tabber__link:hover {
  background-color: #ed6a02;
  box-shadow: 0 10px 10px rgba(237, 106, 2, .2);
  transition: all .1s cubic-bezier(.785, .135, .15, .86) .1s
}

.index .highlight .tabber__item:nth-child(3) .tabber__link {
  border-color: rgba(198, 15, 40, .5);
  color: #c60f28
}

.index .highlight .tabber__item:nth-child(3) .tabber__link:hover {
  background-color: #c60f28;
  box-shadow: 0 10px 10px rgba(198, 15, 40, .2);
  transition: all .1s cubic-bezier(.785, .135, .15, .86) .1s
}

.index .highlight .tabber__item:nth-child(4) .tabber__link {
  border-color: rgba(66, 121, 53, .5);
  color: #427935
}

.index .highlight .tabber__item:nth-child(4) .tabber__link:hover {
  background-color: #427935;
  box-shadow: 0 10px 10px rgba(66, 121, 53, .2);
  transition: all .1s cubic-bezier(.785, .135, .15, .86) .1s
}

.index .highlight .tabber__item:first-child.active .tabber__link {
  background-color: #00abeb;
  box-shadow: 0 10px 10px rgba(0, 171, 235, .2);
  transition: all .1s cubic-bezier(.785, .135, .15, .86) .1s
}

.index .highlight .tabber__item:nth-child(2).active .tabber__link {
  background-color: #ed6a02;
  box-shadow: 0 10px 10px rgba(237, 106, 2, .2);
  transition: all .1s cubic-bezier(.785, .135, .15, .86) .1s
}

.index .highlight .tabber__item:nth-child(3).active .tabber__link {
  background-color: #c60f28;
  box-shadow: 0 10px 10px rgba(198, 15, 40, .2);
  transition: all .1s cubic-bezier(.785, .135, .15, .86) .1s
}

.index .highlight .tabber__item:nth-child(4).active .tabber__link {
  background-color: #427935;
  box-shadow: 0 10px 10px rgba(66, 121, 53, .2);
  transition: all .1s cubic-bezier(.785, .135, .15, .86) .1s
}

.index .highlight .tabber__item .tabber__link:hover,
.index .highlight .tabber__item.active .tabber__link {
  color: #fff
}

.index .spotlight .slider__item-wrapper {
  color: #fff;
  gap: 5px;
  text-shadow: 0 5px 10px rgba(0, 0, 0, .8)
}

@media(max-width:991.98px) {
  .index .spotlight .slider__item-wrapper {
    padding-inline: 37px
  }
}

@media(min-width:992px) {
  .index .spotlight .slider__item-wrapper {
    align-items: flex-end;
    gap: 10px;
    padding-inline: 10%
  }
}

@media(min-width:1200px) {
  .index .spotlight .slider__item-wrapper {
    padding-inline: 10%
  }
}

@media(min-width:1440px) {
  .index .spotlight .slider__item-wrapper {
    padding-inline: 15%
  }
}

.index .highlight .slider__item-wrapper {
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
  background-color: hsla(0, 0%, 100%, .7);
  border-radius: 10px;
  box-shadow: 0 10px 20px rgba(157, 177, 207, .1);
  transition: all .1s cubic-bezier(.785, .135, .15, .86) .1s
}

.index .history .slider__date {
  background-color: #00a6d9;
  color: #fff
}

@media(max-width:991.98px) {
  .index .history .slider__date {
    border-radius: 10px;
    font-size: 1.3rem;
    line-height: 1.5385
  }
}

@media(min-width:992px) {
  .index .history .slider__date {
    border-radius: 20px;
    font-size: 2rem;
    line-height: 1.8
  }
}

.index .spotlight .slider__title {
  font-size: 2.4rem;
  font-weight: 700;
  letter-spacing: 7.2px;
  line-height: 1.2
}

@media(min-width:992px) {
  .index .spotlight .slider__title {
    font-size: 4.8rem;
    inline-size: 580px;
    letter-spacing: 14.4px
  }
}

@media(max-width:991.98px) {
  .index .history .slider__title {
    font-size: 1.6rem
  }
}

@media(min-width:992px) {
  .index .history .slider__title {
    font-size: 1.8rem
  }
}

.index .highlight .slider__title {
  font-size: 1.8rem;
  font-weight: 700;
  text-align: center
}

.index .spotlight .slider__description {
  font-size: 1.8rem
}

@media(min-width:992px) {
  .index .spotlight .slider__description {
    font-size: 3rem;
    inline-size: 580px;
    line-height: 1.2
  }
}

.index .highlight .slider__description {
  color: #838383;
  font-size: 1.8rem;
  text-align: center
}

.index .highlight .slider__result {
  font-size: 3.9rem;
  line-height: 1.175;
  text-align: center
}

.index .highlight .slider__result.small {
  font-size: 3rem
}

.index .highlight .highlight__governance .slider__result {
  color: #00abeb
}

.index .highlight .highlight__rd .slider__result {
  color: #ed6a02
}

.index .highlight .highlight__social .slider__result {
  color: #c60f28
}

.index .highlight .highlight__env .slider__result {
  color: #427935
}

@media(min-width:992px) {
  .index .spotlight .tns-outer {
    -webkit-mask-image: url(../images/index-spotlight-mask.svg?7c890f6238ff312296fc);
    mask-image: url(../images/index-spotlight-mask.svg?7c890f6238ff312296fc);
    -webkit-mask-position: top center;
    mask-position: top center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: auto 845px;
    mask-size: auto 845px
  }
}

.index .spotlight .tns-nav button {
  background-color: #fff;
  block-size: 10px;
  border: 1px solid #c8dced;
  border-radius: 5px;
  inline-size: 10px
}

.index .spotlight .tns-nav button.tns-nav-active {
  background-color: #fc686f;
  border-color: #fc686f;
  inline-size: 20px
}

.index .highlight .tns-nav button {
  background-color: #fff;
  block-size: 10px;
  border: 1px solid #c8dced;
  border-radius: 5px;
  box-shadow: 0 2px 2px rgba(200, 220, 237, .5);
  inline-size: 30px;
  transition: all .1s cubic-bezier(.785, .135, .15, .86) .1s
}

.index .highlight .tns-nav button.tns-nav-active {
  background-color: #fc686f;
  border-color: #fc686f
}

.index .highlight .tns-controls button {
  background-color: transparent;
  border: 0
}

.index .highlight .tns-controls button:before {
  background: hsla(0, 0%, 100%, .8);
  content: "";
  height: 48px;
  -webkit-mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHZpZXdCb3g9IjAgMCA1MCA1MCI+PHBhdGggZD0iTTkuOCAzNy4yIDI1IDIybDE1LjIgMTUuMiA0LjgtNC41LTIwLTIwLTIwIDIweiIvPjwvc3ZnPg==);
  mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHZpZXdCb3g9IjAgMCA1MCA1MCI+PHBhdGggZD0iTTkuOCAzNy4yIDI1IDIybDE1LjIgMTUuMiA0LjgtNC41LTIwLTIwLTIwIDIweiIvPjwvc3ZnPg==);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  transition: all .35s cubic-bezier(.785, .135, .15, .86) .1s;
  width: 48px
}

.index .highlight .tns-controls button:hover:before {
  background-color: #fc686f
}

.visually-hidden {
  block-size: 1px;
  inline-size: 1px;
  position: absolute;
  clip: rect(0, 0, 0, 0);
  border: 0;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  white-space: nowrap
}

.js-layout-row--head {
  block-size: 0;
  inline-size: 100%
}

.hide {
  display: none !important
}

main.index .highlight .slider,
main.index .history .slider,
main.index .spotlight .slider {
  display: none
}

main.index .highlight .slider:has(.tns-item),
main.index .history .slider:has(.tns-item),
main.index .spotlight .slider:has(.tns-item) {
  display: block
}

@media(min-width:992px) {
  main.index .spotlight__container {
    block-size: 845px
  }
}

@media(min-width:1200px) {
  main.index .highlight .tabber__panel {
    block-size: 340px
  }
}




/*文蘭 20241111 修改首頁大banner呈現方式*/
.index .spotlight {
  background-color: #f2f9ff;
}

main.index .spotlight__container {
  block-size: unset;
}

.index .spotlight .slider__picture img {
  left: 0%;
  max-width: none;
  position: relative;
  top: 0%;
  transform: unset;
  width: 100%;
  height: auto;
  /* display: block; 
  aspect-ratio: 16 / 9;*/
  object-fit: fill;
}

.index .spotlight .slider__picture {
  block-size: unset;
}

main.index .yt__header {
  align-items: center;
  display: inline-flex;
  inline-size: 100%;
  justify-content: space-between;
  border-block-end: 1px solid #00a6d9;
  position: relative;
}

main.index .yt__header:after {
  background-color: #00a6d9;
  block-size: 2px;
  bottom: 0;
  content: "";
  display: block;
  left: 0;
  position: absolute;
}

main.index .yt__heading {
  flex: 1 1 0%;
  background-image: linear-gradient(180deg, #00a6d9, #0d6fae);
  background-repeat: no-repeat;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  font-weight: 700;
  padding-block: 10px;
  font-size: 3.6rem;
}




main.index .yt__content {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%;
  /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

main.index .yt__content iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}


@media (max-width: 991.98px) {
  main.index .spotlight {
    border-block-end: 0px solid #fff;
    box-shadow: 0 30px 60px rgba(91, 144, 183, .25);
    transition: all .1s cubic-bezier(.785, .135, .15, .86) .1s;
  }

  main.index .history {
    margin-block-start: 15px;
  }

  #download,
  #backtotop,
  #contact {
    display: none !important;
  }

  .index .spotlight .tns-nav {
    bottom: 10px;
    right: 10px;
    justify-content: flex-end;
  }

  main.index .yt__heading {
    font-size: 2.4rem;
  }

  main.index .yt__header:after {
    inline-size: 120px;
  }

  main.index .yt__container {
    padding-inline: 15px;
    margin-block: 90px 113px;
    gap: 50px;
    display: flex;
    flex-direction: column;
  }
}

@media (min-width: 992px) {
  body {
    background-position: top 270px center;
    /* background-image: unset;
    background-position: top -70px center;
    background-repeat: no-repeat;
    background-size: 2200px auto;*/
  }

  .index .spotlight .tns-outer {
    mask-image: unset;
    mask-position: top center;
    mask-repeat: no-repeat;
    mask-size: auto 845px;
  }

  .index .spotlight .tns-nav {
    right: 0;
    bottom: 70px;
    inline-size: 100%;
    align-items: flex-end;
    margin: 0px auto;
    right: 30px;
    justify-content: flex-end;
  }

  main.index .history {
    block-size: 740px;
    /*margin-block-start: 130px;*/
  }

  .index .history .tns-outer {
    padding-block: 50px 60px;
  }

  main.index .history__header {
    margin-block: 0px 0;
  }

  main.index .yt {
    margin-block-start: 90px;
  }

  main.index .yt__header:after {
    inline-size: 140px;
  }

  main.index .yt__container {
    margin-inline: auto;
    max-inline-size: 984px;
    display: flex;
    flex-direction: column;
    gap: 50px;
  }

}


@media (min-width: 1100px) {
  main.index .history {
    block-size: 830px;
    /* margin-block-start: 130px;*/
  }

  main.index .history__header {
    margin-block: 130px 0;
  }

  .index .history .tns-outer {
    padding-block: 130px 60px;
  }
}