@import url("https://fonts.googleapis.com/css?family=Noto+Sans+TC:300,400,500,700,900&display=swap");
html#scoped {
  font-family: "Noto Sans TC", sans-serif;
  overflow-x: hidden;
  min-height: 100vh;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
html#scoped * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  font-family: "Noto Sans TC", sans-serif;
  outline: none;
}
html#scoped.no-scroll {
  overflow: hidden;
}
html#scoped body {
  margin: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
html#scoped .preload-images {
  position: fixed;
  left: 101vw;
}
html#scoped img {
  display: block;
  width: 100%;
}
html#scoped .d {
  display: block;
}
html#scoped .d.inline {
  display: inline;
  line-height: 0;
}
html#scoped .d.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media screen and (max-width: 800px) {
  html#scoped .d {
    display: none;
  }
  html#scoped .d.inline {
    display: none;
  }
  html#scoped .d.flex {
    display: none;
  }
}
html#scoped .m {
  display: none;
}
html#scoped .m.inline {
  display: none;
}
html#scoped .m.flex {
  display: none;
}
@media screen and (max-width: 800px) {
  html#scoped .m {
    display: block;
  }
  html#scoped .m.inline {
    display: inline;
    line-height: 0;
  }
  html#scoped .m.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.slick-slider {
  position: relative;
  display: block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track, .slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.slick-track:before, .slick-track:after {
  content: "";
  display: table;
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}

[dir=rtl] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

html#scoped .fadeInFromLeft {
  opacity: 0;
  -webkit-transform: translateX(-30px);
      -ms-transform: translateX(-30px);
          transform: translateX(-30px);
}
html#scoped .fadeInFromLeft.animate {
  opacity: 1;
  -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
          transform: translateX(0);
}
@media screen and (max-width: 1280px) {
  html#scoped .fadeInFromLeft {
    -webkit-transform: translateX(-2.34vw);
        -ms-transform: translateX(-2.34vw);
            transform: translateX(-2.34vw);
  }
}
@media screen and (max-width: 800px) {
  html#scoped .fadeInFromLeft {
    -webkit-transform: translateX(-8vw);
        -ms-transform: translateX(-8vw);
            transform: translateX(-8vw);
  }
}
html#scoped .fadeInFromRight {
  opacity: 0;
  -webkit-transform: translateX(30px);
      -ms-transform: translateX(30px);
          transform: translateX(30px);
}
html#scoped .fadeInFromRight.animate {
  opacity: 1;
  -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
          transform: translateX(0);
}
@media screen and (max-width: 1280px) {
  html#scoped .fadeInFromRight {
    -webkit-transform: translateX(2.34vw);
        -ms-transform: translateX(2.34vw);
            transform: translateX(2.34vw);
  }
}
@media screen and (max-width: 800px) {
  html#scoped .fadeInFromRight {
    -webkit-transform: translateX(8vw);
        -ms-transform: translateX(8vw);
            transform: translateX(8vw);
  }
}
html#scoped .fadeInFromTop {
  opacity: 0;
  -webkit-transform: translateY(-30px);
      -ms-transform: translateY(-30px);
          transform: translateY(-30px);
}
html#scoped .fadeInFromTop.animate {
  opacity: 1;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}
@media screen and (max-width: 1280px) {
  html#scoped .fadeInFromTop {
    -webkit-transform: translateY(-2.34vw);
        -ms-transform: translateY(-2.34vw);
            transform: translateY(-2.34vw);
  }
}
@media screen and (max-width: 800px) {
  html#scoped .fadeInFromTop {
    -webkit-transform: translateY(-8vw);
        -ms-transform: translateY(-8vw);
            transform: translateY(-8vw);
  }
}
html#scoped .fadeInFromBottom {
  opacity: 0;
  -webkit-transform: translateY(30px);
      -ms-transform: translateY(30px);
          transform: translateY(30px);
}
html#scoped .fadeInFromBottom.animate {
  opacity: 1;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}
@media screen and (max-width: 1280px) {
  html#scoped .fadeInFromBottom {
    -webkit-transform: translateY(2.34vw);
        -ms-transform: translateY(2.34vw);
            transform: translateY(2.34vw);
  }
}
@media screen and (max-width: 800px) {
  html#scoped .fadeInFromBottom {
    -webkit-transform: translateY(8vw);
        -ms-transform: translateY(8vw);
            transform: translateY(8vw);
  }
}
html#scoped .inview {
  -webkit-transition-delay: 200ms;
          transition-delay: 200ms;
  -webkit-transition: all 800ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: all 800ms cubic-bezier(0.68, 0, 0.265, 1);
}

html#scoped {
  padding-top: 4.95vw;
}
@media screen and (max-width: 800px) {
  html#scoped {
    padding-top: 13.33vw;
  }
}

html#scoped header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 4.95vw;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  background-color: white;
  padding: 0 10.42vw 0 5.21vw;
  -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
          box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
  z-index: 10;
}
@media screen and (max-width: 800px) {
  html#scoped header {
    height: 13.33vw;
    padding: 0 0 0 3.2vw;
    -webkit-box-shadow: 0 0 2.67vw 0 rgba(0, 0, 0, 0.2);
            box-shadow: 0 0 2.67vw 0 rgba(0, 0, 0, 0.2);
  }
}
html#scoped header .v-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 800px) {
  html#scoped header .v-flex {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
  html#scoped header .v-flex:first-child a.page-link {
    border-top: none;
  }
}
@media screen and (max-width: 800px) {
  html#scoped header .v-flex.alt {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
html#scoped header a.logo img {
  width: 12.76vw;
}
@media screen and (max-width: 800px) {
  html#scoped header a.logo img {
    width: 37.07vw;
  }
}
html#scoped header nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media screen and (max-width: 800px) {
  html#scoped header nav {
    display: none;
    position: fixed;
    top: 13.33vw;
    left: 0;
    width: 100%;
    height: calc(100vh - 13.33vw);
    background-color: white;
    padding: 5.33vw 0;
  }
  html#scoped header nav.active {
    display: block;
  }
}
html#scoped header a.link {
  font-size: 1.2vw;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-decoration: none;
  color: #0B8391;
  font-weight: bold;
  line-height: 4.95vw;
  padding: 0 1.56vw;
}
html#scoped header a.link:hover {
  color: white;
  background-color: #026B73;
}
@media screen and (max-width: 800px) {
  html#scoped header a.link {
    font-size: 5.07vw;
    padding: 4vw 0;
    width: 46.4vw;
    text-align: center;
    border-top: 1px solid black;
    line-height: 14vw;
  }
  html#scoped header a.link:hover {
    background-color: white;
    color: #0B8391;
  }
}
html#scoped header a.purchase {
  width: 6.82vw;
  line-height: 2.03vw;
  border-radius: 2.03vw;
  text-align: center;
  background-color: #E42925;
  color: white;
  font-size: 1.09vw;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-decoration: none;
  margin-left: 1.25vw;
}
@media screen and (max-width: 800px) {
  html#scoped header a.purchase {
    width: 46.4vw;
    margin-left: 0;
    line-height: 10.13vw;
    border-radius: 10.13vw;
    font-size: 5.6vw;
    margin-top: 4vw;
  }
}
html#scoped header .h-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media screen and (max-width: 800px) {
  html#scoped header .h-flex {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-top: 8vw;
  }
}
html#scoped header a.social {
  margin-left: 1.25vw;
}
@media screen and (max-width: 800px) {
  html#scoped header a.social {
    margin: 0 2.13vw;
  }
}
html#scoped header a.social img {
  width: 2.34vw;
}
@media screen and (max-width: 800px) {
  html#scoped header a.social img {
    width: 16.53vw;
  }
}
html#scoped header .menu {
  width: 13.33vw;
  height: 13.33vw;
  position: relative;
}
html#scoped header .menu .button {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: 5.87vw auto;
  background-position: center;
  background-repeat: no-repeat;
}
html#scoped header .menu .open {
  background-image: url("../assets/header/open.png");
}
html#scoped header .menu .close {
  background-image: url("../assets/header/close.png");
  opacity: 0;
}
html#scoped header .menu.active .open {
  opacity: 0;
}
html#scoped header .menu.active .close {
  opacity: 1;
}

html#scoped .fixed-menu {
  position: fixed;
  right: 0.89vw;
  bottom: 50%;
  -webkit-transform: translateY(50%);
      -ms-transform: translateY(50%);
          transform: translateY(50%);
  width: 4.69vw;
  background-size: cover;
  background-position: right center;
  background-repeat: no-repeat;
  z-index: 9;
}
@media screen and (max-width: 800px) {
  html#scoped .fixed-menu {
    width: 100%;
    height: auto;
    border: none;
    padding: 0;
    right: 0;
    bottom: 0;
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
  }
}
html#scoped .fixed-menu nav {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 800px) {
  html#scoped .fixed-menu nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
html#scoped .fixed-menu nav .star {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0.47vw 0;
}
@media screen and (max-width: 800px) {
  html#scoped .fixed-menu nav .star {
    display: none;
  }
}
html#scoped .fixed-menu nav .star img {
  width: 1.09vw;
}
html#scoped .fixed-menu nav .up {
  cursor: pointer;
  margin-top: 0.47vw;
  margin-left: -0.42vw;
  margin-right: -0.42vw;
  height: 4.6vw;
}
@media screen and (max-width: 800px) {
  html#scoped .fixed-menu nav .up {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    height: 100%;
  }
}
@media screen and (max-width: 800px) {
  html#scoped .fixed-menu nav .up img {
    margin-top: 0;
  }
}
html#scoped .fixed-menu nav a {
  position: relative;
  display: block;
  width: 100%;
  height: 5.36vw;
}
html#scoped .fixed-menu nav a:hover img.hover {
  opacity: 1;
}
@media screen and (max-width: 800px) {
  html#scoped .fixed-menu nav a {
    width: 26.67vw;
    height: 14.67vw;
  }
}
html#scoped .fixed-menu nav img.hover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
}

html#scoped footer {
  background: -webkit-gradient(linear, left top, right top, color-stop(20%, #003F45), color-stop(44%, #00484F), color-stop(94%, #00484F));
  background: linear-gradient(90deg, #003F45 20%, #00484F 44%, #00484F 94%);
  color: white;
  padding: 1.56vw 0;
}
@media screen and (max-width: 800px) {
  html#scoped footer {
    padding: 0;
    padding-bottom: 14.67vw;
  }
}
html#scoped footer .center-wrap {
  width: 72.92vw;
  margin: 0 auto;
}
@media screen and (max-width: 800px) {
  html#scoped footer .center-wrap {
    width: 100%;
  }
}
html#scoped footer .highlight {
  text-align: center;
  line-height: 1.35vw;
  background-color: #BB1E24;
  font-weight: bold;
  font-size: 0.94vw;
}
@media screen and (max-width: 800px) {
  html#scoped footer .highlight {
    padding: 1.87vw 2.67vw;
    font-size: 4.27vw;
    line-height: unset;
  }
}
html#scoped footer .flex-top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 0.78vw;
  margin-bottom: 0.52vw;
}
@media screen and (max-width: 800px) {
  html#scoped footer .flex-top {
    display: block;
  }
}
html#scoped footer .flex-top .line {
  height: 1px;
  background-color: white;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  margin-top: 0.52vw;
}
@media screen and (max-width: 800px) {
  html#scoped footer .flex-top .line {
    display: none;
  }
}
html#scoped footer .flex-top .text {
  font-size: 0.63vw;
  letter-spacing: 0.06em;
  margin: 0 0.52vw;
}
@media screen and (max-width: 800px) {
  html#scoped footer .flex-top .text {
    font-size: 3.2vw;
    margin: 0 auto;
    margin-top: 1.87vw;
    text-align: center;
    border-bottom: 1px solid white;
    padding-bottom: 2.4vw;
    width: 87.47vw;
  }
}
html#scoped footer .content {
  font-size: 0.94vw;
  line-height: 135%;
  text-align: justify;
}
@media screen and (max-width: 800px) {
  html#scoped footer .content {
    font-size: 4.53vw;
    line-height: 140%;
    margin-top: 3.47vw;
    padding: 0 5.87vw 5.87vw 5.87vw;
  }
}
html#scoped footer .content a {
  text-decoration: none;
  color: white;
  font-weight: bold;
}
html#scoped footer .content span.bold {
  font-weight: bold;
}
html#scoped footer .content span.small {
  font-size: 0.73vw;
}
@media screen and (max-width: 800px) {
  html#scoped footer .content span.small {
    font-size: 3.47vw;
  }
}
html#scoped footer .content span.yellow {
  color: #87C9C5;
}

html#scoped #landing .heading-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
html#scoped #landing .heading-wrap h2 {
  margin: 0 0.52vw;
  font-size: 2.5vw;
  font-weight: bold;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .heading-wrap h2 {
    margin: 0 1.33vw;
    font-size: 7.73vw;
  }
}
html#scoped #landing .heading-wrap h2 span.white {
  color: white;
}
html#scoped #landing .heading-wrap h2 span.blue {
  color: #0A2C66;
}
html#scoped #landing .heading-wrap h2 span.red {
  color: #E42925;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .heading-wrap h2 span.sp {
    text-shadow: 0 0 1vw white;
  }
}
html#scoped #landing .heading-wrap .star {
  width: 2.24vw;
  background-image: url("../assets/heading-star.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-animation-name: blink;
          animation-name: blink;
  -webkit-animation-duration: 2000ms;
          animation-duration: 2000ms;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .heading-wrap .star {
    width: 6.67vw;
  }
}
html#scoped #landing .heading-wrap .star.alt {
  -webkit-animation-delay: 1000ms;
          animation-delay: 1000ms;
}
@-webkit-keyframes blink {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    opacity: 0.8;
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes blink {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    opacity: 0.8;
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
html#scoped #landing section#section1 {
  position: relative;
}
html#scoped #landing section#section1 .fig {
  position: absolute;
  -webkit-transition: all 600ms ease-in-out;
  transition: all 600ms ease-in-out;
}
html#scoped #landing section#section1 .fig1 {
  width: 41.72vw;
  top: 24.11vw;
  left: 43.28vw;
  -webkit-transition-delay: 200ms;
          transition-delay: 200ms;
  opacity: 0;
  -webkit-transform: scale(1.5) translateY(-5vw);
      -ms-transform: scale(1.5) translateY(-5vw);
          transform: scale(1.5) translateY(-5vw);
}
html#scoped #landing section#section1 .fig1.animate {
  opacity: 1;
  -webkit-transform: scale(1) translateY(0);
      -ms-transform: scale(1) translateY(0);
          transform: scale(1) translateY(0);
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section1 .fig1 {
    width: 100%;
    left: 0;
    top: 43vw;
  }
}
html#scoped #landing section#section1 .fig2 {
  width: 41.77vw;
  top: 33vw;
  left: 43vw;
  -webkit-transition-delay: 400ms;
          transition-delay: 400ms;
  opacity: 0;
  -webkit-transform: scale(1.5) translateY(0);
      -ms-transform: scale(1.5) translateY(0);
          transform: scale(1.5) translateY(0);
}
html#scoped #landing section#section1 .fig2.animate {
  opacity: 1;
  -webkit-transform: scale(1) translateY(0);
      -ms-transform: scale(1) translateY(0);
          transform: scale(1) translateY(0);
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section1 .fig2 {
    width: 100%;
    left: 0;
    top: 142vw;
  }
}
html#scoped #landing section#section2 {
  height: 43.33vw;
  padding-top: 8vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section2 {
    height: 102.4vw;
    padding-top: 8.53vw;
    margin-top: 0;
  }
}
html#scoped #landing section#section2 h2 {
  margin: 0;
}
html#scoped #landing section#section2 h2 img {
  width: 13.49vw;
  margin: 0 auto;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section2 h2 img {
    width: 34.4vw;
  }
}
html#scoped #landing section#section2 .video-wrap {
  margin: 0 auto;
  margin-top: 2.4vw;
  position: relative;
  width: 44.53vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section2 .video-wrap {
    margin-top: 8vw;
    width: 88.8vw;
  }
}
html#scoped #landing section#section2 iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  aspect-ratio: 16/9;
  background-color: #C8C9C9;
  border: 1px solid #00767E;
  border-radius: 1.56vw;
  display: none;
}
html#scoped #landing section#section2 iframe.active {
  display: block;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section2 iframe {
    border-radius: 2.67vw;
  }
}
html#scoped #landing section#section2 .togglers {
  width: 100%;
  left: 0;
  position: absolute;
  top: 27.4vw;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  z-index: 1;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section2 .togglers {
    top: 54.67vw;
  }
}
html#scoped #landing section#section2 .togglers .toggler {
  width: 7.34vw;
  height: 5.21vw;
  background-size: cover;
  background-position: center;
  background-color: #C8C9C9;
  border: 1px solid #00767E;
  border-radius: 0.78vw;
  margin: 0 0.94vw;
  cursor: pointer;
}
html#scoped #landing section#section2 .togglers .toggler.yt1 {
  background-image: url("../assets/sec2/thumb1.png");
}
html#scoped #landing section#section2 .togglers .toggler.yt2 {
  background-image: url("../assets/sec2/thumb2.jpg");
}
html#scoped #landing section#section2 .togglers .toggler.yt3 {
  background-image: url("../assets/sec2/thumb3.png");
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section2 .togglers .toggler {
    width: 19.47vw;
    height: 13.87vw;
    border-radius: 2.67vw;
    margin: 0 2.67vw;
  }
}
html#scoped #landing .group-sections {
  height: 214vw;
  background-image: url("../assets/group-bg-d.png");
  background-size: 100% auto;
  background-position: center top;
  background-repeat: no-repeat;
  position: relative;
  -webkit-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .group-sections {
    height: 1065vw;
    background-image: url("../assets/group-bg-m.png");
  }
  html#scoped #landing .group-sections.s2 {
    height: 806vw;
  }
  html#scoped #landing .group-sections.s3 {
    height: 881.6vw;
  }
}
html#scoped #landing .group-sections .group-bottom {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  width: 100%;
}
html#scoped #landing .slider-outer {
  position: relative;
  width: 78.13vw;
  margin: 0 auto;
  padding-top: 1.3vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-outer {
    width: 100vw;
    padding-top: 4vw;
  }
}
html#scoped #landing .slider-outer .slider-bg {
  position: absolute;
  top: 0;
  left: 0;
  background-color: #007F8D;
  border-radius: 1.56vw;
  width: 100%;
}
html#scoped #landing .slider-outer .slider-bg.bg1 {
  height: 32.71vw;
}
html#scoped #landing .slider-outer .slider-bg.bg2 {
  height: 34.53vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-outer .slider-bg {
    border-radius: 4vw;
  }
  html#scoped #landing .slider-outer .slider-bg.bg1 {
    height: 283.73vw;
  }
  html#scoped #landing .slider-outer .slider-bg.bg2 {
    height: 220.27vw;
  }
}
html#scoped #landing .slider-tabs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
html#scoped #landing .slider-tabs .tab {
  line-height: 2.76vw;
  font-size: 1.25vw;
  letter-spacing: 0.1em;
  color: white;
  padding: 0 1.88vw;
  border-right: 1px solid rgba(255, 255, 255, 0.5);
  cursor: pointer;
  position: relative;
}
html#scoped #landing .slider-tabs .tab.active {
  font-weight: bold;
  color: #F8BA00;
}
html#scoped #landing .slider-tabs .tab.active .triangle {
  display: block;
}
html#scoped #landing .slider-tabs .tab.active .star {
  display: block;
}
html#scoped #landing .slider-tabs .tab:last-child {
  border-right: none;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-tabs .tab {
    font-size: 5.07vw;
    letter-spacing: 0em;
    line-height: 6vw;
    text-align: center;
    padding: 0 3.73vw;
  }
}
html#scoped #landing .slider-tabs .tab .triangle {
  height: 0.68vw;
  width: 100%;
  position: absolute;
  top: 100%;
  left: 0;
  background-image: url("../assets/slider-tab-triangle.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  display: none;
  -webkit-animation-name: updown;
          animation-name: updown;
  -webkit-animation-duration: 1000ms;
          animation-duration: 1000ms;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-tabs .tab .triangle {
    height: 1.87vw;
    top: 110%;
  }
}
html#scoped #landing .slider-tabs .tab .star {
  height: 1.88vw;
  width: 100%;
  position: absolute;
  top: 85%;
  left: 0;
  background-image: url("../assets/slider-tab-star.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  display: none;
  -webkit-animation-name: updown;
          animation-name: updown;
  -webkit-animation-duration: 1000ms;
          animation-duration: 1000ms;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-tabs .tab .star {
    height: 6.93vw;
    top: 108%;
  }
}
@-webkit-keyframes updown {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-20%);
            transform: translateY(-20%);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes updown {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-20%);
            transform: translateY(-20%);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
html#scoped #landing .slider-wrap {
  width: 72.92vw;
  margin: 0 auto;
  margin-top: 0.94vw;
  border-radius: 1.04vw;
  border: 1px solid #00767E;
  background-color: white;
  position: relative;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-wrap {
    width: 92vw;
    margin-top: 5.6vw;
    border-radius: 2.67vw;
  }
}
html#scoped #landing .slider-wrap .slide {
  padding-top: 1.04vw;
  padding-bottom: 1.04vw;
  padding-left: 3.13vw;
  padding-right: 3.13vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-wrap .slide {
    padding-top: 2.4vw;
    padding-bottom: 4vw;
    padding-left: 3.2vw;
    padding-right: 3.2vw;
  }
}
html#scoped #landing .slider-wrap .slide .note {
  margin-top: 0.83vw;
  text-align: justify;
  color: #4F4D4D;
  font-size: 0.68vw;
  word-break: break-all;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-wrap .slide .note {
    margin-top: 2.67vw;
    font-size: 2.93vw;
  }
}
html#scoped #landing .slider-wrap .slide .flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.78vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-wrap .slide .flex {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 1.33vw;
  }
}
html#scoped #landing .slider-wrap .slide .separator {
  width: 1px;
  background-color: #09656E;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-wrap .slide .separator {
    height: 1px;
    width: 100%;
  }
}
html#scoped #landing .slider-wrap .slide .half {
  width: 50%;
  padding-bottom: 0.78vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-wrap .slide .half {
    width: 100%;
    padding-bottom: 0;
  }
}
html#scoped #landing .slider-wrap .slide .t1 {
  font-size: 1.04vw;
  color: #4F4D4D;
  margin-bottom: 0.63vw;
  text-align: justify;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-wrap .slide .t1 {
    font-size: 4.8vw;
    margin-bottom: 4vw;
  }
}
html#scoped #landing .slider-wrap h3 {
  margin: 0 auto;
  margin-bottom: 0.78vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-wrap h3 {
    margin-bottom: 1.33vw;
  }
}
html#scoped #landing .slider-wrap h3 img {
  margin: 0 auto;
  height: 3.49vw;
  width: auto;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-wrap h3 img {
    height: 10.67vw;
  }
}
html#scoped #landing .slider-wrap .nav {
  position: absolute;
  width: 1.35vw;
  height: 3.07vw;
  top: 13.02vw;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-wrap .nav {
    width: 4vw;
    height: 9.07vw;
    top: 57.33vw;
  }
}
html#scoped #landing .slider-wrap .prev {
  left: -1.35vw;
  background-image: url("../assets/slider-prev-d.png");
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-wrap .prev {
    left: -4vw;
    background-image: url("../assets/slider-prev-m.png");
  }
}
html#scoped #landing .slider-wrap .next {
  right: -1.35vw;
  background-image: url("../assets/slider-next-d.png");
}
@media screen and (max-width: 800px) {
  html#scoped #landing .slider-wrap .next {
    right: -4vw;
    background-image: url("../assets/slider-next-m.png");
  }
}
html#scoped #landing section#section3 {
  position: absolute;
  width: 100%;
  left: 0;
  top: 52.71vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section3 {
    top: 105.07vw;
  }
}
html#scoped #landing section#section3 h2 {
  margin: 0;
}
html#scoped #landing section#section3 h2 img {
  width: 33.13vw;
  margin: 0 auto;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section3 h2 img {
    width: 84.8vw;
  }
}
html#scoped #landing section#section4 {
  position: absolute;
  width: 100%;
  left: 0;
  top: 98.07vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section4 {
    top: 436.53vw;
  }
}
html#scoped #landing section#section4 h2 {
  margin: 0;
}
html#scoped #landing section#section4 h2 img {
  width: 30.16vw;
  margin: 0 auto;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section4 h2 img {
    width: 84.8vw;
  }
}
html#scoped #landing section#section4 h3 {
  margin: 0 auto;
  margin-bottom: 0.78vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section4 h3 {
    margin-bottom: 1.33vw;
  }
}
html#scoped #landing section#section4 h3 img {
  margin: 0 auto;
  height: 2.71vw;
  width: auto;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section4 h3 img {
    height: 8.27vw;
  }
}
html#scoped #landing section#section5 {
  position: absolute;
  width: 100%;
  left: 0;
  top: 146.41vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section5 {
    top: 708vw;
  }
}
html#scoped #landing section#section5 h2 {
  margin: 0;
  position: relative;
  z-index: 1;
}
html#scoped #landing section#section5 h2 img {
  width: 46.88vw;
  margin: 0 auto;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section5 h2 img {
    width: 100vw;
  }
}
html#scoped #landing section#section5 .slider-outer {
  width: 100vw;
  margin-top: -0.78vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section5 .slider-outer {
    margin-top: -4vw;
  }
}
html#scoped #landing section#section5 .slider-bg.bg3 {
  height: 32.71vw;
  border-radius: 17vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section5 .slider-bg.bg3 {
    height: 192.27vw;
    border-radius: 4vw;
  }
}
html#scoped #landing section#section5 .slider-wrap {
  background-color: rgba(255, 255, 255, 0);
  border: none;
}
html#scoped #landing section#section5 .slider-wrap .slider .slide {
  padding: 0;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section5 .slider-tabs.alt {
    margin-top: 2vw;
  }
}
html#scoped #landing section#section5 .slider-tabs.alt .tab {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
html#scoped #landing .downloads {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  left: 0;
  bottom: 1.56vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .downloads {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    bottom: 5.33vw;
  }
}
html#scoped #landing .downloads a {
  display: block;
}
html#scoped #landing .downloads a img {
  height: 5.21vw;
  width: auto;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .downloads a img {
    width: 100vw;
    height: auto;
  }
}
html#scoped #landing .downloads .download-animation {
  width: 1.3vw;
  height: 1.82vw;
  position: relative;
  margin-top: 1.56vw;
  margin-left: 0.52vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing .downloads .download-animation {
    width: 6.67vw;
    height: 9.33vw;
    margin-top: 8vw;
    margin-left: 2.67vw;
  }
}
html#scoped #landing .downloads .download-animation img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
html#scoped #landing .downloads .download-animation img.download-arrow {
  -webkit-animation-name: arrowd;
          animation-name: arrowd;
  -webkit-animation-duration: 1000ms;
          animation-duration: 1000ms;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
@-webkit-keyframes arrowd {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes arrowd {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
html#scoped #landing section#section6 {
  background-color: #58B7B1;
  margin-top: -1px;
  position: relative;
}
html#scoped #landing section#section6 .bg-block {
  width: 93.65vw;
  background: -webkit-gradient(linear, left bottom, left top, from(#FFF), to(#FCF5DD));
  background: linear-gradient(0deg, #FFF 0%, #FCF5DD 100%);
  margin: 0 auto;
  height: 75vw;
  border-radius: 5.21vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section6 .bg-block {
    background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#FCF5DD));
    background: linear-gradient(180deg, #FFF 0%, #FCF5DD 100%);
    width: 91.47vw;
    height: 274.67vw;
    border-radius: 8vw;
  }
}
html#scoped #landing section#section6 h2 {
  margin: 0;
  position: absolute;
  top: 4.06vw;
  left: 50%;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section6 h2 {
    top: 5.33vw;
  }
}
html#scoped #landing section#section6 h2 img {
  width: 13.44vw;
  margin: 0 auto;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section6 h2 img {
    width: 34.13vw;
  }
}
html#scoped #landing section#section6 .front-bg {
  position: absolute;
  width: 100vw;
  left: 0;
  bottom: 0;
  background-image: url("../assets/front-bg-d.png");
  background-size: 100% auto;
  background-position: center top;
  background-repeat: no-repeat;
  height: 20.63vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section6 .front-bg {
    background-image: url("../assets/front-bg-m.png");
    height: 28vw;
  }
}
html#scoped #landing section#section6 .group {
  position: absolute;
  width: 78.13vw;
  left: 50%;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section6 .group {
    width: 100vw;
  }
}
html#scoped #landing section#section6 .group1 {
  top: 9.27vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section6 .group1 {
    top: 17.07vw;
  }
}
html#scoped #landing section#section6 .tab-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  visibility: hidden;
}
html#scoped #landing section#section6 .tab-content.active {
  opacity: 1;
  visibility: visible;
}
html#scoped #landing section#section6 .tab-buttons {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  top: 8.44vw;
  left: 0;
  width: 100%;
  z-index: 1;
  -webkit-transform: translateX(-0.5vw);
      -ms-transform: translateX(-0.5vw);
          transform: translateX(-0.5vw);
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section6 .tab-buttons {
    top: 44.53vw;
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
  }
}
html#scoped #landing section#section6 .tab-buttons .tab-button {
  cursor: pointer;
  width: 16.25vw;
  height: 4.17vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section6 .tab-buttons .tab-button {
    width: 47.2vw;
    height: 14.4vw;
  }
}
html#scoped #landing section#section6 .buttons {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1.3vw;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  left: 50%;
  top: 15.68vw;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section6 .buttons {
    top: 70.67vw;
    gap: 2.67vw;
  }
}
html#scoped #landing section#section6 .buttons .button-pop {
  width: 13.54vw;
  position: relative;
  cursor: pointer;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section6 .buttons .button-pop {
    width: 41.6vw;
  }
}
html#scoped #landing section#section6 .buttons .button-pop:hover .hover {
  opacity: 1;
}
html#scoped #landing section#section6 .buttons .button-pop .hover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
}
html#scoped #landing section#section6 a.link {
  position: absolute;
  width: 9.38vw;
  height: 3.13vw;
  top: 15.52vw;
  left: 40.1vw;
  cursor: pointer;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section6 a.link {
    width: 48vw;
    height: 15.73vw;
    top: 72.53vw;
    left: 26.13vw;
  }
}
html#scoped #landing section#section6 .group2 {
  top: 40.42vw;
}
@media screen and (max-width: 800px) {
  html#scoped #landing section#section6 .group2 {
    top: 138.93vw;
  }
}

html#scoped .popup-wrap {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.8);
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
  padding: 7.81vw 0;
  overflow-y: auto;
}
html#scoped .popup-wrap.active {
  opacity: 1;
  visibility: visible;
}
@media screen and (max-width: 800px) {
  html#scoped .popup-wrap {
    padding: 8vw 2.67vw;
  }
}
html#scoped .popup-wrap .content-wrap {
  width: 59.38vw;
  padding: 3.13vw 4.17vw;
  border: 1px solid white;
  -webkit-box-shadow: 0 0 1.56vw rgba(0, 0, 0, 0.8);
          box-shadow: 0 0 1.56vw rgba(0, 0, 0, 0.8);
  margin: 0 auto;
  background-color: #007F8D;
  position: relative;
  color: white;
}
@media screen and (max-width: 800px) {
  html#scoped .popup-wrap .content-wrap {
    width: 100%;
    padding: 0;
    border: none;
  }
}
html#scoped .popup-wrap .content-wrap .close {
  width: 3.91vw;
  height: 3.91vw;
  position: absolute;
  top: 0;
  right: 0;
  cursor: pointer;
  background-image: url("../assets/pop-close.svg");
  background-size: 1.77vw;
  background-repeat: no-repeat;
  background-position: center;
}
@media screen and (max-width: 800px) {
  html#scoped .popup-wrap .content-wrap .close {
    width: 14.67vw;
    height: 14.67vw;
    background-size: 9.07vw;
  }
}
html#scoped .popup-wrap .content-wrap .title-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
html#scoped .popup-wrap .content-wrap .title-flex .pop-stars {
  width: 6.35vw;
  background-image: url("../assets/pop-stars.svg");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
html#scoped .popup-wrap .content-wrap .title-flex .text {
  font-size: 1.15vw;
  letter-spacing: 0.1em;
  margin: 0 1.56vw;
  font-weight: bold;
}
html#scoped .popup-wrap .content-wrap .sub-title {
  margin-top: 1.67vw;
  font-weight: bold;
  font-size: 1.04vw;
  text-align: center;
}
html#scoped .popup-wrap .content-wrap .text-wrap {
  font-size: 0.94vw;
  letter-spacing: 0.05em;
  border: 1px solid #F8BA00;
  color: #F8BA00;
  padding: 0.78vw;
  width: 39.22vw;
  margin: 0 auto;
  margin-top: 1.25vw;
}
html#scoped .popup-wrap .content-wrap .text-wrap.alt {
  width: 100%;
}
html#scoped .popup-wrap .content-wrap .text-wrap span.bold {
  font-weight: bold;
}
html#scoped .popup-wrap .content-wrap .button-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 1.67vw;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 800px) {
  html#scoped .popup-wrap .content-wrap .button-wrap {
    position: absolute;
    top: 81.6vw;
    left: 0;
    width: 100%;
  }
}
html#scoped .popup-wrap .content-wrap .button-wrap .link {
  text-decoration: none;
  width: 9.38vw;
  height: 3.07vw;
  line-height: 3.07vw;
  text-align: center;
  font-size: 1.25vw;
  letter-spacing: 0.1em;
  color: #008897;
  font-weight: bold;
  background-color: white;
  border-radius: 5vw;
}
@media screen and (max-width: 800px) {
  html#scoped .popup-wrap .content-wrap .button-wrap .link {
    width: 47.73vw;
    height: 15.73vw;
    line-height: 15.73vw;
    font-size: 6.4vw;
    border-radius: 20vw;
    margin-top: 0;
  }
  html#scoped .popup-wrap .content-wrap .button-wrap .link.alt {
    position: static;
  }
}
html#scoped .popup-wrap .content-wrap .fig1 {
  width: 100%;
  margin-top: 1.04vw;
  margin-bottom: 1.04vw;
}
html#scoped .popup-wrap .content-wrap .fig2 {
  width: 6.67vw;
  margin-top: 1.04vw;
  margin-bottom: 1.04vw;
}
html#scoped .popup-wrap .content-wrap .row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 1.04vw 0;
}
html#scoped .popup-wrap .content-wrap .row .step {
  line-height: 1.35vw;
  background-color: #F8BA00;
  border-radius: 0.78vw;
  text-align: center;
  width: 4.27vw;
  font-size: 0.94vw;
  font-weight: bold;
  color: #007F8D;
  margin-right: 0.31vw;
}
html#scoped .popup-wrap .content-wrap .row .t1 {
  font-size: 1.04vw;
  line-height: 1.35vw;
  font-weight: bold;
  color: #F8BA00;
  margin-right: 1.2vw;
}
html#scoped .popup-wrap .content-wrap .row .t2 {
  font-size: 0.94vw;
  line-height: 1.35vw;
  color: white;
}
html#scoped .popup-wrap .content-wrap .row a {
  text-decoration: none;
  line-height: 1.35vw;
  background-color: #F8BA00;
  border-radius: 0.78vw;
  text-align: center;
  font-size: 0.94vw;
  font-weight: bold;
  color: #007F8D;
  margin-left: 0.52vw;
  padding: 0 0.78vw;
  cursor: pointer;
}
html#scoped .popup-wrap .content-wrap .table {
  border: 2px solid white;
}
html#scoped .popup-wrap .content-wrap .table .flex-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-bottom: 1px solid white;
}
html#scoped .popup-wrap .content-wrap .table .flex-row:last-child {
  border-bottom: none;
}
html#scoped .popup-wrap .content-wrap .table .flex-row .head {
  width: 8.33vw;
  min-width: 8.33vw;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-right: 1px solid white;
  font-size: 0.94vw;
}
html#scoped .popup-wrap .content-wrap .table .flex-row .head.alt {
  width: 14.17vw;
  min-width: 14.17vw;
  font-weight: bold;
}
html#scoped .popup-wrap .content-wrap .table .flex-row .head span.yellow {
  color: #F8BA00;
}
html#scoped .popup-wrap .content-wrap .table .flex-row .content {
  font-size: 0.94vw;
  font-weight: bold;
  padding: 0.78vw 1.04vw;
  border-right: 1px solid white;
}
html#scoped .popup-wrap .content-wrap .table .flex-row .content:last-child {
  border-right: none;
}
html#scoped .popup-wrap .content-wrap .table .flex-row .content span.yellow {
  color: #F8BA00;
}
html#scoped .popup-wrap .content-wrap .table .flex-row .block {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
html#scoped .popup-wrap .content-wrap .table .flex-row .block .inner {
  padding: 0.78vw 1.04vw;
  border-bottom: 1px solid white;
  width: 100%;
  font-size: 0.94vw;
  font-weight: bold;
}
html#scoped .popup-wrap .content-wrap .table .flex-row .block .inner:last-of-type {
  border-bottom: none;
}
html#scoped .popup-wrap .content-wrap .table .flex-row .block span.yellow {
  color: #F8BA00;
}
html#scoped .popup-wrap .content-wrap.m a {
  position: absolute;
  top: 79vw;
  left: 43.8vw;
  text-decoration: none;
  line-height: 7vw;
  background-color: #F8BA00;
  border-radius: 5vw;
  text-align: center;
  font-size: 4.6vw;
  font-weight: bold;
  color: #007F8D;
  width: 22vw;
  cursor: pointer;
}
html#scoped .popup-wrap.alt .content-wrap {
  background-color: white;
  padding: 0;
  color: black;
}
@media screen and (max-width: 800px) {
  html#scoped .popup-wrap.alt .close {
    width: 5.6vw;
    height: 5.6vw;
    background-size: contain;
    right: 1.87vw;
    top: 1.5vw;
  }
}
html#scoped .popup-wrap.alt .title-flex {
  background-color: #007F8D;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  padding: 1.3vw;
}
@media screen and (max-width: 800px) {
  html#scoped .popup-wrap.alt .title-flex {
    padding: 1.07vw 3.2vw;
  }
}
html#scoped .popup-wrap.alt .title-flex .text {
  font-size: 1.56vw;
  color: white;
  padding: 0;
  margin: 0;
}
@media screen and (max-width: 800px) {
  html#scoped .popup-wrap.alt .title-flex .text {
    font-size: 4.27vw;
  }
}
html#scoped .popup-wrap.alt .text-content-wrap {
  padding: 1.3vw;
  font-size: 0.94vw;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 800px) {
  html#scoped .popup-wrap.alt .text-content-wrap {
    padding: 3.2vw;
    font-size: 3.73vw;
  }
}
html#scoped .popup-wrap.alt .button-wrap {
  padding-bottom: 3vw;
}
@media screen and (max-width: 800px) {
  html#scoped .popup-wrap.alt .button-wrap {
    position: static;
    padding-bottom: 8vw;
  }
}
html#scoped .popup-wrap.alt .button-wrap .link {
  background-color: #00767E;
  color: white;
  cursor: pointer;
}
@media screen and (max-width: 800px) {
  html#scoped .popup-wrap.alt p {
    margin: 2.67vw 0;
  }
}
html#scoped .popup-wrap.alt .red-bg {
  background-color: #BA1E24;
  color: white;
  font-weight: bold;
  padding: 0.63vw;
  margin: 0;
  text-align: center;
}
@media screen and (max-width: 800px) {
  html#scoped .popup-wrap.alt .red-bg {
    padding: 1.07vw;
    text-align: left;
  }
}
html#scoped .popup-wrap.alt .bold {
  font-weight: bold;
}
html#scoped .popup-wrap.alt .red {
  color: #C12128;
}

html#scoped #demo {
  position: relative;
}
html#scoped #demo .demo-page {
  padding-top: 7.92vw;
  background-image: url("../assets/page-d.png");
  background-size: 100% auto;
  background-position: center top;
  background-repeat: no-repeat;
  position: relative;
  padding-bottom: 3.44vw;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .demo-page {
    padding-top: 10.67vw;
    background-image: url("../assets/page-m.png");
    padding-bottom: 10.13vw;
  }
}
html#scoped #demo .demo-page img.bot {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}
html#scoped #demo .mb {
  margin-bottom: 30px;
}
html#scoped #demo .heading-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 2.6vw;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .heading-wrap {
    margin-bottom: 3.2vw;
  }
}
html#scoped #demo .heading-wrap h2 {
  margin: 0 0.52vw;
  font-size: 2.5vw;
  font-weight: bold;
  letter-spacing: 0.1em;
  color: #09666F;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .heading-wrap h2 {
    margin: 0 1.33vw;
    font-size: 6.8vw;
  }
}
html#scoped #demo .heading-wrap .star {
  width: 2.24vw;
  background-image: url("../assets/heading-star.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-animation-name: blink;
          animation-name: blink;
  -webkit-animation-duration: 2000ms;
          animation-duration: 2000ms;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .heading-wrap .star {
    width: 6.67vw;
  }
}
html#scoped #demo .heading-wrap .star.alt {
  -webkit-animation-delay: 1000ms;
          animation-delay: 1000ms;
}
@keyframes blink {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    opacity: 0.8;
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
html#scoped #demo .demo-content {
  width: 72.92vw;
  border-radius: 1.56vw;
  background-color: white;
  margin: 0 auto;
  border-top: 1.3vw solid white;
  border-left: 1.56vw solid white;
  border-right: 1.56vw solid white;
  border-bottom: 5.89vw solid white;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .demo-content {
    width: 91.47vw;
    border-radius: 4vw;
    border-top: 1.87vw solid white;
    border-left: 2.13vw solid white;
    border-right: 2.13vw solid white;
    border-bottom: 3.73vw solid white;
  }
}
html#scoped #demo .demo-content .center-wrap {
  width: 41.67vw;
  margin: 0 auto;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .demo-content .center-wrap {
    width: 100%;
  }
}
html#scoped #demo .demo-content .radius {
  border-radius: 1.04vw;
  overflow: hidden;
  padding-top: 4.69vw;
  padding-bottom: 8.65vw;
  background: -webkit-gradient(linear, left top, left bottom, from(#FFF6E5), color-stop(44.67%, #FDF7EA), color-stop(99.26%, #FBFBF9));
  background: linear-gradient(180deg, #FFF6E5 0%, #FDF7EA 44.67%, #FBFBF9 99.26%);
}
@media screen and (max-width: 800px) {
  html#scoped #demo .demo-content .radius {
    border-radius: 2.67vw;
    padding-top: 8.53vw;
    padding-bottom: 10.67vw;
    padding-left: 4vw;
    padding-right: 4vw;
  }
}
html#scoped #demo .demo-content .text {
  font-size: 1.04vw;
  text-align: justify;
  margin-right: 2.08vw;
  margin-bottom: 1.56vw;
}
html#scoped #demo .demo-content .text:last-child {
  margin-bottom: 0;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .demo-content .text {
    font-size: 4.53vw;
    margin-bottom: 5.33vw;
  }
}
html#scoped #demo .demo-content .text span.bold {
  font-weight: bold;
}
html#scoped #demo .demo-content .source {
  font-size: 0.63vw;
  color: #231815;
  margin-top: 0.52vw;
  margin-bottom: 1.56vw;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .demo-content .source {
    font-size: 2.93vw;
    margin-top: 2.67vw;
    margin-bottom: 8vw;
  }
}
html#scoped #demo .demo-content .source span.b {
  font-weight: bold;
  font-size: 0.73vw;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .demo-content .source span.b {
    font-size: 3.2vw;
  }
}
html#scoped #demo .demo-content .article {
  margin-bottom: 3.91vw;
}
html#scoped #demo .demo-content .article:last-child {
  margin-bottom: 0;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .demo-content .article {
    margin-bottom: 12vw;
  }
}
html#scoped #demo .demo-content .article .title {
  padding-left: 1.77vw;
  font-size: 1.46vw;
  font-weight: bold;
  color: #09666F;
  background-image: url("../assets/heading-star.png");
  background-size: 1.35vw;
  background-repeat: no-repeat;
  background-position: left top 0.42vw;
  margin-bottom: 1.15vw;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .demo-content .article .title {
    font-size: 5.6vw;
    background-size: 5.07vw;
    background-position: left top 1.8vw;
    margin-bottom: 5.33vw;
    padding-left: 6vw;
  }
}
html#scoped #demo .demo-content .article .content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-left: 1.77vw;
}
html#scoped #demo .demo-content .article .content.alt {
  display: block;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .demo-content .article .content {
    display: block;
    padding-left: 0;
  }
}
html#scoped #demo .demo-content .article .content .button-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .demo-content .article .content .button-wrap {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-top: 4.8vw;
  }
}
html#scoped #demo .demo-content .article .content .button-wrap .button {
  text-decoration: none;
  width: 8.85vw;
  min-width: 8.85vw;
  height: 3.07vw;
  line-height: 3.07vw;
  text-align: center;
  background-color: #09666F;
  color: white;
  font-size: 1.04vw;
  font-weight: bold;
  border-radius: 1.56vw;
  cursor: pointer;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .demo-content .article .content .button-wrap .button {
    width: 32.53vw;
    min-width: 32.53vw;
    height: 11.2vw;
    line-height: 11.2vw;
    font-size: 4vw;
    border-radius: 6vw;
  }
}
html#scoped #demo .bot {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background-image: url("../assets/front-bg-d.png");
  height: 21.09vw;
  background-size: 100% auto;
  background-position: center top;
  background-repeat: no-repeat;
}
@media screen and (max-width: 800px) {
  html#scoped #demo .bot {
    background-image: url("../assets/front-bg-m.png");
    height: 24vw;
  }
}
html#scoped #demo ol, html#scoped #demo ul {
  padding-left: 1.56vw;
}
@media screen and (max-width: 800px) {
  html#scoped #demo ol, html#scoped #demo ul {
    padding-left: 5.33vw;
  }
}
html#scoped #demo ol li, html#scoped #demo ul li {
  margin: 0.52vw 0;
}
@media screen and (max-width: 800px) {
  html#scoped #demo ol li, html#scoped #demo ul li {
    margin: 2.67vw 0;
  }
}