@charset "UTF-8";
@keyframes imageWiggle {
  0%,
  100% {
    transform: scale(1); }
  25% {
    transform: scale(1.1); }
  50% {
    transform: scale(1); }
  75% {
    transform: scale(1.05); } }
@keyframes imageWiggle2 {
  0%,
  100% {
    transform: scale(1) rotate(0deg); }
  25% {
    transform: scale(0.94) rotate(5deg); }
  50% {
    transform: scale(1) rotate(-2deg); }
  75% {
    transform: scale(0.96) rotate(3deg); } }
@keyframes imageWiggle3 {
  0%,
  100% {
    transform: scale(1) rotate(0deg); }
  25% {
    transform: scale(0.94) rotate(-2deg); }
  50% {
    transform: scale(1) rotate(4deg); }
  75% {
    transform: scale(0.96) rotate(-3deg); } }
.detail-hero {
  position: relative;
  color: #fff;
  margin: 3.125em 0em 0em; }
  .detail-hero.js-inview:not(.viewed):before {
    opacity: 0; }
  .detail-hero__body {
    position: absolute;
    inset: 80% 20px auto;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    z-index: 5; }
    @media (max-width: 767.98px) {
      .detail-hero__body {
        top: auto;
        bottom: 2.25rem; } }
  .detail-hero__title {
    text-align: center;
    font-weight: bold;
    line-height: 1;
    font-family: "dunbar-tall", "Poppins", "Microsoft JhengHei", 微軟正黑體, 微軟雅黑體, 細明體_HKSCS, Arial, sans-serif; }
    @media (min-width: 992px) and (max-width: 1599.98px) {
      .detail-hero__title {
        font-size: 0.8125rem; } }
    .detail-hero__title sub {
      vertical-align: baseline;
      font-size: 0.5em; }
  .detail-hero__title-row {
    font-size: 2.5em; }
    @media (min-width: 992px) {
      .detail-hero__title-row {
        font-size: 5em; } }
    @media (max-width: 991.98px) {
      .detail-hero__title-row {
        text-align: center; } }
  .detail-hero__object {
    position: absolute;
    inset: 0 0 20%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 12%; }
    @media (min-width: 768px) {
      .detail-hero__object {
        padding-top: 6.25em; } }
  .detail-hero__key-object {
    flex: 0 0 54%;
    transition: 1.5s cubic-bezier(0, 0, 0.1, 1.01), opacity 0.8s ease-out; }
    @media (max-width: 1599.98px) {
      .detail-hero__key-object {
        flex-basis: 55%; } }
    @media (max-width: 767.98px) {
      .detail-hero__key-object {
        flex-basis: 90%;
        transform: scale(1.2);
        max-width: 26.25rem; } }
    .detail-hero__key-object .media-holder {
      padding-bottom: 75%;
      overflow: visible; }
    .detail-hero__key-object img:first-child {
      transform: scale(1.4); }
    .detail-hero__key-object img:last-child {
      animation: imageWiggle 60s ease-in-out infinite; }
  .detail-hero.js-inview:not(.viewed) .detail-hero__key-object {
    opacity: 0;
    transform: scale(0.75) translate(14%, 0); }
  .detail-hero__object-layer {
    position: absolute;
    top: 0;
    transition: 1.3s ease-out; }
    .detail-hero__object-layer--1 {
      margin-top: 2.8571428571%;
      width: 14.7142857143%;
      left: 13.7142857143%;
      transition-delay: 1s; }
      @media (max-width: 767.98px) {
        .detail-hero__object-layer--1 {
          margin-top: 23.4666666667%;
          width: 26.1333333333%;
          left: -2.3125rem;
          max-width: 6.125rem; } }
      .detail-hero__object-layer--1 img {
        animation: imageWiggle2 40s ease-in-out infinite 3s; }
    .detail-hero__object-layer--2 {
      margin-top: 17.2857142857%;
      width: 21.0714285714%;
      right: -1.4285714286%;
      transition-delay: 1.4s; }
      @media (max-width: 767.98px) {
        .detail-hero__object-layer--2 {
          margin-top: 62.1333333333%;
          width: 37.0666666667%;
          right: -4.9375rem;
          max-width: 8.6875rem; } }
      .detail-hero__object-layer--2 img {
        animation: imageWiggle3 40s ease-in-out infinite 2s; }
    .detail-hero__object-layer--3 {
      top: auto;
      bottom: 0;
      margin-bottom: -1.7142857143%;
      width: 24.2857142857%;
      left: -9.0714285714%;
      transition-delay: 1.4s; }
      @media (max-width: 767.98px) {
        .detail-hero__object-layer--3 {
          margin-bottom: 24%;
          width: 42.9333333333%;
          left: -6.25rem;
          max-width: 10.0625rem; } }
      .detail-hero__object-layer--3 img {
        animation: imageWiggle 40s ease-in-out infinite; }
    .detail-hero__object-layer--4 {
      margin-top: 6.6666666667%;
      width: 17.7083333333%;
      left: -8.8541666667%;
      transition-delay: 1.7s; }
      @media (max-width: 767.98px) {
        .detail-hero__object-layer--4 {
          display: none; } }
      .detail-hero__object-layer--4 img {
        animation: imageWiggle2 40s ease-in-out infinite; }
    .detail-hero__object-layer--5 {
      margin-top: -20.5729166667%;
      width: 15.7291666667%;
      right: 0;
      transition-delay: 2s; }
      @media (max-width: 767.98px) {
        .detail-hero__object-layer--5 {
          margin-top: -27.3417721519%;
          width: 35.9493670886%;
          right: -6.0759493671%;
          max-width: 8.875rem; } }
      .detail-hero__object-layer--5 img {
        animation: imageWiggle3 40s ease-in-out infinite; }
  .detail-hero.js-inview:not(.viewed) .detail-hero__object-layer {
    opacity: 0; }
    .detail-hero.js-inview:not(.viewed) .detail-hero__object-layer--1 {
      transform: scale(1.2) translate(-20%, -20%); }
    .detail-hero.js-inview:not(.viewed) .detail-hero__object-layer--2 {
      transform: scale(1.2) translate(20%, 0%); }
    .detail-hero.js-inview:not(.viewed) .detail-hero__object-layer--3 {
      transform: scale(1.2) translate(-20%, 20%); }
    .detail-hero.js-inview:not(.viewed) .detail-hero__object-layer--4 {
      transform: scale(1.2) translate(-20%, -5%); }
    .detail-hero.js-inview:not(.viewed) .detail-hero__object-layer--5 {
      transform: scale(1.2) translate(20%, -20%); }
  .detail-hero .container {
    position: relative;
    height: 100%; }
  .detail-hero .js-text-fading > span {
    letter-spacing: 0.05em; }

h3 {
  font-size: 1.25em;
  margin-bottom: 0.5em;
  letter-spacing: 0.03em;
  font-weight: 700; }
  @media (max-width: 767.98px) {
    h3 {
      font-size: 1.125rem; } }

.detail-body .container,
.landing-7 .container,
.faq .container {
  max-width: 56.75rem; }
.detail-body .go-btn span,
.landing-7 .go-btn span,
.faq .go-btn span {
  font-weight: 700; }

.detail-body {
  padding: 4.5em 0em; }
  @media (max-width: 575.98px) {
    .detail-body {
      padding: 1.875em 0em; } }
  .detail-body__section:not(:last-child) {
    margin-bottom: 3.75rem; }
    @media (max-width: 575.98px) {
      .detail-body__section:not(:last-child) {
        margin-bottom: 1.875rem; } }
  .detail-body__flex {
    counter-reset: q; }
    @media (min-width: 576px) {
      .detail-body__flex {
        display: flex;
        margin: 1.25em -8px 0;
        width: calc(100% + 16px); } }
  .detail-body__flex-item {
    flex: 0 0 33.33%;
    padding: 0 8px;
    counter-increment: q; }
    @media (max-width: 575.98px) {
      .detail-body__flex-item {
        padding: 1.875em 0em 0em; } }
  .detail-body__item-img {
    margin-bottom: 1.25em; }
    .detail-body__item-img .media-holder {
      padding-bottom: 82.7338129496%; }
  .detail-body__item-desc:before {
    content: "Q" counter(q);
    display: block;
    margin-bottom: 0.625em; }
  .detail-body--green {
    color: #fff;
    background-color: #D36ECD;
    background-image: linear-gradient(100deg, #4cde7f 0%, #5dc481 40%, #287e47 100%);
    background-position: center;
    background-size: cover; }
    .detail-body--green h3 {
      color: #fff; }
  .detail-body--purple {
    color: #fff;
    background-color: #D36ECD;
    background-image: linear-gradient(120deg, #D36ECD 0%, #8D5489 100%);
    background-position: center;
    background-size: cover; }
    .detail-body--purple h3 {
      color: #fff; }
  .detail-body .go-btn {
    display: inline-flex;
    margin: 0rem 1.25rem 0.625rem 0rem;
    border: 1px solid #D36ECD; }
    @media (max-width: 767.98px) {
      .detail-body .go-btn {
        margin: 0 0 0.625rem;
        display: flex; } }
  @media (max-width: 767.98px) {
    .detail-body .static {
      font-size: 0.875rem; } }
  .detail-body table.list {
    border: none; }
    .detail-body table.list td {
      padding: 0;
      border: none; }

@media (max-width: 767.98px) {
  .landing-7__body {
    padding-left: 0;
    padding-right: 0; } }
.landing-7__btn {
  width: 100%;
  border-radius: 30px;
  height: auto; }
.landing-7 .container {
  flex: 0 0 100%;
  width: 100%; }
.landing-7 .accordion {
  background-color: #fff;
  border-radius: 1.875rem;
  border: 1px solid #D36ECD;
  padding: 5px 5px 5px 30px; }
  .landing-7 .accordion.active {
    padding-bottom: 30px; }
  .landing-7 .accordion__btn {
    display: flex;
    justify-content: space-between;
    width: 100%; }
  .landing-7 .accordion__body {
    padding-top: 2em;
    padding-right: 24px; }
  .landing-7 .accordion span {
    align-self: center;
    font-weight: 700;
    text-align: left; }
  .landing-7 .accordion .icon {
    font-size: 3.125em;
    border-radius: 999px;
    color: #D36ECD; }
  .landing-7 .accordion.active .icon-open {
    display: none; }
  .landing-7 .accordion:not(.active) .icon-close {
    display: none; }
.landing-7 h4 {
  font-size: 1em;
  font-weight: 400; }

.faq {
  padding: 3.75em 0;
  background-image: linear-gradient(120deg, #D36ECD 0%, #8D5489 100%);
  color: #fff;
  counter-reset: faq; }
  .faq__item {
    border-bottom: 1px solid;
    margin-bottom: 1.875rem;
    counter-increment: faq; }
  .faq__item-head {
    display: flex;
    align-items: center;
    padding-bottom: 1.25em;
    width: 100%; }
    .faq__item-head span {
      margin-right: auto;
      text-align: left;
      font-size: 1.25em;
      line-height: 1.5;
      max-width: 41.875rem; }
      @media (max-width: 575.98px) {
        .faq__item-head span {
          font-size: 1.125em; } }
      .faq__item-head span:before {
        content: "Q" counter(faq);
        display: block;
        font-size: 1rem;
        line-height: 1;
        margin-bottom: 0.625rem; }
    .faq__item-head .icon {
      font-size: 1.75em;
      margin-left: 1em;
      transition: 0.5s ease; }
      @media (max-width: 575.98px) {
        .faq__item-head .icon {
          font-size: 1.125em; } }
  .faq__item.active .icon-down {
    transform: scaleY(-1); }
  .faq__item-body {
    padding-bottom: 1.875em; }
    .faq__item-body .static {
      font-size: 0.875em;
      line-height: 1.4285714286;
      max-width: 41.875rem; }
      .faq__item-body .static a {
        text-decoration: underline; }
  .faq__flex {
    display: flex;
    justify-content: center; }
  .faq h3 {
    color: #fff;
    margin-bottom: 1.875rem; }

.key-object {
  position: absolute;
  inset: 0;
  z-index: 14;
  pointer-events: none !important;
  transition: transform 1s ease; }
  .key-object .media-holder {
    padding-bottom: 100%; }
  .key-object .ratio-holder {
    position: absolute;
    width: 100%;
    height: 100%;
    padding: 0; }
  .key-object .tram_three {
    width: 100%;
    height: 100%;
    transition: 0.8s ease; }
    .key-object .tram_three:not(.on-show) {
      opacity: 0; }
  .key-object canvas {
    width: 100%;
    height: 100%; }

.supporter-list {
  position: relative;
  background-color: #fff;
  padding: 2.625em; }
  .\32 024-recap .supporter-list {
    padding: 3.75em 2.625em;
    border-radius: 1.25rem; }
    @media (max-width: 767.98px) {
      .\32 024-recap .supporter-list {
        padding: 1.25em 0.3125em; } }
    @media (min-width: 768px) {
      .\32 024-recap .supporter-list__flex--1 {
        flex-wrap: wrap; } }
    @media (min-width: 768px) {
      .\32 024-recap .supporter-list__flex--1 .supporter-list__sec {
        flex: unset; } }
    @media (max-width: 767.98px) {
      .\32 024-recap .supporter-list__flex--1 .supporter-list__sec {
        flex: 0 0 100%;
        max-width: 100%; } }
    .\32 024-recap .supporter-list__flex--1 .supporter-list__img-item {
      display: flex;
      flex-wrap: nowrap;
      gap: 0.625em;
      align-items: center; }
      @media (max-width: 767.98px) {
        .\32 024-recap .supporter-list__flex--1 .supporter-list__img-item {
          flex-wrap: wrap;
          gap: 2em; } }
    @media (max-width: 767.98px) {
      .\32 024-recap .supporter-list__flex--1 .supporter-list__top-img {
        flex: 0 0 calc(50% - 1rem); } }
    .\32 024-recap .supporter-list__sec-img-list {
      width: 100%; }
  .supporter-list__flex {
    display: flex;
    flex-wrap: wrap;
    width: calc(100% + 32px);
    margin: 0 -16px 1em; }
  .supporter-list__sec {
    padding: 0 16px; }
  .supporter-list__flex--1 {
    flex-wrap: nowrap; }
    @media (max-width: 767.98px) {
      .supporter-list__flex--1 {
        flex-wrap: wrap; } }
  .supporter-list__flex--1 .supporter-list__sec {
    flex: 0 0 20%; }
    @media (max-width: 767.98px) {
      .supporter-list__flex--1 .supporter-list__sec {
        flex: 0 0 50%; } }
  .supporter-list__flex--2 .supporter-list__sec {
    flex: 0 0 100%; }
  .supporter-list__sec-title {
    color: #D36ECD;
    margin-bottom: 0.625em;
    white-space: nowrap; }
    @media (max-width: 767.98px) {
      .supporter-list__sec-title {
        white-space: normal; } }
  .supporter-list__flex--2 .supporter-list__sec-img-list {
    display: flex;
    flex-wrap: wrap;
    width: calc(100% + 32px);
    margin: 0 -16px; }
  .supporter-list__flex--2 .supporter-list__img-item {
    flex: 0 0 20%;
    padding: 0 16px;
    margin-bottom: 0.75em; }
    @media (max-width: 767.98px) {
      .supporter-list__flex--2 .supporter-list__img-item {
        flex: 0 0 50%; } }
  .supporter-list__top-img {
    min-height: 4.375rem;
    display: flex;
    align-items: center;
    justify-content: center; }
  .supporter-list .media-holder {
    padding-bottom: 44.578313253%; }
  .supporter-list .container {
    max-width: 62.875rem; }

/*# sourceMappingURL=inner.css.map */