@charset "UTF-8";
.main-container {
  max-width: none;
}

.content-tab {
  padding-left: 0;
  padding-right: 0;
}

.content {
  width: 100%;
  padding: 0;
}

body {
  font-family: Calibri, Arial, "Microsoft JhengHei", "微軟正黑體", sans-serif, sans-serif;
  color: #333;
  padding-left: 0;
  padding-right: 0;
  line-height: normal;
  font-size: 18px;
}

body * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

body select, body input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

body .max-md {
  max-width: 600px;
  margin: auto;
}

body .max-lg {
  max-width: 860px;
  margin: auto;
}

body .link-line {
  text-decoration: underline;
}

body .link-line:hover, body .link-line:active, body .link-line:foucs, body .link-line:visited {
  text-decoration: underline;
  color: #EC1B2E;
}

body .container {
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  body .container {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  body .container {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  body .container {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  body .container {
    max-width: 1140px;
  }
}

body h2 {
  font-size: 36px;
}

body h3 {
  font-size: 20px;
  line-height: normal;
  margin-bottom: 20px;
}

body ul {
  margin-bottom: 30px;
}

body ul li {
  font-size: 18px;
  line-height: normal;
}

body ::-webkit-input-placeholder {
  color: rgba(0, 0, 0, 0.3);
}

body .row::after {
  content: " ";
  display: block;
  clear: both;
}

body .col {
  width: 100%;
  float: left;
  border: 0;
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
}

body .col.col-1 {
  width: 8.33333%;
}

body .col.col-2 {
  width: 16.66667%;
}

body .col.col-3 {
  width: 25%;
}

body .col.col-4 {
  width: 33.33333%;
}

body .col.col-5 {
  width: 41.66667%;
}

body .col.col-6 {
  width: 50%;
}

body .col.col-7 {
  width: 58.33333%;
}

body .col.col-8 {
  width: 66.66667%;
}

body .col.col-9 {
  width: 75%;
}

body .col.col-10 {
  width: 83.33333%;
}

body .col.col-11 {
  width: 91.66667%;
}

body .col.col-12 {
  width: 100%;
}

@media (min-width: 769px) {
  body .col.col-md-1 {
    width: 8.33333%;
  }
  body .col.col-md-2 {
    width: 16.66667%;
  }
  body .col.col-md-3 {
    width: 25%;
  }
  body .col.col-md-4 {
    width: 33.33333%;
  }
  body .col.col-md-5 {
    width: 41.66667%;
  }
  body .col.col-md-6 {
    width: 50%;
  }
  body .col.col-md-7 {
    width: 58.33333%;
  }
  body .col.col-md-8 {
    width: 66.66667%;
  }
  body .col.col-md-9 {
    width: 75%;
  }
  body .col.col-md-10 {
    width: 83.33333%;
  }
  body .col.col-md-11 {
    width: 91.66667%;
  }
  body .col.col-md-12 {
    width: 100%;
  }
}

body p {
  font-size: 18px;
  line-height: normal;
}

body .txt-remark {
  font-size: 14px;
}

body .btn-green {
  border-radius: 4px;
  background: #26a43a;
  color: #fff;
  display: inline-block;
  padding: 13px 15px 11px;
  font-weight: bold;
  cursor: pointer;
  font-size: 22px;
}

body .btn-green:hover {
  background: #1c7b2b;
  -webkit-transition: 300ms ease;
  transition: 300ms ease;
}

body .fs-xl {
  font-size: 36px;
}

body .fs-lg {
  font-size: 24px;
}

body .fs-md {
  font-size: 18px;
}

body .fs-sm {
  font-size: 14px;
}

.txt-left {
  text-align: left;
}

.txt-right {
  text-align: right;
}

.txt-center {
  text-align: center;
}

.txt-wrap {
  display: inline-block;
}

.txt-sm, p.txt-sm {
  font-size: 14px !important;
  line-height: normal;
}

.txt-sm a, p.txt-sm a {
  font-size: 14px !important;
}

.link-line {
  color: #68737A;
  text-decoration: none;
  text-decoration: underline;
}

.link-line:visited {
  color: #68737A;
  text-decoration: none;
}

.link-line:hover, .link-line:focus {
  color: #EC1B2E;
  text-decoration: none;
}

.link-line:active {
  color: #EC1B2E;
  text-decoration: none;
}

.link-line:hover, .link-line:active, .link-line:focus {
  text-decoration: underline;
}

.txt-grey {
  color: #68737A;
}

.txt-section-title {
  font-size: 36px;
  line-height: 3rem;
  margin-bottom: 30px;
  padding: 0;
  font-weight: bold;
  width: 100%;
}

.txt-download {
  display: block;
  margin-top: 15px;
  font-size: 16px;
  vertical-align: middle;
}

.txt-download:hover {
  text-decoration: underline;
}

.txt-download::after {
  content: "";
  display: inline-block;
  width: 13px;
  height: 13px;
  background-image: url(../images/icon-download.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  margin-left: 4px;
}

.txt-with-arrow::after {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f078";
  -webkit-transform: translate(0, 30%);
  transform: translate(0, 30%);
  padding-left: 8px;
  font-size: .6em;
  vertical-align: super;
  display: inline-block;
}

.s-slider {
  visibility: hidden;
  opacity: 0;
  position: fixed;
  overflow: hidden;
  -webkit-transition: 2s opacity ease;
  transition: 2s opacity ease;
}

.s-slider .slick-list {
  z-index: 100;
}

.s-slider .slide {
  position: absolute;
  background: transparent;
  opacity: 0;
  -webkit-transition: 2s opacity ease;
  transition: 2s opacity ease;
}

.s-slider .slide.slick-slide {
  opacity: 1;
}

.s-slider .slide:before {
  content: "";
  position: absolute;
  height: 50px;
  width: 50px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background: url(../images/slide_loader_150.gif) center no-repeat;
  background-size: contain;
  opacity: 0.2;
  z-index: -1;
}

.s-slider .slide .slide-content {
  width: 962px;
  height: calc(100vw / 1.5);
  max-height: 642px;
  max-width: 100vw;
  border: 1px solid #ccc;
  position: fixed;
  left: 50vw;
  top: 50%;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: transform 0.4s ease-out, opacity 0.5s ease-out;
  -webkit-transition: opacity 0.5s ease-out, -webkit-transform 0.4s ease-out;
  transition: opacity 0.5s ease-out, -webkit-transform 0.4s ease-out;
  transition: transform 0.4s ease-out, opacity 0.5s ease-out;
  transition: transform 0.4s ease-out, opacity 0.5s ease-out, -webkit-transform 0.4s ease-out;
}

.s-slider .slide .slide-content img {
  width: 100%;
  background-color: white;
}

.s-slider .slide .slide-content .area-prev, .s-slider .slide .slide-content .area-next {
  position: absolute;
  height: 50%;
  width: 100%;
  left: 0;
  background: rgba(255, 255, 255, 0);
  opacity: 0;
  z-index: 999;
}

.s-slider .slide .slide-content .area-prev {
  top: 0;
}

.s-slider .slide .slide-content .area-next {
  bottom: 0;
}

.s-slider .slide .slide-content .slide-svg {
  position: absolute;
  background: none;
  background: inherit;
}

.s-slider .slide.prev .slide-content {
  -webkit-transform: translate(-50%, -55%);
  transform: translate(-50%, -55%);
}

.s-slider .slide.next .slide-content {
  -webkit-transform: translate(-50%, -45%);
  transform: translate(-50%, -45%);
}

.s-slider .slide.slick-active .slide-content {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: opacity 0 ease-out;
  transition: opacity 0 ease-out;
}

.s-slider .slick-dots {
  position: fixed;
  top: 50%;
  right: 10px;
  bottom: 0;
  width: 40px;
  height: 310px;
  z-index: 300;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

.s-slider .slick-dots li {
  width: 30px;
  height: 20px;
}

.s-slider .slick-dots li button {
  width: 30px;
  height: 20px;
}

.s-slider .slick-dots li button:before {
  -webkit-transition: opacity 0.2s ease, font-size 0.2s ease;
  transition: opacity 0.2s ease, font-size 0.2s ease;
  opacity: 1;
  font-size: 30px;
  line-height: 20px;
  width: 30px;
  height: 20px;
  content: '\2022';
}

@media (max-width: 768px) {
  .s-slider .slick-dots li button:before {
    font-size: 20px;
  }
}

.s-slider .slick-dots li.slick-active button:before {
  font-size: 60px;
  z-index: -1;
}

@media (max-width: 768px) {
  .s-slider .slick-dots li.slick-active button:before {
    font-size: 40px;
  }
}

.s-slider .slick-arrow {
  position: fixed;
  left: 0;
  width: 100%;
  height: calc((100vh - 640px) / 2);
  z-index: 101;
}

@media (max-width: 960px) {
  .s-slider .slick-arrow {
    height: calc((100vh - (100vw/1.5)) / 2);
  }
}

.s-slider .slick-arrow.slick-next {
  top: auto;
  bottom: 0;
  -webkit-transform: none;
  transform: none;
}

.s-slider .slick-arrow.slick-next:before {
  content: '';
}

.s-slider .slick-arrow.slick-prev {
  top: 0;
  bottom: auto;
  -webkit-transform: none;
  transform: none;
}

.s-slider .slick-arrow.slick-prev:before {
  content: '';
}

.s-slider.slick-initialized {
  visibility: visible;
  opacity: 1;
  position: fixed;
  width: 100vw;
  overflow: hidden;
}

.s-slider.mobile .slide .slide-content {
  width: 95vw;
  height: calc(95vw / 1.5);
  min-height: auto;
}

@media (orientation: landscape) {
  .s-slider.mobile .slide .slide-content {
    width: calc(64vh * 1.5);
    max-height: 64vh;
  }
}

.s-slider.mobile .slick-dots {
  display: none;
}

.s-slider.mobile .slick-arrow {
  height: calc((100% - (95vw / 1.5)) / 2);
}

@media (orientation: landscape) {
  .s-slider.mobile .slick-arrow {
    height: 18vh;
  }
}

.b-lang {
  position: fixed;
  top: 10px;
  right: 10px;
  font-size: 20px;
  font-weight: 400;
  z-index: 5001;
}

@media (orientation: landscape) and (min-width: 800px) and (max-width: 1023px) {
  .b-lang {
    top: 4px;
    right: 50px;
  }
}

.b-lang .wrap ul {
  list-style: none;
  display: inline-block;
  padding: 0;
  margin: 0;
}

.b-lang .wrap ul li {
  display: inline-block;
  cursor: pointer;
  color: #333;
  margin: 0 4px;
  padding: 8px 8px;
  opacity: 0.75;
  -webkit-transition: color 0.2s;
  transition: color 0.2s;
}

.b-lang .wrap ul li:hover {
  opacity: 1;
}

.b-lang .wrap ul li.active {
  cursor: inherit;
  opacity: 0.3;
}

.b-links {
  position: absolute;
  z-index: 99;
  height: 100%;
  width: 100%;
}

.b-links a {
  z-index: 1001;
}

.b-links .box-link {
  position: absolute;
  -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
          box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
  border-radius: 6px;
  -webkit-transition: box-shadow 0.2s;
  -webkit-transition: -webkit-box-shadow 0.2s;
  transition: -webkit-box-shadow 0.2s;
  transition: box-shadow 0.2s;
  transition: box-shadow 0.2s, -webkit-box-shadow 0.2s;
  z-index: 1001;
}

.b-links .box-link:hover, .b-links .box-link:focus {
  -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.08);
          box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.08);
}

.b-links #link-hkei-logo {
  width: 24.5%;
  height: 23.5%;
  top: 9.6%;
  left: 5%;
}

.b-links #link-AR2021 {
  width: 17.5%;
  height: 32.5%;
  top: 38.6%;
  left: 26%;
}

.b-links #link-SR2021 {
  width: 19%;
  height: 32.5%;
  top: 38.6%;
  left: 53.2%;
}

.b-links #link-hkei-logo2 {
  height: 18%;
  width: 23%;
  bottom: 3.8%;
  right: 1.9%;
}

.b-links #link-slide4-1 {
  height: 9%;
  width: 9%;
  top: 46%;
  left: 24.5%;
}

.b-links #link-slide5-1 {
  height: 5.8%;
  width: 12%;
  top: 55.6%;
  left: 35%;
}

.b-links #link-slide6-1 {
  height: 6%;
  width: 12%;
  top: 51.4%;
  left: 76.5%;
}

.b-links #link-slide8-1 {
  height: 6%;
  width: 12%;
  top: 53.5%;
  left: 80.7%;
}

.b-links #link-slide10-1 {
  height: 6%;
  width: 12%;
  top: 42.7%;
  left: 74.8%;
}

.b-links #link-slide11-1 {
  height: 6%;
  width: 12%;
  top: 54%;
  left: 34.4%;
}

.b-links #link-tc-slide4-1 {
  height: 9%;
  width: 7%;
  top: 50%;
  left: 26.5%;
}

.b-links #link-tc-slide5-1 {
  height: 5.6%;
  width: 11%;
  top: 54.8%;
  left: 33.5%;
}

.b-links #link-tc-slide6-1 {
  height: 9%;
  width: 7%;
  top: 50.6%;
  left: 76.2%;
}

.b-links #link-tc-slide8-1 {
  height: 8%;
  width: 7%;
  top: 50.7%;
  left: 84.6%;
}

.b-links #link-tc-slide9-1 {
  height: 8.3%;
  width: 7%;
  top: 52%;
  left: 34.5%;
}

.b-links #link-tc-slide9-2 {
  height: 8.2%;
  width: 7%;
  top: 22%;
  left: 74.7%;
}

.b-links #link-tc-slide10-1 {
  height: 8.3%;
  width: 7%;
  top: 73%;
  left: 43.3%;
}

.b-links #link-tc-slide10-2 {
  height: 8.3%;
  width: 7%;
  top: 41.4%;
  left: 80.3%;
}

.b-tab-indicator {
  position: fixed;
  width: 95vw;
  max-width: 960px;
  display: none;
  margin: 0 auto;
  left: 0;
  right: 0;
  bottom: 30px;
  z-index: 10;
  opacity: 0;
  text-align: center;
  -webkit-transition: opacity 0.8s ease;
  transition: opacity 0.8s ease;
}

.b-tab-indicator .wrap {
  display: inline-block;
  padding: 6px 20px 10px;
  background: rgba(255, 255, 255, 0.82);
  border-radius: 50px;
}

.b-tab-indicator .wrap .ic-touch {
  width: 30px;
  height: 30px;
  display: inline-block;
  margin: 0 -30px 0 0;
  vertical-align: middle;
  position: absolute;
}

.b-tab-indicator .wrap p {
  margin: 0;
  display: inline-block;
  vertical-align: middle;
  margin-left: 35px;
  font-size: 12px;
  line-height: 14px;
  color: #000;
  text-align: left;
}

@media (max-width: 420px) {
  .b-tab-indicator .wrap p {
    font-size: 9px;
  }
}

.b-tab-indicator .wrap p .txt-wrap {
  display: inline-block;
}

.b-tab-indicator.mobile {
  display: inline-block;
}

.b-tab-indicator.active {
  opacity: 1;
}

.b-preloader {
  opacity: 1;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 100vh;
  width: 100vw;
  z-index: 5000;
}

.b-preloader .bg-white {
  position: absolute;
  opacity: 0;
  height: 100%;
  width: 100%;
  background: #ffffff;
  -webkit-transition: opacity 0.4s ease;
  transition: opacity 0.4s ease;
}

.b-preloader .bg-white img {
  position: absolute;
  height: 50px;
  width: 50px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 1;
}

.b-preloader.active .bg-white {
  opacity: 1;
}

.b-preloader.hidden {
  opacity: 0;
  display: none;
  z-index: -10;
}

.b-preloader .img-preload {
  opacity: 0;
  position: absolute;
  left: -10000px;
  z-index: -10;
}

.b-preloader .img-preload img {
  position: absolute;
  height: 0;
  width: 0;
}

.b-landing-animation {
  background: white;
  position: absolute;
  height: 100%;
  width: 100%;
}

.b-landing-animation #ani-canvas {
  position: absolute;
  height: 100%;
  width: 100%;
  overflow: hidden;
  z-index: 1;
}

.b-landing-animation #ani-canvas .ani-group {
  position: absolute;
  height: 100%;
  width: 100%;
}

.b-landing-animation #ani-canvas .ani-group span {
  position: absolute;
  display: block;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: contain;
}

.b-landing-animation #ani-canvas .ani-group #txt-logo {
  background-image: url("../images/landing/txt_hkei-logo.png");
  width: 21.67%;
  height: 20.08%;
  left: 6.2%;
  top: 10.78%;
  z-index: 40;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1-chi-mask,
.b-landing-animation #ani-canvas .ani-group #txt-headline2-chi-mask,
.b-landing-animation #ani-canvas .ani-group #txt-headline3-chi-mask,
.b-landing-animation #ani-canvas .ani-group #txt-headline1a-mask,
.b-landing-animation #ani-canvas .ani-group #txt-headline1b-mask,
.b-landing-animation #ani-canvas .ani-group #txt-headline2-mask,
.b-landing-animation #ani-canvas .ani-group #txt-headline3-mask {
  background: white;
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(10%, white), to(white));
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, white 10%, white 100%);
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1a-mask {
  width: 26.36%;
  height: 3.44%;
  left: 66.66%;
  top: 59.22%;
  z-index: 6;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1a {
  background-image: url("../images/landing/txt_headline1a.png");
  width: 20.36%;
  height: 3.44%;
  left: 72.66%;
  top: 59.22%;
  z-index: 5;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1b-mask {
  width: 17.35%;
  height: 2.73%;
  left: 75.88%;
  top: 63.44%;
  z-index: 6;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1b {
  background-image: url("../images/landing/txt_headline1b.png");
  width: 11.35%;
  height: 2.73%;
  left: 81.88%;
  top: 63.44%;
  z-index: 5;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline2-mask {
  width: 30.11%;
  height: 8.13%;
  left: 62.96%;
  top: 70.86%;
  z-index: 6;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline2 {
  background-image: url("../images/landing/txt_headline2.png");
  width: 24.11%;
  height: 8.13%;
  left: 68.96%;
  top: 70.86%;
  z-index: 5;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline3-mask {
  width: 43.14%;
  height: 5.94%;
  left: 50.04%;
  top: 80.55%;
  z-index: 6;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline3 {
  background-image: url("../images/landing/txt_headline3.png");
  width: 37.14%;
  height: 5.94%;
  left: 56.04%;
  top: 80.55%;
  z-index: 5;
}

.b-landing-animation #ani-canvas .ani-group #txt-logo-chi {
  background-image: url("../images/landing/txt_hkei-logo-chi.png");
  width: 21.72%;
  height: 20.23%;
  left: 6.2%;
  top: 10.78%;
  z-index: 40;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1-chi-mask {
  width: 23.14%;
  height: 3.36%;
  left: 69.78%;
  top: 63.36%;
  z-index: 6;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1-chi {
  background-image: url("../images/landing/txt_headline1-chi.png");
  width: 17.14%;
  height: 3.36%;
  left: 75.78%;
  top: 63.36%;
  z-index: 5;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline2-chi-mask {
  width: 27.82%;
  height: 7.58%;
  left: 64.94%;
  top: 70.55%;
  z-index: 6;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline2-chi {
  background-image: url("../images/landing/txt_headline2-chi.png");
  width: 21.82%;
  height: 7.58%;
  left: 70.94%;
  top: 70.55%;
  z-index: 5;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline3-chi-mask {
  width: 40.17%;
  height: 7.58%;
  left: 52.8%;
  top: 81.02%;
  z-index: 6;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline3-chi {
  background-image: url("../images/landing/txt_headline3-chi.png");
  width: 34.17%;
  height: 7.58%;
  left: 58.8%;
  top: 81.02%;
  z-index: 5;
}

.b-landing-animation #ani-canvas .ani-group .dot-red {
  background-image: url("../images/landing/dot-red.png");
  width: 0.94%;
  height: 1.41%;
  z-index: 41;
}

.b-landing-animation #ani-canvas .ani-group .dot-grey {
  background-image: url("../images/landing/dot-grey.png");
  width: 0.94%;
  height: 1.41%;
  z-index: 41;
}

.b-landing-animation #ani-canvas .ani-group #dot-outer-1 {
  left: 60.42%;
  top: 66.25%;
}

.b-landing-animation #ani-canvas .ani-group #dot-outer-2 {
  left: 70.1%;
  top: 45.31%;
}

.b-landing-animation #ani-canvas .ani-group #dot-outer-3 {
  left: 73.54%;
  top: 2.73%;
}

.b-landing-animation #ani-canvas .ani-group #dot-inner1 {
  left: 46.61%;
  top: 39.77%;
}

.b-landing-animation #ani-canvas .ani-group #dot-inner2 {
  left: 38.23%;
  top: 55%;
}

.b-landing-animation #ani-canvas .ani-group #dot-inner3 {
  left: 39.01%;
  top: 67.58%;
}

.b-landing-animation #ani-canvas .ani-group #dot-inner4 {
  left: 38.7%;
  top: 38.91%;
}

.b-landing-animation #ani-canvas .ani-group #dot-inner5 {
  left: 59.27%;
  top: 20.39%;
}

.b-landing-animation #ani-canvas .ani-group #dot-energy1 {
  background-image: url("../images/landing/dot-energy1.png");
  width: 10.63%;
  height: 22.34%;
  left: 60.42%;
  top: 45.31%;
  z-index: 30;
}

.b-landing-animation #ani-canvas .ani-group #dot-energy2 {
  background-image: url("../images/landing/dot-energy2.png");
  width: 1.04%;
  height: 1.56%;
  left: 73.44%;
  top: 2.66%;
  z-index: 30;
}

.b-landing-animation #ani-canvas .ani-group #deco-line1 {
  background-image: url("../images/landing/deco-line1.png");
  width: 3.28%;
  height: 10%;
  left: 60%;
  top: 37.19%;
  z-index: 30;
}

.b-landing-animation #ani-canvas .ani-group #deco-line2 {
  background-image: url("../images/landing/deco-line2.png");
  width: 4.53%;
  height: 16.25%;
  left: 66.3%;
  top: 10.94%;
  z-index: 30;
}

.b-landing-animation #ani-canvas .ani-group #deco-line3-mask {
  background: white;
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(255, 255, 255, 0)), color-stop(10%, white), to(white));
  background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, white 10%, white 100%);
  width: 100%;
  height: 30%;
  top: 0;
  left: 0;
  z-index: 9;
}

.b-landing-animation #ani-canvas .ani-group #deco-line3 {
  background-image: url("../images/landing/deco-line3.png");
  width: 13.75%;
  height: 32.81%;
  left: 72.03%;
  top: 0;
  z-index: 8;
}

.b-landing-animation #ani-canvas .ani-group #deco-line4 {
  background-image: url("../images/landing/deco-line4.png");
  width: 2.92%;
  height: 23.36%;
  left: 72.71%;
  top: 0;
  z-index: 11;
}

.b-landing-animation #ani-canvas .ani-group #deco-leaf-line {
  background-image: url("../images/landing/deco-leaf-line.png");
  width: 11.3%;
  height: 26.88%;
  left: 27.71%;
  top: 68.2%;
  z-index: 26;
}

.b-landing-animation #ani-canvas .ani-group #deco-energybar-mask {
  height: 100%;
  width: 100%;
  background: white;
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(255, 255, 255, 0)), color-stop(15%, white), to(white));
  background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, white 15%, white 100%);
  z-index: 12;
}

.b-landing-animation #ani-canvas .ani-group #deco-energybar {
  background-image: url("../images/landing/deco-energybar.png");
  width: 44.27%;
  height: 54.53%;
  left: 26.67%;
  top: 45.47%;
  z-index: 11;
}

.b-landing-animation #ani-canvas .ani-group #img-intro1 {
  background-image: url("../images/landing/img-intro1.png");
  width: 15%;
  height: 23.75%;
  left: 38.44%;
  top: 37.66%;
  z-index: 16;
}

.b-landing-animation #ani-canvas .ani-group #img-intro2 {
  background-image: url("../images/landing/img-intro2.png");
  width: 23.75%;
  height: 22.81%;
  left: 35.83%;
  top: 11.09%;
  z-index: 20;
}

.b-landing-animation #ani-canvas .ani-group #img-intro3 {
  background-image: url("../images/landing/img-intro3.png");
  width: 13.96%;
  height: 17.97%;
  left: 41.77%;
  top: 54.06%;
  z-index: 20;
}

.b-landing-animation #ani-canvas .ani-group #img-intro4 {
  background-image: url("../images/landing/img-intro4.png");
  width: 14.38%;
  height: 47.97%;
  left: 57.92%;
  top: 13.44%;
  z-index: 20;
}

.b-landing-animation #ani-canvas .ani-group #bg-leaf1 {
  background-image: url("../images/landing/bg-leaf1.png");
  width: 23.33%;
  height: 35.94%;
  left: 35.31%;
  top: 29.38%;
  z-index: 15;
}

.b-landing-animation #ani-canvas .ani-group #bg-leaf2 {
  background-image: url("../images/landing/bg-leaf2.png");
  width: 33.96%;
  height: 51.56%;
  left: 31.67%;
  top: 18.44%;
  z-index: 14;
}

.b-landing-animation #ani-canvas .ani-group #bg-leaf3 {
  background-image: url("../images/landing/bg-leaf3.png");
  width: 47.19%;
  height: 92.97%;
  left: 26.98%;
  top: 2.97%;
  z-index: 13;
}

.b-landing-animation #ani-canvas .ani-group #img-intro1,
.b-landing-animation #ani-canvas .ani-group #bg-leaf1,
.b-landing-animation #ani-canvas .ani-group #dot-inner1,
.b-landing-animation #ani-canvas .ani-group #dot-inner2,
.b-landing-animation #ani-canvas .ani-group #bg-leaf2,
.b-landing-animation #ani-canvas .ani-group #dot-inner3,
.b-landing-animation #ani-canvas .ani-group #dot-inner4,
.b-landing-animation #ani-canvas .ani-group #bg-leaf3,
.b-landing-animation #ani-canvas .ani-group #dot-inner5,
.b-landing-animation #ani-canvas .ani-group #bg-leaf4,
.b-landing-animation #ani-canvas .ani-group #img-intro2,
.b-landing-animation #ani-canvas .ani-group #img-intro3,
.b-landing-animation #ani-canvas .ani-group #img-intro4,
.b-landing-animation #ani-canvas .ani-group #deco-leaf-line,
.b-landing-animation #ani-canvas .ani-group #deco-energybar,
.b-landing-animation #ani-canvas .ani-group #dot-outer-1,
.b-landing-animation #ani-canvas .ani-group #dot-outer-2,
.b-landing-animation #ani-canvas .ani-group #dot-outer-3,
.b-landing-animation #ani-canvas .ani-group #deco-line1,
.b-landing-animation #ani-canvas .ani-group #deco-line2,
.b-landing-animation #ani-canvas .ani-group #deco-line3,
.b-landing-animation #ani-canvas .ani-group #deco-line4,
.b-landing-animation #ani-canvas .ani-group #txt-logo,
.b-landing-animation #ani-canvas .ani-group #txt-headline1a,
.b-landing-animation #ani-canvas .ani-group #txt-headline1b,
.b-landing-animation #ani-canvas .ani-group #txt-headline2,
.b-landing-animation #ani-canvas .ani-group #txt-headline3,
.b-landing-animation #ani-canvas .ani-group #txt-logo-chi,
.b-landing-animation #ani-canvas .ani-group #txt-headline1-chi,
.b-landing-animation #ani-canvas .ani-group #txt-headline2-chi,
.b-landing-animation #ani-canvas .ani-group #txt-headline3-chi {
  opacity: 0;
}

.b-landing-animation #ani-canvas .ani-group #deco-energybar-mask,
.b-landing-animation #ani-canvas .ani-group #deco-line3-mask {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #img-intro1 {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  -webkit-transition: opacity 1.5s 0.3s ease, transform 1.2s 0.3s ease-out;
  -webkit-transition: opacity 1.5s 0.3s ease, -webkit-transform 1.2s 0.3s ease-out;
  transition: opacity 1.5s 0.3s ease, -webkit-transform 1.2s 0.3s ease-out;
  transition: opacity 1.5s 0.3s ease, transform 1.2s 0.3s ease-out;
  transition: opacity 1.5s 0.3s ease, transform 1.2s 0.3s ease-out, -webkit-transform 1.2s 0.3s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #img-intro1._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #bg-leaf1 {
  -webkit-transform: scale(0.95);
  transform: scale(0.95);
  -webkit-transition: opacity 1.8s 1.1s ease, transform 1.8s 1.1s ease-out;
  -webkit-transition: opacity 1.8s 1.1s ease, -webkit-transform 1.8s 1.1s ease-out;
  transition: opacity 1.8s 1.1s ease, -webkit-transform 1.8s 1.1s ease-out;
  transition: opacity 1.8s 1.1s ease, transform 1.8s 1.1s ease-out;
  transition: opacity 1.8s 1.1s ease, transform 1.8s 1.1s ease-out, -webkit-transform 1.8s 1.1s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #bg-leaf1._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #bg-leaf2 {
  -webkit-transform: scale(0.95);
  transform: scale(0.95);
  -webkit-transition: opacity 1.8s 1.5s ease, transform 1.8s 1.5s ease-out;
  -webkit-transition: opacity 1.8s 1.5s ease, -webkit-transform 1.8s 1.5s ease-out;
  transition: opacity 1.8s 1.5s ease, -webkit-transform 1.8s 1.5s ease-out;
  transition: opacity 1.8s 1.5s ease, transform 1.8s 1.5s ease-out;
  transition: opacity 1.8s 1.5s ease, transform 1.8s 1.5s ease-out, -webkit-transform 1.8s 1.5s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #bg-leaf2._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #bg-leaf3 {
  -webkit-transform: scale(0.95);
  transform: scale(0.95);
  -webkit-transition: opacity 1.8s 1.9s ease, transform 1.8s 1.9s ease-out;
  -webkit-transition: opacity 1.8s 1.9s ease, -webkit-transform 1.8s 1.9s ease-out;
  transition: opacity 1.8s 1.9s ease, -webkit-transform 1.8s 1.9s ease-out;
  transition: opacity 1.8s 1.9s ease, transform 1.8s 1.9s ease-out;
  transition: opacity 1.8s 1.9s ease, transform 1.8s 1.9s ease-out, -webkit-transform 1.8s 1.9s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #bg-leaf3._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #bg-leaf4 {
  -webkit-transition: opacity 1.8s 2.4s ease, transform 1.8s 2.4s ease-out;
  -webkit-transition: opacity 1.8s 2.4s ease, -webkit-transform 1.8s 2.4s ease-out;
  transition: opacity 1.8s 2.4s ease, -webkit-transform 1.8s 2.4s ease-out;
  transition: opacity 1.8s 2.4s ease, transform 1.8s 2.4s ease-out;
  transition: opacity 1.8s 2.4s ease, transform 1.8s 2.4s ease-out, -webkit-transform 1.8s 2.4s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #bg-leaf4._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #dot-inner1 {
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-transition: opacity 0.3s 1.2s ease, transform 0.3s 1.2s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  -webkit-transition: opacity 0.3s 1.2s ease, -webkit-transform 0.3s 1.2s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 1.2s ease, -webkit-transform 0.3s 1.2s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 1.2s ease, transform 0.3s 1.2s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 1.2s ease, transform 0.3s 1.2s cubic-bezier(0.46, 1.87, 0.75, 2.11), -webkit-transform 0.3s 1.2s cubic-bezier(0.46, 1.87, 0.75, 2.11);
}

.b-landing-animation #ani-canvas .ani-group #dot-inner1._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #dot-inner2 {
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-transition: opacity 0.3s 1.4s ease, transform 0.3s 1.4s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  -webkit-transition: opacity 0.3s 1.4s ease, -webkit-transform 0.3s 1.4s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 1.4s ease, -webkit-transform 0.3s 1.4s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 1.4s ease, transform 0.3s 1.4s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 1.4s ease, transform 0.3s 1.4s cubic-bezier(0.46, 1.87, 0.75, 2.11), -webkit-transform 0.3s 1.4s cubic-bezier(0.46, 1.87, 0.75, 2.11);
}

.b-landing-animation #ani-canvas .ani-group #dot-inner2._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #dot-inner3 {
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-transition: opacity 0.3s 1.9s ease, transform 0.3s 1.9s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  -webkit-transition: opacity 0.3s 1.9s ease, -webkit-transform 0.3s 1.9s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 1.9s ease, -webkit-transform 0.3s 1.9s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 1.9s ease, transform 0.3s 1.9s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 1.9s ease, transform 0.3s 1.9s cubic-bezier(0.46, 1.87, 0.75, 2.11), -webkit-transform 0.3s 1.9s cubic-bezier(0.46, 1.87, 0.75, 2.11);
}

.b-landing-animation #ani-canvas .ani-group #dot-inner3._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #dot-inner4 {
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-transition: opacity 0.3s 2.3s ease, transform 0.3s 2.3s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  -webkit-transition: opacity 0.3s 2.3s ease, -webkit-transform 0.3s 2.3s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 2.3s ease, -webkit-transform 0.3s 2.3s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 2.3s ease, transform 0.3s 2.3s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 2.3s ease, transform 0.3s 2.3s cubic-bezier(0.46, 1.87, 0.75, 2.11), -webkit-transform 0.3s 2.3s cubic-bezier(0.46, 1.87, 0.75, 2.11);
}

.b-landing-animation #ani-canvas .ani-group #dot-inner4._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #dot-inner5 {
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-transition: opacity 0.3s 2.8s ease, transform 0.3s 2.8s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  -webkit-transition: opacity 0.3s 2.8s ease, -webkit-transform 0.3s 2.8s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 2.8s ease, -webkit-transform 0.3s 2.8s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 2.8s ease, transform 0.3s 2.8s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 2.8s ease, transform 0.3s 2.8s cubic-bezier(0.46, 1.87, 0.75, 2.11), -webkit-transform 0.3s 2.8s cubic-bezier(0.46, 1.87, 0.75, 2.11);
}

.b-landing-animation #ani-canvas .ani-group #dot-inner5._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #img-intro2 {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  -webkit-transition: opacity 1.5s 2.2s ease, transform 1.5s 2.2s ease-out;
  -webkit-transition: opacity 1.5s 2.2s ease, -webkit-transform 1.5s 2.2s ease-out;
  transition: opacity 1.5s 2.2s ease, -webkit-transform 1.5s 2.2s ease-out;
  transition: opacity 1.5s 2.2s ease, transform 1.5s 2.2s ease-out;
  transition: opacity 1.5s 2.2s ease, transform 1.5s 2.2s ease-out, -webkit-transform 1.5s 2.2s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #img-intro2._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #img-intro3 {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  -webkit-transition: opacity 1.5s 2.8s ease, transform 1.5s 2.8s ease-out;
  -webkit-transition: opacity 1.5s 2.8s ease, -webkit-transform 1.5s 2.8s ease-out;
  transition: opacity 1.5s 2.8s ease, -webkit-transform 1.5s 2.8s ease-out;
  transition: opacity 1.5s 2.8s ease, transform 1.5s 2.8s ease-out;
  transition: opacity 1.5s 2.8s ease, transform 1.5s 2.8s ease-out, -webkit-transform 1.5s 2.8s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #img-intro3._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #img-intro4 {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  -webkit-transition: opacity 1.5s 3.2s ease, transform 1.5s 3.2s ease-out;
  -webkit-transition: opacity 1.5s 3.2s ease, -webkit-transform 1.5s 3.2s ease-out;
  transition: opacity 1.5s 3.2s ease, -webkit-transform 1.5s 3.2s ease-out;
  transition: opacity 1.5s 3.2s ease, transform 1.5s 3.2s ease-out;
  transition: opacity 1.5s 3.2s ease, transform 1.5s 3.2s ease-out, -webkit-transform 1.5s 3.2s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #img-intro4._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #deco-leaf-line {
  -webkit-transition: opacity 0.3s 3s ease;
  transition: opacity 0.3s 3s ease;
}

.b-landing-animation #ani-canvas .ani-group #deco-leaf-line._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #deco-energybar {
  -webkit-transition: opacity 0.3s 3s ease;
  transition: opacity 0.3s 3s ease;
}

.b-landing-animation #ani-canvas .ani-group #deco-energybar._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #deco-energybar-mask {
  -webkit-transform: translate(0, 10%);
  transform: translate(0, 10%);
  -webkit-transition: opacity 0s 2.6s ease, transform 3s 2.6s ease-in;
  -webkit-transition: opacity 0s 2.6s ease, -webkit-transform 3s 2.6s ease-in;
  transition: opacity 0s 2.6s ease, -webkit-transform 3s 2.6s ease-in;
  transition: opacity 0s 2.6s ease, transform 3s 2.6s ease-in;
  transition: opacity 0s 2.6s ease, transform 3s 2.6s ease-in, -webkit-transform 3s 2.6s ease-in;
}

.b-landing-animation #ani-canvas .ani-group #deco-energybar-mask._init {
  -webkit-transform: translate(0, -100%);
  transform: translate(0, -100%);
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #dot-outer-1 {
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-transition: opacity 0.3s 3.8s ease, transform 0.3s 3.8s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  -webkit-transition: opacity 0.3s 3.8s ease, -webkit-transform 0.3s 3.8s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 3.8s ease, -webkit-transform 0.3s 3.8s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 3.8s ease, transform 0.3s 3.8s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 3.8s ease, transform 0.3s 3.8s cubic-bezier(0.46, 1.87, 0.75, 2.11), -webkit-transform 0.3s 3.8s cubic-bezier(0.46, 1.87, 0.75, 2.11);
}

.b-landing-animation #ani-canvas .ani-group #dot-outer-1._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #dot-outer-2 {
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-transition: opacity 0.3s 4.2s ease, transform 0.3s 4.2s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  -webkit-transition: opacity 0.3s 4.2s ease, -webkit-transform 0.3s 4.2s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 4.2s ease, -webkit-transform 0.3s 4.2s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 4.2s ease, transform 0.3s 4.2s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 4.2s ease, transform 0.3s 4.2s cubic-bezier(0.46, 1.87, 0.75, 2.11), -webkit-transform 0.3s 4.2s cubic-bezier(0.46, 1.87, 0.75, 2.11);
}

.b-landing-animation #ani-canvas .ani-group #dot-outer-2._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #dot-outer-3 {
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-transition: opacity 0.3s 4.6s ease, transform 0.3s 4.6s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  -webkit-transition: opacity 0.3s 4.6s ease, -webkit-transform 0.3s 4.6s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 4.6s ease, -webkit-transform 0.3s 4.6s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 4.6s ease, transform 0.3s 4.6s cubic-bezier(0.46, 1.87, 0.75, 2.11);
  transition: opacity 0.3s 4.6s ease, transform 0.3s 4.6s cubic-bezier(0.46, 1.87, 0.75, 2.11), -webkit-transform 0.3s 4.6s cubic-bezier(0.46, 1.87, 0.75, 2.11);
}

.b-landing-animation #ani-canvas .ani-group #dot-outer-3._init {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.b-landing-animation #ani-canvas .ani-group #deco-line1 {
  -webkit-transition: opacity 0.5s 4s ease;
  transition: opacity 0.5s 4s ease;
}

.b-landing-animation #ani-canvas .ani-group #deco-line1._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #deco-line2 {
  -webkit-transition: opacity 0.5s 4.2s ease;
  transition: opacity 0.5s 4.2s ease;
}

.b-landing-animation #ani-canvas .ani-group #deco-line2._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #deco-line3 {
  -webkit-transition: opacity 0.5s 4.4s ease;
  transition: opacity 0.5s 4.4s ease;
}

.b-landing-animation #ani-canvas .ani-group #deco-line3._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #deco-line3-mask {
  -webkit-transform: translate(0, 10%);
  transform: translate(0, 10%);
  -webkit-transition: opacity 0s 2s ease, transform 1s 2s ease-out;
  -webkit-transition: opacity 0s 2s ease, -webkit-transform 1s 2s ease-out;
  transition: opacity 0s 2s ease, -webkit-transform 1s 2s ease-out;
  transition: opacity 0s 2s ease, transform 1s 2s ease-out;
  transition: opacity 0s 2s ease, transform 1s 2s ease-out, -webkit-transform 1s 2s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #deco-line3-mask._init {
  -webkit-transform: translate(0, -100%);
  transform: translate(0, -100%);
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #deco-line4 {
  -webkit-transition: opacity 0.3s 3s ease;
  transition: opacity 0.3s 3s ease;
}

.b-landing-animation #ani-canvas .ani-group #deco-line4._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #txt-logo {
  -webkit-transition: opacity 2s 4s ease;
  transition: opacity 2s 4s ease;
}

.b-landing-animation #ani-canvas .ani-group #txt-logo._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1a {
  -webkit-transition: opacity 0.3s 3s ease;
  transition: opacity 0.3s 3s ease;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1a._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1b {
  -webkit-transition: opacity 0.3s 3s ease;
  transition: opacity 0.3s 3s ease;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1b._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline2 {
  -webkit-transition: opacity 0.3s 3s ease;
  transition: opacity 0.3s 3s ease;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline2._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline3 {
  -webkit-transition: opacity 0.3s 3s ease;
  transition: opacity 0.3s 3s ease;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline3._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1a-mask {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transition: transform 1.5s 5.4s ease-out;
  -webkit-transition: -webkit-transform 1.5s 5.4s ease-out;
  transition: -webkit-transform 1.5s 5.4s ease-out;
  transition: transform 1.5s 5.4s ease-out;
  transition: transform 1.5s 5.4s ease-out, -webkit-transform 1.5s 5.4s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1a-mask._init {
  -webkit-transform: translate(130%, 0);
  transform: translate(130%, 0);
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1b-mask {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transition: transform 1.2s 5.8s ease-out;
  -webkit-transition: -webkit-transform 1.2s 5.8s ease-out;
  transition: -webkit-transform 1.2s 5.8s ease-out;
  transition: transform 1.2s 5.8s ease-out;
  transition: transform 1.2s 5.8s ease-out, -webkit-transform 1.2s 5.8s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1b-mask._init {
  -webkit-transform: translate(130%, 0);
  transform: translate(130%, 0);
}

.b-landing-animation #ani-canvas .ani-group #txt-headline2-mask {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transition: transform 1s 6.5s ease-out;
  -webkit-transition: -webkit-transform 1s 6.5s ease-out;
  transition: -webkit-transform 1s 6.5s ease-out;
  transition: transform 1s 6.5s ease-out;
  transition: transform 1s 6.5s ease-out, -webkit-transform 1s 6.5s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline2-mask._init {
  -webkit-transform: translate(130%, 0);
  transform: translate(130%, 0);
}

.b-landing-animation #ani-canvas .ani-group #txt-headline3-mask {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transition: transform 1.5s 6.9s ease-out;
  -webkit-transition: -webkit-transform 1.5s 6.9s ease-out;
  transition: -webkit-transform 1.5s 6.9s ease-out;
  transition: transform 1.5s 6.9s ease-out;
  transition: transform 1.5s 6.9s ease-out, -webkit-transform 1.5s 6.9s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline3-mask._init {
  -webkit-transform: translate(130%, 0);
  transform: translate(130%, 0);
}

.b-landing-animation #ani-canvas .ani-group #txt-logo-chi {
  -webkit-transition: opacity 1.5s 6s ease;
  transition: opacity 1.5s 6s ease;
}

.b-landing-animation #ani-canvas .ani-group #txt-logo-chi._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1-chi {
  -webkit-transition: opacity 0.3s 3s ease;
  transition: opacity 0.3s 3s ease;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1-chi._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline2-chi {
  -webkit-transition: opacity 0.3s 3s ease;
  transition: opacity 0.3s 3s ease;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline2-chi._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline3-chi {
  -webkit-transition: opacity 0.3s 3s ease;
  transition: opacity 0.3s 3s ease;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline3-chi._init {
  opacity: 1;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1-chi-mask {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transition: transform 1.5s 5.4s ease-out;
  -webkit-transition: -webkit-transform 1.5s 5.4s ease-out;
  transition: -webkit-transform 1.5s 5.4s ease-out;
  transition: transform 1.5s 5.4s ease-out;
  transition: transform 1.5s 5.4s ease-out, -webkit-transform 1.5s 5.4s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline1-chi-mask._init {
  -webkit-transform: translate(130%, 0);
  transform: translate(130%, 0);
}

.b-landing-animation #ani-canvas .ani-group #txt-headline2-chi-mask {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transition: transform 1.5s 5.8s ease-out;
  -webkit-transition: -webkit-transform 1.5s 5.8s ease-out;
  transition: -webkit-transform 1.5s 5.8s ease-out;
  transition: transform 1.5s 5.8s ease-out;
  transition: transform 1.5s 5.8s ease-out, -webkit-transform 1.5s 5.8s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline2-chi-mask._init {
  -webkit-transform: translate(130%, 0);
  transform: translate(130%, 0);
}

.b-landing-animation #ani-canvas .ani-group #txt-headline3-chi-mask {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transition: transform 1.5s 6.2s ease-out;
  -webkit-transition: -webkit-transform 1.5s 6.2s ease-out;
  transition: -webkit-transform 1.5s 6.2s ease-out;
  transition: transform 1.5s 6.2s ease-out;
  transition: transform 1.5s 6.2s ease-out, -webkit-transform 1.5s 6.2s ease-out;
}

.b-landing-animation #ani-canvas .ani-group #txt-headline3-chi-mask._init {
  -webkit-transform: translate(130%, 0);
  transform: translate(130%, 0);
}

/*------------------------------------------------------------------------ */
body {
  margin: 0;
  padding: 0;
  height: 100vh;
  overflow: hidden;
}

svg {
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}
/*# sourceMappingURL=style.css.map */