@charset "UTF-8";
/*
0-600px Phone
600-900px Tablet portrait
900-1200px Tablet landscape
1200-1800 is our normal styles apply
1800px + Big desktop

$breakpoint argument choices:
- phone
- tab-port
- tab-land
- big-desktop
1em=16px

ORDER:base+typography > general layout + grid>page layout >components
*/
.ma0 {
  margin: 0; }

.ma30 {
  margin: 30px; }

.mt30 {
  margin-top: 30px; }

.mb20 {
  margin-bottom: 20px; }

.mb30 {
  margin-bottom: 30px; }

.ma-auto {
  margin: auto; }

.pa0 {
  padding: 0; }

.pt30 {
  padding-top: 30px; }

.hightlight {
  color: #C0942D; }

.color-2 {
  color: #198760; }

.color-3-1 {
  color: #B63B9F; }

.color-5-1 {
  color: #EE7A00; }

.section-title {
  text-align: center;
  color: #333333; }
  .section-title .expo-title-crumb {
    font-size: 20px; }
  .section-title .expo-title-main {
    font-size: 62px;
    letter-spacing: 2px; }
  .section-title .expo-title-sub {
    font-size: 24px;
    margin: 10px 0;
    line-height: 1.4em; }
  .section-title .expo-title-desc {
    text-align: center; }

.swiper-button-prev {
  color: #fff;
  text-shadow: 0 0 10px rgba(44, 44, 44, 0.8); }

.swiper-button-next {
  color: #fff;
  text-shadow: 0 0 10px rgba(44, 44, 44, 0.8); }

.quote-item {
  padding-top: 3rem; }
  .quote-item .quote-text {
    font-weight: 300;
    width: 80%;
    margin-left: 10%;
    position: relative;
    height: 240px;
    margin-top: 30px;
    text-align: center; }
    @media (max-width: 667px) {
      .quote-item .quote-text {
        height: 190px;
        line-height: 1.4; } }
    .quote-item .quote-text:before {
      content: "\f10e";
      display: block;
      color: #888;
      font: normal normal normal 14px/1 FontAwesome;
      font-size: inherit;
      font-size: 30px;
      text-rendering: auto;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      position: absolute;
      left: -8%;
      top: -30px;
      text-shadow: none; }
      @media (max-width: 667px) {
        .quote-item .quote-text:before {
          font-size: 20px; } }
    .quote-item .quote-text:after {
      content: "\f10d";
      display: block;
      color: #888;
      font: normal normal normal 14px/1 FontAwesome;
      font-size: inherit;
      font-size: 30px;
      text-rendering: auto;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      position: absolute;
      right: -8%;
      text-shadow: none; }
      @media (max-width: 667px) {
        .quote-item .quote-text:after {
          font-size: 20px; } }
  .quote-item .quote-name {
    display: block;
    text-align: right;
    font-size: 70%;
    margin-top: 20px; }

.bg-animation {
  animation: bg-animation 30s ease infinite; }

@keyframes bg-animation {
  0% {
    background-position: 0% 50%; }
  50% {
    background-position: 100% 50%; }
  100% {
    background-position: 0% 50%; } }
.float-star01 {
  animation-name: float-star01; }

.float-star02 {
  animation-name: float-star02; }

@keyframes float-star01 {
  10% {
    transform: translate3d(10px, 0, 0); }
  20% {
    transform: translate3d(0, 40px, 0); }
  50% {
    transform: translate3d(0, 60px, 0);
    opacity: .6; }
  70% {
    transform: translate3d(0, 40px, 0); }
  80% {
    transform: translate3d(0, 10px, 0); } }
@keyframes float-star02 {
  10% {
    transform: translate3d(10px, 0, 0); }
  20% {
    transform: translate3d(20px, 0, 0); }
  50% {
    transform: translate3d(10px, 0, 0);
    transform: rotate(10deg);
    opacity: .8; }
  70% {
    transform: translate3d(10px, 0, 0); }
  80% {
    transform: translate3d(10px, 0, 0);
    transform: rotate(-10deg); } }
@-webkit-keyframes rotate-right {
  from {
    -webkit-transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(360deg); } }
@-webkit-keyframes rotate-left {
  from {
    -webkit-transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(-360deg); } }
@-webkit-keyframes hover {
  0% {
    -webkit-transform: translateY(0%); }
  50% {
    -webkit-transform: translateY(5%); }
  100% {
    -webkit-transform: translateY(0%); } }
@-webkit-keyframes pull {
  0% {
    -webkit-transform: scaleY(1); }
  40% {
    -webkit-transform: scaleY(1.01); }
  60% {
    -webkit-transform: scaleY(0.99); }
  80% {
    -webkit-transform: scaleY(1.01); }
  100% {
    -webkit-transform: scaleY(0.99); }
  80% {
    -webkit-transform: scaleY(1.01); }
  100% {
    -webkit-transform: scaleY(1); } }
#countryObjects {
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-transform-origin: 200px 200px;
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation: rotate-right 240s linear 0s infinite; }

#floatingGlobe {
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-transform-origin: 200px 200px;
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation: rotate-left 360s linear 0s infinite; }

#globe {
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation: hover 0s linear 0s infinite; }

#windmill {
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-transform-origin: 331px 201px;
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation: rotate-right 2s linear 0s infinite; }

#cloud1 {
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation: hover 3s linear 1s infinite; }

#cloud2 {
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation: hover 3s linear 2s infinite; }

#cloud3 {
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation: hover 3s linear 3s infinite; }

#circle1 {
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-transform-origin: 200px 200px;
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation: rotate-right 12s linear 0s infinite; }

#circle2 {
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-transform-origin: 200px 200px;
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation: rotate-left 24s linear 0s infinite; }

#circle3 {
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-transform-origin: 200px 200px;
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation: rotate-right 12s linear 0s infinite; }

#circle4 {
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-transform-origin: 200px 200px;
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation: rotate-left 24s linear 0s infinite; }

#circle5 {
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-transform-origin: 200px 200px;
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation: rotate-right 12s linear 0s infinite; }

.boat__rudder {
  transform-origin: center center;
  -moz-transform-origin: center center;
  -webkit-transform-origin: center center;
  -o-transform-origin: center center;
  -webkit-animation: rudder-rotate 80s linear infinite;
  animation: rudder-rotate 80s linear infinite; }

@-webkit-keyframes rudder-rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); }
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); } }
@keyframes rudder-rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); }
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); } }
.loading__rocket {
  -webkit-animation: loading-rocket 3s linear infinite;
  animation: loading-rocket 3s linear infinite; }

@-webkit-keyframes loading-rocket {
  0% {
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
    opacity: 1; }
  10% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; }
  40% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; }
  50% {
    -webkit-transform: translateY(2px);
    transform: translateY(2px);
    opacity: 1; }
  60% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
    opacity: 1; }
  80% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
    opacity: 0; }
  to {
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
    opacity: 0; } }
@keyframes loading-rocket {
  0% {
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
    opacity: 1; }
  10% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; }
  40% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; }
  50% {
    -webkit-transform: translateY(2px);
    transform: translateY(2px);
    opacity: 1; }
  60% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
    opacity: 1; }
  80% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
    opacity: 0; }
  to {
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
    opacity: 0; } }
.loading__bubble circle {
  -webkit-animation: bubble 3s linear infinite;
  animation: bubble 3s linear infinite; }

@-webkit-keyframes bubble {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0; }
  65% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1; }
  75% {
    -webkit-transform: scale(1.01);
    transform: scale(1.01);
    opacity: 1; }
  to {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0; } }
@keyframes bubble {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0; }
  65% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1; }
  75% {
    -webkit-transform: scale(1.01);
    transform: scale(1.01);
    opacity: 1; }
  to {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0; } }
.loading__bubble circle:nth-child(2) {
  -webkit-animation-delay: -0.2s;
  animation-delay: -0.2s; }

.loading__bubble circle:nth-child(3) {
  -webkit-animation-delay: -0.3s;
  animation-delay: -0.3s; }

.loading__bubble circle:nth-child(4) {
  -webkit-animation-delay: -0.4s;
  animation-delay: -0.4s; }

.loading__bubble circle:first-child {
  -webkit-transform-origin: 50px 31px;
  -ms-transform-origin: 50px 31px;
  transform-origin: 50px 31px; }

.loading__bubble circle:nth-child(2) {
  -webkit-transform-origin: 52px 28px;
  -ms-transform-origin: 52px 28px;
  transform-origin: 52px 28px; }

.loading__bubble circle:nth-child(3) {
  -webkit-transform-origin: 58px 24px;
  -ms-transform-origin: 58px 24px;
  transform-origin: 58px 24px; }

.loading__bubble circle:nth-child(4) {
  -webkit-transform-origin: 55px 27px;
  -ms-transform-origin: 55px 27px;
  transform-origin: 55px 27px; }

.loading__dot {
  position: absolute;
  top: 120%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  font-size: 0;
  list-style: none;
  padding-left: 0; }

.loading__dot li {
  height: 0;
  position: absolute;
  top: 50%;
  left: 0;
  width: 0;
  margin: 0;
  height: 10px;
  width: 10px;
  border: 3px solid #fff;
  border-radius: 100%;
  -webkit-transform: transformZ(0);
  -ms-transform: transformZ(0);
  transform: transformZ(0);
  -webkit-animation: loadiing-dot 2s infinite;
  animation: loadiing-dot 2s infinite; }

@-webkit-keyframes loadiing-dot {
  0% {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    background: #fff; }
  50% {
    -webkit-transform: scale(1);
    transform: scale(1);
    background: #1C406B; }
  to {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    background: #fff; } }
@keyframes loadiing-dot {
  0% {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    background: #fff; }
  50% {
    -webkit-transform: scale(1);
    transform: scale(1);
    background: #1C406B; }
  to {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    background: #fff; } }
.loading__dot li:first-child {
  left: -20px;
  -webkit-animation-delay: 0s;
  animation-delay: 0s; }

.loading__dot li:nth-child(2) {
  left: 0;
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s; }

.loading__dot li:nth-child(3) {
  left: 20px;
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s; }

* {
  padding: 0;
  margin: 0; }

html {
  overflow-x: hidden; }

body {
  min-width: 100%;
  min-height: 100vh;
  position: relative;
  font-family: "微軟正黑體", "Open Sans", Helvetica, Arial, sans-serif;
  font-size: 16px;
  overflow-x: hidden; }
  @media (max-width: 768px) {
    body {
      min-height: 100%; } }

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 20px 0 10px;
  line-height: 1.4; }

h1 {
  font-size: 42px;
  font-weight: 800; }

h2 {
  font-size: 34px;
  font-weight: 600; }

h3 {
  font-size: 30px;
  font-weight: 600; }

h4 {
  font-size: 24px;
  line-height: 1.4;
  font-weight: 600; }

h5 {
  font-size: 22px;
  font-weight: 600; }

h6 {
  font-size: 18.5px;
  font-weight: 500;
  margin: 10px 0;
  line-height: 1.3; }

.lead {
  margin: 10px 0 5px;
  font-weight: bold; }

@media screen and (max-width: 767px) {
  h1 {
    font-size: 45px;
    margin-bottom: 20px; }

  h2 {
    font-size: 30px;
    margin: 1%; }

  h3 {
    font-size: 28px;
    margin: 1%; }

  h4 {
    font-size: 24px;
    margin: 1%; }

  h5 {
    font-size: 20px;
    font-weight: 600;
    margin: 1%; }

  h6 {
    font-size: 16px;
    font-weight: 600;
    margin: 1%; }

  p {
    font-size: 16px; } }
strong {
  font-weight: 700; }

p {
  font-size: 16px;
  line-height: 1.6; }

p:last-child {
  margin-bottom: 0px; }

ul {
  list-style: none;
  line-height: 1.9em; }

ul li {
  list-style: none; }

ul.disc-list li.disc-list {
  list-style: disc; }

ol {
  margin-left: 30px; }

a {
  transition: all .3s ease;
  color: #15c9ff;
  cursor: pointer; }
  a:hover, a:focus, a:active {
    color: #00ade1;
    text-decoration: none; }

button,
.btn {
  color: #ffffff;
  transition: all .3s ease;
  font-size: 16px;
  line-height: 1.4;
  border: none;
  outline: none;
  font-family: "微軟正黑體", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; }
  button:focus, button:hover,
  .btn:focus,
  .btn:hover {
    color: #ffffff; }

.btn--default {
  background: #fff;
  border: 2px solid #EE7A00;
  margin-top: 20px;
  min-width: 120px;
  color: #EE7A00;
  display: inline-block;
  width: 45%;
  margin: 1%;
  padding: 10px 0;
  font-size: 18px; }

.btn--default:focus,
.btn--default:hover,
.btn--default:active {
  color: #fff;
  background: #EE7A00; }

.btn--block {
  display: block;
  width: 99%;
  margin: 1% 0 2% 0; }

.inactivelink {
  pointer-events: none;
  cursor: default; }

.text-over-h {
  overflow: hidden;
  text-overflow: ellipsis; }

.line-h-15 {
  line-height: 1.5em !important; }

.line-h-16 {
  line-height: 1.6em !important; }

.line-h-18 {
  line-height: 1.8em !important; }

.ma10 {
  margin: 10px; }

.ma20 {
  margin: 20px; }

.ml10 {
  margin-left: 10px; }

.mt10 {
  margin-top: 10px; }

.mt20 {
  margin-top: 20px; }

.mt30 {
  margin-top: 30px; }

.pa0 {
  padding: 0px; }

.pt0 {
  padding-top: 0px; }

section,
header {
  position: relative; }

section {
  padding: 4% 0% 5% 0%;
  float: left;
  width: 100%; }
  @media (max-width: 767px) {
    section {
      padding: 20px 15px;
      overflow: hidden;
      padding-top: 30px;
      padding-bottom: 30px; } }
  section .ul li {
    margin-bottom: 1em; }
    section .ul li:before {
      content: '•';
      position: absolute;
      font-size: 30px;
      left: -.8%; }
  section:last-of-type {
    margin-bottom: 0; }

.container {
  padding: 0; }

header, footer {
  float: left;
  position: relative;
  width: 100%; }

.navbar-inverse {
  height: 90px;
  background-color: transparent;
  border-color: transparent;
  padding: 0;
  margin-bottom: 0; }
  @media (max-width: 1024px) {
    .navbar-inverse {
      height: auto; } }
  @media (max-width: 767px) {
    .navbar-inverse {
      position: absolute;
      background-color: #1e0739;
      height: auto;
      width: 100%;
      padding: 0 15px;
      box-shadow: 0 0 16px #b8a3e4aa; } }
@media (max-width: 1200px) and (min-width: 768px) {
  .navbar-inverse .navbar-header {
    width: 22%; } }

  .navbar-inverse .navbar-header .navbar-toggle {
    border-radius: 0px;
    padding: 14px;
    border-color: #fdfdfd; }
    .navbar-inverse .navbar-header .navbar-toggle .icon-bar {
      background-color: #ffffff;
      height: 2px;
      width: 20px;
      display: block; }
  .navbar-inverse .navbar-logobox {
    display: block;
    padding: 8px;
    width: 220px;
    margin: 7% 0 0 10%; }
    @media (max-width: 1200px) {
      .navbar-inverse .navbar-logobox {
        margin-top: 6px;
        margin-left: 15px; } }
    .navbar-inverse .navbar-logobox img {
      width: 100%; }
  .navbar-inverse .navbar-toggle:focus,
  .navbar-inverse .navbar-toggle:hover {
    background-color: #333333; }
  .navbar-inverse .navbar-nav {
    margin-right: 15px; }
    @media (max-width: 767px) {
      .navbar-inverse .navbar-nav li {
        border-bottom: 1px solid #333333;
        text-align: center; } }
    .navbar-inverse .navbar-nav li a {
      font-size: 16px;
      color: #fdfdfd;
      line-height: 55px;
      padding: 1.1em; }
      @media (max-width: 767px) {
        .navbar-inverse .navbar-nav li a {
          padding: .3em; } }
    .navbar-inverse .navbar-nav li .dropdown-menu {
      padding: 0px;
      border-radius: 0;
      left: calc(50% - 80px); }
      .navbar-inverse .navbar-nav li .dropdown-menu li {
        border-bottom: 1px solid #eee; }
  .navbar-inverse ul li:last-child {
    border-bottom: none; }
  .navbar-inverse .dropdown {
    float: left; }
    .navbar-inverse .dropdown a:hover,
    .navbar-inverse .dropdown a:active,
    .navbar-inverse .dropdown a:visited {
      color: #fdfdfd; }
    .navbar-inverse .dropdown .btn {
      background: transparent; }
  .navbar-inverse .navbar-nav .dropdown-menu li a {
    line-height: 30px;
    padding: 10px 1em;
    text-align: center; }
  .navbar-inverse .nav .open > a,
  .navbar-inverse .nav .open > a:focus,
  .navbar-inverse .nav .open > a:hover {
    background: transparent;
    border-color: transparent; }

.nav-pager {
  float: left;
  width: 100%;
  text-align: center;
  margin: 20px 0; }

.pagination {
  margin: 10px;
  display: inline-block; }

.pagination > li > a, .pagination > li > span {
  color: #888; }
  .pagination > li > a:hover, .pagination > li > a:focus, .pagination > li > a:active, .pagination > li > span:hover, .pagination > li > span:focus, .pagination > li > span:active {
    color: #333;
    text-decoration: none; }

@media (min-width: 992px) {
  .col-md-x5 {
    width: 20%; } }

@media screen and (max-width: 767px) {
  body {
    line-height: 1.4; }

  h1, h2, h3, h4, h5, h6 {
    margin: 20px 0 10px;
    line-height: 1.2; }

  h1 {
    font-size: 3.6rem;
    line-height: 1.3; }

  h2 {
    font-size: 2.5rem;
    line-height: 1.3; }

  h3 {
    font-size: 2.4rem;
    line-height: 1.3; }

  h4 {
    font-size: 2rem;
    line-height: 1.3; }

  h5 {
    font-size: 1.85rem;
    font-weight: 600; }

  h6 {
    font-size: 1.7rem;
    font-weight: 500;
    margin: 10px 0;
    line-height: 1.3; }

  p {
    line-height: 1.4; }

  ul {
    line-height: 1.8; }

  ol {
    margin-left: 20px; }

  button, .btn, .btn--default {
    font-size: 18px; } }