@charset "UTF-8";
/* variable css */
/* font */
/* body */
/* Tables */
/* css reset */
ul {
  margin-bottom: 0; }

p {
  margin-bottom: 0; }

a {
  text-decoration: none; }
  a:hover {
    text-decoration: none;
    color: inherit; }

*:focus {
  outline: none !important; }

.form-control:focus {
  -webkit-box-shadow: none !important;
  box-shadow: none !important; }

/* css reboot */
*,
*::before,
*::after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

html {
  font-family: sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -ms-overflow-style: scrollbar;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

@-ms-viewport {
  width: device-width; }

article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
  display: block; }

body {
  margin: 0;
  font-family: "CenturyGothic", "微軟正黑體", "Microsoft JhengHei", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #000;
  text-align: left;
  background-color: #FFF; }

[tabindex="-1"]:focus {
  outline: 0 !important; }

hr {
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
  overflow: visible; }

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 0; }

p {
  margin-top: 0; }

abbr[title],
abbr[data-original-title] {
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
  cursor: help;
  border-bottom: 0; }

address {
  margin-bottom: 1rem;
  font-style: normal;
  line-height: inherit; }

ol,
ul,
dl {
  margin-top: 0;
  padding-left: 0;
  list-style: none; }

ol ol,
ul ul,
ol ul,
ul ol {
  margin-bottom: 0; }

dt {
  font-weight: 700; }

dd {
  margin-bottom: .5rem;
  margin-left: 0; }

blockquote {
  margin: 0 0 1rem; }

dfn {
  font-style: italic; }

b,
strong {
  font-weight: bolder; }

small {
  font-size: 80%; }

sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline; }

sub {
  bottom: -.25em; }

sup {
  top: -.5em; }

a {
  color: inherit;
  text-decoration: none;
  background-color: transparent;
  -webkit-text-decoration-skip: objects; }
  a:hover {
    color: inherit;
    text-decoration: none; }

a:not([href]):not([tabindex]) {
  color: inherit;
  text-decoration: none; }
  a:not([href]):not([tabindex]):hover, a:not([href]):not([tabindex]):focus {
    color: inherit;
    text-decoration: none; }
  a:not([href]):not([tabindex]):focus {
    outline: 0; }

pre,
code,
kbd,
samp {
  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 1em; }

pre {
  margin-top: 0;
  margin-bottom: 1rem;
  overflow: auto;
  -ms-overflow-style: scrollbar; }

figure {
  margin: 0 0 1rem; }

img {
  vertical-align: middle;
  border-style: none; }

svg:not(:root) {
  overflow: hidden; }

table {
  border-collapse: collapse; }

caption {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  text-align: left;
  caption-side: bottom; }

th {
  text-align: inherit; }

label {
  display: inline-block; }

button {
  border-radius: 0; }

button:focus {
  outline: 1px dotted;
  outline: 5px auto -webkit-focus-ring-color; }

input,
button,
select,
optgroup,
textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit; }

button,
input {
  overflow: visible; }

button,
select {
  text-transform: none; }

button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; }

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  padding: 0;
  border-style: none; }

input[type="radio"],
input[type="checkbox"] {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0; }

input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"] {
  -webkit-appearance: listbox; }

textarea {
  overflow: auto;
  resize: vertical; }

fieldset {
  min-width: 0;
  padding: 0;
  margin: 0;
  border: 0; }

legend {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 0;
  margin-bottom: .5rem;
  font-size: 1.5rem;
  line-height: inherit;
  color: inherit;
  white-space: normal; }

progress {
  vertical-align: baseline; }

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

[type="search"] {
  outline-offset: -2px;
  -webkit-appearance: none; }

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

::-webkit-file-upload-button {
  font: inherit;
  -webkit-appearance: button; }

output {
  display: inline-block; }

summary {
  display: list-item;
  cursor: pointer; }

template {
  display: none; }

[hidden] {
  display: none !important; }

/**
 * ----------------------------------------
 * animation fade-in
 * ----------------------------------------
 */
@-webkit-keyframes fade-in {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes fade-in {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation fade-in-fwd
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-fwd {
  0% {
    -webkit-transform: translateZ(-80px);
    transform: translateZ(-80px);
    opacity: 0; }
  100% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    opacity: 1; } }
@keyframes fade-in-fwd {
  0% {
    -webkit-transform: translateZ(-80px);
    transform: translateZ(-80px);
    opacity: 0; }
  100% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation fade-in-bck
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-bck {
  0% {
    -webkit-transform: translateZ(80px);
    transform: translateZ(80px);
    opacity: 0; }
  100% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    opacity: 1; } }
@keyframes fade-in-bck {
  0% {
    -webkit-transform: translateZ(80px);
    transform: translateZ(80px);
    opacity: 0; }
  100% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation fade-in-top
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-top {
  0% {
    -webkit-transform: translateY(-50px) translateZ(0);
    transform: translateY(-50px) translateZ(0);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0) translateZ(0);
    transform: translateY(0) translateZ(0);
    opacity: 1; } }
@keyframes fade-in-top {
  0% {
    -webkit-transform: translateY(-50px) translateZ(0);
    transform: translateY(-50px) translateZ(0);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0) translateZ(0);
    transform: translateY(0) translateZ(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation fade-in-top-10
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-top-10 {
  0% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; } }
@keyframes fade-in-top-10 {
  0% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation fade-in-right
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-right {
  0% {
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1; } }
@keyframes fade-in-right {
  0% {
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation fade-in-right-10
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-right-10 {
  0% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1; } }
@keyframes fade-in-right-10 {
  0% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation fade-in-bottom
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-bottom {
  0% {
    -webkit-transform: translateY(50px) translateZ(0);
    transform: translateY(50px) translateZ(0);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0) translateZ(0);
    transform: translateY(0) translateZ(0);
    opacity: 1; } }
@keyframes fade-in-bottom {
  0% {
    -webkit-transform: translateY(50px) translateZ(0);
    transform: translateY(50px) translateZ(0);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0) translateZ(0);
    transform: translateY(0) translateZ(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation fade-in-bottom-10
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-bottom-10 {
  0% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; } }
@keyframes fade-in-bottom-10 {
  0% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation fade-in-left
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-left {
  0% {
    -webkit-transform: translateX(-50px) translateZ(0);
    transform: translateX(-50px) translateZ(0);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0) translateZ(0);
    transform: translateX(0) translateZ(0);
    opacity: 1; } }
@keyframes fade-in-left {
  0% {
    -webkit-transform: translateX(-50px) translateZ(0);
    transform: translateX(-50px) translateZ(0);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0) translateZ(0);
    transform: translateX(0) translateZ(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation fade-in-tl
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-tl {
  0% {
    -webkit-transform: translateX(-50px) translateY(-50px) translateZ(0);
    transform: translateX(-50px) translateY(-50px) translateZ(0);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0) translateY(0) translateZ(0);
    transform: translateX(0) translateY(0) translateZ(0);
    opacity: 1; } }
@keyframes fade-in-tl {
  0% {
    -webkit-transform: translateX(-50px) translateY(-50px) translateZ(0);
    transform: translateX(-50px) translateY(-50px) translateZ(0);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0) translateY(0) translateZ(0);
    transform: translateX(0) translateY(0) translateZ(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation fade-in-tr
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-tr {
  0% {
    -webkit-transform: translateX(50px) translateY(-50px);
    transform: translateX(50px) translateY(-50px);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1; } }
@keyframes fade-in-tr {
  0% {
    -webkit-transform: translateX(50px) translateY(-50px);
    transform: translateX(50px) translateY(-50px);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation fade-in-bl
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-bl {
  0% {
    -webkit-transform: translateX(-50px) translateY(50px);
    transform: translateX(-50px) translateY(50px);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1; } }
@keyframes fade-in-bl {
  0% {
    -webkit-transform: translateX(-50px) translateY(50px);
    transform: translateX(-50px) translateY(50px);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation fade-in-br
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-br {
  0% {
    -webkit-transform: translateX(50px) translateY(50px);
    transform: translateX(50px) translateY(50px);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1; } }
@keyframes fade-in-br {
  0% {
    -webkit-transform: translateX(50px) translateY(50px);
    transform: translateX(50px) translateY(50px);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation fade-out
 * ----------------------------------------
 */
@-webkit-keyframes fade-out {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@keyframes fade-out {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

/**
 * ----------------------------------------
 * animation fade-out-bck
 * ----------------------------------------
 */
@-webkit-keyframes fade-out-bck {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    opacity: 1; }
  100% {
    -webkit-transform: translateZ(-80px);
    transform: translateZ(-80px);
    opacity: 0; } }
@keyframes fade-out-bck {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    opacity: 1; }
  100% {
    -webkit-transform: translateZ(-80px);
    transform: translateZ(-80px);
    opacity: 0; } }

/**
 * ----------------------------------------
 * animation fade-out-fwd
 * ----------------------------------------
 */
@-webkit-keyframes fade-out-fwd {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    opacity: 1; }
  100% {
    -webkit-transform: translateZ(80px);
    transform: translateZ(80px);
    opacity: 0; } }
@keyframes fade-out-fwd {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    opacity: 1; }
  100% {
    -webkit-transform: translateZ(80px);
    transform: translateZ(80px);
    opacity: 0; } }

/**
 * ----------------------------------------
 * animation fade-out-top
 * ----------------------------------------
 */
@-webkit-keyframes fade-out-top {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; }
  100% {
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
    opacity: 0; } }
@keyframes fade-out-top {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; }
  100% {
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
    opacity: 0; } }

/**
 * ----------------------------------------
 * animation fade-out-right
 * ----------------------------------------
 */
@-webkit-keyframes fade-out-right {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1; }
  100% {
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
    opacity: 0; } }
@keyframes fade-out-right {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1; }
  100% {
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
    opacity: 0; } }

/**
 * ----------------------------------------
 * animation fade-out-bottom
 * ----------------------------------------
 */
@-webkit-keyframes fade-out-bottom {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; }
  100% {
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0; } }
@keyframes fade-out-bottom {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; }
  100% {
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0; } }

/**
 * ----------------------------------------
 * animation fade-out-left
 * ----------------------------------------
 */
@-webkit-keyframes fade-out-left {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1; }
  100% {
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
    opacity: 0; } }
@keyframes fade-out-left {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1; }
  100% {
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
    opacity: 0; } }

/**
 * ----------------------------------------
 * animation kenburns-top
 * ----------------------------------------
 */
@-webkit-keyframes kenburns-top {
  0% {
    -webkit-transform: scale(1) translateY(0);
    transform: scale(1) translateY(0);
    -webkit-transform-origin: 50% 16%;
    transform-origin: 50% 16%; }
  100% {
    -webkit-transform: scale(1.25) translateY(-15px);
    transform: scale(1.25) translateY(-15px);
    -webkit-transform-origin: top;
    transform-origin: top; } }
@keyframes kenburns-top {
  0% {
    -webkit-transform: scale(1) translateY(0);
    transform: scale(1) translateY(0);
    -webkit-transform-origin: 50% 16%;
    transform-origin: 50% 16%; }
  100% {
    -webkit-transform: scale(1.25) translateY(-15px);
    transform: scale(1.25) translateY(-15px);
    -webkit-transform-origin: top;
    transform-origin: top; } }

/**
 * ----------------------------------------
 * animation kenburns-bottom
 * ----------------------------------------
 */
@-webkit-keyframes kenburns-bottom {
  0% {
    -webkit-transform: scale(1) translateY(0);
    transform: scale(1) translateY(0);
    -webkit-transform-origin: 50% 84%;
    transform-origin: 50% 84%; }
  100% {
    -webkit-transform: scale(1.25) translateY(15px);
    transform: scale(1.25) translateY(15px);
    -webkit-transform-origin: bottom;
    transform-origin: bottom; } }
@keyframes kenburns-bottom {
  0% {
    -webkit-transform: scale(1) translateY(0);
    transform: scale(1) translateY(0);
    -webkit-transform-origin: 50% 84%;
    transform-origin: 50% 84%; }
  100% {
    -webkit-transform: scale(1.25) translateY(15px);
    transform: scale(1.25) translateY(15px);
    -webkit-transform-origin: bottom;
    transform-origin: bottom; } }

/**
 * ----------------------------------------
 * animation rotate-vert-center
 * ----------------------------------------
 */
@-webkit-keyframes rotate-vert-center {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0); }
  100% {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg); } }
@keyframes rotate-vert-center {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0); }
  100% {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg); } }

/**
 * ----------------------------------------
 * animation scale-in-center
 * ----------------------------------------
 */
@-webkit-keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1; }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1; } }
@keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1; }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation scale-out-center
 * ----------------------------------------
 */
@-webkit-keyframes scale-out-center {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1; }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1; } }
@keyframes scale-out-center {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1; }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation swing-in-top-fwd
 * ----------------------------------------
 */
@-webkit-keyframes swing-in-top-fwd {
  0% {
    -webkit-transform: rotateX(-100deg);
    transform: rotateX(-100deg);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 0; }
  100% {
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 1; } }
@keyframes swing-in-top-fwd {
  0% {
    -webkit-transform: rotateX(-100deg);
    transform: rotateX(-100deg);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 0; }
  100% {
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation slide-in-left
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-left {
  0% {
    -webkit-transform: translateX(-1000px);
    transform: translateX(-1000px);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1; } }
@keyframes slide-in-left {
  0% {
    -webkit-transform: translateX(-1000px);
    transform: translateX(-1000px);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation slide-in-right
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-right {
  0% {
    -webkit-transform: translateX(1000px);
    transform: translateX(1000px);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1; } }
@keyframes slide-in-right {
  0% {
    -webkit-transform: translateX(1000px);
    transform: translateX(1000px);
    opacity: 0; }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation slide-in-top
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-top {
  0% {
    -webkit-transform: translateY(-1000px);
    transform: translateY(-1000px);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; } }
@keyframes slide-in-top {
  0% {
    -webkit-transform: translateY(-1000px);
    transform: translateY(-1000px);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation slide-in-bottom
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-bottom {
  0% {
    -webkit-transform: translateY(50%);
    transform: translateY(50%);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; } }
@keyframes slide-in-bottom {
  0% {
    -webkit-transform: translateY(50%);
    transform: translateY(50%);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation slide-in-left-10
 * ----------------------------------------
 */
@keyframes slide-in-left {
  0% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px); }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0); } }

/**
 * ----------------------------------------
 * animation slide-in-right-10
 * ----------------------------------------
 */
@keyframes slide-in-right {
  0% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px); }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0); } }

/**
 * ----------------------------------------
 * animation slide-in-top-10
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-top-10 {
  0% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px); }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0); } }
@keyframes slide-in-top-10 {
  0% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px); }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0); } }

/**
 * ----------------------------------------
 * animation slide-in-bottom-10
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-bottom-10 {
  0% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px); }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0); } }
@keyframes slide-in-bottom-10 {
  0% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px); }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0); } }

/**
 * ----------------------------------------
 * animation bounce-top
 * ----------------------------------------
 */
@-webkit-keyframes bounce-top {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 1; }
  6% {
    -webkit-transform: translateY(-45px);
    transform: translateY(-45px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 1; }
  24% {
    opacity: 1; }
  40% {
    -webkit-transform: translateY(-24px);
    transform: translateY(-24px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  65% {
    -webkit-transform: translateY(-12px);
    transform: translateY(-12px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  82% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  93% {
    -webkit-transform: translateY(-4px);
    transform: translateY(-4px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  25%,
  55%,
  75%,
  87% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out; }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    opacity: 1; } }
@keyframes bounce-top {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 1; }
  6% {
    -webkit-transform: translateY(-45px);
    transform: translateY(-45px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 1; }
  24% {
    opacity: 1; }
  40% {
    -webkit-transform: translateY(-24px);
    transform: translateY(-24px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  65% {
    -webkit-transform: translateY(-12px);
    transform: translateY(-12px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  82% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  93% {
    -webkit-transform: translateY(-4px);
    transform: translateY(-4px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  25%,
  55%,
  75%,
  87% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out; }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation bounce-top
 * ----------------------------------------
 */
@-webkit-keyframes bounce-animal {
  0% {
    -webkit-transform: translateX(-200%) translateY(-10px) scale(0);
    transform: translateX(-200%) translateY(-10px) scale(0);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0; }
  5% {
    -webkit-transform: translateX(-180%) translateY(0px) scale(0.05);
    transform: translateX(-180%) translateY(0px) scale(0.05);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0.05; }
  10% {
    -webkit-transform: translateX(-160%) translateY(-20px) scale(0.1);
    transform: translateX(-160%) translateY(-20px) scale(0.1);
    opacity: 0.1; }
  20% {
    -webkit-transform: translateX(-140%) translateY(0px) scale(0.25);
    transform: translateX(-140%) translateY(0px) scale(0.25);
    opacity: 0.2; }
  35% {
    -webkit-transform: translateX(-120%) translateY(-25px) scale(0.4);
    transform: translateX(-120%) translateY(-25px) scale(0.4);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0.35; }
  40% {
    -webkit-transform: translateX(-100%) translateY(0px) scale(0.5);
    transform: translateX(-100%) translateY(0px) scale(0.5);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0.5; }
  55% {
    -webkit-transform: translateX(-80%) translateY(-30px) scale(0.6);
    transform: translateX(-80%) translateY(-30px) scale(0.6);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0.7; }
  73% {
    -webkit-transform: translateX(-60%) translateY(0px) scale(0.7);
    transform: translateX(-60%) translateY(0px) scale(0.7);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0.85; }
  88% {
    -webkit-transform: translateX(-30%) translateY(-35px) scale(0.85);
    transform: translateX(-30%) translateY(-35px) scale(0.85);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0.95; }
  100% {
    -webkit-transform: translateX(0%) scale(1);
    transform: translateX(0%) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 1; } }
@keyframes bounce-animal {
  0% {
    -webkit-transform: translateX(-200%) translateY(-10px) scale(0);
    transform: translateX(-200%) translateY(-10px) scale(0);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0; }
  5% {
    -webkit-transform: translateX(-180%) translateY(0px) scale(0.05);
    transform: translateX(-180%) translateY(0px) scale(0.05);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0.05; }
  10% {
    -webkit-transform: translateX(-160%) translateY(-20px) scale(0.1);
    transform: translateX(-160%) translateY(-20px) scale(0.1);
    opacity: 0.1; }
  20% {
    -webkit-transform: translateX(-140%) translateY(0px) scale(0.25);
    transform: translateX(-140%) translateY(0px) scale(0.25);
    opacity: 0.2; }
  35% {
    -webkit-transform: translateX(-120%) translateY(-25px) scale(0.4);
    transform: translateX(-120%) translateY(-25px) scale(0.4);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0.35; }
  40% {
    -webkit-transform: translateX(-100%) translateY(0px) scale(0.5);
    transform: translateX(-100%) translateY(0px) scale(0.5);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0.5; }
  55% {
    -webkit-transform: translateX(-80%) translateY(-30px) scale(0.6);
    transform: translateX(-80%) translateY(-30px) scale(0.6);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0.7; }
  73% {
    -webkit-transform: translateX(-60%) translateY(0px) scale(0.7);
    transform: translateX(-60%) translateY(0px) scale(0.7);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0.85; }
  88% {
    -webkit-transform: translateX(-30%) translateY(-35px) scale(0.85);
    transform: translateX(-30%) translateY(-35px) scale(0.85);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0.95; }
  100% {
    -webkit-transform: translateX(0%) scale(1);
    transform: translateX(0%) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation flip-in-ver-left
 * ----------------------------------------
 */
@-webkit-keyframes flip-in-ver-left {
  0% {
    -webkit-transform: rotateY(80deg);
    transform: rotateY(80deg);
    opacity: 0; }
  100% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    opacity: 1; } }
@keyframes flip-in-ver-left {
  0% {
    -webkit-transform: rotateY(80deg);
    transform: rotateY(80deg);
    opacity: 0; }
  100% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation flip-in-hor-bottom
 * ----------------------------------------
 */
@-webkit-keyframes flip-in-hor-bottom {
  0% {
    -webkit-transform: rotateX(80deg);
    transform: rotateX(80deg);
    opacity: 0; }
  100% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    opacity: 1; } }
@keyframes flip-in-hor-bottom {
  0% {
    -webkit-transform: rotateX(80deg);
    transform: rotateX(80deg);
    opacity: 0; }
  100% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation flip-out-hor-top
 * ----------------------------------------
 */
@-webkit-keyframes flip-out-hor-top {
  0% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    opacity: 1; }
  100% {
    -webkit-transform: rotateX(70deg);
    transform: rotateX(70deg);
    opacity: 0; } }
@keyframes flip-out-hor-top {
  0% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    opacity: 1; }
  100% {
    -webkit-transform: rotateX(70deg);
    transform: rotateX(70deg);
    opacity: 0; } }

/**
 * ----------------------------------------
 * animation flip-out-ver-left
 * ----------------------------------------
 */
@-webkit-keyframes flip-out-ver-left {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    opacity: 1; }
  100% {
    -webkit-transform: rotateY(-70deg);
    transform: rotateY(-70deg);
    opacity: 0; } }
@keyframes flip-out-ver-left {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    opacity: 1; }
  100% {
    -webkit-transform: rotateY(-70deg);
    transform: rotateY(-70deg);
    opacity: 0; } }

/**
 * ----------------------------------------
 * animation slide-in-elliptic-top-fwd
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-elliptic-top-fwd {
  0% {
    -webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
    transform: translateY(-600px) rotateX(-30deg) scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% 1400px;
    transform-origin: 50% 1400px;
    opacity: 1; } }
@keyframes slide-in-elliptic-top-fwd {
  0% {
    -webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
    transform: translateY(-600px) rotateX(-30deg) scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% 1400px;
    transform-origin: 50% 1400px;
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation slide-in-bck-bottom
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-bck-bottom {
  0% {
    -webkit-transform: translateZ(700px) translateY(300px);
    transform: translateZ(700px) translateY(300px);
    opacity: 0; }
  100% {
    -webkit-transform: translateZ(0) translateY(0);
    transform: translateZ(0) translateY(0);
    opacity: 1; } }
@keyframes slide-in-bck-bottom {
  0% {
    -webkit-transform: translateZ(700px) translateY(300px);
    transform: translateZ(700px) translateY(300px);
    opacity: 0; }
  100% {
    -webkit-transform: translateZ(0) translateY(0);
    transform: translateZ(0) translateY(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation Gradient
 * ----------------------------------------
 */
@-webkit-keyframes gradient {
  0% {
    background-position: 0% 50%; }
  50% {
    background-position: 100% 50%; }
  100% {
    background-position: 0% 50%; } }
@keyframes gradient {
  0% {
    background-position: 0% 50%; }
  50% {
    background-position: 100% 50%; }
  100% {
    background-position: 0% 50%; } }

/**
 * ----------------------------------------
 * animation tracking-in-expand
 * ----------------------------------------
 */
@-webkit-keyframes tracking-in-expand-2 {
  0% {
    letter-spacing: -4px;
    opacity: 0; }
  40% {
    opacity: 0.6; }
  100% {
    letter-spacing: 2px;
    opacity: 1; } }
@keyframes tracking-in-expand-2 {
  0% {
    letter-spacing: -4px;
    opacity: 0; }
  40% {
    opacity: 0.6; }
  100% {
    letter-spacing: 2px;
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation tracking-in-expand
 * ----------------------------------------
 */
@-webkit-keyframes tracking-in-expand-1 {
  0% {
    letter-spacing: -2px;
    opacity: 0; }
  40% {
    opacity: 0.6; }
  100% {
    letter-spacing: 1px;
    opacity: 1; } }
@keyframes tracking-in-expand-1 {
  0% {
    letter-spacing: -2px;
    opacity: 0; }
  40% {
    opacity: 0.6; }
  100% {
    letter-spacing: 1px;
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation tracking-in-expand
 * ----------------------------------------
 */
@-webkit-keyframes tracking-in-expand-05 {
  0% {
    letter-spacing: -1px;
    opacity: 0; }
  40% {
    opacity: 0.6; }
  100% {
    letter-spacing: 0.5px;
    opacity: 1; } }
@keyframes tracking-in-expand-05 {
  0% {
    letter-spacing: -1px;
    opacity: 0; }
  40% {
    opacity: 0.6; }
  100% {
    letter-spacing: 0.5px;
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation tracking-in-expand
 * ----------------------------------------
 */
@-webkit-keyframes tracking-in-expand-0 {
  0% {
    letter-spacing: -1px;
    opacity: 0; }
  40% {
    opacity: 0.6; }
  100% {
    letter-spacing: 0px;
    opacity: 1; } }
@keyframes tracking-in-expand-0 {
  0% {
    letter-spacing: -1px;
    opacity: 0; }
  40% {
    opacity: 0.6; }
  100% {
    letter-spacing: 0px;
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation slide-in-blurred-top
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-blurred-top {
  0% {
    -webkit-transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
    transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0) scaleY(1) scaleX(1);
    transform: translateY(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1; } }
@keyframes slide-in-blurred-top {
  0% {
    -webkit-transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
    transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0) scaleY(1) scaleX(1);
    transform: translateY(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1; } }

/**
 * ----------------------------------------
 * animation bg-pan-left
 * ----------------------------------------
 */
@-webkit-keyframes bg-pan-left {
  0% {
    background-position: 1000% 50%; }
  100% {
    background-position: 0% 50%; } }
@keyframes bg-pan-left {
  0% {
    background-position: 1000% 50%; }
  100% {
    background-position: 0% 50%; } }

.b-lazy {
  opacity: 0;
  -webkit-transition: opacity 0.5s ease-in-out;
  -o-transition: opacity 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out; }
  .b-lazy.b-load {
    opacity: 1; }

[class*="waypoint"] {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  visibility: hidden;
  -webkit-animation-duration: 0.7s;
  animation-duration: 0.7s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out; }
  [class*="waypoint"].show {
    visibility: visible; }
  [class*="waypoint"].fade-in.show {
    -webkit-animation-name: fade-in;
    animation-name: fade-in; }
  [class*="waypoint"].fade-in-top.show {
    -webkit-animation-name: fade-in-top;
    animation-name: fade-in-top; }
  [class*="waypoint"].fade-in-bottom.show {
    -webkit-animation-name: fade-in-bottom;
    animation-name: fade-in-bottom; }
  [class*="waypoint"].fade-in-left.show {
    -webkit-animation-name: fade-in-left;
    animation-name: fade-in-left; }
  [class*="waypoint"].fade-in-right.show {
    -webkit-animation-name: fade-in-right;
    animation-name: fade-in-right; }
  [class*="waypoint"].fade-in-tl.show {
    -webkit-animation-name: fade-in-tl;
    animation-name: fade-in-tl; }
  [class*="waypoint"].fade-in-tr.show {
    -webkit-animation-name: fade-in-tr;
    animation-name: fade-in-tr; }
  [class*="waypoint"].fade-in-bl.show {
    -webkit-animation-name: fade-in-bl;
    animation-name: fade-in-bl; }
  [class*="waypoint"].fade-in-br.show {
    -webkit-animation-name: fade-in-br;
    animation-name: fade-in-br; }
  [class*="waypoint"].swing-in-top-fwd.show {
    -webkit-animation-name: swing-in-top-fwd;
    animation-name: swing-in-top-fwd; }
  [class*="waypoint"].kenburns-top.show {
    -webkit-animation-name: kenburns-top;
    animation-name: kenburns-top;
    animation-direction: reverse;
    -webkit-animation-duration: 2s;
    animation-duration: 2s; }
  [class*="waypoint"].tracking-in-expand-2.show {
    -webkit-animation-name: tracking-in-expand-2;
    animation-name: tracking-in-expand-2; }
    @media (max-width: 1024px) {
      [class*="waypoint"].tracking-in-expand-2.show {
        -webkit-animation-name: tracking-in-expand-1;
        animation-name: tracking-in-expand-1; } }
  [class*="waypoint"].tracking-in-expand-05.show {
    -webkit-animation-name: tracking-in-expand-05;
    animation-name: tracking-in-expand-05; }
    @media (max-width: 1024px) {
      [class*="waypoint"].tracking-in-expand-05.show {
        -webkit-animation-name: tracking-in-expand-05;
        animation-name: tracking-in-expand-05; } }
  [class*="waypoint"].tracking-in-expand-0.show {
    -webkit-animation-name: tracking-in-expand-0;
    animation-name: tracking-in-expand-0; }
    @media (max-width: 1024px) {
      [class*="waypoint"].tracking-in-expand-0.show {
        -webkit-animation-name: tracking-in-expand-0;
        animation-name: tracking-in-expand-0; } }
  [class*="waypoint"][data-waypoint-duration='100'] {
    -webkit-animation-duration: 0.1s;
    animation-duration: 0.1s; }
  [class*="waypoint"][data-waypoint-delay='100'] {
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s; }
  [class*="waypoint"][data-waypoint-duration='200'] {
    -webkit-animation-duration: 0.2s;
    animation-duration: 0.2s; }
  [class*="waypoint"][data-waypoint-delay='200'] {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s; }
  [class*="waypoint"][data-waypoint-duration='300'] {
    -webkit-animation-duration: 0.3s;
    animation-duration: 0.3s; }
  [class*="waypoint"][data-waypoint-delay='300'] {
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s; }
  [class*="waypoint"][data-waypoint-duration='400'] {
    -webkit-animation-duration: 0.4s;
    animation-duration: 0.4s; }
  [class*="waypoint"][data-waypoint-delay='400'] {
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s; }
  [class*="waypoint"][data-waypoint-duration='500'] {
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s; }
  [class*="waypoint"][data-waypoint-delay='500'] {
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s; }
  [class*="waypoint"][data-waypoint-duration='600'] {
    -webkit-animation-duration: 0.6s;
    animation-duration: 0.6s; }
  [class*="waypoint"][data-waypoint-delay='600'] {
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s; }
  [class*="waypoint"][data-waypoint-duration='700'] {
    -webkit-animation-duration: 0.7s;
    animation-duration: 0.7s; }
  [class*="waypoint"][data-waypoint-delay='700'] {
    -webkit-animation-delay: 0.7s;
    animation-delay: 0.7s; }
  [class*="waypoint"][data-waypoint-duration='800'] {
    -webkit-animation-duration: 0.8s;
    animation-duration: 0.8s; }
  [class*="waypoint"][data-waypoint-delay='800'] {
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s; }
  [class*="waypoint"][data-waypoint-duration='900'] {
    -webkit-animation-duration: 0.9s;
    animation-duration: 0.9s; }
  [class*="waypoint"][data-waypoint-delay='900'] {
    -webkit-animation-delay: 0.9s;
    animation-delay: 0.9s; }
  [class*="waypoint"][data-waypoint-duration='1000'] {
    -webkit-animation-duration: 1s;
    animation-duration: 1s; }
  [class*="waypoint"][data-waypoint-delay='1000'] {
    -webkit-animation-delay: 1s;
    animation-delay: 1s; }
  [class*="waypoint"][data-waypoint-duration='1100'] {
    -webkit-animation-duration: 1.1s;
    animation-duration: 1.1s; }
  [class*="waypoint"][data-waypoint-delay='1100'] {
    -webkit-animation-delay: 1.1s;
    animation-delay: 1.1s; }
  [class*="waypoint"][data-waypoint-duration='1200'] {
    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s; }
  [class*="waypoint"][data-waypoint-delay='1200'] {
    -webkit-animation-delay: 1.2s;
    animation-delay: 1.2s; }
  [class*="waypoint"][data-waypoint-duration='1300'] {
    -webkit-animation-duration: 1.3s;
    animation-duration: 1.3s; }
  [class*="waypoint"][data-waypoint-delay='1300'] {
    -webkit-animation-delay: 1.3s;
    animation-delay: 1.3s; }
  [class*="waypoint"][data-waypoint-duration='1400'] {
    -webkit-animation-duration: 1.4s;
    animation-duration: 1.4s; }
  [class*="waypoint"][data-waypoint-delay='1400'] {
    -webkit-animation-delay: 1.4s;
    animation-delay: 1.4s; }
  [class*="waypoint"][data-waypoint-duration='1500'] {
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s; }
  [class*="waypoint"][data-waypoint-delay='1500'] {
    -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s; }
  [class*="waypoint"][data-waypoint-duration='1600'] {
    -webkit-animation-duration: 1.6s;
    animation-duration: 1.6s; }
  [class*="waypoint"][data-waypoint-delay='1600'] {
    -webkit-animation-delay: 1.6s;
    animation-delay: 1.6s; }
  [class*="waypoint"][data-waypoint-duration='1700'] {
    -webkit-animation-duration: 1.7s;
    animation-duration: 1.7s; }
  [class*="waypoint"][data-waypoint-delay='1700'] {
    -webkit-animation-delay: 1.7s;
    animation-delay: 1.7s; }
  [class*="waypoint"][data-waypoint-duration='1800'] {
    -webkit-animation-duration: 1.8s;
    animation-duration: 1.8s; }
  [class*="waypoint"][data-waypoint-delay='1800'] {
    -webkit-animation-delay: 1.8s;
    animation-delay: 1.8s; }
  [class*="waypoint"][data-waypoint-duration='1900'] {
    -webkit-animation-duration: 1.9s;
    animation-duration: 1.9s; }
  [class*="waypoint"][data-waypoint-delay='1900'] {
    -webkit-animation-delay: 1.9s;
    animation-delay: 1.9s; }
  [class*="waypoint"][data-waypoint-duration='2000'] {
    -webkit-animation-duration: 2s;
    animation-duration: 2s; }
  [class*="waypoint"][data-waypoint-delay='2000'] {
    -webkit-animation-delay: 2s;
    animation-delay: 2s; }

.headerFadeIn {
  -webkit-animation: fade-in-top 1s ease both;
  animation: fade-in-top 1s ease both; }

.headerFadeOut {
  -webkit-animation: fade-out-top 1s ease both;
  animation: fade-out-top 1s ease both; }

/* fonts css */

.btn[class*="-btn"] .txt {
  font-size: 1rem; }

.btn[class*="-btn"] .cn {
  font-size: 0.9375em; }

@media screen and (max-width: 991px) {
  .btn[class*="-btn"] .txt {
    font-size: 1rem; } }

@media screen and (max-width: 374px) {
  .btn[class*="-btn"] .txt {
    font-size: 0.75rem; } }

.btn.banner-btn {
  font-size: 16px; }

.scroll_down {
  font-size: 0.875rem;
  color: rgba(0, 0, 0, 0.5); }

header .nav-header-links .nav-link {
  font-size: 1rem;
  letter-spacing: 1px; }

header .nav-header-links .back-btn .txt {
  font-size: 1rem;
  letter-spacing: 1px; }

footer .links-area label {
  font-size: 1.75rem;
  color: #7a7a7a; }

footer .footer-links a {
  font-size: 1rem;
  letter-spacing: 0.5px; }

footer .footer-contact label,
footer .footer-contact .contact-link {
  font-size: 0.875rem;
  letter-spacing: 0.4px; }

footer .copyright span,
footer .copyright a {
  font-size: 0.8125rem; }

@media (max-width: 991px) {
  footer .footer-links a {
    font-size: 1.125rem; } }

.btn .txt {
  letter-spacing: 0; }

.banner .heading1 {
  font-size: 3.4375em;
  letter-spacing: 1.5px;
  font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  margin-bottom: 15px; }
  @media (max-width: 1459px) {
    .banner .heading1 {
      font-size: 2.44062em; } }
  @media (max-width: 1199px) {
    .banner .heading1 {
      font-size: 2.2rem; } }
  @media (max-width: 991px) {
    .banner .heading1 {
      font-size: 2rem;
      line-height: 1.3; } }

.title-wrapper .title-area .heading1 {
  font-size: 3.4375rem;
  letter-spacing: 2px;
  font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  -webkit-font-smoothing: antialiased;
  margin-bottom: 10px; }
  .banner .title-wrapper .title-area .heading1 {
    margin-bottom: 30px; }
    @media (max-width: 575px) {
      .banner .title-wrapper .title-area .heading1 {
        margin-bottom: 20px; } }

.title-wrapper .title-area .edit {
  color: rgba(255, 255, 255, 0.5); }

@media (max-width: 1365px) {
  .title-wrapper .title-area .heading1 {
    font-size: 3.5vw; } }

@media (max-width: 991px) {
  .title-wrapper .title-area .heading1 {
    font-size: 2rem;
    line-height: 1.3; } }

@media (max-width: 575px) {
  .title-wrapper .title-area .heading1 {
    font-size: 1.875rem; }
  .title-wrapper .title-area .edit {
    font-size: 0.9375rem; } }

.word-add-dash {
  word-break: break-all;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto; }

.share-area .socials,
.share-area .a2a_default_style {
  margin-left: -14px;
  margin-right: -14px; }
  .share-area .socials [class*="social-link--"],
  .share-area .a2a_default_style [class*="social-link--"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
  .share-area .socials a,
  .share-area .a2a_default_style a {
    padding-left: 14px;
    padding-right: 14px; }

.icon-play {
  position: relative;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  background: #80f4e2;
  background: -moz-linear-gradient(45deg, #80f4e2 0%, #4ac7eb 66%, #4ac7eb 100%);
  background: -webkit-linear-gradient(45deg, #80f4e2 0%, #4ac7eb 66%, #4ac7eb 100%);
  background: -o-linear-gradient(45deg, #80f4e2 0%, #4ac7eb 66%, #4ac7eb 100%);
  background: linear-gradient(45deg, #80f4e2 0%, #4ac7eb 66%, #4ac7eb 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80f4e2', endColorstr='#4ac7eb',GradientType=1 );
  opacity: 0.7; }
  .icon-play::before {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 8px;
    border-color: transparent transparent transparent #FFF; }

.btn {
  border: solid 1px #000;
  cursor: pointer; }
  .btn[class*="-btn"] {
    position: relative;
    border-radius: 0;
    padding: 0;
    margin-top: 50px;
    border-style: solid;
    border-width: 1px;
    font-size: 0; }
    .btn[class*="-btn"] .txt {
      position: relative;
      z-index: 2;
      display: inline-block; }
    .btn[class*="-btn"] .en + .cn {
      padding-left: 5px; }
    .btn[class*="-btn"] .decoration {
      position: absolute;
      left: -1px;
      top: -1px;
      width: 14px;
      height: 14px;
      -webkit-transition: width 0.3s ease 0.2s, height 0.2s ease;
      -o-transition: width 0.3s ease 0.2s, height 0.2s ease;
      transition: width 0.3s ease 0.2s, height 0.2s ease; }
    .btn[class*="-btn"]:hover .decoration {
      width: calc(100% + 4px);
      height: calc(100% + 4px); }
  .btn.btn-noborder {
    border-color: transparent;
    padding: 12px 60px; }

.socials [class*="icon-"] {
  -webkit-transition: opacity 0.3s ease-in-out;
  -o-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out;
  color: #FFF;
  opacity: 0.6; }

.socials a:hover [class*="icon-"] {
  opacity: 1; }

.more .search ~ span {
  font-size: 1.125rem; }

.load_more {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  width: 100%;
  max-width: 100%;
  text-align: center;
  margin-top: 30px; }
  .load_more [class*="icon-"] {
    position: relative;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 45px;
    flex: 0 0 45px;
    max-width: 45px;
    width: 45px;
    height: 45px;
    flex: 0 0 45px;
    max-width: 45px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 20px;
    color: #FFF; }
    .load_more [class*="icon-"]::before {
      display: block;
      width: 100%;
      text-align: center;
      z-index: 1; }
    .load_more [class*="icon-"]::after {
      content: '';
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      display: block;
      border-radius: 50%;
      background-color: #619ca2; }
  .load_more .text {
    margin-left: 15px;
    font-family: "mplus-bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }

.btn.no-decoration {
  -webkit-transition: background 0.3s ease, color 0.3s ease;
  -o-transition: background 0.3s ease, color 0.3s ease;
  transition: background 0.3s ease, color 0.3s ease; }
  .btn.no-decoration:hover {
    background-color: #000 !important;
    color: #FFF !important; }

.btn.has-svg {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; }
  .btn.has-svg [class*="icon"] {
    position: relative;
    width: 51px;
    max-width: 51px;
    height: 47px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
    .btn.has-svg [class*="icon"]::before {
      content: '\e90c';
      font-family: 'icomoon';
      position: relative;
      z-index: 10;
      color: #FFF; }
    .btn.has-svg [class*="icon"]::after {
      content: '';
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      background: url("../../upload/f2e/icon/frame.png");
      background-size: contain;
      width: 48px;
      height: 45px;
      background-position: 50% 50%;
      background-repeat: no-repeat; }
    .btn.has-svg [class*="icon"] + .txt {
      padding-left: 20px; }
  .btn.has-svg:hover [class*=icon]::after {
    background-size: contain;
    width: 48px;
    height: 45px;
    background-color: transparent;
    background-image: url("../../upload/f2e/icon/frame_hover.png"); }

.scroll_down {
  position: absolute;
  left: 0;
  cursor: pointer; }
  .scroll_down [class*="icon-"] {
    display: block;
    margin: auto;
    width: 30px;
    height: 30px;
    color: #585858;
    background: #cccccc;
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
    .scroll_down [class*="icon-"]::before {
      display: block; }
  .scroll_down.border-type [class*="icon-"] {
    color: #FFF;
    background-color: transparent;
    border: solid 1px #FFF; }

.scroll_down {
  position: relative;
  width: 100%;
  bottom: 15px; }
  .scroll_down:hover [class*="icon-"] {
    -webkit-animation: slide-in-top-10 .5s ease-in-out both;
    animation: slide-in-top-10 .5s ease-in-out both; }

.gotop-container .gotop {
  position: relative; }

#template_series {
  width: 180px;
  max-width: 100%;
  padding: 15px 20px; }

.tippy-popper .tippy-tooltip.honeybee-theme {
  background-color: #5893d4;
  text-align: left;
  border-radius: 10px;
  font-family: "mplus-medium", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
  .tippy-popper .tippy-tooltip.honeybee-theme .tippy-backdrop {
    background-color: #005792;
    font-weight: bold;
    color: #FFF; }
  .tippy-popper .tippy-tooltip.honeybee-theme .tippy-tooltip {
    background: transparent;
    font-family: "mplus-medium", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }

.tippy-popper p {
  margin-top: 3px; }

.load_more [class*="icon-"]::after {
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: -webkit-transform 0.3s ease-in-out;
  -o-transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; }

.load_more:hover [class*="icon-"]::after {
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2); }

.search.icon-bg {
  -webkit-transition: none !important;
  -o-transition: none !important;
  transition: none !important; }
  .search.icon-bg::before {
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    -o-transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; }
  .search.icon-bg [class*="icon-"] {
    -webkit-transition: none !important;
    -o-transition: none !important;
    transition: none !important; }

.search:hover.icon-bg::before {
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2); }

.search:hover.icon-bg [class*="icon-"] {
  -webkit-transform: none !important;
  -ms-transform: none !important;
  transform: none !important; }

.more:hover .search.icon-bg::before {
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2); }

.more:hover .search.icon-bg [class*="icon-"] {
  -webkit-transform: none !important;
  -ms-transform: none !important;
  transform: none !important; }

.swiper-pagination[data-type="line"] .swiper-pagination-bullet {
  width: auto;
  height: auto;
  background-color: transparent;
  border-radius: 0;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  opacity: 1;
  cursor: pointer; }
  .swiper-pagination[data-type="line"] .swiper-pagination-bullet:first-child:last-child {
    display: none; }
  .swiper-pagination[data-type="line"] .swiper-pagination-bullet:before {
    content: '';
    display: block;
    width: 40px;
    height: 3px;
    background-color: #FFF;
    -webkit-box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1);
    opacity: 0.5;
    -webkit-transition: opacity .6s ease-in-out;
    -o-transition: opacity .6s ease-in-out;
    transition: opacity .6s ease-in-out; }
  .swiper-pagination[data-type="line"] .swiper-pagination-bullet-active:before {
    opacity: 1; }

.swiper-pagination[data-type="line"] .swiper-pagination-bullet + .swiper-pagination-bullet {
  margin-left: 10px; }

.main-nav-tabs-area {
  position: relative; }
  @media (max-width: 767px) {
    .main-nav-tabs-area .selectVal,
    .main-nav-tabs-area .nav-tabs {
      width: 100%;
      max-width: 100%; } }
  .main-nav-tabs-area .selectVal {
    position: relative;
    display: block;
    height: 48px;
    border: solid 1px #000;
    line-height: 36px;
    padding: 6px 20px;
    z-index: 20;
    background-color: #fff; }
    .main-nav-tabs-area .selectVal::after {
      content: '';
      position: absolute;
      display: block;
      right: 10px;
      top: 50%;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
      width: 0;
      height: 0;
      border-style: solid;
      border-width: 8px 5px 0 5px;
      border-color: #000 transparent transparent transparent; }
  .main-nav-tabs-area .selectVal {
    width: 360px;
    height: auto;
    max-width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
    position: relative;
    border: none;
    z-index: 11;
    border-radius: 20px;
    background-color: rgba(224, 222, 227, 0.9);
    color: rgba(0, 0, 0, 0.4);
    padding: 14px 25px; }
    .main-nav-tabs-area .selectVal span {
      line-height: 24px;
      display: block; }
    .main-nav-tabs-area .selectVal::before {
      content: "";
      display: block;
      width: 1px;
      height: 24px;
      background-color: rgba(0, 0, 0, 0.2);
      position: absolute;
      top: 50%;
      right: 55px;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%); }
    .main-nav-tabs-area .selectVal::after {
      content: "";
      width: 0;
      height: 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      border-style: solid;
      border-width: 8px 5.5px 0 5.5px;
      border-color: #609CA2 transparent transparent transparent;
      position: absolute;
      right: 25px;
      top: 50%;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%); }
    @media (min-width: 768px) {
      .main-nav-tabs-area .selectVal {
        display: none; } }
    @media (max-width: 767px) {
      .main-nav-tabs-area .selectVal {
        display: block;
        padding-top: 14px;
        padding-bottom: 14px; } }
    @media (max-width: 479px) {
      .main-nav-tabs-area .selectVal {
        width: 100%;
        padding-top: 12px;
        padding-bottom: 12px; } }
  .main-nav-tabs-area .nav-tabs .select-area_scroll {
    width: 100%; }
  @media (min-width: 768px) {
    .main-nav-tabs-area .nav-tabs {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      list-style: none;
      padding: 0; }
      .main-nav-tabs-area .nav-tabs ul {
        padding-left: 45px;
        padding-right: 45px;
        display: block;
        font-size: 0; }
      .main-nav-tabs-area .nav-tabs .nav-item {
        display: inline-block;
        vertical-align: middle; }
        .main-nav-tabs-area .nav-tabs .nav-item + .nav-item {
          margin-left: 20px; }
        .main-nav-tabs-area .nav-tabs .nav-item .nav-link {
          position: relative;
          display: block;
          padding: 22px 15px;
          -webkit-transition: color 0.3s ease;
          -o-transition: color 0.3s ease;
          transition: color 0.3s ease;
          color: rgba(0, 0, 0, 0.4);
          cursor: pointer; }
          .main-nav-tabs-area .nav-tabs .nav-item .nav-link span {
            position: relative;
            white-space: nowrap;
            z-index: 1; }
          .main-nav-tabs-area .nav-tabs .nav-item .nav-link::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 50%;
            -webkit-transform: translateX(-50%);
            -ms-transform: translateX(-50%);
            transform: translateX(-50%);
            width: 0%;
            height: 5px;
            background-color: #FFF;
            -webkit-transition: width 0.3s ease;
            -o-transition: width 0.3s ease;
            transition: width 0.3s ease;
            z-index: 0; }
          .main-nav-tabs-area .nav-tabs .nav-item .nav-link[data-toggle="tab"]:hover {
            color: black; }
          .main-nav-tabs-area .nav-tabs .nav-item .nav-link[data-toggle="tab"].active {
            color: #000; }
            .main-nav-tabs-area .nav-tabs .nav-item .nav-link[data-toggle="tab"].active::after {
              width: 100%; }
            .main-nav-tabs-area .nav-tabs .nav-item .nav-link[data-toggle="tab"].active:hover {
              color: #000; }
          .main-nav-tabs-area .nav-tabs .nav-item .nav-link[data-toggle="scrolltoid"]:hover {
            color: black; }
            .main-nav-tabs-area .nav-tabs .nav-item .nav-link[data-toggle="scrolltoid"]:hover::after {
              width: 100%; }
      .main-nav-tabs-area .nav-tabs.has-divider .nav-item:not(:last-child) {
        position: relative; }
        .main-nav-tabs-area .nav-tabs.has-divider .nav-item:not(:last-child)::after {
          content: '';
          position: absolute;
          right: -8px;
          top: 50%;
          -webkit-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
          transform: translateY(-50%);
          width: 1px;
          height: 15px;
          background-color: rgba(0, 0, 0, 0.2); } }
  @media (min-width: 992px) {
    .main-nav-tabs-area .nav-tabs .nav-item + .nav-item {
      margin-left: 40px; } }
  @media (max-width: 767px) {
    .main-nav-tabs-area .nav-tabs {
      background: #e7e7e7;
      border-top: 0;
      pointer-events: none;
      position: absolute;
      z-index: 10;
      padding: 0;
      top: 48px;
      left: 50%;
      max-height: 180px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      opacity: 0;
      -webkit-transform: translate(-50%, -20px);
      -ms-transform: translate(-50%, -20px);
      transform: translate(-50%, -20px);
      -webkit-transition: opacity 0.5s ease, -webkit-transform 0.5s ease;
      transition: opacity 0.5s ease, -webkit-transform 0.5s ease;
      -o-transition: opacity 0.5s ease, transform 0.5s ease;
      transition: opacity 0.5s ease, transform 0.5s ease;
      transition: opacity 0.5s ease, transform 0.5s ease, -webkit-transform 0.5s ease;
      overflow-y: auto; }
      .main-nav-tabs-area .nav-tabs .select-area_scroll ul,
      .main-nav-tabs-area .nav-tabs .select-area_scroll ul li {
        width: 100%;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%; }
      .main-nav-tabs-area .nav-tabs.select-area {
        top: 0;
        overflow: hidden;
        background-color: #78A7D4;
        border-radius: 20px 20px 20px 20px;
        padding-top: 25px;
        padding-bottom: 25px;
        -ms-flex-line-pack: center;
        align-content: center;
        max-height: 250px; }
        .main-nav-tabs-area .nav-tabs.select-area .select-area_scroll {
          margin: auto;
          width: calc(100% - 50px);
          -webkit-box-flex: 0;
          -ms-flex: 0 0 calc(100% - 50px);
          flex: 0 0 calc(100% - 50px);
          max-width: calc(100% - 50px);
          max-height: calc(250px - 40px); } }
      @media (max-width: 767px) and (max-width: 767px) {
        .main-nav-tabs-area .nav-tabs.select-area .select-area_scroll {
          margin-left: 0; } }
  @media (max-width: 767px) {
          .main-nav-tabs-area .nav-tabs.select-area .select-area_scroll li a {
            color: #FFF; }
            .main-nav-tabs-area .nav-tabs.select-area .select-area_scroll li a.active {
              background-color: transparent;
              color: #000; }
          .main-nav-tabs-area .nav-tabs.select-area .select-area_scroll li:hover a {
            color: #000; }
      .main-nav-tabs-area .nav-tabs li {
        width: 100%;
        display: block;
        margin-right: 0 !important; }
        .main-nav-tabs-area .nav-tabs li a {
          display: block;
          padding: 10px 20px;
          -webkit-transition: color 0.3s ease;
          -o-transition: color 0.3s ease;
          transition: color 0.3s ease; }
          .main-nav-tabs-area .nav-tabs li a:after,
          .main-nav-tabs-area .nav-tabs li a p:after {
            display: none; }
          .main-nav-tabs-area .nav-tabs li a.active {
            background-color: #eaca59;
            color: #FFF; }
        .main-nav-tabs-area .nav-tabs li:hover a {
          color: #eaca59; }
        .main-nav-tabs-area .nav-tabs li:last-child.current a {
          background-color: transparent;
          color: #000; }
      .main-nav-tabs-area .nav-tabs.open {
        opacity: 1;
        -webkit-transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
        transform: translate(-50%, 0);
        pointer-events: auto;
        z-index: 99; } }
  @media (max-width: 479px) {
    .main-nav-tabs-area .nav-tabs.select-area {
      width: 100%; }
      .main-nav-tabs-area .nav-tabs.select-area .select-area_scroll {
        width: calc(100% - 50px);
        -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(100% - 50px);
        flex: 0 0 calc(100% - 50px);
        max-width: calc(100% - 50px); } }

.tab-content .tab-pane.show {
  -webkit-animation: fade-in .8s ease both;
  animation: fade-in .8s ease both; }

.tab-content .tab-pane.always-show {
  display: block !important;
  height: auto; }

.banner > .wrapper .heading2 {
  font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-weight: bold; }

.banner[data-type="tall"] {
  padding-bottom: 33.854%; }
  @media (max-width: 1024px) {
    .banner[data-type="tall"] {
      padding-bottom: 0;
      height: calc(100vh - 160px) !important; } }
  @media (max-width: 767px) {
    .banner[data-type="tall"] {
      height: calc(100vh - 110px) !important; } }

.banner[data-type="short"] {
  padding-bottom: 26.056%; }

.banner[data-type="full"] {
  padding-bottom: 0;
  height: 100vh;
  min-height: 500px; }
  .banner[data-type="full"] .wrapper {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
    .banner[data-type="full"] .wrapper .title-area {
      width: 100%;
      text-align: center; }

body:not([data-page="product_detail"]) .banner .wrapper .title-area {
  width: 60vw;
  max-width: 100%; }

body:not([data-page="product_detail"]) .banner {
  position: relative;
  width: 100%;
  height: 0;
  overflow: hidden; }
  body:not([data-page="product_detail"]) .banner .bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-size: cover !important; }
  body:not([data-page="product_detail"]) .banner .wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0; }
  @media (max-width: 992px) {
    body:not([data-page="product_detail"]) .banner {
      padding-bottom: 38%; } }
  @media (max-width: 768px) {
    body:not([data-page="product_detail"]) .banner[data-type="short"] {
      padding-bottom: 107.4%; }
    body:not([data-page="product_detail"]) .banner .wrapper .edit br {
      display: none; } }
  @media (max-width: 576px) {
    body:not([data-page="product_detail"]) .banner[data-type="tall"] .wrapper {
      top: 100px;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start; } }

.lbx_box .nicescroll-rails {
  background: transparent !important; }
  .lbx_box .nicescroll-rails .nicescroll-cursors {
    border: 2px solid #000 !important; }

.hide_lightbox .nicescroll-rails {
  right: 0; }

.detail_libox .nicescroll-rails {
  right: 0; }

.detail_libox[data-detail="center"] .nicescroll-rails .nicescroll-cursors {
  border: 2px solid #ECECEC !important; }

.column-1 {
  width: 8.33333%; }

.column-2 {
  width: 16.66667%; }

.column-3 {
  width: 25%; }

.column-4 {
  width: 33.33333%; }

.column-5 {
  width: 41.66667%; }

.column-6 {
  width: 50%; }

.column-7 {
  width: 58.33333%; }

.column-8 {
  width: 66.66667%; }

.column-9 {
  width: 75%; }

.column-10 {
  width: 83.33333%; }

.column-11 {
  width: 91.66667%; }

.column-12 {
  width: 100%; }

.wrapper {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  max-width: 85%; }
  @media (min-width: 576px) {
    .wrapper {
      max-width: 85%; } }
  @media (min-width: 768px) {
    .wrapper {
      max-width: 90%; } }
  @media (min-width: 1630px) {
    .wrapper {
      max-width: 1610px; } }

.wrapper-inner {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  max-width: 80%; }
  @media (min-width: 992px) {
    .wrapper-inner {
      max-width: 800px; } }
  @media (min-width: 1200px) {
    .wrapper-inner {
      max-width: 1000px; } }
  @media (min-width: 1630px) {
    .wrapper-inner {
      max-width: 1300px; } }

/* common css */
.no_scrollbar {
  overflow: hidden;
  -webkit-animation: delay-hidden 1s ease-in-out both;
  animation: delay-hidden 1s ease-in-out both; }

.nicescroll-rails {
  z-index: 1000 !important; }

@-webkit-keyframes delay-hidden {
  from {
    overflow: auto; }
  to {
    overflow: hidden; } }

@keyframes delay-hidden {
  from {
    overflow: auto; }
  to {
    overflow: hidden; } }

.select [preset] {
  cursor: pointer;
  pointer-events: none;
  color: rgba(0, 0, 0, 0.3) !important; }

main {
  position: relative;
  z-index: 1; }

main {
  padding-top: 72px; }
  @media (max-width: 767px) {
    main {
      padding-top: 60px; } }
  @media (max-width: 575px) {
    main {
      padding-top: 50px; } }

footer {
  z-index: 1; }

html[class*="Windows"] body {
  -webkit-font-smoothing: antialiased; }

body {
  position: relative;
  width: 100%;
  opacity: 0;
  -webkit-transition: opacity 0.5s ease-in-out;
  -o-transition: opacity 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out;
  overflow-x: hidden;
  background-color: #343434;
  -webkit-overflow-scrolling: touch; }
  body.page-load {
    opacity: 1; }
  body.lock {
    position: fixed;
    width: 100%;
    height: 100%; }

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

section {
  position: relative; }

img {
  max-width: 100%; }

.clearfix {
  overflow: auto;
  zoom: 1; }

.b-lazy {
  -webkit-transition: opacity 0.5s ease-in-out;
  -o-transition: opacity 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out;
  max-width: 100%;
  opacity: 0; }
  .b-lazy.b-loaded {
    opacity: 1; }

.mask-container {
  position: relative; }
  .mask-container .mask {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    z-index: 1; }
    .mask-container .mask[data-hover-type="opacity"] {
      opacity: 0.5;
      -webkit-transition: opacity 0.7s ease;
      -o-transition: opacity 0.7s ease;
      transition: opacity 0.7s ease; }
  .mask-container:hover .mask[data-hover-type="opacity"] {
    opacity: 0; }

.btn {
  display: inline-block;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 1px solid transparent;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5; }
  .btn.no-border {
    border: 0; }

.px-0 {
  padding-left: 0;
  padding-right: 0; }

.mx-auto {
  margin-left: auto;
  margin-right: auto; }

.my-auto {
  margin-top: auto;
  margin-bottom: auto; }

.mr-auto {
  margin-right: auto; }

.ml-auto {
  margin-left: auto; }

.absolute-full {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  z-index: 2; }

.position-fixed {
  position: fixed !important; }
  .position-fixed-top {
    top: 0; }

.position-absolute {
  position: absolute !important; }
  .position-absolute-top {
    top: 0; }

/* === 背景 === */
.bg.absolute-bg {
  position: absolute; }

/* === display === */
.d-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }

.d-block {
  display: block; }

.d-inline-block {
  display: inline-block; }

/* === 物件 水平對齊 (Margin法) === */
[data-h-align-margin="left"] {
  margin-right: auto; }

[data-h-align-margin="center"] {
  margin-left: auto;
  margin-right: auto; }

[data-h-align-margin="right"] {
  margin-left: auto; }

/* === 文字 水平對齊 === */
[text-align="left"] {
  text-align: left; }

[text-align="center"] {
  text-align: center; }

[text-align="right"] {
  text-align: right; }

.align-horizontal-container {
  font-size: 0; }
  .align-horizontal-container .align-horizontal-item {
    display: inline-block;
    font-size: 1rem; }

/* === 區塊 對齊（Flex法） === */
.flex-align-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
  .flex-align-container[data-article-h-align="left"] {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start; }
  .flex-align-container[data-article-h-align="center"] {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
  .flex-align-container[data-article-h-align="right"] {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end; }
  .flex-align-container[data-article-v-align="top"] {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start; }
  .flex-align-container[data-article-v-align="middle"] {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
  .flex-align-container[data-article-v-align="bottom"] {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end; }

/* === tabs === */
.tab-content {
  position: relative; }

.tab-content > .tab-pane,
.pill-content > .pill-pane {
  display: block;
  height: 0;
  overflow-y: hidden; }

.tab-content > .show,
.pill-content > .show {
  height: auto; }

/* === slick slider === */
.slick-arrow {
  z-index: 99; }

/* === read only === */
.read-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0; }

/* === lists === */
.list-unstyled {
  padding-left: 0;
  list-style: none; }

.transitions__bg {
  position: fixed;
  top: 0;
  right: 0;
  width: 0;
  height: 100vh;
  z-index: 100;
  background-color: #222222;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  z-index: 999999; }
  .transitions__bg.init {
    width: 100%; }

.transitions__logo {
  -webkit-animation: transitions__bg__img 0.5s both;
  animation: transitions__bg__img 0.5s both; }

.transitions__key__box {
  margin-top: 0.5vw;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; }
  .transitions__key__box > .key {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 25px;
    height: 25px;
    border: 1px solid #636363;
    color: #636363;
    border-radius: 5px;
    margin: 0 2px;
    -webkit-transform: skewX(-15deg);
    -ms-transform: skewX(-15deg);
    transform: skewX(-15deg);
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    -webkit-animation: transitions__bg__img 0.5s both;
    animation: transitions__bg__img 0.5s both; }
    .transitions__key__box > .key.active {
      background-color: #ffbc00;
      color: #222222;
      border: 1px solid #ffbc00;
      -webkit-box-shadow: 0 0 10px rgba(255, 188, 0, 0.5);
      box-shadow: 0 0 10px rgba(255, 188, 0, 0.5); }

@-webkit-keyframes transitions__bg__img {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes transitions__bg__img {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

nav.navbar {
  width: 100%;
  z-index: 100;
  position: absolute;
  left: 0;
  top: 0;
  font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-weight: bold; }
  nav.navbar.navbar-bg-dark {
    background: #292929;
    color: #FFF; }
  nav.navbar.position-fixed-top {
    position: fixed;
    -webkit-animation: navBar-fixed 0.5s both;
    animation: navBar-fixed 0.5s both; }
  nav.navbar.position-fixed {
    top: 0; }
    nav.navbar.position-fixed .nav-logo,
    nav.navbar.position-fixed .nav-header .nav-header-right-links {
      margin-left: 0;
      position: fixed;
      top: 0;
      height: 100px; }
    nav.navbar.position-fixed .nav-logo {
      left: 5vw; }
    nav.navbar.position-fixed .nav-header .nav-header-right-links {
      right: 5vw; }
    @media (max-width: 1200px) {
      nav.navbar.position-fixed .nav-logo {
        left: 2vw; }
      nav.navbar.position-fixed .nav-header .nav-header-right-links {
        right: 2vw; } }
    @media (max-width: 576px) {
      nav.navbar.position-fixed .nav-logo {
        left: 15px; }
      nav.navbar.position-fixed .nav-header .nav-header-right-links {
        right: 15px; } }
  nav.navbar .nav-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
    nav.navbar .nav-header .nav-logo {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      height: 100%; }
      nav.navbar .nav-header .nav-logo img {
        display: block;
        max-width: 100%; }
      @media screen and (max-width: 576px) {
        nav.navbar .nav-header .nav-logo {
          -webkit-box-flex: 0;
          -ms-flex: 0 0 120px;
          flex: 0 0 120px; } }
      @media screen and (max-width: 480px) {
        nav.navbar .nav-header .nav-logo {
          -webkit-box-flex: 0;
          -ms-flex: 0 0 auto;
          flex: 0 0 auto; } }
      @media screen and (max-width: 376px) {
        nav.navbar .nav-header .nav-logo {
          -webkit-box-flex: 0;
          -ms-flex: 0 0 70px;
          flex: 0 0 70px;
          max-width: 70px; } }
      nav.navbar .nav-header .nav-logo img {
        -webkit-transition: -webkit-transform .3s ease-in-out;
        transition: -webkit-transform .3s ease-in-out;
        -o-transition: transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
        transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out; }
      nav.navbar .nav-header .nav-logo:hover img {
        -webkit-transform: scale(0.94);
        -ms-transform: scale(0.94);
        transform: scale(0.94); }
    nav.navbar .nav-header .nav-header-links {
      position: relative; }
      nav.navbar .nav-header .nav-header-links.nav-header-center {
        position: absolute;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%); }
        @media screen and (min-width: 768px) {
          nav.navbar .nav-header .nav-header-links.nav-header-center {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center; } }
        @media screen and (max-width: 768px) {
          nav.navbar .nav-header .nav-header-links.nav-header-center {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border: 0; } }
        nav.navbar .nav-header .nav-header-links.nav-header-center ul > li {
          font-size: 0; }
          nav.navbar .nav-header .nav-header-links.nav-header-center ul > li > a {
            position: relative;
            -webkit-transition: 0.3s;
            -o-transition: 0.3s;
            transition: 0.3s; }
            nav.navbar .nav-header .nav-header-links.nav-header-center ul > li > a:hover {
              color: #ffbc00; }
        nav.navbar .nav-header .nav-header-links.nav-header-center ul li + li {
          margin-left: 70px; }
        @media screen and (max-width: 1200px) {
          nav.navbar .nav-header .nav-header-links.nav-header-center ul li + li {
            margin-left: 50px; } }
        @media screen and (max-width: 992px) {
          nav.navbar .nav-header .nav-header-links.nav-header-center ul li + li {
            margin-left: 20px; } }
      nav.navbar .nav-header .nav-header-links.nav-header-right {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin-left: auto; }
        .nav-back {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          margin-left: auto;
          padding-right: 1vw;
          -webkit-user-select: none;
          -moz-user-select: none;
          -ms-user-select: none;
          user-select: none;
          cursor: pointer;
          color: #ffffff; }
          .nav-back:before {
            content: '';
            display: block;
            width: 10px;
            height: 10px;
            border-top: 3px solid #639ce2;
            border-left: 3px solid #639ce2;
            -webkit-transform: rotate(-45deg);
            -ms-transform: rotate(-45deg);
            transform: rotate(-45deg);
            padding-right: 5px; }
  nav.navbar .nav-toggler {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 72px;
    width: 40px;
    border: 0;
    cursor: pointer;
    background-color: transparent; }
    nav.navbar .nav-toggler .icon-nav-toggler {
      position: relative;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      width: 20px;
      height: 20px;
      -webkit-transition: -webkit-transform 0.3s ease-in-out;
      transition: -webkit-transform 0.3s ease-in-out;
      -o-transition: transform 0.3s ease-in-out;
      transition: transform 0.3s ease-in-out;
      transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; }
      nav.navbar .nav-toggler .icon-nav-toggler span {
        position: absolute;
        width: 5px;
        height: 5px;
        display: block;
        border-radius: 50%; }
  nav.navbar .nav-toggler .icon-nav-toggler span:nth-child(1), nav.navbar .nav-toggler .icon-nav-toggler span:nth-child(4) {
    background-color: #eaca59; }
  nav.navbar .nav-toggler .icon-nav-toggler span:nth-child(2), nav.navbar .nav-toggler .icon-nav-toggler span:nth-child(3) {
    background-color: #FFF; }
  nav.navbar .nav-toggler .icon-nav-toggler span:nth-child(1) {
    left: 0;
    top: 0;
    -webkit-transition: height 0.3s ease 0.3s, left 0.3s ease, border 0.3s ease, -webkit-transform 0.3s ease;
    transition: height 0.3s ease 0.3s, left 0.3s ease, border 0.3s ease, -webkit-transform 0.3s ease;
    -o-transition: height 0.3s ease 0.3s, transform 0.3s ease, left 0.3s ease, border 0.3s ease;
    transition: height 0.3s ease 0.3s, transform 0.3s ease, left 0.3s ease, border 0.3s ease;
    transition: height 0.3s ease 0.3s, transform 0.3s ease, left 0.3s ease, border 0.3s ease, -webkit-transform 0.3s ease; }
  nav.navbar .nav-toggler .icon-nav-toggler span:nth-child(2) {
    right: 0;
    top: 0;
    -webkit-transition: width 0.3s ease 0.3s, top 0.3s ease, border 0.3s ease, -webkit-transform 0.3s ease;
    transition: width 0.3s ease 0.3s, top 0.3s ease, border 0.3s ease, -webkit-transform 0.3s ease;
    -o-transition: width 0.3s ease 0.3s, transform 0.3s ease, top 0.3s ease, border 0.3s ease;
    transition: width 0.3s ease 0.3s, transform 0.3s ease, top 0.3s ease, border 0.3s ease;
    transition: width 0.3s ease 0.3s, transform 0.3s ease, top 0.3s ease, border 0.3s ease, -webkit-transform 0.3s ease; }
  nav.navbar .nav-toggler .icon-nav-toggler span:nth-child(3) {
    left: 0;
    bottom: 0;
    -webkit-transition: width 0.3s ease 0.3s, bottom 0.3s ease, border 0.3s ease, -webkit-transform 0.3s ease;
    transition: width 0.3s ease 0.3s, bottom 0.3s ease, border 0.3s ease, -webkit-transform 0.3s ease;
    -o-transition: width 0.3s ease 0.3s, transform 0.3s ease, bottom 0.3s ease, border 0.3s ease;
    transition: width 0.3s ease 0.3s, transform 0.3s ease, bottom 0.3s ease, border 0.3s ease;
    transition: width 0.3s ease 0.3s, transform 0.3s ease, bottom 0.3s ease, border 0.3s ease, -webkit-transform 0.3s ease; }
  nav.navbar .nav-toggler .icon-nav-toggler span:nth-child(4) {
    right: 0;
    bottom: 0;
    -webkit-transition: height 0.3s ease 0.3s, right 0.3s ease, border 0.3s ease, -webkit-transform 0.3s ease;
    transition: height 0.3s ease 0.3s, right 0.3s ease, border 0.3s ease, -webkit-transform 0.3s ease;
    -o-transition: height 0.3s ease 0.3s, transform 0.3s ease, right 0.3s ease, border 0.3s ease;
    transition: height 0.3s ease 0.3s, transform 0.3s ease, right 0.3s ease, border 0.3s ease;
    transition: height 0.3s ease 0.3s, transform 0.3s ease, right 0.3s ease, border 0.3s ease, -webkit-transform 0.3s ease; }
  nav.navbar .nav-toggler:hover .icon-nav-toggler {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg); }
  @media screen and (max-width: 767px) {
    nav.navbar .nav-toggler {
      margin-left: 0;
      width: 60px;
      height: 60px; } }
  @media screen and (max-width: 575px) {
    nav.navbar .nav-toggler {
      width: 50px;
      height: 50px; }
      nav.navbar .nav-toggler .icon-nav-toggler {
        width: 16px;
        height: 16px; }
        nav.navbar .nav-toggler .icon-nav-toggler span {
          width: 4px;
          height: 4px; } }
  @media screen and (max-width: 479px) {
    nav.navbar .nav-toggler {
      margin-left: 0; } }

@-webkit-keyframes navBar-fixed {
  0% {
    top: -100px; }
  100% {
    top: 0; } }

@keyframes navBar-fixed {
  0% {
    top: -100px; }
  100% {
    top: 0; } }

#navBarBtn .hamburgerBox, #navBarBtn .rotateBox {
  width: 100%;
  height: 100%;
  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; }

#navBarBtn .line {
  width: 100%;
  height: 1px;
  margin: 2.5px 0px;
  background-color: white; }
  @media (max-width: 768px) {
    #navBarBtn .line {
      width: 4vw; } }
  @media (max-width: 667px) {
    #navBarBtn .line {
      width: 8vw; } }

#navBar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 998;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  overflow: hidden;
  -webkit-transform: translateX(-100vw);
  -ms-transform: translateX(-100vw);
  transform: translateX(-100vw);
  -webkit-overflow-scrolling: touch; }
  #navBar .cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(255, 188, 0, 0.7); }
    @media (max-width: 768px) {
      #navBar .cover {
        background-color: transparent; } }
  #navBar .lightBoxContent {
    position: relative;
    width: 78vw;
    min-height: 78vh;
    max-width: 1500px;
    background-color: #1f1f1f;
    color: white;
    -webkit-box-shadow: 0 0 30px rgba(31, 31, 31, 0.2);
    box-shadow: 0 0 30px rgba(31, 31, 31, 0.2);
    padding: 14.5vh 8vw;
    z-index: 999; }
    @media (max-width: 1366px) {
      #navBar .lightBoxContent {
        width: 90vw;
        min-height: 88vh; } }
    @media (max-width: 1024px) {
      #navBar .lightBoxContent {
        padding: 9.667vh 5vw; } }
    @media (max-width: 768px) {
      #navBar .lightBoxContent {
        background-color: #1f1f1f;
        width: 100vw;
        min-height: 100vh;
        max-width: 100vw;
        max-height: 100vh;
        overflow: scroll;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 18vh; } }
    #navBar .lightBoxContent .content {
      position: relative;
      max-width: 915px;
      width: 100%;
      margin: 0 auto; }
  #navBar .closeBtn {
    position: absolute;
    top: 50px;
    right: 50px;
    width: 25px;
    height: 25px;
    cursor: pointer; }
    #navBar .closeBtn:before, #navBar .closeBtn:after {
      content: "";
      position: absolute;
      top: 50%;
      left: 0;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
      width: 100%;
      height: 2px;
      background-color: white; }
    #navBar .closeBtn:before {
      -webkit-transform: translateY(-50%) rotate(45deg);
      -ms-transform: translateY(-50%) rotate(45deg);
      transform: translateY(-50%) rotate(45deg); }
    #navBar .closeBtn:after {
      -webkit-transform: translateY(-50%) rotate(-45deg);
      -ms-transform: translateY(-50%) rotate(-45deg);
      transform: translateY(-50%) rotate(-45deg); }
    @media (max-width: 1024px) {
      #navBar .closeBtn {
        top: 20px;
        right: 20px; } }
  #navBar hr {
    margin: 0;
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    width: 100%; }
  #navBar .products .productsTitle {
    font-size: 2.25rem;
    font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: bold;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
  #navBar .products .productsClassBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 40px 0; }
  #navBar .products .productsClass {
    margin: 0 20px;
    text-align: center; }
    #navBar .products .productsClass:hover .before {
      opacity: 0; }
    #navBar .products .productsClass:hover .after {
      opacity: 1; }
    #navBar .products .productsClass:hover .productsClassTitle {
      color: #ffbc00; }
    @media (max-width: 768px) {
      #navBar .products .productsClass {
        margin: 10px; } }
  #navBar .products .productsClassIcon {
    display: block;
    position: relative;
    width: 60px;
    height: 60px;
    margin: 0 auto; }
    #navBar .products .productsClassIcon img {
      display: block;
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
      #navBar .products .productsClassIcon img.before {
        opacity: 1; }
      #navBar .products .productsClassIcon img.after {
        opacity: 0; }
  #navBar .products .productsClassTitle {
    display: block;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    margin-top: 10px; }
  #navBar .products a.overViewLink {
    position: absolute;
    top: 20px;
    right: 0;
    font-size: 0.9375rem;
    text-transform: uppercase;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: bold; }
    #navBar .products a.overViewLink:after, #navBar .products a.overViewLink:before {
      content: "";
      position: absolute;
      top: 50%;
      left: -22.5px;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
      width: 15px;
      height: 2px;
      background-color: #ffbc00;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
    #navBar .products a.overViewLink:before {
      -webkit-transform: translateY(-50%) rotate(90deg);
      -ms-transform: translateY(-50%) rotate(90deg);
      transform: translateY(-50%) rotate(90deg); }
    #navBar .products a.overViewLink:hover {
      color: #ffbc00; }
      #navBar .products a.overViewLink:hover:after {
        -webkit-transform: translateY(-50%) rotate(270deg);
        -ms-transform: translateY(-50%) rotate(270deg);
        transform: translateY(-50%) rotate(270deg); }
      #navBar .products a.overViewLink:hover:before {
        -webkit-transform: translateY(-50%) rotate(270deg);
        -ms-transform: translateY(-50%) rotate(270deg);
        transform: translateY(-50%) rotate(270deg); }
  #navBar .navBox .navPageBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: bold;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 8vh; }
    @media (max-width: 1366px) {
      #navBar .navBox .navPageBox {
        margin-top: 12vh; } }
    @media (max-width: 1024px) {
      #navBar .navBox .navPageBox {
        margin-top: 8vh;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start; } }
    @media (max-width: 768px) {
      #navBar .navBox .navPageBox {
        margin-top: 4vh; } }
  #navBar .navBox .navPageBoxList {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    margin-right: 1.5%; }
    #navBar .navBox .navPageBoxList:last-child {
      margin-right: 0; }
    #navBar .navBox .navPageBoxList a {
      position: relative;
      -webkit-transition: 0.1s 0.4s;
      -o-transition: 0.1s 0.4s;
      transition: 0.1s 0.4s; }
      #navBar .navBox .navPageBoxList a:after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: -8px;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        height: 3px;
        width: 0%;
        background-color: #ffbc00;
        -webkit-transition: 0.5s;
        -o-transition: 0.5s;
        transition: 0.5s; }
      #navBar .navBox .navPageBoxList a:hover:after {
        width: 100%; }
    @media (max-width: 1024px) and (min-width: 769px) {
      #navBar .navBox .navPageBoxList {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        text-align: center;
        margin: 0;
        margin-top: 1%; }
        #navBar .navBox .navPageBoxList:after {
          content: "";
          position: absolute;
          top: 50%;
          right: 0;
          -webkit-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
          transform: translateY(-50%);
          width: 2px;
          height: 65%;
          background-color: rgba(255, 255, 255, 0.3); }
        #navBar .navBox .navPageBoxList:nth-child(5n+4):after, #navBar .navBox .navPageBoxList:last-child:after {
          background-color: transparent; }
        #navBar .navBox .navPageBoxList:hover {
          background-color: rgba(255, 255, 255, 0.1); } }
    @media (max-width: 768px) {
      #navBar .navBox .navPageBoxList {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 100%;
        flex: 1 1 100%;
        text-align: center;
        margin-top: 5%;
        margin-right: 0; } }
  #navBar .navBox .otherBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 8vh; }
    @media (max-width: 1366px) {
      #navBar .navBox .otherBox {
        margin-top: 12vh; } }
    @media (max-width: 1024px) {
      #navBar .navBox .otherBox {
        margin-top: 8vh;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column; } }
    @media (max-width: 768px) {
      #navBar .navBox .otherBox {
        margin-top: 4vh; } }
  #navBar .navBox .otherTitle {
    position: relative;
    top: -2.5px;
    font-size: 0.875rem;
    margin-right: 5px; }
  #navBar .navBox .otherItem {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    @media (max-width: 1024px) {
      #navBar .navBox .otherItem {
        margin-top: 2vh; } }
    @media (max-width: 420px) {
      #navBar .navBox .otherItem.socialMedia {
        display: block; } }
  #navBar .navBox .lang > .otherTitle {
    margin-right: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    white-space: nowrap; }
    #navBar .navBox .lang > .otherTitle > .icon-globe {
      margin-right: 5px;
      font-size: 1.125rem; }
  #navBar .navBox .lang > .langOption {
    margin-left: 8%;
    cursor: pointer;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    color: #7a7a7a; }
    #navBar .navBox .lang > .langOption:hover {
      color: #ffbc00; }
  @media (max-width: 1024px) {
    #navBar .navBox .lang {
      -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
      order: 3; } }
  @media (max-width: 420px) {
    #navBar .navBox .socialMedia .otherTitle {
      display: block;
      text-align: center; } }
  #navBar .navBox .socialMediaBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    @media (max-width: 1024px) {
      #navBar .navBox .socialMediaBox {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1; } }
    @media (max-width: 420px) {
      #navBar .navBox .socialMediaBox {
        margin-top: 1vh; } }
  #navBar .navBox .socialMediaItem {
    margin: 0 5px;
    color: #7a7a7a;
    border: 1px solid #7a7a7a;
    border-radius: 50%;
    font-size: 0.875rem;
    -webkit-transition: all 0.5s, -webkit-transform 0.5s;
    transition: all 0.5s, -webkit-transform 0.5s;
    -o-transition: all 0.5s, transform 0.5s;
    transition: all 0.5s, transform 0.5s;
    transition: all 0.5s, transform 0.5s, -webkit-transform 0.5s; }
    #navBar .navBox .socialMediaItem > a {
      display: block;
      width: 30px;
      height: 30px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
    #navBar .navBox .socialMediaItem:hover {
      border: 1px solid #ffbc00;
      background-color: #ffbc00;
      color: #1f1f1f; }
      #navBar .navBox .socialMediaItem:hover > a {
        -webkit-animation: rotate-vert-center 0.25s cubic-bezier(0.455, 0.03, 0.515, 0.955) both;
        animation: rotate-vert-center 0.25s cubic-bezier(0.455, 0.03, 0.515, 0.955) both;
        -webkit-transform: translate3d(0, 0, 180);
        transform: translate3d(0, 0, 180); }
  #navBar .navBox .otherLinks a {
    font-size: 0.875rem;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s; }
    #navBar .navBox .otherLinks a:hover {
      color: #ffbc00; }
  #navBar .navBox .otherLinks span {
    display: inline-block;
    margin: 0 10px; }
  @media (max-width: 1024px) {
    #navBar .navBox .otherLinks {
      -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
      order: 2; } }
  #navBar.active {
    -webkit-transform: translateX(0vw);
    -ms-transform: translateX(0vw);
    transform: translateX(0vw);
    -webkit-transition: 0s;
    -o-transition: 0s;
    transition: 0s; }
    #navBar.active .cover {
      width: 100vw;
      -webkit-animation: openNavBarLightBox 0.5s both;
      animation: openNavBarLightBox 0.5s both; }
    #navBar.active .lightBoxContent {
      -webkit-animation: openNavBarLightBox-Content 0.5s 0.5s both;
      animation: openNavBarLightBox-Content 0.5s 0.5s both; }
  #navBar.close {
    -webkit-transform: translateX(-100vw);
    -ms-transform: translateX(-100vw);
    transform: translateX(-100vw);
    -webkit-transition: 0s 1s;
    -o-transition: 0s 1s;
    transition: 0s 1s; }
    #navBar.close .cover {
      -webkit-animation: closeNavBarLightBox 0.5s 0.5s both;
      animation: closeNavBarLightBox 0.5s 0.5s both; }
    #navBar.close .lightBoxContent {
      -webkit-animation: closeNavBarLightBox-Content 0.5s both;
      animation: closeNavBarLightBox-Content 0.5s both; }

@-webkit-keyframes openNavBarLightBox {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes openNavBarLightBox {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@-webkit-keyframes openNavBarLightBox-Content {
  0% {
    -webkit-transform: translateX(100vw);
    transform: translateX(100vw); }
  100% {
    -webkit-transform: translateX(0vw);
    transform: translateX(0vw); } }

@keyframes openNavBarLightBox-Content {
  0% {
    -webkit-transform: translateX(100vw);
    transform: translateX(100vw); }
  100% {
    -webkit-transform: translateX(0vw);
    transform: translateX(0vw); } }

@-webkit-keyframes closeNavBarLightBox {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes closeNavBarLightBox {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@-webkit-keyframes closeNavBarLightBox-Content {
  0% {
    -webkit-transform: translateX(0vw);
    transform: translateX(0vw); }
  100% {
    -webkit-transform: translateX(-100vw);
    transform: translateX(-100vw); } }

@keyframes closeNavBarLightBox-Content {
  0% {
    -webkit-transform: translateX(0vw);
    transform: translateX(0vw); }
  100% {
    -webkit-transform: translateX(-100vw);
    transform: translateX(-100vw); } }

footer {
  background-color: #343434; }
  footer > .content {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch; }
    @media (max-width: 1024px) {
      footer > .content {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column; } }
  footer .policy {
    color: white;
    position: relative; }
    footer .policy:after {
      content: "";
      display: block;
      position: absolute;
      bottom: -1px;
      right: 0;
      width: 100%;
      height: 1px;
      background-color: white; }
  footer .sidleBox {
    width: 50%;
    position: relative;
    padding-bottom: 4.6785vw; }
    @media (max-width: 1024px) {
      footer .sidleBox {
        width: 100%; } }
    footer .sidleBox > .content {
      position: relative;
      height: 100%; }
    footer .sidleBox.left {
      background-color: #292929;
      padding-top: 6.510417vw;
      z-index: 1; }
      footer .sidleBox.left:after {
        content: "";
        position: absolute;
        top: -50px;
        left: 0;
        width: 100%;
        height: 50px;
        background: inherit; }
      footer .sidleBox.left > .content {
        -webkit-transform: translateX(15vw);
        -ms-transform: translateX(15vw);
        transform: translateX(15vw); }
        @media (max-width: 1366px) {
          footer .sidleBox.left > .content {
            -webkit-transform: translateX(4vw);
            -ms-transform: translateX(4vw);
            transform: translateX(4vw); } }
        @media (max-width: 1024px) {
          footer .sidleBox.left > .content {
            -webkit-transform: translateX(0vw);
            -ms-transform: translateX(0vw);
            transform: translateX(0vw); } }
      @media (max-width: 1024px) {
        footer .sidleBox.left {
          -webkit-box-ordinal-group: 3;
          -ms-flex-order: 2;
          order: 2;
          background-color: #1f1f1f; } }
    footer .sidleBox.right {
      background-color: #1f1f1f;
      padding-right: 12.5vw;
      padding-left: 5.2917vw;
      padding-top: 4.6785vw; }
      @media (max-width: 1366px) {
        footer .sidleBox.right {
          padding-right: 4vw; } }
      @media (max-width: 1024px) {
        footer .sidleBox.right {
          -webkit-box-ordinal-group: 2;
          -ms-flex-order: 1;
          order: 1;
          background-color: #292929; } }
    @media (max-width: 1024px) {
      footer .sidleBox.left, footer .sidleBox.right {
        padding: 4.6785vw; } }
  footer .socialMediaBox, footer .socialMediaItem > a, footer .duckyContact, footer .contactGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
  footer .websiteBox {
    color: rgba(255, 255, 255, 0.6);
    font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: bold;
    font-size: 0;
    margin-left: -15px; }
    @media (max-width: 1024px) {
      footer .websiteBox {
        visibility: hidden;
        height: 0; } }
    footer .websiteBox > li {
      font-size: 1.0625rem;
      display: inline-block;
      margin: 0 0.78125vw; }
      @media (max-width: 1024px) {
        footer .websiteBox > li {
          margin: 0 1.5vw; } }
      footer .websiteBox > li > a {
        text-transform: uppercase;
        -webkit-transition: 0.5s;
        -o-transition: 0.5s;
        transition: 0.5s; }
        footer .websiteBox > li > a:hover {
          color: #ffbc00; }
  footer .duckyBox {
    margin-top: 3.125vw; }
  footer .duckyLogo {
    width: 155px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
    @media (max-width: 1024px) {
      footer .duckyLogo {
        margin: 30px auto; } }
    footer .duckyLogo > img {
      width: 100%; }
  footer .duckyRights {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.2);
    margin-top: 15px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
    @media (max-width: 1024px) {
      footer .duckyRights {
        text-align: center;
        margin-top: 30px; } }
  footer .socialMediaBox {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end; }
    @media (max-width: 1024px) {
      footer .socialMediaBox {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center; } }
  footer .socialMediaBoxTitle {
    text-align: right;
    font-size: 28px;
    color: #7a7a7a; }
    @media (max-width: 1024px) {
      footer .socialMediaBoxTitle {
        text-align: center; } }
  footer .socialMediaItem {
    border-radius: 50%;
    border: 1px solid #7a7a7a;
    margin-left: 0.9vw;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    overflow: hidden; }
    @media (max-width: 1024px) {
      footer .socialMediaItem {
        margin-top: 20px;
        margin-left: 3.6vw; }
        footer .socialMediaItem:first-child {
          margin-left: 0; } }
    footer .socialMediaItem > a {
      width: 48px;
      height: 48px;
      font-size: 1.125rem;
      color: #ffbc00;
      line-height: 0;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
      @media (max-width: 1024px) {
        footer .socialMediaItem > a {
          width: 42px;
          height: 42px; } }
      @media (max-width: 768px) {
        footer .socialMediaItem > a {
          width: 36px;
          height: 36px;
          font-size: 1rem; } }
    footer .socialMediaItem:hover {
      background-color: #ffbc00; }
      footer .socialMediaItem:hover > a {
        color: #1f1f1f;
        -webkit-animation: rotate-vert-center 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) both;
        animation: rotate-vert-center 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) both;
        -webkit-transform: translate3d(0, 0, 180);
        transform: translate3d(0, 0, 180);
        -webkit-transform-style: preserve-3d;
        transform-style: preserve-3d; }
  footer .duckyContact {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-style: normal;
    font-size: 0.8125rem;
    margin: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d; }
    @media (min-width: 1024px) {
      footer .duckyContact {
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end; } }
    @media (max-width: 768px) {
      footer .duckyContact {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column; } }
    footer .duckyContact .contactGroup {
      margin-right: 18px; }
      footer .duckyContact .contactGroup:first-child {
        margin-right: 18px; }
        @media (max-width: 768px) {
          footer .duckyContact .contactGroup:first-child {
            margin: 0; } }
    footer .duckyContact .contactItem {
      text-align: center;
      margin-right: 18px;
      line-height: 2; }
      footer .duckyContact .contactItem:last-child {
        margin-right: 0; }
    footer .duckyContact .contactTitle {
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold;
      font-weight: bold;
      color: white; }
    footer .duckyContact .contactText {
      color: #7a7a7a;
      margin-left: 9px; }
    @media (max-width: 1024px) {
      footer .duckyContact {
        position: relative;
        margin-top: 30px; } }
  footer .gotop {
    position: absolute;
    bottom: 80px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 2;
    cursor: pointer;
    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-align: center;
    -ms-flex-align: center;
    align-items: center; }
    @media (max-width: 1024px) {
      footer .gotop {
        bottom: 47.5%;
        -webkit-transform: translate(-50%, 100%);
        -ms-transform: translate(-50%, 100%);
        transform: translate(-50%, 100%); } }
    @media (max-width: 570px) {
      footer .gotop {
        bottom: 45%; } }
    @media (max-width: 420px) {
      footer .gotop {
        bottom: 42.5%; } }
    footer .gotop svg {
      width: 30px;
      height: 30px; }
    footer .gotop span:before {
      display: block;
      color: #ffbc00;
      font-weight: bold;
      -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      transform: rotate(90deg);
      font-size: 0.75rem; }
    footer .gotop .goTopArrow {
      fill: #ffbc00; }
    footer .gotop text.goTopText {
      fill: white;
      font-size: 3rem !important;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold; }
    footer .gotop p.goTopText {
      color: white;
      font-size: 0.9375rem !important;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold; }

[data-page="product_index"] .title-wrapper * {
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s; }

[data-page="product_index"] main > .content {
  padding-top: 160px;
  padding-bottom: 225px; }
  [data-page="product_index"] main > .content .products-wrapper {
    padding-top: 80px; }
  @media (max-width: 1199px) {
    [data-page="product_index"] main > .content {
      padding-top: 16vw;
      padding-bottom: 30vw; } }
  @media (max-width: 767px) {
    [data-page="product_index"] main > .content {
      padding-top: 100px;
      padding-bottom: 130px; } }
  @media (max-width: 575px) {
    [data-page="product_index"] main > .content {
      padding-top: 80px;
      padding-bottom: 40px; } }

[data-page="product_index"] .products-wrapper [class*="column-"] {
  position: relative; }

[data-page="product_index"] .products-wrapper .pic-container,
[data-page="product_index"] .products-wrapper .text-container {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%; }

[data-page="product_index"] .products-wrapper .pic-container {
  background-size: cover !important; }
  [data-page="product_index"] .products-wrapper .pic-container img {
    display: none; }

[data-page="product_index"] .products-wrapper .text-container .text-inner {
  padding: 85px 50px; }

[data-page="product_index"] .products-wrapper .text-container .title {
  display: inline-block; }
  [data-page="product_index"] .products-wrapper .text-container .title .heading1 {
    font-size: 1.875rem;
    letter-spacing: 0.5px;
    -webkit-font-smoothing: antialiased;
    font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }

[data-page="product_index"] .products-wrapper .text-container .hr {
  width: 30px;
  height: 6px;
  background-color: #ffbc00;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: 0;
  display: inline-block; }

@media (min-width: 768px) and (max-width: 1199px) {
  [data-page="product_index"] .products-wrapper .grid-item:not(.grid-item--width2) .text-container .edit p br {
    display: none; } }

@media (min-width: 768px) and (max-width: 991px) {
  [data-page="product_index"] .products-wrapper .text-container .text-inner {
    padding: 15px 30px; } }

@media (max-width: 767px) {
  [data-page="product_index"] .products-wrapper .pic-container {
    position: relative; }
    [data-page="product_index"] .products-wrapper .pic-container img {
      display: block; }
  [data-page="product_index"] .products-wrapper .text-container {
    display: block; }
    [data-page="product_index"] .products-wrapper .text-container .text-inner {
      padding: 15px 30px;
      text-align: left; } }

@media (max-width: 575px) {
  [data-page="product_index"] .products-wrapper .text-container .title .heading1 {
    font-size: 1.35rem; }
  [data-page="product_index"] .products-wrapper .text-container .hr {
    height: 3px; }
  [data-page="product_index"] .products-wrapper .text-container .edit {
    font-size: 0.875rem; }
    [data-page="product_index"] .products-wrapper .text-container .edit p br {
      display: none; } }

[data-page="product_index"] .full-area {
  width: 100%; }

[data-page="product_index"] .grid-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; }

[data-page="product_index"] .grid {
  margin: 0 auto;
  width: 1630px !important;
  max-width: 100%;
  margin-left: 0; }

[data-page="product_index"] .grid:after {
  content: '';
  display: block;
  clear: both; }

[data-page="product_index"] .grid-sizer,
[data-page="product_index"] .grid-item {
  width: 50%; }

[data-page="product_index"] .grid-item {
  position: relative;
  height: 0;
  padding-bottom: 27.608%;
  float: left;
  color: white;
  text-align: center; }
  [data-page="product_index"] .grid-item--width-long {
    width: 50%; }
  [data-page="product_index"] .grid-item--width-short {
    width: 50%; }
  [data-page="product_index"] .grid-item--width2 {
    width: 100%;
    padding-bottom: 41.105%; }
  [data-page="product_index"] .grid-item--height2 {
    padding-bottom: 55.215%; }

[data-page="product_index"] .grid-item-box {
  position: absolute;
  left: 0;
  top: 0;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  overflow: hidden;
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s; }
  [data-page="product_index"] .grid-item-box::before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index: 2; }
  [data-page="product_index"] .grid-item-box .pic-container {
    z-index: 1; }
  [data-page="product_index"] .grid-item-box .text-container {
    z-index: 2; }

@media (max-width: 1709px) {
  [data-page="product_index"] .grid-sizer,
  [data-page="product_index"] .grid-item,
  [data-page="product_index"] .grid-item--width-short,
  [data-page="product_index"] .grid-item--width-long {
    width: 50%; }
  [data-page="product_index"] .grid-item--width2 {
    width: 100%; } }

@media (min-width: 768px) {
  [data-page="product_index"] .grid-item:nth-of-type(even).grid-item--width-long.grid-item--height2 {
    float: left; }
  [data-page="product_index"] .grid-item:nth-of-type(odd).grid-item--width-long.grid-item--height2 {
    float: right; } }

@media (max-width: 767px) {
  [data-page="product_index"] {
    display: block; }
    [data-page="product_index"] .grid-item {
      float: none; }
    [data-page="product_index"] .grid-item + .grid-item {
      margin-top: 15px; }
    [data-page="product_index"] .grid-item-box {
      position: relative;
      width: 100%;
      height: auto; }
    [data-page="product_index"] .grid-sizer,
    [data-page="product_index"] .grid-item,
    [data-page="product_index"] .grid-item--width-short,
    [data-page="product_index"] .grid-item--width-long {
      width: 100%;
      padding-bottom: 0;
      height: auto; }
    [data-page="product_index"] .grid-item--width2 {
      width: 100%; } }

[data-page="product_index"] .grid-item-box::before {
  opacity: 0;
  -webkit-transition: opacity 0.7s ease;
  -o-transition: opacity 0.7s ease;
  transition: opacity 0.7s ease; }

[data-page="product_index"] .grid-item-box .pic-container {
  -webkit-transition: -webkit-transform 0.7s ease;
  transition: -webkit-transform 0.7s ease;
  -o-transition: transform 0.7s ease;
  transition: transform 0.7s ease;
  transition: transform 0.7s ease, -webkit-transform 0.7s ease; }

[data-page="product_index"] .grid-item-box .text-container .hr {
  -webkit-transition: width 0.7s ease;
  -o-transition: width 0.7s ease;
  transition: width 0.7s ease; }

[data-page="product_index"] .grid-item-box:hover::before {
  opacity: 0.3; }

[data-page="product_index"] .grid-item-box:hover .pic-container {
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2); }

[data-page="product_index"] .grid-item-box:hover .text-container .hr {
  width: 100%; }

#zoomple_previewholder, #zoomple_image_overlay {
  z-index: -1; }
  #zoomple_previewholder.show, #zoomple_image_overlay.show {
    z-index: 100; }

#zoomple_previewholder img {
  max-width: none; }

[data-page="product_detail"] .banner .heading2 {
  font-weight: bold;
  font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }

[data-page="product_detail"] .banner .heading1 {
  line-height: 1.2; }

[data-page="product_detail"] .banner .wrapper-full.waypoint.show .bottom .magnifier-area,
[data-page="product_detail"] .banner .wrapper-full.waypoint.show .bottom .swiper-pagination,
[data-page="product_detail"] .banner .wrapper-full.waypoint.show .bottom .share-area,
[data-page="product_detail"] .banner .wrapper-full.waypoint.show .bottom .scroll_down [class*="icon-"] {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out; }

[data-page="product_detail"] .banner .wrapper-full.waypoint.show .bottom .magnifier-area,
[data-page="product_detail"] .banner .wrapper-full.waypoint.show .bottom .swiper-pagination {
  -webkit-animation-name: fade-in-left;
  animation-name: fade-in-left; }

[data-page="product_detail"] .banner .wrapper-full.waypoint.show .bottom .share-area {
  -webkit-animation-name: fade-in-right;
  animation-name: fade-in-right; }

[data-page="product_detail"] .banner .wrapper-full.waypoint.show .bottom .scroll_down [class*="icon-"] {
  -webkit-animation-name: fade-in-top;
  animation-name: fade-in-top; }

[data-page="product_detail"] .banner .swiper-container .swiper-slide {
  visibility: hidden; }
  [data-page="product_detail"] .banner .swiper-container .swiper-slide-active {
    visibility: visible; }
    [data-page="product_detail"] .banner .swiper-container .swiper-slide-active[data-bg="bg"] .bg {
      -webkit-animation: gradient 5s ease both infinite;
      animation: gradient 5s ease both infinite; }
    [data-page="product_detail"] .banner .swiper-container .swiper-slide-active .title-area .heading2 {
      -webkit-animation: fade-in-left 0.8s ease-out 0.3s both;
      animation: fade-in-left 0.8s ease-out 0.3s both; }
    [data-page="product_detail"] .banner .swiper-container .swiper-slide-active .title-area .heading1 {
      -webkit-animation: fade-in-left 0.8s ease-out 0.6s both;
      animation: fade-in-left 0.8s ease-out 0.6s both; }
    [data-page="product_detail"] .banner .swiper-container .swiper-slide-active .title-area .edit {
      -webkit-animation: fade-in-left 0.8s ease-out 0.9s both;
      animation: fade-in-left 0.8s ease-out 0.9s both; }
    [data-page="product_detail"] .banner .swiper-container .swiper-slide-active .pic-area img {
      -webkit-animation: scale-in-center 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.2s both;
      animation: scale-in-center 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.2s both; }

[data-page="product_detail"] .banner > .wrapper-full {
  position: relative;
  z-index: 10; }

[data-page="product_detail"] .banner .material,
[data-page="product_detail"] .banner .bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover !important; }

[data-page="product_detail"] .banner .swiper-container .swiper-slide {
  width: 100vw;
  height: calc(100vh - 72px); }
  @media (max-width: 576px) {
    [data-page="product_detail"] .banner .swiper-container .swiper-slide {
      padding-top: 50px;
      height: auto;
      min-height: calc(100vh - 50px); } }
  [data-page="product_detail"] .banner .swiper-container .swiper-slide[data-bg="bg"] .bg {
    display: block; }
  [data-page="product_detail"] .banner .swiper-container .swiper-slide[data-bg="bg"] .material {
    display: none; }
  [data-page="product_detail"] .banner .swiper-container .swiper-slide[data-bg="material"] .bg {
    display: block; }
  [data-page="product_detail"] .banner .swiper-container .swiper-slide[data-bg="material"] .material {
    display: block; }
  [data-page="product_detail"] .banner .swiper-container .swiper-slide .wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    z-index: 2; }
  [data-page="product_detail"] .banner .swiper-container .swiper-slide .title-wrapper {
    max-width: 50%; }
    @media (max-width: 1024px) {
      [data-page="product_detail"] .banner .swiper-container .swiper-slide .title-wrapper {
        max-width: none; } }
  [data-page="product_detail"] .banner .swiper-container .swiper-slide .title-area {
    padding-top: 8vh;
    z-index: 20; }
  [data-page="product_detail"] .banner .swiper-container .swiper-slide .title .heading2,
  [data-page="product_detail"] .banner .swiper-container .swiper-slide .title .heading1 {
    max-width: 100%; }
  [data-page="product_detail"] .banner .swiper-container .swiper-slide .pic-area {
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    max-width: 1000px;
    width: 90%;
    z-index: 1;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 200px 0 0; }
    [data-page="product_detail"] .banner .swiper-container .swiper-slide .pic-area .pic {
      cursor: default; }
      [data-page="product_detail"] .banner .swiper-container .swiper-slide .pic-area .pic img {
        display: block;
        margin-left: auto;
        margin-right: auto;
        max-height: calc(100vh - 300px); }

[data-page="product_detail"] .banner .swiper-container .wrapper.bottom {
  position: absolute;
  bottom: 120px;
  left: 0;
  width: 100%;
  right: 0;
  z-index: 2; }
  @media (max-width: 575px) {
    [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .magnifier-area {
      position: relative;
      width: 36px; } }
  [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .magnifier-btn {
    position: relative;
    border-radius: 50%;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    background-image: none;
    background-color: #fff;
    cursor: pointer;
    width: 36px;
    height: 36px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
    [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .magnifier-btn.on {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex; }
    [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .magnifier-btn [class*="icon-"] {
      font-size: 20px; }
    [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .magnifier-btn .line {
      position: absolute;
      top: calc(50% - 1px);
      left: calc(50% - 2px);
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center; }
      [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .magnifier-btn .line::before, [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .magnifier-btn .line::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        background-color: #000;
        display: block; }
      [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .magnifier-btn .line::before {
        width: 6px;
        height: 2px; }
      [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .magnifier-btn .line::after {
        width: 2px;
        height: 6px;
        -webkit-transition: -webkit-transform 0.5s ease;
        transition: -webkit-transform 0.5s ease;
        -o-transition: transform 0.5s ease;
        transition: transform 0.5s ease;
        transition: transform 0.5s ease, -webkit-transform 0.5s ease; }
    [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .magnifier-btn.active .line::after {
      -webkit-transform: translate(-50%, -50%) rotate(90deg);
      -ms-transform: translate(-50%, -50%) rotate(90deg);
      transform: translate(-50%, -50%) rotate(90deg); }
  [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .swiper-pagination {
    position: absolute;
    left: 60px;
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
    [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .swiper-pagination .swiper-pagination-bullet::before {
      width: 45px; }
  [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .outlink {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #fff;
    opacity: .6;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    font-size: 1.25rem; }
    [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .outlink:hover {
      opacity: 1;
      -webkit-transition: .5s;
      -o-transition: .5s;
      transition: .5s; }
    [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .outlink p {
      margin-left: 10px; }
    @media (max-width: 575px) {
      [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .outlink {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-transform: translateY(-150%);
        -ms-transform: translateY(-150%);
        transform: translateY(-150%); } }
  [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .share-area {
    position: absolute;
    right: 0;
    bottom: 0;
    color: rgba(255, 255, 255, 0.6); }
    [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .share-area p {
      font-weight: lighter;
      margin-bottom: 30px; }
    [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .share-area .socials {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-box-pack: end;
      -ms-flex-pack: end;
      justify-content: flex-end; }
  @media (max-width: 575px) {
    [data-page="product_detail"] .banner .swiper-container .wrapper.bottom {
      bottom: 0;
      padding-bottom: 55px; }
      [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .swiper-pagination {
        margin-top: -5vw;
        top: 0;
        left: 0;
        right: 0; }
      [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .share-area {
        display: none;
        position: relative;
        text-align: center; }
        [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .share-area p {
          margin-bottom: 15px;
          margin-top: 10px; }
        [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .share-area .socials {
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center; }
      [data-page="product_detail"] .banner .swiper-container .wrapper.bottom .scroll_down {
        bottom: 20px; } }

[data-page="product_detail"] .banner .share-area.phone-mode {
  display: none; }
  @media (max-width: 575px) {
    [data-page="product_detail"] .banner .share-area.phone-mode {
      position: absolute;
      top: 30px;
      left: 0;
      right: 0;
      z-index: 5;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      width: 85%;
      margin-left: auto;
      margin-right: auto;
      padding-top: 5px;
      padding-bottom: 5px; }
      [data-page="product_detail"] .banner .share-area.phone-mode p {
        margin-right: 23px;
        color: #FFF;
        font-size: 0.875rem; }
      [data-page="product_detail"] .banner .share-area.phone-mode .socials {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex; }
        [data-page="product_detail"] .banner .share-area.phone-mode .socials li {
          color: #FFF; } }

[data-page="product_detail"] .banner .share-area.pc-mode {
  display: block; }
  @media (max-width: 575px) {
    [data-page="product_detail"] .banner .share-area.pc-mode {
      display: none; } }

[data-page="product_detail"] .banner .scroll_down {
  position: absolute;
  bottom: -65px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 30px;
  z-index: 10; }

body[data-page="product_detail"] section > .content > .titleBox > .title, #productDerailNav > .productDerailNavList > .productDerailNavBtn > a, #features > .content.content2 .titleBox > .title, #features > .content.content3 .graphic .descriptionBox .subTitle, #features > .content.content3 .graphic .descriptionBox .title {
  font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-weight: bold; }

#features > .content.content1 .bullet, #features > .content.content2 .bullet, #recommend .swiper-pagination-bullet {
  display: inline-block;
  margin: 0 4px;
  width: 50px;
  height: 50px;
  cursor: pointer;
  position: relative; }
  #features > .content.content1 .bullet:first-child:last-child, #features > .content.content2 .bullet:first-child:last-child, #recommend .swiper-pagination-bullet:first-child:last-child {
    display: none; }
  #features > .content.content1 .bullet:before, #features > .content.content2 .bullet:before, #recommend .swiper-pagination-bullet:before {
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    position: absolute;
    top: 50%;
    left: 0;
    background-color: rgba(255, 255, 255, 0.2);
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s; }
  #features > .content.content1 .active.bullet:before, #features > .content.content2 .active.bullet:before, #recommend .active.swiper-pagination-bullet:before, #features > .content.content1 .swiper-pagination-bullet-active.bullet:before, #features > .content.content2 .swiper-pagination-bullet-active.bullet:before, #recommend .swiper-pagination-bullet-active.swiper-pagination-bullet:before {
    background-color: white; }

body[data-page="product_detail"] main, body[data-page="product_detail"] article {
  position: relative; }

body[data-page="product_detail"] section {
  padding-top: 6.771vw;
  padding-bottom: 6.771vw; }
  body[data-page="product_detail"] section > .content {
    width: 90%;
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 0; }
    body[data-page="product_detail"] section > .content > .titleBox {
      text-align: center; }
      body[data-page="product_detail"] section > .content > .titleBox > .title {
        font-size: 2.5rem;
        color: white; }
      body[data-page="product_detail"] section > .content > .titleBox > .description {
        font-size: 0.9375rem;
        color: rgba(255, 255, 255, 0.7);
        margin-top: 0.5625vw; }
  body[data-page="product_detail"] section > .content + .content {
    margin-top: 7.29vw; }

body[data-page="product_detail"] .arrow {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  border: 1px solid #95c4ff;
  background-color: #95c4ff;
  cursor: pointer; }
  body[data-page="product_detail"] .arrow:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-65%, -65%);
    -ms-transform: translate(-65%, -65%);
    transform: translate(-65%, -65%);
    width: 35%;
    height: 35%;
    border-right: 2px solid white;
    border-bottom: 2px solid white;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s; }
  body[data-page="product_detail"] .arrow--down {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg); }
  body[data-page="product_detail"] .arrow--up {
    -webkit-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    transform: rotate(-135deg); }
  body[data-page="product_detail"] .arrow--empty {
    border: 1px solid white;
    background-color: transparent;
    -webkit-animation: fade-in-top-arrow 1s 1.8s both;
    animation: fade-in-top-arrow 1s 1.8s both; }

@-webkit-keyframes fade-in-top-arrow {
  0% {
    -webkit-transform: translateY(-50px) rotate(45deg);
    transform: translateY(-50px) rotate(45deg);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0) rotate(45deg);
    transform: translateY(0) rotate(45deg);
    opacity: 1; } }

@keyframes fade-in-top-arrow {
  0% {
    -webkit-transform: translateY(-50px) rotate(45deg);
    transform: translateY(-50px) rotate(45deg);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0) rotate(45deg);
    transform: translateY(0) rotate(45deg);
    opacity: 1; } }

#productDerailNav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  left: 50%;
  top: 50px;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 9; }
  @media (max-width: 768px) {
    #productDerailNav {
      display: none; } }
  #productDerailNav > .productDerailNavList {
    position: relative;
    border-bottom: 1px solid #999999;
    padding: 0 2.35vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    #productDerailNav > .productDerailNavList > .productDerailNavBtn > a {
      position: relative;
      display: block;
      padding: 1.48vw;
      font-size: 1.125rem;
      color: #999999; }
      @media (max-width: 1024px) {
        #productDerailNav > .productDerailNavList > .productDerailNavBtn > a {
          padding: 2vw; } }
      #productDerailNav > .productDerailNavList > .productDerailNavBtn > a:after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        height: 4px;
        width: 0%;
        background-color: white;
        -webkit-transition: 0.3s;
        -o-transition: 0.3s;
        transition: 0.3s; }
      #productDerailNav > .productDerailNavList > .productDerailNavBtn > a:hover:after {
        width: 85%; }
  #productDerailNav.productDerailNav--fixed {
    -webkit-animation: navBar-fixed 0.8s both;
    animation: navBar-fixed 0.8s both;
    position: fixed;
    top: 0px; }

#features {
  padding-top: 13.542vw; }
  #features > .content.content1 .mainContent {
    margin-top: 40px; }
  #features > .content.content1 figure .swiperBg {
    width: 100%;
    padding-bottom: 56.25%;
    background-size: cover; }
  #features > .content.content1 figcaption {
    text-align: center;
    font-size: 0.9375rem;
    color: white;
    margin-top: 20px; }
  #features > .content.content1 .playerCover {
    position: relative;
    width: 100%; }
  #features > .content.content1 .youtube {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%; }
  #features > .content.content1 iframe {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%; }
  #features > .content.content1 .playerBtn {
    position: absolute;
    width: 90px;
    height: 90px;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 50%;
    cursor: pointer;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s; }
    @media (max-width: 768px) {
      #features > .content.content1 .playerBtn {
        width: 60px;
        height: 60px; } }
    #features > .content.content1 .playerBtn:after {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      border-top: 6.5px solid transparent;
      border-bottom: 6.5px solid transparent;
      border-left: 9.191px solid white;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s;
      z-index: 9; }
    #features > .content.content1 .playerBtn:hover {
      background-color: rgba(255, 255, 255, 0.2); }
      #features > .content.content1 .playerBtn:hover:after {
        border-left-color: white; }
  #features > .content.content1 .featureBullet {
    position: relative;
    margin-top: 25px; }
  #features > .content.content2 {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto; }
    #features > .content.content2 .sectionBanner {
      position: relative; }
    #features > .content.content2 .titleBox {
      position: absolute;
      width: 80%;
      top: 50%;
      left: 50%;
      text-align: center;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      -webkit-transition: 0.5s 0.4s;
      -o-transition: 0.5s 0.4s;
      transition: 0.5s 0.4s;
      opacity: 0; }
      #features > .content.content2 .titleBox > .title {
        font-size: 3rem;
        color: white; }
        @media (max-width: 1024px) {
          #features > .content.content2 .titleBox > .title {
            font-size: 2.25rem; } }
      #features > .content.content2 .titleBox > .description {
        margin-top: 3.5vw;
        font-size: 0.9375rem;
        color: rgba(255, 255, 255, 0.7); }
        @media (max-width: 1024px) {
          #features > .content.content2 .titleBox > .description {
            margin-top: 1.75vw; } }
        @media (max-width: 768px) {
          #features > .content.content2 .titleBox > .description {
            margin-top: 10vw; } }
    #features > .content.content2 .bannerBox > .org-image {
      display: none; }
      @media (min-width: 769px) {
        #features > .content.content2 .bannerBox > .org-image {
          display: block;
          width: 100%; } }
    #features > .content.content2 .bannerBox > .phone-image {
      display: none; }
      @media (max-width: 768px) {
        #features > .content.content2 .bannerBox > .phone-image {
          display: block; } }
    #features > .content.content2 .swiper-slide-active .titleBox {
      opacity: 1; }
    #features > .content.content2 .experienceSwiper .titleBox {
      opacity: 1; }
    #features > .content.content2 .experienceBullet {
      position: absolute;
      bottom: 0; }
  #features > .content.content3 {
    width: 90%;
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto; }
    #features > .content.content3 .graphic {
      margin-top: 3.64vw; }
      #features > .content.content3 .graphic .descriptionBox .subTitle {
        font-size: 0.9375rem;
        color: rgba(255, 255, 255, 0.4); }
      #features > .content.content3 .graphic .descriptionBox .title {
        font-size: 2.75rem;
        line-height: 1.2;
        color: white;
        margin-top: 1vw; }
        @media (max-width: 1024px) {
          #features > .content.content3 .graphic .descriptionBox .title {
            font-size: 2.25rem; } }
        @media (max-width: 700px) {
          #features > .content.content3 .graphic .descriptionBox .title {
            font-size: 2rem; } }
      #features > .content.content3 .graphic .descriptionBox > .description {
        font-size: 0.9375rem;
        letter-spacing: 0.02187rem;
        line-height: 1.7;
        color: rgba(255, 255, 255, 0.7);
        margin-top: 3.25vw; }
      #features > .content.content3 .graphic.left, #features > .content.content3 .graphic.right {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center; }
        @media (max-width: 1024px) {
          #features > .content.content3 .graphic.left, #features > .content.content3 .graphic.right {
            padding: 0 1vw;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column; } }
        #features > .content.content3 .graphic.left .graphicImg, #features > .content.content3 .graphic.right .graphicImg {
          -webkit-box-flex: 0;
          -ms-flex: 0 0 57.46%;
          flex: 0 0 57.46%;
          -webkit-transition: 1s;
          -o-transition: 1s;
          transition: 1s; }
          @media (max-width: 1460px) {
            #features > .content.content3 .graphic.left .graphicImg, #features > .content.content3 .graphic.right .graphicImg {
              -webkit-box-flex: 0;
              -ms-flex: 0 0 50%;
              flex: 0 0 50%;
              max-width: 50%; } }
          @media (max-width: 1200px) {
            #features > .content.content3 .graphic.left .graphicImg, #features > .content.content3 .graphic.right .graphicImg {
              -webkit-box-flex: 0;
              -ms-flex: 0 0 42.54%;
              flex: 0 0 42.54%;
              max-width: 42.54%; } }
          @media (max-width: 1024px) {
            #features > .content.content3 .graphic.left .graphicImg, #features > .content.content3 .graphic.right .graphicImg {
              -webkit-box-flex: 0;
              -ms-flex: none;
              flex: none;
              max-width: 100%;
              width: 100%; } }
        #features > .content.content3 .graphic.left .descriptionBox, #features > .content.content3 .graphic.right .descriptionBox {
          -webkit-box-flex: 0;
          -ms-flex: 0 0 42.54%;
          flex: 0 0 42.54%;
          padding: 2.5vw; }
          @media (max-width: 1460px) {
            #features > .content.content3 .graphic.left .descriptionBox, #features > .content.content3 .graphic.right .descriptionBox {
              -webkit-box-flex: 0;
              -ms-flex: 0 0 50%;
              flex: 0 0 50%; } }
          @media (max-width: 1200px) {
            #features > .content.content3 .graphic.left .descriptionBox, #features > .content.content3 .graphic.right .descriptionBox {
              -webkit-box-flex: 0;
              -ms-flex: 0 0 57.46%;
              flex: 0 0 57.46%; } }
          @media (max-width: 1024px) {
            #features > .content.content3 .graphic.left .descriptionBox, #features > .content.content3 .graphic.right .descriptionBox {
              -webkit-box-flex: 0;
              -ms-flex: 0 0 auto;
              flex: 0 0 auto;
              width: 100%;
              padding: 4vw; } }
      #features > .content.content3 .graphic.left .graphicImg {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1; }
      #features > .content.content3 .graphic.left .descriptionBox {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2; }
      #features > .content.content3 .graphic.right .graphicImg {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2; }
        @media (max-width: 1024px) {
          #features > .content.content3 .graphic.right .graphicImg {
            -webkit-box-ordinal-group: 2;
            -ms-flex-order: 1;
            order: 1; } }
      #features > .content.content3 .graphic.right .descriptionBox {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1; }
        @media (max-width: 1024px) {
          #features > .content.content3 .graphic.right .descriptionBox {
            -webkit-box-ordinal-group: 3;
            -ms-flex-order: 2;
            order: 2; } }
      #features > .content.content3 .graphic.full {
        position: relative; }
        #features > .content.content3 .graphic.full .descriptionBox {
          position: absolute;
          bottom: 0;
          left: 0;
          width: 100%;
          padding: 3.6vw;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center; }
          @media (max-width: 1024px) {
            #features > .content.content3 .graphic.full .descriptionBox {
              position: relative;
              display: block; } }
          #features > .content.content3 .graphic.full .descriptionBox .titleBox {
            -webkit-box-flex: 1;
            -ms-flex: 1 1 40%;
            flex: 1 1 40%; }
          #features > .content.content3 .graphic.full .descriptionBox .subTitle {
            color: rgba(0, 0, 0, 0.4); }
            @media (max-width: 1024px) {
              #features > .content.content3 .graphic.full .descriptionBox .subTitle {
                color: rgba(255, 255, 255, 0.4); } }
          #features > .content.content3 .graphic.full .descriptionBox .title {
            color: black; }
            @media (max-width: 1024px) {
              #features > .content.content3 .graphic.full .descriptionBox .title {
                color: white; } }
          #features > .content.content3 .graphic.full .descriptionBox .description {
            -webkit-box-flex: 1;
            -ms-flex: 1 1 60%;
            flex: 1 1 60%;
            margin-left: 20px;
            color: rgba(0, 0, 0, 0.7); }
            @media (max-width: 1024px) {
              #features > .content.content3 .graphic.full .descriptionBox .description {
                color: rgba(255, 255, 255, 0.7);
                margin-left: 0; } }
          #features > .content.content3 .graphic.full .descriptionBox.descriptionBox--white .subTitle {
            color: rgba(255, 255, 255, 0.4); }
          #features > .content.content3 .graphic.full .descriptionBox.descriptionBox--white .title {
            color: white; }
          #features > .content.content3 .graphic.full .descriptionBox.descriptionBox--white .description {
            color: rgba(255, 255, 255, 0.7); }
          #features > .content.content3 .graphic.full .descriptionBox.descriptionBox--Black .subTitle {
            color: rgba(0, 0, 0, 0.4); }
          #features > .content.content3 .graphic.full .descriptionBox.descriptionBox--Black .title {
            color: black; }
          #features > .content.content3 .graphic.full .descriptionBox.descriptionBox--Black .description {
            color: rgba(0, 0, 0, 0.7); }

#specification {
  background-color: #232323; }
  #specification > .content .mainContent {
    margin-top: 50px; }
  #specification > .content .table-wrapper {
    font-weight: bold;
    font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
    #specification > .content .table-wrapper .table-body .table-detail {
      font-weight: normal;
      font-family: "CenturyGothic", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
  #specification > .content .table-wrapper {
    color: white; }
    #specification > .content .table-wrapper .table-group {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex; }
      #specification > .content .table-wrapper .table-group .table-column .table-column-container {
        height: 100%; }
      #specification > .content .table-wrapper .table-group .table-no {
        -ms-flex-negative: 0;
        flex-shrink: 0;
        -ms-flex-preferred-size: 175px;
        flex-basis: 175px;
        max-width: 15%; }
      #specification > .content .table-wrapper .table-group .table-item {
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        -ms-flex-preferred-size: 0%;
        flex-basis: 0%; }
      #specification > .content .table-wrapper .table-group .table-detail {
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        -ms-flex-preferred-size: 0%;
        flex-basis: 0%; }
    #specification > .content .table-wrapper .table-column .table-column-container {
      border-bottom-style: solid;
      border-bottom-width: 1px;
      border-bottom-color: rgba(255, 255, 255, 0.3); }
    #specification > .content .table-wrapper .table-header .table-column .table-column-container,
    #specification > .content .table-wrapper .table-body .table-group:last-child .table-column .table-column-container {
      border-bottom-color: rgba(255, 255, 255, 0.6);
      border-width: 4px; }
    #specification > .content .table-wrapper .table-header .table-column .table-column-container {
      color: rgba(255, 255, 255, 0.4); }
    #specification > .content .table-wrapper .table-body .table-detail {
      color: rgba(255, 255, 255, 0.7); }
    @media (min-width: 768px) {
      #specification > .content .table-wrapper .table-header,
      #specification > .content .table-wrapper .table-body {
        margin-left: -5px;
        margin-right: -5px; }
      #specification > .content .table-wrapper .table-column {
        padding-left: 5px;
        padding-right: 5px; }
      #specification > .content .table-wrapper .table-header .table-column .table-column-container {
        padding-top: 15px;
        padding-bottom: 15px; }
      #specification > .content .table-wrapper .table-body .table-column .table-column-container {
        padding-top: 30px;
        padding-bottom: 30px; }
      #specification > .content .table-wrapper .table-header .table-column:not(:first-child) .table-column-container,
      #specification > .content .table-wrapper .table-body .table-column:not(:first-child) .table-column-container {
        padding-left: 20%;
        padding-right: 30px; } }
    @media (min-width: 576px) and (max-width: 767px) {
      #specification > .content .table-wrapper .table-header {
        display: none; }
      #specification > .content .table-wrapper .table-column .table-column-container {
        border: 0; }
      #specification > .content .table-wrapper .table-group {
        position: relative;
        border-bottom: solid 1px rgba(255, 255, 255, 0.3);
        padding-top: 15px;
        padding-bottom: 15px; }
        #specification > .content .table-wrapper .table-group .table-no {
          display: none; }
        #specification > .content .table-wrapper .table-group .table-item,
        #specification > .content .table-wrapper .table-group .table-detail {
          padding: 0;
          width: 50%;
          -webkit-box-flex: 0;
          -ms-flex: 0 0 50%;
          flex: 0 0 50%;
          max-width: 50%; } }
    @media (max-width: 575px) {
      #specification > .content .table-wrapper .table-header {
        display: none; }
      #specification > .content .table-wrapper .table-column .table-column-container {
        border: 0; }
      #specification > .content .table-wrapper .table-group {
        position: relative;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        border-bottom: solid 1px rgba(255, 255, 255, 0.3);
        padding-top: 15px;
        padding-bottom: 15px; }
        #specification > .content .table-wrapper .table-group .table-no {
          position: absolute;
          top: 15px;
          left: 15px; }
        #specification > .content .table-wrapper .table-group .table-item,
        #specification > .content .table-wrapper .table-group .table-detail {
          padding-left: 50px; }
        #specification > .content .table-wrapper .table-group .table-detail {
          padding-top: 8px; } }

#download .downloadTab {
  margin-top: 3.65vw; }

#download .download {
  margin-top: 30px; }
  #download .downloadList {
    border: 1px solid #717171;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    padding: 30px; }
    #download .downloadList.active {
      border: 1px solid white; }
    @media (max-width: 1024px) {
      #download .downloadList {
        padding: 40px; } }
  #download .downloadBar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    font-size: 1rem;
    color: white; }
    @media (max-width: 768px) {
      #download .downloadBar {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start; } }
  #download .downloadTitle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding-right: 40px; }
    @media (max-width: 1024px) {
      #download .downloadTitle {
        display: block; } }
    #download .downloadTitle:before {
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold;
      -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
      flex: 0 0 auto;
      content: attr(data-version);
      display: block;
      width: 130px;
      margin-right: 20px;
      text-align: center; }
      @media (max-width: 1024px) {
        #download .downloadTitle:before {
          width: 100%;
          text-align: left;
          margin-bottom: 1vw; } }
  #download .downloadDetailBtn {
    position: relative;
    letter-spacing: 1px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap; }
    @media (max-width: 768px) {
      #download .downloadDetailBtn {
        margin-left: 20px;
        margin-top: 2vw; } }
    #download .downloadDetailBtn:before, #download .downloadDetailBtn:after {
      content: '';
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      top: 50%;
      left: -40%;
      width: 14px;
      height: 2px;
      background-color: #95c4ff;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
    #download .downloadDetailBtn:before {
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%); }
    #download .downloadDetailBtn:after {
      -webkit-transform: translateY(-50%) rotate(90deg);
      -ms-transform: translateY(-50%) rotate(90deg);
      transform: translateY(-50%) rotate(90deg); }
    #download .downloadDetailBtn:hover:before {
      -webkit-transform: translateY(-50%) rotate(-180deg);
      -ms-transform: translateY(-50%) rotate(-180deg);
      transform: translateY(-50%) rotate(-180deg); }
    #download .downloadDetailBtn:hover:after {
      -webkit-transform: translateY(-50%) rotate(-90deg);
      -ms-transform: translateY(-50%) rotate(-90deg);
      transform: translateY(-50%) rotate(-90deg); }
  #download .downloadBtn {
    position: relative;
    font-size: 1.25rem;
    margin-left: 0.8vw;
    color: #eee;
    top: 1px; }
    @media (max-width: 768px) {
      #download .downloadBtn {
        margin-left: 3vw;
        margin-top: 2vw; } }
  #download .downloadContent {
    position: relative;
    font-size: 0.9375rem;
    color: rgba(255, 255, 255, 0.4);
    padding: 40px 160px 0 150px; }
    @media (max-width: 1024px) {
      #download .downloadContent {
        padding-left: 0;
        padding-right: 0; } }
    #download .downloadContent .arrow {
      position: absolute;
      bottom: 0;
      right: 0; }
      @media (max-width: 1024px) {
        #download .downloadContent .arrow {
          right: 50%;
          -webkit-transform: translate(50%) rotate(-135deg);
          -ms-transform: translate(50%) rotate(-135deg);
          transform: translate(50%) rotate(-135deg); } }
    #download .downloadContent--article {
      width: 100%; }
      @media (max-width: 1024px) {
        #download .downloadContent--article {
          padding-bottom: 50px; } }
      #download .downloadContent--article > p {
        line-height: 1.7;
        margin: 45px 0; }
        #download .downloadContent--article > p:first-child, #download .downloadContent--article > p:last-child {
          margin: 0; }

#recommend {
  padding: 0px; }
  #recommend > .content {
    width: 100%;
    max-width: 1785px;
    margin-left: auto;
    margin-right: auto;
    padding: 150px 0; }
    #recommend > .content > .mainContent {
      width: 100%;
      max-width: 1440px;
      margin-left: auto;
      margin-right: auto; }
  #recommend .recommendSwiper.noneSet .swiper-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
  #recommend .recommendSwiper.noneSet .swiper-slide {
    max-width: 480px; }
  #recommend .mask-container {
    margin-top: 105px;
    height: 230px; }
    #recommend .mask-container > img {
      display: block;
      margin: 0 auto;
      max-height: 200px; }
    #recommend .mask-container > figcaption {
      text-align: center;
      color: white;
      margin-top: 35px;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold;
      position: absolute;
      bottom: 0;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%); }
    #recommend .mask-container a {
      display: block; }
  #recommend .recommendBullet {
    position: relative;
    margin-top: 60px; }
  #recommend .swiper-pagination-bullet {
    background-color: transparent;
    opacity: 1; }
    #recommend .swiper-pagination-bullet:before {
      background-color: #292929; }

@keyframes navBar-fixed {
  0% {
    top: -100px; }
  100% {
    top: 0; } }

@-webkit-keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

@keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 50px, 0);
    transform: translate3d(0, 50px, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 50px, 0);
    transform: translate3d(0, 50px, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

.hide_lightbox {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  height: 100vh; }
  @media only screen and (max-width: 1000px) {
    .hide_lightbox {
      height: 100vh;
      overflow-y: auto;
      display: inline-block; } }
  .hide_lightbox.close {
    -webkit-transition: 1s;
    -o-transition: 1s;
    transition: 1s;
    opacity: 0; }
  .hide_lightbox ._b {
    background: rgba(0, 0, 0, 0.7);
    width: 100%;
    height: 100%;
    display: inline-block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 0;
    opacity: 0;
    -webkit-animation: 1s fadeIn forwards;
    animation: 1s fadeIn forwards; }

.lb_searchbox {
  width: 70%;
  margin: 0 0 0 auto;
  position: relative;
  z-index: 2;
  font-family: "CenturyGothic", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  opacity: 0;
  -webkit-animation: 1s .5s fadeIn forwards;
  animation: 1s .5s fadeIn forwards;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
  @media only screen and (max-width: 1700px) {
    .lb_searchbox {
      width: 90%; } }
  @media only screen and (max-width: 1400px) {
    .lb_searchbox {
      width: 100%; } }
  @media only screen and (max-width: 1000px) {
    .lb_searchbox {
      display: inline-block; } }
  .lb_searchbox .lb_close {
    position: absolute;
    background: #000;
    width: 80px;
    height: 80px;
    z-index: 10;
    top: 0;
    right: 0; }
    .lb_searchbox .lb_close div {
      position: relative;
      width: 100%;
      height: 100%;
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg); }
    .lb_searchbox .lb_close span {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      background: #fff; }
      .lb_searchbox .lb_close span:first-child {
        width: 20px;
        height: 1.5px; }
      .lb_searchbox .lb_close span:last-child {
        width: 1.5px;
        height: 20px; }
  .lb_searchbox .titlebox {
    width: 500px;
    height: 100vh;
    text-align: center;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative; }
    @media only screen and (max-width: 1400px) {
      .lb_searchbox .titlebox {
        width: 300px; } }
    @media only screen and (max-width: 1000px) {
      .lb_searchbox .titlebox {
        height: auto;
        width: 100%;
        padding: 150px 0; } }
    .lb_searchbox .titlebox > div {
      width: 80%;
      margin: 0 auto; }
    .lb_searchbox .titlebox p {
      font-size: 0.875rem;
      line-height: 1.375rem;
      margin: 0; }
    .lb_searchbox .titlebox .h5 {
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-size: 3.5rem;
      line-height: 1.5rem;
      margin: 0 0 30px; }
  .lb_searchbox .rightbox {
    width: calc(100% - 500px);
    background: #343434;
    color: #fff;
    height: 100vh;
    margin: 0 0 0 auto;
    position: relative;
    overflow-y: auto; }
    @media only screen and (max-width: 1400px) {
      .lb_searchbox .rightbox {
        width: calc(100% - 300px); } }
    @media only screen and (max-width: 1000px) {
      .lb_searchbox .rightbox {
        width: 100%;
        height: auto; } }
    .lb_searchbox .rightbox .switchbox {
      color: #858585;
      display: inline-block;
      position: absolute;
      left: 0;
      top: 10%;
      -webkit-transform: none;
      -ms-transform: none;
      transform: none;
      text-align: center;
      -webkit-transition: .5s;
      -o-transition: .5s;
      transition: .5s;
      z-index: 10; }
      @media only screen and (max-width: 1000px) {
        .lb_searchbox .rightbox .switchbox {
          top: 0;
          background: #343434;
          padding: 30px 0;
          overflow-x: auto;
          width: 100%;
          border-bottom: 1px #ffbc01 solid; }
          .lb_searchbox .rightbox .switchbox ul {
            display: -webkit-inline-box;
            display: -ms-inline-flexbox;
            display: inline-flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center; } }
      .lb_searchbox .rightbox .switchbox.fixed {
        position: fixed;
        left: calc(30% + 500px);
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%); }
        @media only screen and (max-width: 1700px) {
          .lb_searchbox .rightbox .switchbox.fixed {
            left: calc(10% + 500px); } }
        @media only screen and (max-width: 1400px) {
          .lb_searchbox .rightbox .switchbox.fixed {
            left: 300px; } }
        @media only screen and (max-width: 1000px) {
          .lb_searchbox .rightbox .switchbox.fixed {
            left: 0;
            top: 0;
            -webkit-transform: none;
            -ms-transform: none;
            transform: none;
            width: 100%;
            z-index: 10; } }
      .lb_searchbox .rightbox .switchbox > div {
        position: relative;
        display: inline-block; }
      .lb_searchbox .rightbox .switchbox .arrow {
        position: absolute;
        right: 2px;
        top: 0;
        display: inline-block;
        width: 15px;
        height: 15px;
        -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
        transform: translateX(100%);
        -webkit-transition: .5s;
        -o-transition: .5s;
        transition: .5s;
        z-index: 2; }
        @media only screen and (max-width: 1000px) {
          .lb_searchbox .rightbox .switchbox .arrow {
            right: auto;
            left: 50px;
            top: auto;
            bottom: 0;
            -webkit-transform: translate(0, 100%);
            -ms-transform: translate(0, 100%);
            transform: translate(0, 100%);
            display: none; } }
        .lb_searchbox .rightbox .switchbox .arrow span {
          position: relative;
          width: 100%;
          height: 100%;
          display: inline-block; }
          .lb_searchbox .rightbox .switchbox .arrow span::before, .lb_searchbox .rightbox .switchbox .arrow span::after {
            content: '';
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 7.5px 0 7.5px 13.0px;
            position: absolute;
            top: 0; }
          .lb_searchbox .rightbox .switchbox .arrow span::before {
            border-color: transparent transparent transparent #343434;
            right: 2px;
            z-index: 11; }
          .lb_searchbox .rightbox .switchbox .arrow span::after {
            border-color: transparent transparent transparent #ffbc01;
            right: 0;
            z-index: 10; }
      .lb_searchbox .rightbox .switchbox ul {
        position: relative;
        z-index: 1; }
        .lb_searchbox .rightbox .switchbox ul::after {
          content: '';
          width: 1px;
          height: 100%;
          display: inline-block;
          background: #ffbc01;
          position: absolute;
          top: 0;
          right: -1px; }
          @media only screen and (max-width: 1000px) {
            .lb_searchbox .rightbox .switchbox ul::after {
              display: none; } }
      .lb_searchbox .rightbox .switchbox li {
        font-size: 0.75rem;
        line-height: 1.25rem;
        margin: 0;
        -webkit-transition: .5s;
        -o-transition: .5s;
        transition: .5s;
        cursor: pointer;
        padding: 0 50px;
        max-width: 158px; }
        @media only screen and (max-width: 1000px) {
          .lb_searchbox .rightbox .switchbox li {
            padding: 0 15px;
            max-width: 88px; } }
        @media only screen and (max-width: 600px) {
          .lb_searchbox .rightbox .switchbox li {
            padding: 0 10px; } }
        .lb_searchbox .rightbox .switchbox li.active {
          color: #fff; }
          .lb_searchbox .rightbox .switchbox li.active img {
            opacity: 1; }
        .lb_searchbox .rightbox .switchbox li img {
          margin-bottom: 10px;
          opacity: .4; }
          @media only screen and (max-width: 600px) {
            .lb_searchbox .rightbox .switchbox li img {
              width: 70%; } }
        .lb_searchbox .rightbox .switchbox li p {
          white-space: normal;
          word-break: break-all; }
        .lb_searchbox .rightbox .switchbox li:not(:last-child) {
          margin-bottom: 50px; }
          @media only screen and (max-width: 1000px) {
            .lb_searchbox .rightbox .switchbox li:not(:last-child) {
              margin-bottom: 0; } }
  .lb_searchbox .contant {
    width: calc(100% - 60px - 50px - 50px);
    margin: 0 0 0 auto;
    text-align: center;
    padding-top: 150px; }
    .lb_searchbox .contant .searchicon {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      position: relative;
      background: #ffbc00;
      display: inline-block;
      margin-bottom: 40px; }
      .lb_searchbox .contant .searchicon i {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        color: #000;
        font-size: 1.25rem;
        font-weight: bold; }
    @media only screen and (max-width: 1000px) {
      .lb_searchbox .contant {
        width: 100%;
        padding-top: 120px; } }
    .lb_searchbox .contant.all > div {
      padding-bottom: 100px; }
    .lb_searchbox .contant.all .all_items {
      display: none;
      opacity: 0; }
    .lb_searchbox .contant.all .searchicon {
      display: none; }
    .lb_searchbox .contant > div {
      padding: 30px 60px 0;
      text-align: left;
      margin-bottom: 60px;
      position: relative; }
      .lb_searchbox .contant > div::after {
        content: '';
        width: 1px;
        height: 100%;
        display: inline-block;
        background: #ffbc01;
        position: absolute;
        top: 0;
        left: -2px; }
      @media only screen and (max-width: 1000px) {
        .lb_searchbox .contant > div {
          border-left: 0px #ffbc01 solid;
          padding: 60px 10% 0; } }
    .lb_searchbox .contant .h5 {
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-size: 1.875rem;
      line-height: 2.375rem;
      margin: 0 0 20px; }
    .lb_searchbox .contant .input {
      position: relative;
      width: 80%;
      margin-bottom: 30px; }
      @media only screen and (max-width: 700px) {
        .lb_searchbox .contant .input {
          width: 100%; } }
      .lb_searchbox .contant .input input {
        border: none;
        border-radius: 30px;
        background: #e0e0e0;
        font-size: 0.9375rem;
        line-height: 1.4375rem;
        margin: 0;
        padding: 20px 40px 20px 20px;
        width: 100%;
        color: #000; }
        @media only screen and (max-width: 600px) {
          .lb_searchbox .contant .input input {
            padding: 10px 40px 10px 20px; } }
        .lb_searchbox .contant .input input::-webkit-input-placeholder {
          color: #000; }
        .lb_searchbox .contant .input input:-ms-input-placeholder {
          color: #000; }
        .lb_searchbox .contant .input input::-ms-input-placeholder {
          color: #000; }
        .lb_searchbox .contant .input input::placeholder {
          color: #000; }
      .lb_searchbox .contant .input .icon-search {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        color: #000;
        right: 20px;
        font-size: 1.25rem;
        font-weight: bold; }
    .lb_searchbox .contant .keyword {
      margin-bottom: 70px; }
      @media only screen and (max-width: 1000px) {
        .lb_searchbox .contant .keyword {
          margin-bottom: 30px; } }
      .lb_searchbox .contant .keyword > p {
        font-size: 0.9375rem;
        line-height: 1.4375rem;
        margin: 0 0 15px;
        letter-spacing: .6px;
        font-weight: bold; }
      .lb_searchbox .contant .keyword ul {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
        .lb_searchbox .contant .keyword ul li {
          border-radius: 25px;
          border: 1px #fff solid;
          color: #fff;
          text-align: center;
          padding: 10px 20px;
          -webkit-transition: .5s;
          -o-transition: .5s;
          transition: .5s;
          opacity: .4;
          cursor: pointer;
          font-size: 0.875rem;
          line-height: 1.375rem;
          margin: 0 10px 10px 0; }
          @media only screen and (max-width: 600px) {
            .lb_searchbox .contant .keyword ul li {
              padding: 10px; } }
          .lb_searchbox .contant .keyword ul li:hover {
            opacity: 1; }
          .lb_searchbox .contant .keyword ul li.active {
            opacity: 1;
            background: #ffbc00;
            border: 1px #ffbc00 solid;
            color: #000; }
    .lb_searchbox .contant .all_items {
      -webkit-animation: 1s fadeInUp forwards;
      animation: 1s fadeInUp forwards; }
      .lb_searchbox .contant .all_items .items {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding: 30px 0; }
        @media only screen and (max-width: 600px) {
          .lb_searchbox .contant .all_items .items {
            display: block; } }
        .lb_searchbox .contant .all_items .items:not(:last-child) {
          border-bottom: 1px #5d5d5d solid; }
        .lb_searchbox .contant .all_items .items .h4 {
          font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
          font-size: 1.25rem;
          line-height: 1.75rem;
          margin: 0;
          width: 80px; }
          @media only screen and (max-width: 600px) {
            .lb_searchbox .contant .all_items .items .h4 {
              width: 100ˋ;
              margin-bottom: 20px; } }
        .lb_searchbox .contant .all_items .items > div {
          padding-left: 10px;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          position: relative;
          width: calc(100% - 80px); }
          @media only screen and (max-width: 600px) {
            .lb_searchbox .contant .all_items .items > div {
              width: 100%;
              padding-left: 0; } }
          .lb_searchbox .contant .all_items .items > div ul {
            width: calc(100% - 100px); }
            @media only screen and (max-width: 600px) {
              .lb_searchbox .contant .all_items .items > div ul {
                width: 100%; } }
          .lb_searchbox .contant .all_items .items > div li {
            font-size: 0.875rem;
            line-height: 1.375rem;
            margin: 0;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            cursor: pointer;
            padding: 5px 0;
            text-align: left; }
            .lb_searchbox .contant .all_items .items > div li.active span {
              background: #ffbc00; }
            .lb_searchbox .contant .all_items .items > div li:not(:last-child) {
              margin-bottom: 10px; }
            .lb_searchbox .contant .all_items .items > div li p {
              width: calc(100% - 25px); }
              @media only screen and (max-width: 600px) {
                .lb_searchbox .contant .all_items .items > div li p {
                  width: 100%; } }
            .lb_searchbox .contant .all_items .items > div li span {
              width: 13px;
              height: 13px;
              background: #5d5d5d;
              border-radius: 3px;
              display: inline-block;
              margin-right: 10px;
              -webkit-transition: .5s;
              -o-transition: .5s;
              transition: .5s; }
          .lb_searchbox .contant .all_items .items > div .icon {
            display: -webkit-inline-box;
            display: -ms-inline-flexbox;
            display: inline-flex;
            font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
            font-size: 0.875rem;
            line-height: 1.375rem;
            margin: 0;
            position: absolute;
            right: 0;
            top: 0; }
            @media only screen and (max-width: 600px) {
              .lb_searchbox .contant .all_items .items > div .icon {
                top: -46px; } }
            .lb_searchbox .contant .all_items .items > div .icon p {
              padding: 5px 10px;
              cursor: pointer;
              -webkit-transition: .5s;
              -o-transition: .5s;
              transition: .5s; }
              .lb_searchbox .contant .all_items .items > div .icon p:hover {
                color: #ffbc00; }
            .lb_searchbox .contant .all_items .items > div .icon .clear {
              position: relative; }
              .lb_searchbox .contant .all_items .items > div .icon .clear::after {
                content: '';
                width: 1px;
                height: 15px;
                display: inline-block;
                top: 50%;
                right: 0;
                -webkit-transform: translateY(-50%);
                -ms-transform: translateY(-50%);
                transform: translateY(-50%);
                background: rgba(255, 255, 255, 0.3);
                position: absolute; }

.menulist > ul {
  scrollbar-arrow-color: #fffbf2;
  scrollbar-base-color: #000;
  scrollbar-shadow-color: #3b3b3b;
  scrollbar-track-color: #fffbf2; }
  .menulist > ul::-webkit-scrollbar {
    width: 3px;
    background: rgba(0, 0, 0, 0); }
  .menulist > ul::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0); }
  .menulist > ul::-webkit-scrollbar-thumb {
    background-color: #000;
    border-radius: 25px; }

body {
  opacity: 1; }
  body section {
    overflow: inherit; }

.product_compare {
  overflow-x: hidden;
  font-family: "CenturyGothic", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
  .product_compare .main {
    background: #343434;
    color: #fff;
    letter-spacing: .7px; }
    .product_compare .main > article {
      padding: 140px 0 0; }
    @media only screen and (max-width: 1300px) {
      .product_compare .main.allnone .titleSec > div:first-child {
        margin-bottom: 20px; }
      .product_compare .main.allnone .titleSec .type {
        display: inline-block;
        -webkit-animation: 1s .5s fadeIn forwards;
        animation: 1s .5s fadeIn forwards; } }
    .product_compare .main.allnone .tr.dropbox .type {
      -webkit-animation: 1s .5s fadeIn forwards;
      animation: 1s .5s fadeIn forwards; }
      @media only screen and (max-width: 1300px) {
        .product_compare .main.allnone .tr.dropbox .type {
          display: none; } }
      .product_compare .main.allnone .tr.dropbox .type .menulist {
        display: inline-block; }
  .product_compare .titleSec {
    text-align: center;
    width: 80%;
    margin: 0 auto 130px; }
    .product_compare .titleSec p {
      font-size: 0.9375rem;
      line-height: 1.4375rem;
      margin: 0;
      color: rgba(255, 255, 255, 0.7); }
    .product_compare .titleSec .h4 {
      font-size: 3.125rem;
      line-height: 3.625rem;
      margin: 0 0 30px;
      color: #fff;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
    .product_compare .titleSec .type {
      width: 200px;
      margin: 0 auto;
      display: none;
      opacity: 0; }

.product_compare .tableSec {
  text-align: center;
  padding-bottom: 200px;
  min-height: 600px; }
  @media only screen and (max-width: 1100px) {
    .product_compare .tableSec {
      width: 90%;
      margin: 0 auto;
      overflow-x: scroll; } }
  .product_compare .tableSec > div {
    width: 1200px;
    margin: 0 auto; }
    @media only screen and (max-width: 1300px) {
      .product_compare .tableSec > div {
        width: 1024px; } }
    .product_compare .tableSec > div .table {
      width: 100%; }
      .product_compare .tableSec > div .table:not(:first-child) td.title {
        display: none; }

.product_compare .tableSec .tbody {
  position: relative; }

.product_compare .tableSec .tr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
  .product_compare .tableSec .tr:not(.dropbox):not(.first) .space_border {
    border-top: 1px #535353 solid;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s; }
  .product_compare .tableSec .tr:not(.dropbox):not(.first) .td:not(.titletd) {
    font-family: "CenturyGothic", Microsoft JhengHei, sans-serif;
    font-weight: bold; }
  .product_compare .tableSec .tr:not(.dropbox):not(.first).hover.last .td > div, .product_compare .tableSec .tr:not(.dropbox):not(.first).hover.last .space_border {
    border-bottom: 1px #ffbc00 solid; }
  .product_compare .tableSec .tr:not(.dropbox):not(.first).hover .td > div, .product_compare .tableSec .tr:not(.dropbox):not(.first).hover .space_border {
    border-top: 1px #ffbc00 solid; }
  .product_compare .tableSec .tr:not(.dropbox):not(.first):hover {
    color: #ffbc00; }
  .product_compare .tableSec .tr:last-child .td:not(.DropdownList) > div {
    border-bottom: 1px #535353 solid; }
  .product_compare .tableSec .tr:last-child .space_border {
    border-bottom: 1px #535353 solid; }
  .product_compare .tableSec .tr .space, .product_compare .tableSec .tr .space_border {
    width: 20px; }
  .product_compare .tableSec .tr:not(.dropbox) .td:not(.titletd):not(.space):not(.space_border) {
    width: calc((100% - 170px) / 3); }
    @media only screen and (max-width: 1300px) {
      .product_compare .tableSec .tr:not(.dropbox) .td:not(.titletd):not(.space):not(.space_border) {
        width: calc(100% / 3); } }
  .product_compare .tableSec .tr.dropbox {
    position: relative;
    z-index: 2; }
    .product_compare .tableSec .tr.dropbox .td:not(.type):not(.space):not(.space_border) {
      width: calc((100% - 170px) / 3); }
      @media only screen and (max-width: 1300px) {
        .product_compare .tableSec .tr.dropbox .td:not(.type):not(.space):not(.space_border) {
          width: calc(100% / 3); } }
    .product_compare .tableSec .tr.dropbox .type {
      opacity: 0;
      width: 110px; }
      @media only screen and (max-width: 1300px) {
        .product_compare .tableSec .tr.dropbox .type {
          position: absolute; } }
      .product_compare .tableSec .tr.dropbox .type .menulist {
        width: 100%;
        display: none; }
    .product_compare .tableSec .tr.dropbox .double_dropdownList {
      min-height: 65px; }
      .product_compare .tableSec .tr.dropbox .double_dropdownList.open .menulist {
        display: block;
        -webkit-animation: 1s fadeInUp forwards;
        animation: 1s fadeInUp forwards; }
      .product_compare .tableSec .tr.dropbox .double_dropdownList .menulist {
        display: none;
        opacity: 0; }
  .product_compare .tableSec .tr.first.fixed {
    position: fixed;
    width: 1200px;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    background: #343434;
    z-index: 10; }
    @media only screen and (max-width: 1300px) {
      .product_compare .tableSec .tr.first.fixed {
        width: 1024px; } }
  .product_compare .tableSec .tr.first.absolute {
    position: absolute;
    left: 0;
    width: 100%; }
  .product_compare .tableSec .tr.first .td > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
  .product_compare .tableSec .tr.first .td.open .additems {
    display: none;
    opacity: 0; }
  .product_compare .tableSec .tr.first .td.open .hasthing {
    display: block;
    -webkit-transition: opacity .5s .5s;
    -o-transition: opacity .5s .5s;
    transition: opacity .5s .5s;
    opacity: 1; }
    .product_compare .tableSec .tr.first .td.open .hasthing > .img {
      width: 300px;
      height: 250px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      .product_compare .tableSec .tr.first .td.open .hasthing > .img img {
        -webkit-box-flex: 0;
        -ms-flex: none;
        flex: none; }
  .product_compare .tableSec .tr.first .td.add .hasthing {
    display: none;
    opacity: 0; }
  .product_compare .tableSec .tr.first .td.add .additems {
    display: block;
    -webkit-transition: opacity .5s .5s;
    -o-transition: opacity .5s .5s;
    transition: opacity .5s .5s;
    opacity: 1; }
  .product_compare .tableSec .tr.first .hasthing {
    display: none;
    opacity: 0; }
  .product_compare .tableSec .tr.first .additems {
    display: none;
    opacity: 0;
    font-size: 0.9375rem;
    line-height: 1.4375rem;
    margin: 0;
    cursor: pointer; }
    .product_compare .tableSec .tr.first .additems span {
      width: 50px;
      height: 50px;
      border-radius: 50%;
      border: 1px #fff solid;
      margin-bottom: 10px;
      display: inline-block;
      position: relative; }
      .product_compare .tableSec .tr.first .additems span i {
        display: inline-block;
        background: #fff;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%); }
        .product_compare .tableSec .tr.first .additems span i:first-child {
          width: 10px;
          height: 1px; }
        .product_compare .tableSec .tr.first .additems span i:last-child {
          width: 1px;
          height: 10px; }
  .product_compare .tableSec .tr.first img {
    margin-bottom: 20px;
    max-height: 100%; }
  .product_compare .tableSec .tr.first .name {
    font-size: 1.25rem;
    line-height: 1.5625rem;
    margin: 0 0 40px;
    color: #ffbc00;
    font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
  .product_compare .tableSec .tr.first .deleteicon {
    font-size: 0.875rem;
    line-height: 1.375rem;
    margin: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer; }
    .product_compare .tableSec .tr.first .deleteicon span {
      display: inline-block;
      width: 20px;
      height: 20px;
      background: #95c4ff;
      border-radius: 50%;
      margin-right: 10px;
      position: relative; }
      .product_compare .tableSec .tr.first .deleteicon span::after {
        content: '';
        width: 10px;
        height: 1px;
        display: inline-block;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        background: #000; }

.product_compare .tableSec .td {
  font-size: 1.0625rem;
  line-height: 1.5625rem;
  margin: 0; }
  .product_compare .tableSec .td.none p {
    display: none; }
  .product_compare .tableSec .td.titletd {
    width: 110px;
    font-size: 0.9375rem;
    line-height: 1.4375rem;
    margin: 0;
    position: relative;
    color: #afc9e9;
    font-family: "CenturyGothic", Microsoft JhengHei, sans-serif;
    font-weight: lighter; }
    @media only screen and (max-width: 1300px) {
      .product_compare .tableSec .td.titletd {
        display: none; } }
    .product_compare .tableSec .td.titletd p {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%); }
  .product_compare .tableSec .td:not(.double_dropdownList):not(.dropdownList) {
    position: relative; }
    .product_compare .tableSec .td:not(.double_dropdownList):not(.dropdownList)::after {
      content: attr(data-title);
      position: absolute;
      top: 20px;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%);
      font-size: 0.9375rem;
      line-height: 1.4375rem;
      margin: 0;
      color: #afc9e9;
      display: none; }
      @media only screen and (max-width: 1300px) {
        .product_compare .tableSec .td:not(.double_dropdownList):not(.dropdownList)::after {
          display: inline-block;
          opacity: .8; } }
    .product_compare .tableSec .td:not(.double_dropdownList):not(.dropdownList) > div {
      border-top: 1px #535353 solid;
      padding: 40px 10px;
      height: 100%;
      -webkit-transition: .5s;
      -o-transition: .5s;
      transition: .5s; }
      @media only screen and (max-width: 1300px) {
        .product_compare .tableSec .td:not(.double_dropdownList):not(.dropdownList) > div {
          padding: 60px 10px 40px; } }
    .product_compare .tableSec .td:not(.double_dropdownList):not(.dropdownList) .title {
      font-size: 0.9375rem;
      line-height: 1.4375rem;
      margin: 0;
      color: #afc9e9; }

.product_compare .dropdownList .menulist > ul {
  width: 200px; }
  .product_compare .dropdownList .menulist > ul li div::before, .product_compare .dropdownList .menulist > ul li div::after {
    display: none; }
  .product_compare .dropdownList .menulist > ul li p {
    padding: 15px 5px;
    font-size: 0.875rem;
    line-height: 1.375rem;
    margin: 0; }

.product_compare .menulist {
  position: relative; }
  .product_compare .menulist > ul > li.d_open > div::before {
    -webkit-transform: translateY(-50%) rotate(90deg);
    -ms-transform: translateY(-50%) rotate(90deg);
    transform: translateY(-50%) rotate(90deg);
    opacity: 0; }
  .product_compare .menulist::after {
    content: '';
    width: 10px;
    height: 10px;
    display: inline-block;
    border-right: 1px #fff solid;
    border-bottom: 1px #fff solid;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%) rotate(45deg);
    -ms-transform: translateY(-50%) rotate(45deg);
    transform: translateY(-50%) rotate(45deg);
    right: 5px; }
  .product_compare .menulist .selectMenu {
    font-size: 1.125rem;
    line-height: 1.625rem;
    margin: 0;
    width: 100%;
    padding: 20px;
    display: inline-block;
    cursor: pointer; }
  .product_compare .menulist > ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 10;
    width: 100%;
    max-height: 473px;
    overflow-y: auto; }
    .product_compare .menulist > ul > li > div {
      position: relative; }
      .product_compare .menulist > ul > li > div::before, .product_compare .menulist > ul > li > div::after {
        background: #fff;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        -webkit-transition: .5s;
        -o-transition: .5s;
        transition: .5s; }
      .product_compare .menulist > ul > li > div::before {
        content: '';
        width: 1px;
        height: 15px;
        display: inline-block;
        right: 22px; }
      .product_compare .menulist > ul > li > div::after {
        right: 15px;
        content: '';
        width: 15px;
        height: 1px;
        display: inline-block; }
    .product_compare .menulist > ul > li:not(:last-child) {
      border-bottom: 1px #fff solid; }
    .product_compare .menulist > ul li {
      -webkit-transition: .5s;
      -o-transition: .5s;
      transition: .5s;
      cursor: pointer; }
      .product_compare .menulist > ul li div {
        background: #767676;
        -webkit-transition: .5s;
        -o-transition: .5s;
        transition: .5s; }
        .product_compare .menulist > ul li div:hover {
          background: #afc9e9;
          color: #000; }
      .product_compare .menulist > ul li p {
        padding: 25px 45px;
        font-size: 1.25rem;
        line-height: 1.75rem;
        margin: 0; }
  .product_compare .menulist .child {
    background: #cacaca;
    display: none;
    width: 100%; }
    .product_compare .menulist .child li {
      padding: 15px 10px;
      font-size: 1rem;
      line-height: 1.5rem;
      margin: 0;
      cursor: pointer;
      color: #000; }
      .product_compare .menulist .child li:not(:last-child) {
        border-bottom: 1px #767676 solid; }
      .product_compare .menulist .child li:hover {
        background: #000;
        color: #fff; }

.product_compare .menulist--class::after {
  content: '';
  width: 10px;
  height: 10px;
  display: inline-block;
  border-right: 1px #fff solid;
  border-bottom: 1px #fff solid;
  position: relative;
  top: 0; }

.product_compare .menulist--class .selectMenu {
  padding: 0; }

.search_result {
  overflow-x: hidden; }
  .search_result .main {
    background: #343434;
    color: #fff;
    letter-spacing: .7px;
    min-height: 100vh; }
    .search_result .main > article {
      padding: 140px 0 0; }
  .search_result footer {
    z-index: 10; }

.search_result {
  font-family: "CenturyGothic", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
  .search_result .titleSec {
    width: 80%;
    margin: 0 auto 90px; }
    .search_result .titleSec .searchicon {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      position: relative;
      background: #ffbc00;
      display: inline-block;
      margin-bottom: 0px; }
      .search_result .titleSec .searchicon i {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        color: #000;
        font-size: 1.25rem;
        font-weight: bold; }
    .search_result .titleSec .searchicon.m {
      display: none; }
      @media only screen and (max-width: 1200px) {
        .search_result .titleSec .searchicon.m {
          display: inline-block;
          -webkit-transform: translateY(50%);
          -ms-transform: translateY(50%);
          transform: translateY(50%); } }
    @media only screen and (max-width: 1200px) {
      .search_result .titleSec .searchicon.pc {
        display: none; } }
    .search_result .titleSec ._up {
      text-align: center;
      border-bottom: 1px #717171 solid;
      margin-bottom: 50px; }
      .search_result .titleSec ._up p {
        font-size: 0.9375rem;
        line-height: 1.4375rem;
        margin: 0 0 10px; }
      .search_result .titleSec ._up .h4 {
        font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        font-size: 3.125rem;
        line-height: 3.625rem;
        margin: 0 0 50px; }
    .search_result .titleSec ._down {
      width: 800px;
      margin: 0 auto; }
      @media only screen and (max-width: 1200px) {
        .search_result .titleSec ._down {
          width: 80%;
          text-align: center;
          background: #515151;
          border-radius: 25px;
          padding-top: 0; } }
      @media only screen and (max-width: 600px) {
        .search_result .titleSec ._down {
          width: 100%; } }
      .search_result .titleSec ._down.open .filter .dot span:first-child, .search_result .titleSec ._down.open .filter .dot span:last-child {
        width: 20px;
        height: 1px; }
      .search_result .titleSec ._down.open .filter .dot span:nth-child(2) {
        display: none; }
      .search_result .titleSec ._down.open .filter.over .dot {
        position: relative;
        width: 20px;
        margin: 0 auto;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg); }
        .search_result .titleSec ._down.open .filter.over .dot span {
          position: absolute;
          top: 50%;
          left: 50%;
          -webkit-transform: translate(-50%, -50%);
          -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%); }
          .search_result .titleSec ._down.open .filter.over .dot span:last-child {
            height: 20px;
            width: 1px; }
      .search_result .titleSec ._down.open ._down_content {
        -webkit-animation: 1s fadeIn forwards;
        animation: 1s fadeIn forwards; }
      .search_result .titleSec ._down > div {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex; }
        @media only screen and (max-width: 1200px) {
          .search_result .titleSec ._down > div {
            display: block;
            padding: 25px 0; } }
      .search_result .titleSec ._down .filter {
        display: none;
        font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        cursor: pointer; }
        @media only screen and (max-width: 1200px) {
          .search_result .titleSec ._down .filter {
            display: inline-block;
            width: 100%; } }
        .search_result .titleSec ._down .filter p {
          font-size: 1.125rem;
          line-height: 1.625rem;
          margin: 0 0 10px; }
        .search_result .titleSec ._down .filter .dot {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center; }
          .search_result .titleSec ._down .filter .dot span {
            -webkit-transition: .5s;
            -o-transition: .5s;
            transition: .5s;
            width: 5px;
            height: 5px;
            border-radius: 50%;
            background: #fff;
            margin: 0 5px;
            display: inline-block; }
      @media only screen and (max-width: 1200px) {
        .search_result .titleSec ._down ._down_content {
          display: none;
          opacity: 0; } }
      @media only screen and (max-width: 700px) {
        .search_result .titleSec ._down ._down_content {
          text-align: left;
          padding: 45px 0px; } }
      .search_result .titleSec ._down ._left, .search_result .titleSec ._down ._right {
        width: 50%; }
        @media only screen and (max-width: 1200px) {
          .search_result .titleSec ._down ._left, .search_result .titleSec ._down ._right {
            width: 100%; } }
      @media only screen and (max-width: 700px) {
        .search_result .titleSec ._down ._left {
          padding: 0 15px; } }
      .search_result .titleSec ._down ._left p {
        font-size: 1rem;
        line-height: 1.5rem;
        margin: 0 0 40px; }
      .search_result .titleSec ._down ._left .h5 {
        font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        font-size: 1.25rem;
        line-height: 1.75rem;
        margin: 0 0 15px; }
      .search_result .titleSec ._down ._right p {
        font-size: 0.9375rem;
        line-height: 1.4375rem;
        margin: 0;
        color: rgba(255, 255, 255, 0.5);
        padding-left: 15px; }
      .search_result .titleSec ._down ._right .h4 {
        font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        font-size: 1rem;
        line-height: 1.5rem;
        margin: 0;
        color: #fff;
        width: 80px;
        text-align: right;
        padding-right: 15px;
        position: relative; }
        @media only screen and (max-width: 1200px) {
          .search_result .titleSec ._down ._right .h4 {
            width: auto; } }
        @media only screen and (max-width: 700px) {
          .search_result .titleSec ._down ._right .h4 {
            text-align: left;
            margin-bottom: 10px; } }
        .search_result .titleSec ._down ._right .h4::after {
          content: '';
          width: 1px;
          height: 15px;
          display: inline-block;
          background: rgba(255, 255, 255, 0.4);
          position: absolute;
          top: 6px;
          right: 0; }
          @media only screen and (max-width: 700px) {
            .search_result .titleSec ._down ._right .h4::after {
              display: none; } }
      .search_result .titleSec ._down ._right li {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex; }
        @media only screen and (max-width: 700px) {
          .search_result .titleSec ._down ._right li {
            display: block;
            text-align: left; } }
        .search_result .titleSec ._down ._right li:not(:last-child) {
          margin-bottom: 20px; }

.search_result .listSec {
  width: calc(100% - 120px);
  margin: 0 auto;
  padding-top: 140px;
  background: #565656; }
  @media only screen and (max-width: 767px) {
    .search_result .listSec {
      margin: 0 auto 80px; } }
  @media only screen and (max-width: 650px) {
    .search_result .listSec {
      width: 90%; } }
  .search_result .listSec > div {
    width: 1400px;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s; }
    @media only screen and (max-width: 1600px) {
      .search_result .listSec > div {
        width: 80%; } }
    @media only screen and (max-width: 1100px) {
      .search_result .listSec > div {
        width: 90%; } }
    .search_result .listSec > div .items {
      width: 25%;
      text-align: center;
      margin-bottom: 130px;
      padding: 0 30px; }
      @media only screen and (max-width: 1600px) {
        .search_result .listSec > div .items {
          width: calc(100% / 3); } }
      @media only screen and (max-width: 1100px) {
        .search_result .listSec > div .items {
          width: 50%; } }
      @media only screen and (max-width: 650px) {
        .search_result .listSec > div .items {
          width: 100%; } }
      .search_result .listSec > div .items .img {
        position: relative;
        max-width: 300px;
        width: 100%;
        height: 250px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin-bottom: 20px; }
        .search_result .listSec > div .items .img img {
          max-height: 100%; }
        .search_result .listSec > div .items .img .tag {
          font-size: 0.875rem;
          line-height: 1.4375rem;
          margin: 0;
          top: 0;
          left: 0;
          -webkit-transform: translate(-10px, -50%);
          -ms-transform: translate(-10px, -50%);
          transform: translate(-10px, -50%);
          z-index: 10;
          position: absolute;
          display: inline-block;
          padding: 5px 10px;
          max-width: 100%; }
          .search_result .listSec > div .items .img .tag p {
            overflow: hidden;
            -o-text-overflow: ellipsis;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 1;
            -webkit-box-orient: vertical;
            max-height: 1.4375rem;
            width: 100%;
            text-align: left; }
      .search_result .listSec > div .items h3 {
        font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        font-size: 1.25rem;
        line-height: 1.75rem;
        margin: 0; }

#profile:after, #brandAgent:after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  width: 50%;
  height: 100%;
  background-color: #292929;
  z-index: -2; }

body[data-page="about_2"] .dropDownBtn:after, #brandAgent .brandSwiperArrowBox .nextSwiper:after, #brandAgent .brandSwiperArrowBox .prevSwiper:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-65%, -65%);
  -ms-transform: translate(-65%, -65%);
  transform: translate(-65%, -65%);
  width: 35%;
  height: 35%;
  border-right: 2px solid #4a4a4a;
  border-bottom: 2px solid #4a4a4a;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s; }

body[data-page="about_2"] .banner {
  position: relative; }

body[data-page="about_2"] main {
  background-color: #343434; }

body[data-page="about_2"] section {
  padding-top: 6.771vw;
  padding-bottom: 6.771vw; }
  body[data-page="about_2"] section > .content {
    width: 90%;
    max-width: 1570px;
    margin-left: auto;
    margin-right: auto;
    position: relative; }
    @media (min-width: 1921px) {
      body[data-page="about_2"] section > .content {
        width: 90%;
        max-width: 1920px;
        margin-left: auto;
        margin-right: auto; } }
    body[data-page="about_2"] section > .content .description {
      font-size: 0.9375rem;
      margin-top: 15px;
      line-height: 1.7; }
    body[data-page="about_2"] section > .content .titleBox {
      color: white; }
      body[data-page="about_2"] section > .content .titleBox.side {
        max-width: 500px;
        padding: 10px; }
        @media (max-width: 768px) {
          body[data-page="about_2"] section > .content .titleBox.side {
            width: 100%;
            padding: 0;
            margin-left: 0; } }
      body[data-page="about_2"] section > .content .titleBox > .title, body[data-page="about_2"] section > .content .titleBox > .subTitle {
        font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        font-weight: bold; }
      body[data-page="about_2"] section > .content .titleBox > .title {
        font-size: 0.9375rem; }
      body[data-page="about_2"] section > .content .titleBox > .subTitle {
        font-size: 2.19vw;
        letter-spacing: 2px;
        line-height: 1.3; }
        @media (min-width: 1920px) {
          body[data-page="about_2"] section > .content .titleBox > .subTitle {
            font-size: 2.625rem; } }
        @media (max-width: 1366px) {
          body[data-page="about_2"] section > .content .titleBox > .subTitle {
            font-size: 3vw; } }
        @media (max-width: 1024px) {
          body[data-page="about_2"] section > .content .titleBox > .subTitle {
            font-size: 3.8vw; } }
        @media (max-width: 768px) {
          body[data-page="about_2"] section > .content .titleBox > .subTitle {
            font-size: 2.125rem; } }
      body[data-page="about_2"] section > .content .titleBox > .description {
        color: rgba(255, 255, 255, 0.7); }
    body[data-page="about_2"] section > .content .aboutListTitleBox {
      text-align: center;
      color: white; }
      body[data-page="about_2"] section > .content .aboutListTitleBox > .title {
        font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        font-weight: bold;
        font-size: 1.625rem; }

body[data-page="about_2"] .dropDownBtn {
  position: absolute;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid white;
  bottom: 5%;
  left: 50%;
  -webkit-transform: translateX(-50%) rotate(45deg);
  -ms-transform: translateX(-50%) rotate(45deg);
  transform: translateX(-50%) rotate(45deg);
  cursor: pointer; }
  body[data-page="about_2"] .dropDownBtn:after {
    border-color: white; }

#aboutNav {
  background-color: #222222;
  color: white;
  padding: 32.5px 0;
  font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-weight: bold;
  font-size: 1.125rem;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s; }
  @media (max-width: 768px) {
    #aboutNav {
      padding: 0;
      height: 0;
      overflow: hidden; } }
  #aboutNav .aboutNav-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
  #aboutNav .aboutNav-list {
    position: relative; }
    #aboutNav .aboutNav-list > a {
      position: relative;
      margin: 0 30px;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
      #aboutNav .aboutNav-list > a:before {
        content: "";
        position: absolute;
        bottom: -10px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        height: 4px;
        width: 0%;
        background-color: #ffbc00;
        opacity: 0;
        -webkit-transition: 0.5s;
        -o-transition: 0.5s;
        transition: 0.5s; }
      #aboutNav .aboutNav-list > a:hover {
        color: #ffbc00; }
        #aboutNav .aboutNav-list > a:hover:before {
          width: 100%;
          opacity: 1; }
    #aboutNav .aboutNav-list:not(:last-child):after {
      content: "";
      position: absolute;
      top: 50%;
      left: calc(100% - 5px);
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
      width: 10px;
      height: 2px;
      background-color: rgba(152, 152, 152, 0.4); }

#profile {
  padding-top: 7.8125vw;
  padding-bottom: 4vw; }
  #profile .content {
    padding-left: 8.5vw; }
    @media (max-width: 1600px) {
      #profile .content {
        padding-left: 0vw; } }
  #profile .titleBox {
    padding-top: 8vh; }
    @media (max-width: 768px) {
      #profile .titleBox {
        padding-top: 0; } }
  #profile .profileBox {
    position: relative; }
  #profile .profileImg {
    position: absolute;
    top: 0;
    right: 0;
    max-width: 80%;
    z-index: -1; }
    @media (max-width: 768px) {
      #profile .profileImg {
        position: relative;
        max-width: 100%;
        margin-top: 5vw; } }
  #profile .profileContent {
    width: 700px;
    max-width: 100%;
    padding: 3.9vw 4.9vw 3.9vw 4.9vw;
    margin-top: 4vh;
    background-color: #ffbc00; }
    @media (max-width: 768px) {
      #profile .profileContent {
        padding: 5vw;
        max-width: 95%;
        margin: -2.5vw auto 0 auto; } }
    #profile .profileContent .profileTitle {
      font-size: 1.5rem;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold; }
    #profile .profileContent .profileDescription {
      font-size: 0.9375rem;
      margin-top: 30px;
      line-height: 1.7; }

#brandAgent {
  padding-bottom: 3.4156vw; }
  @media (max-width: 1024px) {
    #brandAgent {
      padding-bottom: 30px; } }
  #brandAgent .content {
    max-width: 1920px; }
  #brandAgent .innerWrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 1640px;
    margin-right: auto;
    margin-left: 0; }
    @media (max-width: 1024px) {
      #brandAgent .innerWrapper {
        display: block;
        margin-right: auto;
        margin-left: auto; } }
  #brandAgent .titleBox {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    margin-left: 2vw; }
    @media (max-width: 1366px) {
      #brandAgent .titleBox {
        margin-left: 1vw; } }
    @media (max-width: 1024px) and (min-width: 769px) {
      #brandAgent .titleBox {
        width: 100%;
        margin-left: 0;
        text-align: center;
        margin: 0 auto; } }
  #brandAgent .brandContent {
    position: relative;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    max-width: 68.4524%;
    width: 100%;
    margin-right: auto;
    margin-left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch; }
    @media (max-width: 1024px) {
      #brandAgent .brandContent {
        display: block;
        max-width: 100%;
        margin-top: 5vw;
        margin-left: auto;
        margin-right: auto; } }
    #brandAgent .brandContent.nonSet > .brandSwiperArrowBox {
      display: none; }
    #brandAgent .brandContent.nonSet .swiper-wrapper {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      #brandAgent .brandContent.nonSet .swiper-wrapper > .brandSwiperSlide {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 100%;
        flex: 1 1 100%;
        max-width: 375px; }
        @media (min-width: 667px) {
          #brandAgent .brandContent.nonSet .swiper-wrapper > .brandSwiperSlide:nth-child(2) {
            -webkit-transform: translateY(45px);
            -ms-transform: translateY(45px);
            transform: translateY(45px); } }
      #brandAgent .brandContent.nonSet .swiper-wrapper > .brandSwiperSlide:only-child {
        max-width: 750px; }
  #brandAgent .brandSwiper {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    position: relative;
    padding-bottom: 45px; }
    @media (max-width: 667px) {
      #brandAgent .brandSwiper {
        padding-bottom: 0; } }
    #brandAgent .brandSwiper .brandSwiperSlide {
      height: 405px;
      width: 33%;
      padding: 0 1px;
      -webkit-transition: 0.8s;
      -o-transition: 0.8s;
      transition: 0.8s; }
      @media (min-width: 667px) {
        #brandAgent .brandSwiper .brandSwiperSlide.swiper-slide-next {
          -webkit-transform: translateY(45px);
          -ms-transform: translateY(45px);
          transform: translateY(45px); } }
    #brandAgent .brandSwiper .brandSwiperContent {
      position: relative;
      height: 100%;
      background-color: #555555;
      -webkit-transition: 0.8s;
      -o-transition: 0.8s;
      transition: 0.8s; }
      #brandAgent .brandSwiper .brandSwiperContent .brandLogo, #brandAgent .brandSwiper .brandSwiperContent .brandDescription {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -webkit-transition: 0.8s;
        -o-transition: 0.8s;
        transition: 0.8s;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center; }
      #brandAgent .brandSwiper .brandSwiperContent .brandLogo {
        opacity: 1; }
      #brandAgent .brandSwiper .brandSwiperContent .brandDescription {
        padding: 0 45px;
        opacity: 0;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none; }
        #brandAgent .brandSwiper .brandSwiperContent .brandDescription > a {
          position: absolute;
          bottom: 0;
          left: 50%;
          -webkit-transform: translateX(-50%);
          -ms-transform: translateX(-50%);
          transform: translateX(-50%);
          width: calc(100% - 4.6875vw);
          text-align: center;
          font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
          font-weight: bold;
          padding: 15.5px 0;
          background-color: #e6e6e6; }
          @media (max-width: 667px) {
            #brandAgent .brandSwiper .brandSwiperContent .brandDescription > a {
              width: calc(100% - 7.25vw); } }
      #brandAgent .brandSwiper .brandSwiperContent:hover {
        background-color: #ffbc00; }
        #brandAgent .brandSwiper .brandSwiperContent:hover .brandLogo {
          opacity: 0; }
        #brandAgent .brandSwiper .brandSwiperContent:hover .brandDescription {
          opacity: 1; }
  #brandAgent .brandSwiperArrowBox {
    margin-left: 1vw; }
    @media (max-width: 1024px) {
      #brandAgent .brandSwiperArrowBox {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin-top: 3vw;
        margin-left: 0; } }
    #brandAgent .brandSwiperArrowBox .nextSwiper, #brandAgent .brandSwiperArrowBox .prevSwiper {
      position: relative;
      width: 28px;
      height: 28px;
      border-radius: 50%;
      border: 2px solid #4a4a4a;
      margin: 0.5vw;
      cursor: pointer;
      top: calc(50% - 4.6875vw);
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
      @media (max-width: 1024px) {
        #brandAgent .brandSwiperArrowBox .nextSwiper, #brandAgent .brandSwiperArrowBox .prevSwiper {
          margin: 8px; } }
      #brandAgent .brandSwiperArrowBox .nextSwiper:hover, #brandAgent .brandSwiperArrowBox .prevSwiper:hover {
        border-color: white; }
        #brandAgent .brandSwiperArrowBox .nextSwiper:hover:after, #brandAgent .brandSwiperArrowBox .prevSwiper:hover:after {
          border-color: white; }
    #brandAgent .brandSwiperArrowBox .nextSwiper:after {
      -webkit-transform: translate(-30%, -50%) rotate(135deg);
      -ms-transform: translate(-30%, -50%) rotate(135deg);
      transform: translate(-30%, -50%) rotate(135deg); }
    #brandAgent .brandSwiperArrowBox .prevSwiper:after {
      -webkit-transform: translate(-70%, -50%) rotate(-45deg);
      -ms-transform: translate(-70%, -50%) rotate(-45deg);
      transform: translate(-70%, -50%) rotate(-45deg); }

#chronicle .content {
  max-width: 1024px; }

#chronicle .titleBox {
  text-align: center;
  width: 90%;
  margin-left: auto;
  margin-right: auto; }
  @media (max-width: 1024px) {
    #chronicle .titleBox {
      margin-left: 0;
      text-align: left; } }

#chronicle .chronicleTab, #chronicle .chronicleSelect {
  margin: 3vw 0; }
  @media (max-width: 1024px) {
    #chronicle .chronicleTab, #chronicle .chronicleSelect {
      margin: 2.627vw auto;
      width: 90%; } }

.chronicleSelect .selectText, .downloadSelect .selectText {
  display: none; }

@media (max-width: 768px) {
  .chronicleSelect, .downloadSelect {
    position: relative;
    font-family: "CenturyGothic", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    background-color: #ffbc00;
    max-width: 340px;
    color: #222222;
    text-align: center;
    border-radius: 20px;
    margin-right: auto;
    margin-left: auto;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 99; }
    .chronicleSelect.active:after, .downloadSelect.active:after {
      -webkit-transform: translateY(-50%) rotate(180deg);
      -ms-transform: translateY(-50%) rotate(180deg);
      transform: translateY(-50%) rotate(180deg); }
    .chronicleSelect.active .selectBox, .downloadSelect.active .selectBox {
      opacity: 1; }
    .chronicleSelect:after, .downloadSelect:after {
      content: "";
      position: absolute;
      top: 50%;
      right: 8%;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
      border-left: 5px solid transparent;
      border-top: 8px solid #222222;
      border-right: 5px solid transparent;
      border-bottom: 0px solid transparent;
      -webkit-transition: 0.8s;
      -o-transition: 0.8s;
      transition: 0.8s; }
    .chronicleSelect .selectText, .downloadSelect .selectText {
      display: block;
      padding: 10px;
      text-align: center; }
    .chronicleSelect .selectBox, .downloadSelect .selectBox {
      display: none;
      position: absolute;
      top: 110%;
      left: 0;
      width: 100%;
      border-radius: 20px;
      background-color: #e4e4e4;
      overflow: auto;
      opacity: 0;
      -webkit-transition: opacity 0.3s 0.1s;
      -o-transition: opacity 0.3s 0.1s;
      transition: opacity 0.3s 0.1s;
      max-height: 300px;
      overflow-y: scroll;
      -webkit-overflow-style: none;
      -ms-overflow-style: -ms-autohiding-scrollbar; }
      .chronicleSelect .selectBox::-webkit-scrollbar, .downloadSelect .selectBox::-webkit-scrollbar {
        background-color: transparent;
        border-radius: 10px;
        width: 5px; }
      .chronicleSelect .selectBox::-webkit-scrollbar-thumb, .downloadSelect .selectBox::-webkit-scrollbar-thumb {
        width: 5px;
        background-color: #222222; }
      .chronicleSelect .selectBox::-webkit-scrollbar-track, .downloadSelect .selectBox::-webkit-scrollbar-track {
        background-color: rgba(34, 34, 34, 0.2); }
      .chronicleSelect .selectBox li.option, .downloadSelect .selectBox li.option {
        padding: 15px;
        cursor: pointer;
        z-index: 9; }
        .chronicleSelect .selectBox li.option:hover, .downloadSelect .selectBox li.option:hover {
          background-color: #ffbc00; } }

@media (min-width: 769px) {
  .chronicleTab .tabBox, .downloadTab .tabBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 0.9375rem;
    font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: bold; }
  .chronicleTab .tabItem, .downloadTab .tabItem {
    padding: 8px 25px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid #ffbc00;
    color: #ffbc00;
    border-radius: 50px;
    margin: 0 12px;
    cursor: pointer;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s; }
    .chronicleTab .tabItem:hover, .chronicleTab .tabItem.active, .downloadTab .tabItem:hover, .downloadTab .tabItem.active {
      background-color: #ffbc00;
      color: black; } }

#chronicle .yearsBox {
  padding: 0 5px; }

#chronicle .yearItem {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  color: white;
  padding-top: 40px; }
  #chronicle .yearItem:not(:last-child) > .dateBox {
    border-bottom: 1px solid #5d5d5d; }
  #chronicle .yearItem > .yearNum {
    font-size: 1.875rem;
    font-weight: normal;
    margin-right: 2.60417vw; }
  #chronicle .yearItem > .dateBox {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding-bottom: 40px; }
    #chronicle .yearItem > .dateBox > .dateItem {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start; }
      #chronicle .yearItem > .dateBox > .dateItem:not(:first-child) {
        margin-top: 20px; }
      @media (max-width: 768px) {
        #chronicle .yearItem > .dateBox > .dateItem:first-child {
          margin-top: 20px; } }
    #chronicle .yearItem > .dateBox .date {
      -webkit-box-flex: 0;
      -ms-flex: 0 0 80px;
      flex: 0 0 80px;
      font-size: 1.125rem;
      max-width: 80px;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold; }
    #chronicle .yearItem > .dateBox .dateDescription {
      -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
      flex: 1 1 auto;
      font-size: 1rem;
      color: #c4c4c4;
      margin-left: 1.5625vw; }
  @media (max-width: 1024px) {
    #chronicle .yearItem {
      display: block; }
      #chronicle .yearItem > .dateBox .dateDescription {
        margin-left: 3.125vw; } }
  @media (max-width: 667px) {
    #chronicle .yearItem > .dateBox > .dateItem {
      display: block; }
    #chronicle .yearItem > .dateBox .dateDescription {
      margin-left: 0;
      margin-top: 1.5625vw; } }

#chronicle .swiper-pagination {
  position: relative;
  width: 100%;
  margin-top: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; }
  #chronicle .swiper-pagination .bullet {
    width: 43px;
    height: 3px;
    background-color: #5d5d5d;
    margin: 0 4px;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    cursor: pointer; }
    #chronicle .swiper-pagination .bullet:first-child:last-child {
      display: none; }
    #chronicle .swiper-pagination .bullet.active {
      background-color: #ffbc00; }

#artisticCreation {
  position: relative; }
  #artisticCreation .backgroundImg {
    position: absolute;
    top: 0;
    left: 0;
    width: 97vw;
    height: 100%;
    background-color: #292929;
    overflow: hidden; }
    @media (max-width: 1366px) {
      #artisticCreation .backgroundImg {
        width: 100%; } }
    #artisticCreation .backgroundImg > img {
      position: absolute; }
      @media (max-width: 1366px) {
        #artisticCreation .backgroundImg > img {
          max-width: 45vw; } }
    #artisticCreation .backgroundImg .top {
      top: 0; }
    #artisticCreation .backgroundImg .left {
      left: 0; }
    #artisticCreation .backgroundImg .right {
      right: 0; }
    #artisticCreation .backgroundImg .bottom {
      bottom: 0; }
  @media (min-width: 768px) {
    #artisticCreation .content {
      max-width: 1920px;
      width: 90%; } }
  #artisticCreation .innerWrapper {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 1vh;
    width: 90%; }
    @media (max-width: 1366px) {
      #artisticCreation .innerWrapper {
        display: block; } }
    #artisticCreation .innerWrapper.aiCenter {
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
    #artisticCreation .innerWrapper.aiStretch {
      -webkit-box-align: stretch;
      -ms-flex-align: stretch;
      align-items: stretch; }
    #artisticCreation .innerWrapper.between {
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between; }
    #artisticCreation .innerWrapper.ms-right {
      margin-left: auto; }
    #artisticCreation .innerWrapper.ms-left {
      margin-left: auto; }
      @media (max-width: 1366px) and (min-width: 769px) {
        #artisticCreation .innerWrapper.ms-left {
          margin-left: 0;
          margin-right: auto; } }
    @media (max-width: 768px) {
      #artisticCreation .innerWrapper {
        width: 100%;
        margin: 0 auto; } }
  #artisticCreation .titleBox {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    margin-left: 10vw; }
    @media (max-width: 1366px) {
      #artisticCreation .titleBox {
        width: 90%; } }
    @media (max-width: 768px) {
      #artisticCreation .titleBox {
        margin-left: 0vw; } }
  #artisticCreation .titleImg {
    overflow: hidden; }
    #artisticCreation .titleImg > img {
      -webkit-transform: scale(1.01);
      -ms-transform: scale(1.01);
      transform: scale(1.01);
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
    @media (min-width: 1366px) {
      #artisticCreation .titleImg:hover > img {
        -webkit-transform: scale(1.11);
        -ms-transform: scale(1.11);
        transform: scale(1.11); } }
    @media (max-width: 1366px) {
      #artisticCreation .titleImg {
        max-width: 900px;
        margin-left: auto; } }
    @media (max-width: 768px) {
      #artisticCreation .titleImg {
        padding: 0;
        margin-top: 5vw; } }
  #artisticCreation .limitedEdition {
    position: relative;
    width: 73%;
    max-width: 1080px;
    padding: 4vw 0;
    color: white;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    @media (max-width: 1366px) {
      #artisticCreation .limitedEdition {
        width: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: stretch;
        -ms-flex-align: stretch;
        align-items: stretch; } }
    @media (max-width: 768px) {
      #artisticCreation .limitedEdition {
        margin-top: 2vw;
        padding: 8vw 0; } }
    #artisticCreation .limitedEdition:hover .moreCover {
      opacity: 1; }
    #artisticCreation .limitedEdition:hover .moreText {
      letter-spacing: 0; }
  #artisticCreation .ProductImg {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auot;
    flex: 0 0 auot; }
    #artisticCreation .ProductImg .ProductImg--pc {
      display: block; }
      @media (max-width: 1366px) {
        #artisticCreation .ProductImg .ProductImg--pc {
          display: none; } }
    #artisticCreation .ProductImg .ProductImg--phome {
      display: none; }
      @media (max-width: 1366px) {
        #artisticCreation .ProductImg .ProductImg--phome {
          display: block;
          margin: 0 auto;
          max-width: 85%; } }
      @media (max-width: 768px) {
        #artisticCreation .ProductImg .ProductImg--phome {
          max-width: 100%; } }
    @media (max-width: 1366px) {
      #artisticCreation .ProductImg {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2; } }
    @media (max-width: 768px) {
      #artisticCreation .ProductImg {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        margin-top: 4vw; } }
  #artisticCreation .ProductTileBox {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
    @media (max-width: 1366px) {
      #artisticCreation .ProductTileBox {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        margin-bottom: 2.5vw; } }
    #artisticCreation .ProductTileBox > .title, #artisticCreation .ProductTileBox > .description {
      width: 70%;
      margin-left: auto;
      margin-right: auto; }
      @media (max-width: 1024px) {
        #artisticCreation .ProductTileBox > .title, #artisticCreation .ProductTileBox > .description {
          width: 90%; } }
    #artisticCreation .ProductTileBox > .title {
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold;
      font-size: 1.625rem; }
    #artisticCreation .ProductTileBox > .hr {
      width: 5%;
      height: 3px;
      border: none;
      background-color: white;
      margin-top: 1.38889vw; }
    #artisticCreation .ProductTileBox > .description {
      font-size: 0.9375rem;
      margin-top: 2.7778vw; }
  #artisticCreation .limitedEditionMoreBtn {
    width: 23%;
    display: block;
    background-color: #ffbc00;
    margin-left: 0.5vw;
    margin-right: 3vw;
    z-index: 2;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: bold;
    font-size: 1.125rem; }
    #artisticCreation .limitedEditionMoreBtn .moreText {
      margin-top: 1vh;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
    #artisticCreation .limitedEditionMoreBtn .moreIcon {
      position: relative;
      width: 34px;
      height: 34px;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
      #artisticCreation .limitedEditionMoreBtn .moreIcon:before, #artisticCreation .limitedEditionMoreBtn .moreIcon:after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        height: 3px;
        width: 100%;
        background-color: black; }
      #artisticCreation .limitedEditionMoreBtn .moreIcon:after {
        -webkit-transform: translate(-50%, -50%) rotate(90deg);
        -ms-transform: translate(-50%, -50%) rotate(90deg);
        transform: translate(-50%, -50%) rotate(90deg); }
    #artisticCreation .limitedEditionMoreBtn:hover .moreText {
      letter-spacing: 2px; }
    #artisticCreation .limitedEditionMoreBtn:hover .moreIcon {
      -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
      transform: rotate(180deg); }
    @media (max-width: 1366px) {
      #artisticCreation .limitedEditionMoreBtn {
        position: absolute;
        top: 85%;
        right: -75px;
        width: 150px;
        height: 150px;
        margin: 0; } }
    @media (max-width: 768px) {
      #artisticCreation .limitedEditionMoreBtn {
        position: relative;
        width: 100%;
        right: 0;
        margin-top: 2vw; } }

#aboutList {
  padding-top: 180px; }
  #aboutList .content {
    width: 90%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto; }
  #aboutList .aboutListTitleBox {
    width: 90%;
    margin-right: auto;
    margin-left: auto; }
    @media (min-width: 1024px) {
      #aboutList .aboutListTitleBox {
        width: 70%; } }
    @media (min-width: 1366px) {
      #aboutList .aboutListTitleBox {
        width: 60%; } }
  #aboutList .description {
    color: white; }
  #aboutList > .description {
    margin-top: 40px; }
  #aboutList .limitedEditionBox {
    margin-top: 7.8125vw;
    margin-bottom: 50px; }
  #aboutList .limitedEditionList {
    margin-top: 1.04167vw;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
    overflow: hidden; }
    #aboutList .limitedEditionList .product {
      max-width: 100%; }
    #aboutList .limitedEditionList .product--pc {
      display: block; }
      @media (max-width: 768px) {
        #aboutList .limitedEditionList .product--pc {
          display: none; } }
    #aboutList .limitedEditionList .product--phome {
      display: none; }
      @media (max-width: 768px) {
        #aboutList .limitedEditionList .product--phome {
          display: block;
          margin-right: auto;
          margin-left: auto; } }
    #aboutList .limitedEditionList:nth-of-type(odd) .titleBox {
      -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
      order: 2; }
    #aboutList .limitedEditionList:nth-of-type(odd) .product {
      -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
      order: 1; }
      #aboutList .limitedEditionList:nth-of-type(odd) .product > img {
        margin-right: auto; }
    #aboutList .limitedEditionList:nth-of-type(even) .product > img {
      margin-left: auto; }
    @media (min-width: 1024px) {
      #aboutList .limitedEditionList:hover {
        -webkit-transform: translateX(5.8%);
        -ms-transform: translateX(5.8%);
        transform: translateX(5.8%); } }
    @media (max-width: 768px) {
      #aboutList .limitedEditionList {
        margin-top: 3.08834vw; } }
  #aboutList .limitedEdition {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    padding: 4vw 0; }
    @media (max-width: 768px) {
      #aboutList .limitedEdition {
        display: block;
        padding: 8vw 0; } }
    #aboutList .limitedEdition:hover > .moreCover {
      opacity: 1; }
      #aboutList .limitedEdition:hover > .moreCover > .moreText {
        letter-spacing: 0; }
    #aboutList .limitedEdition.mobileType > .moreCover {
      display: none; }
    @media (max-width: 768px) {
      #aboutList .limitedEdition.mobileType > .moreCover {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        position: relative;
        background-color: transparent;
        margin-top: 8vw;
        opacity: 1; }
        #aboutList .limitedEdition.mobileType > .moreCover > .moreBtn {
          display: none; }
        #aboutList .limitedEdition.mobileType > .moreCover > .moreText {
          font-size: 0.8125rem;
          letter-spacing: 0;
          padding: 8px 30px;
          background-color: white;
          border-radius: 50px;
          color: black;
          margin: 0; } }
  #aboutList .titleBox {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 40%;
    flex: 1 1 40%;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    text-align: center; }
    #aboutList .titleBox > .title {
      font-size: 3.125rem;
      letter-spacing: 0.3125rem; }
    #aboutList .titleBox > .titleLog + .title {
      width: 0;
      height: 0;
      visibility: hidden; }
    #aboutList .titleBox > .hr {
      width: 5%;
      height: 3px;
      border: none;
      background-color: white;
      margin-top: 1.38889vw; }
      @media (max-width: 1024px) {
        #aboutList .titleBox > .hr {
          margin-top: 3vw; } }
      @media (max-width: 768px) {
        #aboutList .titleBox > .hr {
          margin-top: 6vw; } }
  #aboutList .product {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 60%;
    flex: 1 1 60%;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2; }
    #aboutList .product > img {
      display: block; }
      @media (max-width: 768px) {
        #aboutList .product > img {
          max-width: 80%;
          margin-top: 3vw; } }
  #aboutList .bockgroundTattoo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
    #aboutList .bockgroundTattoo > img {
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none; }
  .moreCover {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 1;
    overflow: hidden;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    opacity: 0;
    -webkit-transform: scale(1.01) rotate(0.02deg);
    -ms-transform: scale(1.01) rotate(0.02deg);
    transform: scale(1.01) rotate(0.02deg);
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d; }
    .moreCover > .moreBtn, .moreCover > .moreText {
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
    .moreCover > .moreBtn {
      width: 30px;
      height: 30px; }
      .moreCover > .moreBtn > path.more {
        fill: #ffbc00; }
    .moreCover > .moreText {
      margin-left: 10px;
      letter-spacing: 3px;
      color: white;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold; }

#lightBox {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 998;
  -webkit-overflow-scrolling: touch; }
  #lightBox .cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 0; }
  #lightBox #entryContent {
    height: 100vh;
    max-width: 1200px;
    margin-left: auto;
    padding: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 999;
    -webkit-overflow-scrolling: touch; }
    #lightBox #entryContent:before, #lightBox #entryContent:after {
      content: none; }
    #lightBox #entryContent > .content {
      max-width: 1200px; }
    #lightBox #entryContent section {
      padding: 0; }
  #lightBox .lightBoxGotop:after {
    content: none; }

/* display: flex 置中*/
/* display: flex 置中*/
[data-page-classify="home"] {
  background-color: white;
  overflow-x: hidden; }
  [data-page-classify="home"] main {
    padding-top: 0; }
  @media (min-width: 1024px) {
    [data-page-classify="home"] footer {
      position: relative;
      z-index: auto; }
      [data-page-classify="home"] footer:before, [data-page-classify="home"] footer:after {
        content: "";
        position: absolute;
        top: -100px;
        width: 50%;
        height: 100%;
        z-index: -1; }
      [data-page-classify="home"] footer:before {
        background-color: #292929;
        left: 0; }
      [data-page-classify="home"] footer:after {
        background-color: #1f1f1f;
        right: 0; } }
  @media only screen and (max-width: 767px) {
    [data-page-classify="home"] footer {
      margin-top: 0;
      padding-top: 0; } }
  [data-page-classify="home"] .navbar {
    position: fixed;
    display: none; }

.graphic-block:nth-child(2n) .graphic-block__href {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse; }

.graphic-block:hover .graphic__img {
  -webkit-transform: scale(1.2) rotate(0.02deg);
  -ms-transform: scale(1.2) rotate(0.02deg);
  transform: scale(1.2) rotate(0.02deg); }

.graphic-block__href {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }

.graphic-txt {
  letter-spacing: 0.025em; }
  .graphic-txt__p {
    font-family: "Myriad Pro", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
    font-size: 0.9375rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden; }
  .graphic-txt__title {
    font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
    font-weight: bold;
    margin-bottom: 1vh; }
  .graphic-txt__gutter {
    margin-left: 0;
    margin-bottom: 2vh;
    padding: 0;
    border: none;
    width: 25px;
    height: 3px;
    background-color: #b4b3b3;
    display: block; }
  .graphic-txt__date {
    font-style: italic;
    font-size: 0.75rem;
    letter-spacing: 0.025em;
    color: rgba(34, 133, 184, 0.8);
    margin-top: 2vw;
    display: inline-block; }
  .graphic-txt--slogan {
    padding: 30px; }
    .graphic-txt--slogan .graphic-txt__title {
      font-size: 3rem; }
      @media only screen and (max-width: 767px) {
        .graphic-txt--slogan .graphic-txt__title {
          font-size: 2.125rem; } }
      @media only screen and (max-width: 460px) {
        .graphic-txt--slogan .graphic-txt__title {
          padding-bottom: 0px; } }
  .graphic-txt--normal {
    padding: 30px; }
    .graphic-txt--normal .graphic-txt__title {
      font-size: 1.625rem; }
      @media only screen and (max-width: 767px) {
        .graphic-txt--normal .graphic-txt__title {
          font-size: 1.25rem; } }
  .graphic-txt--center {
    text-align: center; }
    .graphic-txt--center .graphic-txt__gutter {
      margin: 0 auto;
      margin-bottom: 2vh; }
  .graphic-txt--black .graphic-txt__p {
    color: rgba(0, 0, 0, 0.8); }
  .graphic-txt--black .graphic-hrefL__txt {
    color: rgba(0, 0, 0, 0.5); }
  .graphic-txt--black .graphic-hrefL__txt:hover, .graphic-txt--black .graphic-hrefL__txt--active {
    color: #000; }
  .graphic-txt--white .graphic-txt__title {
    color: #fff; }
  .graphic-txt--white .graphic-txt__p {
    color: rgba(255, 255, 255, 0.8); }
  .graphic-txt--white .graphic-href {
    color: #fff; }
  .graphic-txt--tl {
    top: 10%;
    left: 10%; }
  .graphic-txt--tr {
    top: 10%;
    right: 10%; }
  .graphic-txt--cl {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 10%; }
  .graphic-txt--cr {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 10%; }
  .graphic-txt--bl {
    bottom: 10%;
    left: 10%; }
  .graphic-txt--br {
    bottom: 10%;
    right: 10%; }

.graphic-txtBlock--tl {
  top: 10%;
  left: 10%; }

.graphic-txtBlock--tr {
  top: 10%;
  right: 10%; }

.graphic-txtBlock--cl {
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 10%; }

.graphic-txtBlock--cr {
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 10%; }

.graphic-txtBlock--bl {
  bottom: 10%;
  left: 10%; }

.graphic-txtBlock--br {
  bottom: 10%;
  right: 10%; }

.graphic-href {
  margin-top: 3vh;
  display: inline-block; }
  .graphic-href:hover {
    color: #ffbc00; }
    .graphic-href:hover .graphic-href__txt {
      color: #ffbc00; }
  .graphic-href__icon {
    margin-right: 12px; }
    .graphic-href__icon img {
      width: 35px; }
  .graphic-href__txt {
    font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
    font-size: 1rem;
    letter-spacing: 0.075em;
    text-transform: uppercase;
    vertical-align: sub; }
    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
      .graphic-href__txt {
        vertical-align: bottom; } }
  .graphic-href--p {
    position: relative;
    padding-left: 24px; }
    .graphic-href--p:after, .graphic-href--p:before {
      content: '';
      position: absolute;
      background-color: #ffbc00;
      top: 50%;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%); }
    .graphic-href--p:after {
      width: 12px;
      height: 2px;
      left: 0; }
    .graphic-href--p:before {
      width: 2px;
      height: 12px;
      left: 5px; }

.graphic-hrefL {
  display: inline-block;
  font-size: 0px;
  margin-right: 1.823vw;
  margin-left: 1.823vw; }
  .graphic-hrefL__txt {
    font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
    font-weight: bold;
    font-size: 0.875rem;
    letter-spacing: 0.075em;
    text-transform: uppercase;
    -webkit-transition: .5s ease;
    -o-transition: .5s ease;
    transition: .5s ease;
    cursor: pointer; }
  .graphic-hrefL__all {
    font-size: 0;
    white-space: nowrap;
    overflow: hidden;
    padding-bottom: 10px; }

.graphic-img {
  width: 50%;
  overflow: hidden; }

.graphic__img {
  padding-bottom: 83.015%;
  width: 100%;
  background-size: cover;
  background-position: center center;
  overflow: hidden;
  -webkit-transition: .5s ease;
  -o-transition: .5s ease;
  transition: .5s ease;
  height: 100%; }

.aHero {
  padding-top: 50px;
  padding-bottom: 50px;
  background-color: #292929; }
  @media only screen and (max-width: 767px) {
    .aHero {
      padding-top: 20px;
      padding-bottom: 20px; } }
  @media only screen and (max-width: 460px) {
    .aHero {
      padding-top: 0px;
      padding-bottom: 0px; } }
  .aHero-navbar {
    position: absolute;
    z-index: 2;
    max-width: 1680px;
    margin: 0 auto;
    top: 30px;
    left: 0;
    right: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 90%; }
  .aHero-heroName {
    overflow: hidden;
    display: inline-block;
    -webkit-animation-delay: 1s;
    animation-delay: 1s; }
    .aHero-heroName__href {
      width: 85px;
      height: 99px;
      display: block;
      text-indent: 101%;
      white-space: nowrap;
      overflow: hidden;
      background-size: cover; }
      @media (max-width: 420px) {
        .aHero-heroName__href {
          margin-left: 5px;
          width: 60px;
          height: 70px; } }
      .aHero-heroName__href.white {
        background-image: url(../../assets/img/homeLogo_white.svg);
        display: none; }
      .aHero-heroName__href.black {
        background-image: url(../../assets/img/homeLogo_black.svg);
        display: none; }
  .aHero-menu {
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    margin-left: auto; }
    .aHero-menu span {
      display: block;
      margin-top: 10px; }
    .aHero-menu:hover {
      color: #fff; }
  .aHero-container {
    height: calc(100vh - 100px);
    max-width: calc(100% - 120px);
    margin: 0 auto; }
    @media only screen and (max-width: 767px) {
      .aHero-container {
        height: calc(100vh - 40px);
        max-width: calc(100% - 40px); } }
    @media only screen and (max-width: 460px) {
      .aHero-container {
        height: 100vh;
        max-width: 100%; } }
  .aHero-li {
    background-size: cover;
    background-position: center center;
    position: relative; }
    .aHero-li-inner {
      position: absolute;
      max-width: 510px;
      top: 50%;
      left: 10vw; }
      @media only screen and (max-width: 767px) {
        .aHero-li-inner {
          left: 50%;
          -webkit-transform: translate(-50%, -50%);
          -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
          width: 90%;
          margin: 0 auto; } }
    .aHero-li--white .aHero-play, .aHero-li--white .aHero-pause {
      border-color: rgba(255, 255, 255, 0.3); }
      .aHero-li--white .aHero-play:after, .aHero-li--white .aHero-pause:after {
        border-left-color: #fff; }
    .aHero-li--play .aHero-play, .aHero-li--play .aHero-pause {
      visibility: visible; }
  .aHero__title {
    font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
    font-size: 3.4375rem;
    letter-spacing: 0.033em;
    font-weight: bold;
    line-height: 1;
    margin-bottom: 20px; }
    @media only screen and (max-width: 767px) {
      .aHero__title {
        font-size: 2.5rem; } }
  .aHero__p {
    font-size: 1.0625rem;
    letter-spacing: 0.025em;
    opacity: .7; }
  .aHero-play, .aHero-pause {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 1px solid;
    position: absolute;
    top: 50%;
    right: 75px;
    cursor: pointer;
    z-index: 2;
    visibility: hidden; }
  .aHero-play:after {
    content: '';
    position: absolute;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 10px solid;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
  .aHero-pause {
    display: none; }
    .aHero-pause:after {
      content: '';
      position: absolute;
      width: 10px;
      height: 15px;
      border-right: 2px solid #fff;
      border-left: 2px solid #fff;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%); }
  .aHero-video {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1; }
    .aHero-video--in {
      width: 100%;
      height: 100%; }
  .aHero-hrefAll {
    position: absolute;
    top: 70vh;
    left: 10vw;
    z-index: 1;
    margin-left: -25px; }
    @media (max-width: 460px) {
      .aHero-hrefAll {
        left: 50%;
        width: 100%;
        margin-left: 0;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center; } }
  .aHero-href-li {
    display: inline-block; }
    .aHero-href-li:nth-child(1) {
      -webkit-animation-delay: 1.6s;
      animation-delay: 1.6s; }
    .aHero-href-li:nth-child(2) {
      -webkit-animation-delay: 1.8s;
      animation-delay: 1.8s; }
    .aHero-href-li:nth-child(3) {
      -webkit-animation-delay: 2s;
      animation-delay: 2s; }
  .aHero__href {
    font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
    font-size: 1.0625rem;
    letter-spacing: 0.001em;
    margin-right: 25px;
    margin-left: 25px; }
    @media only screen and (max-width: 767px) {
      .aHero__href {
        margin-right: 10px;
        margin-left: 10px;
        font-size: 0.875rem; } }
    .aHero__href:hover {
      color: #ffbc00; }
  .aHero__more {
    font-size: 0.875rem;
    letter-spacing: 0.075em;
    color: rgba(255, 255, 255, 0.8);
    cursor: pointer;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    bottom: 5vh;
    z-index: 11;
    text-transform: uppercase; }
    @media (max-width: 460px) {
      .aHero__more {
        bottom: 5vw; } }
  .aHero--white .aHero-heroName__href.white {
    display: block; }
  .aHero--black .aHero-heroName__href.black {
    display: block; }
  .aHero--black .aHero__href:hover {
    color: #ffbc00; }
  .aHero .swiper-pagination {
    text-align: right; }
  .aHero .swiper-pagination-bullet {
    width: 45px;
    height: 20px;
    border-radius: 0;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent; }
    .aHero .swiper-pagination-bullet > div {
      width: 45px;
      height: 3px;
      border-radius: 0;
      background: #fff; }
    .aHero .swiper-pagination-bullet-active {
      background-color: transparent; }
      .aHero .swiper-pagination-bullet-active > div {
        background: #fff; }
  .aHero .swiper-container-horizontal > .swiper-pagination-bullets {
    bottom: 5vh;
    padding-right: 75px; }
    @media only screen and (max-width: 767px) {
      .aHero .swiper-container-horizontal > .swiper-pagination-bullets {
        bottom: 1vh;
        padding-right: 30px; } }
    @media only screen and (max-width: 460px) {
      .aHero .swiper-container-horizontal > .swiper-pagination-bullets {
        bottom: 15vw;
        padding-right: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center; } }

.aMedia-li {
  width: 50%;
  margin-top: 38px;
  margin-bottom: 38px; }
  @media only screen and (max-width: 1400px) {
    .aMedia-li {
      width: 100%; } }
  @media only screen and (max-width: 767px) {
    .aMedia-li {
      margin-top: 19px;
      margin-bottom: 19px; } }
  .aMedia-li-more {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s; }
    .aMedia-li-more__icon {
      font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
      font-weight: bold;
      font-size: 0.875rem;
      letter-spacing: 0.025em;
      color: #fff; }
      .aMedia-li-more__icon span {
        vertical-align: middle; }
    .aMedia-li-more__click {
      width: 30px;
      height: 30px;
      border-radius: 50%;
      background-color: #ffbc00;
      display: inline-block;
      margin-right: 15px;
      position: relative; }
      .aMedia-li-more__click:after, .aMedia-li-more__click:before {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        background-color: #000; }
      .aMedia-li-more__click:after {
        width: 12px;
        height: 1px; }
      .aMedia-li-more__click:before {
        width: 1px;
        height: 12px; }
  .aMedia-li-left {
    width: 54.7945205%;
    position: relative; }
    @media only screen and (max-width: 767px) {
      .aMedia-li-left {
        width: 100%; } }
    .aMedia-li-left__img {
      padding-bottom: 66.25%;
      background-size: cover;
      background-position: center center; }
  .aMedia-li-right {
    width: 45.2054795%; }
    @media only screen and (max-width: 767px) {
      .aMedia-li-right {
        width: 100%; } }
  .aMedia-li:nth-child(4n-3) .graphic-txt--normal, .aMedia-li:nth-child(4n-2) .graphic-txt--normal {
    margin: 0;
    margin-left: 35px; }
    @media only screen and (max-width: 1500px) {
      .aMedia-li:nth-child(4n-3) .graphic-txt--normal, .aMedia-li:nth-child(4n-2) .graphic-txt--normal {
        text-align: right; } }
  .aMedia-li:nth-child(4n-3) .graphic-txt__date:after, .aMedia-li:nth-child(4n-2) .graphic-txt__date:after {
    right: 100%;
    margin-right: 16px; }
  @media only screen and (max-width: 1500px) {
    .aMedia-li:nth-child(4n-3) .graphic-txt__date, .aMedia-li:nth-child(4n-2) .graphic-txt__date {
      margin-right: 0; } }
  .aMedia-li:nth-child(4n-1) .aMedia__href, .aMedia-li:nth-child(4n) .aMedia__href {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse; }
  .aMedia-li:nth-child(4n-1) .graphic-txt__date:after, .aMedia-li:nth-child(4n) .graphic-txt__date:after {
    left: 100%;
    margin-left: 16px; }
    @media only screen and (max-width: 767px) {
      .aMedia-li:nth-child(4n-1) .graphic-txt__date:after, .aMedia-li:nth-child(4n) .graphic-txt__date:after {
        left: auto;
        margin-left: 0;
        right: 100%;
        margin-right: 16px; } }
  @media only screen and (max-width: 1500px) {
    .aMedia-li:nth-child(4n-1) .graphic-txt--normal, .aMedia-li:nth-child(4n) .graphic-txt--normal {
      text-align: left; } }
  @media only screen and (max-width: 767px) {
    .aMedia-li:nth-child(4n-1) .graphic-txt--normal, .aMedia-li:nth-child(4n) .graphic-txt--normal {
      text-align: right; } }
  @media only screen and (max-width: 1400px) {
    .aMedia-li:nth-child(4n-3) .aMedia__href, .aMedia-li:nth-child(4n-1) .aMedia__href {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row; }
    .aMedia-li:nth-child(4n-3) .graphic-txt--normal, .aMedia-li:nth-child(4n-1) .graphic-txt--normal {
      margin-right: 0;
      margin-left: 35px; } }
  @media only screen and (max-width: 1400px) and (max-width: 767px) {
    .aMedia-li:nth-child(4n-3) .graphic-txt--normal, .aMedia-li:nth-child(4n-1) .graphic-txt--normal {
      margin-left: 0; } }
  @media only screen and (max-width: 1400px) {
    .aMedia-li:nth-child(4n-2) .aMedia__href, .aMedia-li:nth-child(4n) .aMedia__href {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
      flex-direction: row-reverse; }
    .aMedia-li:nth-child(4n-2) .graphic-txt--normal, .aMedia-li:nth-child(4n) .graphic-txt--normal {
      margin-left: 0;
      margin-right: 35px; } }
  @media only screen and (max-width: 1400px) and (max-width: 767px) {
    .aMedia-li:nth-child(4n-2) .graphic-txt--normal, .aMedia-li:nth-child(4n) .graphic-txt--normal {
      margin-right: 0; } }

.aMedia__href {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-right: 35px;
  margin-left: 35px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }
  @media only screen and (max-width: 460px) {
    .aMedia__href {
      margin-right: 25px;
      margin-left: 25px; } }
  .aMedia__href:hover .aMedia-li-more {
    opacity: 1; }

.hProduct {
  position: relative;
  background-color: #292929;
  padding-top: 80px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }
  @media only screen and (max-width: 767px) {
    .hProduct {
      padding-top: 0; } }
  .hProduct-left {
    width: 58.854167%;
    padding-bottom: 51.235%;
    background-size: cover;
    background-position: center center;
    margin-bottom: 50px;
    position: relative; }
    @media only screen and (max-width: 1200px) {
      .hProduct-left {
        width: 50%; } }
    @media only screen and (max-width: 1024px) {
      .hProduct-left {
        width: 100%;
        padding-bottom: 0;
        height: 80vh; } }
    @media only screen and (max-width: 767px) {
      .hProduct-left {
        margin-bottom: 0; } }
    .hProduct-left .graphic-txt--slogan {
      max-width: 530px;
      position: absolute;
      top: 5%;
      left: 5%;
      right: auto; }
      @media (max-width: 767px) {
        .hProduct-left .graphic-txt--slogan {
          left: 0; } }
    .hProduct-left .graphic-txt--normal {
      position: absolute;
      max-width: 370px;
      bottom: 5%;
      right: 5%; }
      @media (max-width: 767px) {
        .hProduct-left .graphic-txt--normal {
          bottom: 0;
          right: 0; } }
  .hProduct-right {
    width: 41.145833%;
    margin-top: 50px;
    position: relative;
    z-index: 2; }
    @media only screen and (max-width: 1200px) {
      .hProduct-right {
        width: 50%; } }
    @media only screen and (max-width: 960px) {
      .hProduct-right {
        width: 100%; } }
    @media only screen and (max-width: 767px) {
      .hProduct-right {
        margin-top: 0; } }
    .hProduct-right .graphic-txtBlock {
      background-color: #fff;
      width: 50%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      @media only screen and (max-width: 767px) {
        .hProduct-right .graphic-txtBlock {
          width: 100%;
          -webkit-box-ordinal-group: 2;
          -ms-flex-order: 1;
          order: 1; } }
    @media only screen and (max-width: 767px) {
      .hProduct-right .graphic-img {
        width: 100%;
        -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
        order: 0; } }
    .hProduct-right .graphic--normal {
      max-width: 310px; }

.hArt {
  padding: 200px 0 140px 0;
  margin-top: -50px;
  position: relative; }
  @media only screen and (max-width: 767px) {
    .hArt {
      padding: 100px 0 60px 0; } }
  .hArt:after, .hArt:before {
    content: '';
    position: absolute;
    width: 50%;
    height: 100%;
    top: 0;
    z-index: 1; }
  .hArt:after {
    left: 0;
    background-color: #292929; }
  .hArt:before {
    right: 0;
    background-color: #222222;
    height: calc(100% + 50px); }
    @media (max-width: 700px) {
      .hArt:before {
        height: 100%; } }
  .hArt-container {
    max-width: 1440px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    width: 90%; }
  .hArt .graphic-txt--slogan {
    margin: 0 4vw; }
    @media only screen and (max-width: 767px) {
      .hArt .graphic-txt--slogan {
        margin: 0; } }
    .hArt .graphic-txt--slogan .graphic-txt__p {
      max-width: 480px; }
  .hArt-left {
    width: 63.54167%;
    overflow: hidden; }
    @media only screen and (max-width: 960px) {
      .hArt-left {
        width: 100%; } }
    .hArt-left--hover {
      padding-bottom: 52.46%;
      background-size: cover;
      background-position: center center;
      -webkit-transition: .5s ease;
      -o-transition: .5s ease;
      transition: .5s ease; }
  .hArt-right {
    width: 36.45833%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    @media only screen and (max-width: 960px) {
      .hArt-right {
        width: 100%; } }
    .hArt-right .graphic-txt--normal {
      text-align: right;
      max-width: 350px;
      margin-left: 4vw;
      margin-right: 4vw; }
      @media only screen and (max-width: 960px) {
        .hArt-right .graphic-txt--normal {
          max-width: none; } }
      @media only screen and (max-width: 767px) {
        .hArt-right .graphic-txt--normal {
          margin: 0; } }
    .hArt-right .graphic-txt__title, .hArt-right .graphic-txt__p {
      text-align: left; }
  .hArt-floor {
    margin-top: 60px;
    margin-bottom: 60px;
    position: relative;
    z-index: 2; }
    @media only screen and (max-width: 767px) {
      .hArt-floor {
        margin-top: 30px;
        margin-bottom: 30px; } }
    .hArt-floor__maskI {
      position: absolute;
      top: 50%;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
      z-index: -1;
      display: none;
      max-height: 100%; }
    .hArt-floor:after {
      display: none; }
    .hArt-floor:nth-child(odd):after {
      position: absolute;
      right: -100px;
      -webkit-transform: translateY(-75%);
      -ms-transform: translateY(-75%);
      transform: translateY(-75%);
      content: attr(attr-txt);
      font-size: 36.625rem;
      color: #282828;
      font-family: "Myriad Pro", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
      z-index: -1; }
    .hArt-floor:nth-child(odd) .hArt-floor__maskI {
      right: 0; }
    .hArt-floor:nth-child(even):after {
      position: absolute;
      left: -100px;
      -webkit-transform: translateY(-75%);
      -ms-transform: translateY(-75%);
      transform: translateY(-75%);
      content: attr(attr-txt);
      font-size: 36.625rem;
      color: #323232;
      font-family: "Myriad Pro", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
      z-index: -1; }
    .hArt-floor:nth-child(even) .hArt-block {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
      flex-direction: row-reverse; }
    .hArt-floor:nth-child(even) .hArt-floor__maskI {
      left: 0; }
  .hArt--hasTxt .hArt-floor:after {
    display: block; }
  .hArt--hasImg .hArt-floor__maskI {
    display: block; }
  .hArt-block {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 1440px;
    margin: 0 auto;
    width: 90%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
    .hArt-block:hover .hArt-left--hover {
      -webkit-transform: scale(1.2) rotate(0.02deg);
      -ms-transform: scale(1.2) rotate(0.02deg);
      transform: scale(1.2) rotate(0.02deg); }

.hAbout {
  height: 77.79vh;
  background-size: cover;
  background-position: 100% 100%;
  background-attachment: fixed;
  position: relative; }
  @media (max-width: 1024px) {
    .hAbout {
      background-attachment: scroll; } }
  .hAbout .graphic-container {
    max-width: 1440px;
    margin: 0 auto;
    position: relative;
    width: 90%;
    height: 100%; }
  .hAbout .graphic-txt {
    max-width: 610px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%); }
    .hAbout .graphic-txt--cl {
      left: 4vw; }
      @media (max-width: 700px) {
        .hAbout .graphic-txt--cl {
          left: 0; } }
    .hAbout .graphic-txt--cc {
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%); }
    .hAbout .graphic-txt--cr {
      right: 4vw; }

.hNews {
  position: relative; }
  .hNews:after {
    content: '';
    width: calc(50% - 60px);
    right: 60px;
    height: 40px;
    background-color: #dcdcdc;
    position: absolute; }
    @media only screen and (max-width: 767px) {
      .hNews:after {
        content: none; } }
  .hNews-container {
    width: calc(100% - 120px);
    margin-right: 60px;
    margin-left: 60px;
    background-color: #dcdcdc;
    padding-top: 120px; }
    @media only screen and (max-width: 767px) {
      .hNews-container {
        width: 90%;
        margin: 0 auto;
        padding-top: 15.64vw; } }
  .hNews-swiper {
    max-width: 1600px;
    margin: 0 auto;
    padding-bottom: 150px;
    display: none; }
    @media only screen and (max-width: 767px) {
      .hNews-swiper {
        padding-bottom: 70px; } }
    .hNews-swiper--in {
      display: block; }
  .hNews .aMedia {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
  .hNews .graphic-txt {
    letter-spacing: normal;
    margin-bottom: 40px; }
    @media only screen and (max-width: 460px) {
      .hNews .graphic-txt {
        margin-bottom: 0; } }
    .hNews .graphic-txt__title {
      margin-bottom: 3vh; }
    .hNews .graphic-txt__date {
      margin-right: 100px;
      position: relative; }
      @media only screen and (max-width: 767px) {
        .hNews .graphic-txt__date {
          margin-right: 0;
          margin-top: 5vw; } }
      .hNews .graphic-txt__date:after {
        content: '';
        position: absolute;
        width: 200px;
        height: 1px;
        background-color: #fff;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%); }
        @media only screen and (max-width: 1500px) {
          .hNews .graphic-txt__date:after {
            width: 5vw; } }
        @media only screen and (max-width: 767px) {
          .hNews .graphic-txt__date:after {
            width: 10vw; } }
    .hNews .graphic-txt--normal {
      padding: 30px 15px;
      text-align: right;
      max-width: 270px;
      margin: 0 auto; }
      @media only screen and (max-width: 1400px) {
        .hNews .graphic-txt--normal {
          max-width: none; } }
      .hNews .graphic-txt--normal .graphic-txt__title, .hNews .graphic-txt--normal .graphic-txt__p {
        text-align: left; }
      .hNews .graphic-txt--normal .graphic-txt__title {
        min-height: 81px;
        font-size: 1.125rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center; }
        @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
          .hNews .graphic-txt--normal .graphic-txt__title {
            display: table-cell;
            vertical-align: middle;
            padding-bottom: 1vh; } }
        @media only screen and (max-width: 767px) {
          .hNews .graphic-txt--normal .graphic-txt__title {
            min-height: auto; } }
    .hNews .graphic-txt__p {
      font-size: 0.875rem; }
  .hNews .swiper-pagination-bullet {
    width: 45px;
    height: 3px;
    border-radius: 0; }
    .hNews .swiper-pagination-bullet-active {
      background: #5d5d5d; }
  .hNews .swiper-container-horizontal > .swiper-pagination-bullets {
    bottom: 110px; }
    @media only screen and (max-width: 767px) {
      .hNews .swiper-container-horizontal > .swiper-pagination-bullets {
        bottom: 25px; } }

[data-page=support_main], [data-page=support_detail] {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline; }
  [data-page=support_main] ol, [data-page=support_main] ul, [data-page=support_detail] ol, [data-page=support_detail] ul {
    list-style: none; }
  [data-page=support_main] footer, [data-page=support_detail] footer {
    -webkit-transition: 1s;
    -o-transition: 1s;
    transition: 1s; }
  [data-page=support_main] .clear-fix, [data-page=support_detail] .clear-fix {
    clear: both; }
  [data-page=support_main] .select, [data-page=support_detail] .select {
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: calc(50% - 100px);
    margin: 50px; }
    @media only screen and (max-width: 767px) {
      [data-page=support_main] .select, [data-page=support_detail] .select {
        width: 100%;
        width: 90%; } }
  [data-page=support_main] main, [data-page=support_detail] main {
    padding-bottom: 200px; }
    [data-page=support_main] main .bannerScrollDwon, [data-page=support_detail] main .bannerScrollDwon {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      width: 30px;
      height: 30px;
      border: 1px solid white;
      border-radius: 50%;
      cursor: pointer;
      margin: 0 auto;
      -webkit-animation: fade-in 0.7s both 2s;
      animation: fade-in 0.7s both 2s;
      -webkit-animation-timing-function: ease-in-out;
      animation-timing-function: ease-in-out; }
      [data-page=support_main] main .bannerScrollDwon:after, [data-page=support_detail] main .bannerScrollDwon:after {
        color: #fff;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        content: "";
        display: block;
        width: 35%;
        height: 35%;
        border-right: 2px solid white;
        border-bottom: 2px solid white; }

.step {
  background-color: #343434;
  border-bottom: 2px solid #434343;
  position: relative;
  -webkit-transition: 1s;
  -o-transition: 1s;
  transition: 1s; }
  .step:after {
    content: '';
    position: absolute;
    width: 1px;
    height: 0px;
    background-color: #7d7d7d;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    top: -40px;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    z-index: 1; }
  .step-lists {
    list-style: none; }
  .step-container {
    max-width: 830px;
    width: 90%;
    margin: 0 auto;
    padding-top: 30px;
    padding-bottom: 55px;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s; }
  .step-title {
    text-align: center;
    letter-spacing: 0.001em;
    color: rgba(255, 255, 255, 0.4); }
  .step__num {
    border-radius: 20px;
    background-color: #7d7d7d;
    display: inline-block;
    font-size: 1.125rem;
    line-height: 35px;
    padding-left: 12px;
    padding-right: 12px;
    margin-bottom: 30px;
    font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
    font-weight: bold; }
  .step__title {
    font-size: 2.25rem;
    font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif; }
    @media only screen and (max-width: 592px) {
      .step__title {
        font-size: 1.8rem; } }
  .step__p {
    display: none;
    font-size: 0.9375rem;
    letter-spacing: 0.025em;
    font-family: 'Myriad Pro', '微軟正黑體', 'Microsoft JhengHei', Arial, sans-serif; }
  .step--active {
    background-color: #434343; }
    .step--active .step-container {
      padding-top: 60px;
      padding-bottom: 125px; }
    .step--active .step-list {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex; }
    .step--active .step-title {
      color: #fff; }
    .step--active .step__num {
      margin-bottom: 36px; }
    .step--active .step__title {
      margin-bottom: 12px; }
    .step--active .step__p {
      color: rgba(255, 255, 255, 0.9);
      display: block; }
    .step--active:after {
      height: 100px; }
  .step-list, .step-select {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: baseline;
    list-style: none; }
  .step-list {
    display: none;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -42px;
    margin-left: -42px;
    margin-top: 80px;
    margin-bottom: -35px; }
    @media only screen and (max-width: 960px) {
      .step-list {
        margin-right: 0;
        margin-left: 0; } }
    .step-list--search .step-list {
      display: none !important; }
    .step-list--search .select-again {
      opacity: 1 !important; }
  .step-select {
    width: calc(33.33333% - 84px);
    margin-right: 42px;
    margin-left: 42px;
    margin-bottom: 35px;
    border: 1px solid #fff;
    border-radius: 10px;
    padding: 44px 0;
    cursor: pointer;
    -webkit-transition: .5s ,opacity 1s;
    -o-transition: .5s ,opacity 1s;
    transition: .5s ,opacity 1s;
    opacity: 0;
    float: left; }
    @media only screen and (max-width: 960px) {
      .step-select {
        width: calc(33.33333% - 42px);
        margin-right: 21px;
        margin-left: 21px; } }
    @media only screen and (max-width: 767px) {
      .step-select {
        width: 100%;
        margin-right: 0;
        margin-left: 0; } }
    .step-select__title {
      position: relative;
      height: 80px;
      margin: 0 auto;
      margin-bottom: 20px;
      width: 80%;
      color: #fff;
      -webkit-transition: .5s;
      -o-transition: .5s;
      transition: .5s; }
      .step-select__title img {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        max-height: 80px;
        -webkit-transition: .5s;
        -o-transition: .5s;
        transition: .5s; }
        .step-select__title img:last-of-type {
          opacity: 0; }
      .step-select__title p {
        font-size: 3.125rem;
        text-align: center; }
    .step-select--onlyP {
      min-height: 80px;
      position: relative;
      padding: 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      max-height: 80px; }
      .step-select--onlyP .step-select__title {
        display: none; }
    .step-select--noImg .step-select__title img {
      display: none; }
    .step-select--noTitleP .step-select__title p {
      display: none; }
    .step-select__p {
      font-size: 1.25rem;
      color: #fff;
      text-align: center;
      -webkit-transition: .5s;
      -o-transition: .5s;
      transition: .5s;
      word-break: break-all;
      max-height: 60px;
      overflow: hidden;
      padding: 0 15px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      max-height: 60px; }
    .step-select:hover, .step-select--active {
      background-color: #ffbc00;
      border: 1px solid #ffbc00; }
      .step-select:hover .step-select__title, .step-select--active .step-select__title {
        color: #000; }
        .step-select:hover .step-select__title img:first-child, .step-select--active .step-select__title img:first-child {
          opacity: 0; }
        .step-select:hover .step-select__title img:last-of-type, .step-select--active .step-select__title img:last-of-type {
          opacity: 1; }
      .step-select:hover .step-select__p, .step-select--active .step-select__p {
        color: #000; }
  .step:first-child .step-list {
    opacity: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
  .step:first-child .step-select {
    opacity: 1; }
  .step:first-child:after {
    top: auto;
    bottom: -35px; }
  .step__reSelect {
    display: none;
    text-align: center;
    cursor: pointer;
    margin-top: 30px;
    color: #ffffff;
    font-size: 0.9375rem;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    font-family: 'Century Gothic', '微軟正黑體', 'Microsoft JhengHei', Arial, sans-serif; }
  .step--reSelect .step__reSelect {
    display: block;
    opacity: 0; }
  .step--search {
    background-color: #343434;
    border-bottom: 2px solid #434343;
    position: relative;
    display: none; }
  .step-mask {
    height: 140px;
    background-color: #434343; }

.select-container {
  background-color: #777777;
  padding: 0;
  padding-top: 100px;
  padding-bottom: 140px;
  position: relative;
  overflow: initial;
  display: none; }
  @media only screen and (max-width: 767px) {
    .select-container {
      padding-bottom: 0; } }
  .select-container:after {
    content: '';
    width: 1px;
    height: 100px;
    background-color: #fff;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    top: -40px;
    z-index: 1;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s; }
  .select-container--detail {
    display: block;
    padding-bottom: 50px; }
    .select-container--detail:after {
      content: none; }
    .select-container--detail .select {
      width: 90%;
      margin: 50px auto; }
      .select-container--detail .select-lists {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center; }
      .select-container--detail .select__subtitle {
        margin-bottom: 0; }

.select-lists {
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  max-width: 1600px;
  margin: 0 auto; }

.select__over {
  font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
  font-weight: bold;
  font-size: 2.25rem;
  letter-spacing: 0.01em;
  margin-bottom: 30px;
  color: #fff;
  text-align: center;
  width: 90%;
  margin: 0 auto; }

.select-again {
  font-family: "Myriad Pro", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
  font-size: 0.9375rem;
  letter-spacing: 0.025em;
  color: rgba(149, 196, 255, 0.9);
  margin-bottom: 20px;
  text-align: center;
  width: 90%;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; }
  .select-again:hover .select-again__title {
    color: #ffbc00; }
  .select-again:hover .select-again__icon {
    background-color: #ffbc00; }
  .select-again__icon {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: rgba(149, 196, 255, 0.9);
    color: #000;
    margin-left: 5px;
    display: none;
    line-height: 16px;
    text-align: center; }
  .select-again--notFind .select-again__icon {
    display: block; }

.select__img {
  max-width: 300px;
  min-height: 300px;
  position: relative;
  width: 80%;
  margin-bottom: 20px;
  margin-top: 20px; }
  @media only screen and (max-width: 767px) {
    .select__img {
      min-height: auto;
      position: static; } }
  .select__img img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    max-height: 300px; }
    @media only screen and (max-width: 767px) {
      .select__img img {
        position: static;
        max-height: none;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none; } }

.select__title {
  font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
  font-weight: bold;
  color: #fff;
  font-size: 1.375rem;
  margin-bottom: 10px; }

.select__subtitle {
  font-family: "CenturyGothic", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
  font-size: 0.9375rem;
  font-weight: normal;
  margin-bottom: 75px; }
  @media only screen and (max-width: 767px) {
    .select__subtitle {
      margin-bottom: 40px; } }

.select-hrefS {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 0;
  list-style: none; }
  @media only screen and (max-width: 767px) {
    .select-hrefS {
      display: none !important; } }

.select-href {
  margin-right: 12px;
  margin-left: 12px; }
  .select-href__href {
    font-family: "CenturyGothic", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
    font-size: 0.9375rem;
    color: #ffbc00;
    line-height: 40px;
    display: block;
    padding: 0 22px;
    border: 1px solid #ffbc00;
    border-radius: 20px;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    cursor: pointer;
    margin-top: 5px;
    margin-bottom: 5px; }
    .select-href__href:hover, .select-href__href--active {
      color: #000;
      background-color: #ffbc00; }

.select-inner {
  max-width: 1000px;
  margin: 0 auto;
  width: 90%; }
  .select-inner-container {
    background-color: #343434;
    padding-top: 90px;
    padding-bottom: 140px; }
  .select-inner__title {
    font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
    font-weight: bold;
    font-size: 1.875rem;
    color: #fff;
    margin-top: 80px;
    margin-bottom: 80px;
    text-align: center; }

.select-allList {
  border-top: 1px solid #717171; }
  .select-allList:not(:first-child) {
    display: none; }

.select-list {
  color: #fff;
  padding: 40px 30px;
  border-bottom: 1px solid #717171; }
  @media only screen and (max-width: 767px) {
    .select-list {
      padding: 40px 20px; } }
  .select-list-name {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .select-list__no {
    font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
    font-weight: bold;
    font-size: 1.125rem;
    margin-bottom: 15px; }
  .select-list__title {
    font-family: "CenturyGothic", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
    font-size: 1rem;
    font-weight: initial;
    margin-right: 20px; }
    @media only screen and (max-width: 960px) {
      .select-list__title {
        width: 100%;
        margin-right: 0; } }
  .select-list__open {
    margin-left: auto;
    cursor: pointer;
    position: relative;
    letter-spacing: 1px;
    padding-left: 24px; }
    @media only screen and (max-width: 960px) {
      .select-list__open {
        margin-left: 0;
        margin-top: 15px; } }
    .select-list__open:after, .select-list__open:before {
      content: '';
      position: absolute;
      top: 50%;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
      background-color: #95c4ff;
      left: 0; }
    .select-list__open:after {
      width: 2px;
      height: 12px;
      margin-left: 5px; }
    .select-list__open:before {
      width: 12px;
      height: 2px;
      margin-left: 0; }
  .select-list__href {
    width: 24px;
    height: 24px;
    margin-left: 36px;
    display: block; }
    @media only screen and (max-width: 960px) {
      .select-list__href {
        margin-top: 15px; } }
    .select-list__href img {
      width: 100%;
      height: 100%;
      display: block; }

.select-inLists {
  display: none; }

.select-inList {
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.7;
  margin-top: 40px;
  margin-bottom: 40px; }
  .select-inList__title {
    font-size: 0.9375rem; }
  .select-inList__p {
    font-size: 0.875rem; }

.select-hrefSRwd {
  font-family: "CenturyGothic", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
  font-size: 0.9375rem;
  max-width: 250px;
  margin: 0 auto;
  text-align: center;
  position: relative;
  display: none; }
  @media only screen and (max-width: 767px) {
    .select-hrefSRwd {
      display: block; } }
  .select-hrefSRwd--in .select-hrefSRwd__title {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    -webkit-transition: border-radius 0s;
    -o-transition: border-radius 0s;
    transition: border-radius 0s; }
    .select-hrefSRwd--in .select-hrefSRwd__title:after {
      -webkit-transform: translateY(-50%) rotate(180deg);
      -ms-transform: translateY(-50%) rotate(180deg);
      transform: translateY(-50%) rotate(180deg); }
  .select-hrefSRwd__title, .select-hrefSRwd__list {
    line-height: 40px;
    color: #ffbc00;
    cursor: pointer; }
  .select-hrefSRwd__title {
    border: 1px solid #ffbc00;
    background-color: #ffbc00;
    color: #000;
    position: relative;
    border-radius: 20px;
    -webkit-transition: border-radius .15s .4s;
    -o-transition: border-radius .15s .4s;
    transition: border-radius .15s .4s; }
    .select-hrefSRwd__title:after {
      content: '';
      position: absolute;
      border-right: 5px solid transparent;
      border-left: 5px solid transparent;
      border-top: 5px solid #000;
      top: 50%;
      right: 20px;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
      -webkit-transition: .5s;
      -o-transition: .5s;
      transition: .5s; }
  .select-hrefSRwd-lists {
    border: 1px solid #ffbc00;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
    border-top: 0;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 1;
    background-color: #343434;
    max-height: 200px;
    overflow: hidden;
    overflow-y: scroll;
    display: none; }

.arrow-close {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background-color: #95c4ff;
  margin: 0 auto;
  position: relative;
  cursor: pointer; }
  .arrow-close:after {
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(-45deg);
    -ms-transform: translate(-50%, -50%) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(-45deg);
    margin-left: 0;
    margin-top: 2px; }

.step-search {
  max-width: 750px;
  margin: 0 auto;
  margin-top: 75px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border: 1px solid #8e8e8e;
  border-radius: 12px;
  padding: 25px 30px;
  display: none;
  position: relative; }
  .step-search .select-again {
    position: absolute;
    bottom: -50px;
    opacity: 0;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s; }
    .step-search .select-again__icon {
      display: inline; }

.search__icon {
  min-width: 20px; }
  .search__icon img {
    vertical-align: text-bottom; }
    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
      .search__icon img {
        vertical-align: middle; } }

.search__input {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  border: none;
  outline: none;
  background-color: transparent;
  margin-left: 20px;
  margin-right: 20px;
  font-size: 1.25rem;
  font-family: "CenturyGothic", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
  color: #fff; }
  .search__input::-webkit-input-placeholder {
    color: rgba(255, 255, 255, 0.6); }
  .search__input:-moz-placeholder {
    color: rgba(255, 255, 255, 0.6); }
  .search__input::-moz-placeholder {
    color: rgba(255, 255, 255, 0.6); }
  .search__input:-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.6); }
  .search__input:focus::-webkit-input-placeholder {
    color: transparent; }
  .search__input:focus:-moz-placeholder {
    color: transparent; }
  .search__input:focus::-moz-placeholder {
    color: transparent; }
  .search__input:focus:-ms-input-placeholder {
    color: transparent; }

.search__arrow {
  width: 30px;
  height: 30px;
  position: relative;
  cursor: pointer;
  visibility: hidden; }
  .search__arrow:after {
    content: '';
    position: absolute;
    width: 25px;
    height: 2px;
    background-color: #fff;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%); }
  .search__arrow:before {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-left: 3px;
    margin-top: 4.5px; }

[data-page="product_lists"] .banner .scroll_down {
  display: none; }

@media (max-width: 767px) {
  [data-page="product_lists"] .banner {
    display: block; } }

[data-page="product_lists"] .product-container .title-area {
  margin: 0 auto;
  margin-top: 170px;
  margin-bottom: 50px;
  max-width: 1510px;
  width: 90%; }
  @media (max-width: 767px) {
    [data-page="product_lists"] .product-container .title-area {
      margin-top: 120px; } }

.product-lists {
  max-width: 1610px;
  margin: 0 auto;
  margin-bottom: 140px; }
  @media only screen and (max-width: 960px) {
    .product-lists {
      margin-bottom: 0; } }
  .product-lists--rwd .product-li--small, .product-lists--rwd .product-li--big {
    padding-bottom: 150px;
    max-height: 530px; }
  .product-lists--rwd .product-li--big {
    width: calc(33.33333% - 3px); }
    @media only screen and (max-width: 960px) {
      .product-lists--rwd .product-li--big {
        width: calc(50% - 3px); } }
    @media only screen and (max-width: 767px) {
      .product-lists--rwd .product-li--big {
        width: calc(100% - 3px); } }
    .product-lists--rwd .product-li--big .product-li__img {
      min-height: 265px; }
      .product-lists--rwd .product-li--big .product-li__img img {
        max-height: 180px; }
  .product-lists--rwd .product-li__more {
    position: static;
    background-color: transparent;
    visibility: visible;
    opacity: 1; }
  .product-lists--rwd .product-li__add {
    top: auto;
    bottom: 80px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    white-space: nowrap; }
  .product-lists--rwd .product-li__click {
    top: auto;
    bottom: 30px;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%); }

.product-li--size {
  width: 33.3333333%; }
  @media only screen and (max-width: 960px) {
    .product-li--size {
      width: 50%; } }
  @media only screen and (max-width: 767px) {
    .product-li--size {
      width: 100%; } }

.product-li--small {
  width: calc(33.33333% - 3px);
  padding-top: 80px;
  padding-bottom: 80px;
  margin: 1.5px;
  max-height: 460px; }
  @media only screen and (max-width: 960px) {
    .product-li--small {
      width: calc(50% - 3px); } }
  @media only screen and (max-width: 767px) {
    .product-li--small {
      width: calc(100% - 3px);
      padding-top: 30px; } }
  .product-li--small .product-li__img {
    padding-top: 60px;
    padding-bottom: 60px;
    min-height: 265px;
    position: relative; }
    .product-li--small .product-li__img img {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      max-height: 145px; }
    .product-li--small .product-li__img--right img {
      right: 0;
      left: auto;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%); }

.product-li--big {
  width: calc(66.66666% - 3px);
  margin: 1.5px;
  padding-top: 80px;
  padding-bottom: 80px;
  max-height: 923px; }
  @media only screen and (max-width: 960px) {
    .product-li--big {
      width: calc(50% - 3px);
      max-height: 460px; } }
  @media only screen and (max-width: 767px) {
    .product-li--big {
      width: calc(100% - 3px);
      padding-top: 30px; } }
  .product-li--big .product-li__img {
    padding-top: 60px;
    padding-bottom: 60px;
    min-height: 728.5px;
    position: relative; }
    @media only screen and (max-width: 960px) {
      .product-li--big .product-li__img {
        min-height: 265px; } }
    .product-li--big .product-li__img img {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      max-height: 608.5px; }
      @media only screen and (max-width: 960px) {
        .product-li--big .product-li__img img {
          max-height: 180px; } }
    .product-li--big .product-li__img--right img {
      right: 0;
      left: auto;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%); }
    .product-li--big .product-li__img--left img {
      right: auto;
      left: 0;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%); }
    .product-li--big .product-li__img--cetner img {
      right: auto;
      left: auto;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%); }
    .product-li--big .product-li__img--widthFull img {
      width: 100%;
      right: auto;
      left: auto;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%); }

.product-li__name {
  font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
  font-weight: bold;
  font-size: 1.5rem;
  letter-spacing: 0.01em;
  text-align: center; }

.product-li__add {
  position: absolute;
  top: 10px;
  left: 32px;
  font-size: 1rem;
  color: #fff;
  cursor: pointer;
  padding: 20px 30px;
  opacity: 0; }
  .product-li__add:after, .product-li__add:before {
    position: absolute;
    content: '';
    background-color: #ffbc00;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%); }
  .product-li__add:after {
    width: 14px;
    height: 2px;
    left: 0px; }
  .product-li__add:before {
    width: 2px;
    height: 14px;
    left: 6px; }
  .product-li__add:hover {
    color: #ffbc00; }
  .product-li__add--inItem {
    opacity: 1; }
  .product-li__add--cancel {
    visibility: hidden; }
    .product-li__add--cancel:before {
      content: none; }
  .product-li__add--in {
    visibility: visible;
    opacity: 1; }
  .product-li__add--out {
    visibility: hidden;
    opacity: 0; }

.product-li__tag {
  padding: 16px 25px;
  font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
  font-weight: bold;
  font-size: 1rem;
  letter-spacing: 0.025em;
  max-width: 305px;
  overflow: hidden;
  position: absolute;
  right: 0;
  top: 0; }

.product-li--noTag .product-li__tag {
  display: none; }

.product-li__more {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  visibility: hidden;
  opacity: 0;
  -webkit-transition: .5s;
  -o-transition: .5s;
  transition: .5s; }

.product-li__click {
  font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
  font-weight: bold;
  font-size: 0.9375rem;
  line-height: 50px;
  cursor: pointer;
  text-transform: uppercase;
  border-radius: 30px;
  background-color: #fff;
  display: inline-block;
  padding-left: 25px;
  padding-right: 25px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: .5s;
  -o-transition: .5s;
  transition: .5s; }
  .product-li__click:hover {
    background-color: #ffbc00; }

.product-li:hover .product-li__more {
  visibility: visible;
  opacity: 1; }

@-webkit-keyframes menu-bar-in {
  0% {
    top: -90px; }
  100% {
    top: 0; } }

@keyframes menu-bar-in {
  0% {
    top: -90px; }
  100% {
    top: 0; } }

.menu-bar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  max-width: 1340px;
  margin: -45px auto 0;
  background-color: #222222;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 1;
  width: 100%; }
  @media (max-width: 1340px) {
    .menu-bar {
      margin: 0 auto; } }
  .menu-bar .icon-menu, .menu-bar .icon-search {
    font-size: 1.25rem;
    color: #c7c7c7;
    margin-bottom: 12px; }
    @media only screen and (max-width: 767px) {
      .menu-bar .icon-menu, .menu-bar .icon-search {
        margin-bottom: 0; } }
  .menu-bar .nav-back {
    display: none;
    font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: bold; }
  .menu-bar--top {
    position: fixed;
    top: -90px;
    left: 0;
    right: 0;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    width: 100%;
    margin-top: 0;
    -webkit-animation: menu-bar-in 1s both;
    animation: menu-bar-in 1s both;
    max-width: 100%; }
    .menu-bar--top .nav-back {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex; }

.menu-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
  font-weight: bold;
  font-size: 1.125rem;
  letter-spacing: 0.025em;
  color: #fff;
  max-width: 1160px;
  margin: 0 auto; }
  @media only screen and (max-width: 960px) {
    .menu-list {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column; } }
  @media only screen and (max-width: 767px) {
    .menu-list {
      overflow: hidden; } }
  .menu-list__gutter {
    height: 20px;
    width: 1px;
    background-color: #656565;
    margin: 0;
    margin-left: 45px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    @media only screen and (max-width: 960px) {
      .menu-list__gutter {
        display: none; } }
  .menu-list__selected {
    white-space: nowrap;
    margin: 0 45px;
    margin-right: 20px;
    height: 90px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #ffbc00; }
    @media only screen and (max-width: 960px) {
      .menu-list__selected {
        margin-left: 90px;
        margin-right: 0; } }
    @media only screen and (max-width: 767px) {
      .menu-list__selected {
        height: 60px;
        margin-left: 60px; } }
    @media only screen and (max-width: 460px) {
      .menu-list__selected {
        margin-left: 10px;
        margin-right: 10px; } }
  .menu-list__more {
    min-width: 90px;
    height: 90px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer; }
    .menu-list__more span {
      width: 4px;
      height: 4px;
      background-color: #d3d3d3;
      border-radius: 50%;
      margin-right: 3px;
      margin-left: 3px; }
    @media only screen and (max-width: 767px) {
      .menu-list__more {
        height: 60px;
        min-width: 60px; } }
  .menu-list__p {
    min-width: 100px;
    text-align: center; }

.menu-icon, .menu-search {
  min-width: 90px;
  height: 90px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  background-color: #747474;
  cursor: pointer; }
  @media only screen and (max-width: 767px) {
    .menu-icon, .menu-search {
      min-width: 60px;
      height: 60px; } }
  .menu-icon .icon-menu, .menu-search .icon-menu {
    position: relative; }
  .menu-icon__p, .menu-search__p {
    font-size: 0.8125rem;
    letter-spacing: 0.025em;
    color: #fff; }
    @media only screen and (max-width: 767px) {
      .menu-icon__p, .menu-search__p {
        display: none; } }
  .menu-icon__num, .menu-search__num {
    min-width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #fff;
    color: #000;
    font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
    font-weight: bold;
    font-size: 1rem;
    line-height: 20px;
    text-align: center;
    position: absolute;
    right: -10px;
    top: -10px; }
  .menu-icon--select0 .menu-icon__num, .menu-search--select0 .menu-icon__num {
    display: none; }

.menu-search {
  margin-left: -1px; }

.menu-selects {
  width: 100%; }
  @media only screen and (max-width: 960px) {
    .menu-selects {
      position: absolute;
      top: 90px;
      left: 0;
      display: none; } }
  @media only screen and (max-width: 767px) {
    .menu-selects {
      top: 60px; } }

.menu-select {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  max-height: 90px;
  overflow: hidden;
  -webkit-transition: 1s ease;
  -o-transition: 1s ease;
  transition: 1s ease; }
  @media only screen and (max-width: 960px) {
    .menu-select {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      max-height: 450px;
      background-color: #222222;
      overflow-y: scroll; } }
  .menu-select__list {
    margin: 31.5px 24px;
    cursor: pointer;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    position: relative; }
    @media only screen and (max-width: 960px) {
      .menu-select__list {
        display: inline-block; } }
    .menu-select__list:after {
      content: '';
      width: 0%;
      height: 4px;
      background-color: #ffbc00;
      position: absolute;
      bottom: -10px;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%);
      -webkit-transition: .5s;
      -o-transition: .5s;
      transition: .5s; }
    .menu-select__list:hover, .menu-select__list--active {
      color: #ffbc00; }
      .menu-select__list:hover:after, .menu-select__list--active:after {
        width: 100%; }
  .menu-select--open {
    -webkit-transition: 1s ease;
    -o-transition: 1s ease;
    transition: 1s ease;
    max-height: 450px; }

.select-lb {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 999;
  display: none; }
  .select-lb__close {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0; }
  .select-lb-inner {
    max-width: 400px;
    margin: 0 auto;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-color: #fff;
    width: 90%; }
  .select-lb-txt {
    padding: 70px 35px; }
  .select-lb-ok {
    text-align: center;
    line-height: 45px;
    background-color: #000;
    color: #fff;
    cursor: pointer; }
  .select-lb__title {
    font-family: "CenturyGothic-Bold", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
    font-weight: bold;
    font-size: 1.875rem;
    letter-spacing: 0.01em;
    text-align: center;
    margin-bottom: 16px; }
  .select-lb__p {
    font-size: 1rem;
    letter-spacing: 0.01em; }

body[data-page="locations"].lock {
  position: fixed; }

body[data-page="locations"] section.section {
  color: white;
  padding: 0 20px; }
  body[data-page="locations"] section.section .content {
    display: none;
    width: 100%;
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto; }
    body[data-page="locations"] section.section .content.active {
      display: block; }

body[data-page="locations"] section#tabBox {
  background-color: #222222; }
  body[data-page="locations"] section#tabBox ul.tabeLists {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 30px;
    font-size: 1.125rem;
    font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
    body[data-page="locations"] section#tabBox ul.tabeLists li.tabeList {
      padding: 0 25px; }
      body[data-page="locations"] section#tabBox ul.tabeLists li.tabeList:not(:last-child) {
        border-right: 2px solid #343434; }
      body[data-page="locations"] section#tabBox ul.tabeLists li.tabeList.active > p {
        color: #ffbc00; }
      body[data-page="locations"] section#tabBox ul.tabeLists li.tabeList > p {
        cursor: pointer; }

body[data-page="locations"] section#contentBox {
  background-color: #343434;
  padding-bottom: 7.8125vw; }
  body[data-page="locations"] section#contentBox .titleBox {
    text-align: center;
    padding: 100px 0 40px 0; }
    body[data-page="locations"] section#contentBox .titleBox .title {
      font-size: 1.5rem; }
      body[data-page="locations"] section#contentBox .titleBox .title > strong {
        font-size: 2.25rem;
        font-weight: normal; }
  body[data-page="locations"] section#contentBox .selectBox {
    position: relative;
    font-family: "CenturyGothic", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    background-color: #ffbc00;
    max-width: 340px;
    color: #222222;
    text-align: center;
    border-radius: 25px;
    margin: 0 auto;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 9; }
    body[data-page="locations"] section#contentBox .selectBox.active:after {
      -webkit-transform: translateY(-50%) rotate(180deg);
      -ms-transform: translateY(-50%) rotate(180deg);
      transform: translateY(-50%) rotate(180deg); }
    body[data-page="locations"] section#contentBox .selectBox.active ul.select {
      opacity: 1; }
    body[data-page="locations"] section#contentBox .selectBox:after {
      content: "";
      position: absolute;
      top: 50%;
      right: 8%;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
      border-left: 5px solid transparent;
      border-top: 8px solid #222222;
      border-right: 5px solid transparent;
      border-bottom: 0px solid transparent;
      -webkit-transition: 0.8s;
      -o-transition: 0.8s;
      transition: 0.8s; }
    body[data-page="locations"] section#contentBox .selectBox .selectText {
      padding: 10px;
      text-align: center; }
    body[data-page="locations"] section#contentBox .selectBox ul.select {
      display: none;
      position: absolute;
      top: 110%;
      left: 0;
      width: 100%;
      border-radius: 20px;
      background-color: #e4e4e4;
      overflow: auto;
      opacity: 0;
      z-index: -1;
      -webkit-transition: opacity 0.3s 0.1s;
      -o-transition: opacity 0.3s 0.1s;
      transition: opacity 0.3s 0.1s;
      max-height: 300px;
      overflow-y: scroll;
      -webkit-overflow-style: none;
      -ms-overflow-style: -ms-autohiding-scrollbar; }
      body[data-page="locations"] section#contentBox .selectBox ul.select::-webkit-scrollbar {
        background-color: transparent;
        border-radius: 10px;
        width: 5px; }
      body[data-page="locations"] section#contentBox .selectBox ul.select::-webkit-scrollbar-thumb {
        width: 5px;
        background-color: #222222; }
      body[data-page="locations"] section#contentBox .selectBox ul.select::-webkit-scrollbar-track {
        background-color: rgba(34, 34, 34, 0.2); }
      body[data-page="locations"] section#contentBox .selectBox ul.select li.option {
        padding: 15px;
        cursor: pointer; }
        body[data-page="locations"] section#contentBox .selectBox ul.select li.option:hover {
          background-color: #ffbc00; }
  body[data-page="locations"] section#contentBox .domesticContent {
    margin-top: 60px; }
    body[data-page="locations"] section#contentBox .domesticContent .areaBox {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
      border-top: 5px solid #717171; }
      @media (max-width: 1200px) {
        body[data-page="locations"] section#contentBox .domesticContent .areaBox {
          display: block; } }
      body[data-page="locations"] section#contentBox .domesticContent .areaBox:last-child {
        border-bottom: 5px solid #717171; }
      body[data-page="locations"] section#contentBox .domesticContent .areaBox .areaName {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 15%;
        flex: 1 1 15%;
        font-size: 1.375rem;
        font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        text-align: center;
        padding: 25px 0; }
      body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 95%;
        flex: 1 1 95%; }
        body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          -webkit-box-pack: start;
          -ms-flex-pack: start;
          justify-content: flex-start;
          -webkit-box-align: stretch;
          -ms-flex-align: stretch;
          align-items: stretch; }
          body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list:not(:last-child) {
            border-bottom: 1px solid #717171; }
          body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyName, body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyInfo, body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyLink {
            padding: 30px 10px; }
          body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyName {
            -webkit-box-flex: 0;
            -ms-flex: 0 1 30%;
            flex: 0 1 30%;
            color: #dadada; }
          body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyInfo {
            -webkit-box-flex: 1;
            -ms-flex: 1 1 57.5%;
            flex: 1 1 57.5%; }
          body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyLink {
            -webkit-box-flex: 1;
            -ms-flex: 1 1 12.5%;
            flex: 1 1 12.5%; }
          body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyInfo .info span.infoTitle {
            display: inline-block;
            width: 65px;
            font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
          body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyInfo .info span.infoText {
            margin-left: 10px;
            color: #dadada; }
          body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyInfo .info:not(:last-child) {
            margin-bottom: 5px; }
          body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyLink {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-pack: end;
            -ms-flex-pack: end;
            justify-content: flex-end;
            padding: 0 20px; }
            @media (max-width: 1200px) {
              body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyLink {
                padding: 0 10px; } }
            body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyLink a {
              font-size: 1.125rem; }
              body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyLink a:not(:first-child) {
                margin-left: 20px; }
        @media (max-width: 1200px) {
          body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list {
            display: block;
            padding: 20px 0; }
            body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list:first-child {
              border-top: 5px solid #717171; }
            body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyName, body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyInfo, body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyLink {
              padding-top: 10px;
              padding-bottom: 10px; }
            body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyName {
              font-size: 1.25rem;
              font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
            body[data-page="locations"] section#contentBox .domesticContent .areaBox ul.dataLists li.list .companyLink {
              -webkit-box-pack: start;
              -ms-flex-pack: start;
              justify-content: flex-start; } }
  body[data-page="locations"] section#contentBox .foreignContent {
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 80px;
    margin-bottom: 80px; }
    @media (max-width: 1200px) {
      body[data-page="locations"] section#contentBox .foreignContent {
        width: 100%;
        max-width: 768px;
        margin-left: auto;
        margin-right: auto; } }
    @media (max-width: 768px) {
      body[data-page="locations"] section#contentBox .foreignContent {
        width: 100%;
        max-width: 420px;
        margin-left: auto;
        margin-right: auto; } }
    @media (max-width: 420px) {
      body[data-page="locations"] section#contentBox .foreignContent {
        width: 100%;
        max-width: 320px;
        margin-left: auto;
        margin-right: auto; } }
    body[data-page="locations"] section#contentBox .foreignContent .countryBox {
      width: calc(33.333% - 50px);
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
      margin: 40px 25px; }
      @media (max-width: 1200px) {
        body[data-page="locations"] section#contentBox .foreignContent .countryBox {
          -webkit-box-flex: 1;
          -ms-flex: 1 1 45%;
          flex: 1 1 45%;
          margin: 40px 10px; } }
      @media (max-width: 768px) {
        body[data-page="locations"] section#contentBox .foreignContent .countryBox {
          -webkit-box-flex: 1;
          -ms-flex: 1 1 100%;
          flex: 1 1 100%;
          margin: 15px 0; } }
      body[data-page="locations"] section#contentBox .foreignContent .countryBox .nationalFlag {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        border-radius: 50%;
        overflow: hidden; }
        @media (max-width: 320px) {
          body[data-page="locations"] section#contentBox .foreignContent .countryBox .nationalFlag {
            -webkit-box-flex: 0;
            -ms-flex: 0 0 40px;
            flex: 0 0 40px; } }
        body[data-page="locations"] section#contentBox .foreignContent .countryBox .nationalFlag img {
          width: 100%; }
      body[data-page="locations"] section#contentBox .foreignContent .countryBox .countryInfo {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        padding: 0 20px; }
        @media (max-width: 320px) {
          body[data-page="locations"] section#contentBox .foreignContent .countryBox .countryInfo {
            -webkit-box-flex: 1;
            -ms-flex: 1 0 auto;
            flex: 1 0 auto; } }
        body[data-page="locations"] section#contentBox .foreignContent .countryBox .countryInfo .countryName {
          font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
        body[data-page="locations"] section#contentBox .foreignContent .countryBox .countryInfo ul.websiteBox li.website .linkTitle {
          color: #95c4ff; }
          body[data-page="locations"] section#contentBox .foreignContent .countryBox .countryInfo ul.websiteBox li.website .linkTitle:before {
            content: "－";
            margin-right: 2.5px; }
        body[data-page="locations"] section#contentBox .foreignContent .countryBox .countryInfo ul.websiteBox li.website a.linkText {
          position: relative;
          word-break: break-all;
          font-size: 0.875rem;
          -webkit-transition: 0.5s;
          -o-transition: 0.5s;
          transition: 0.5s; }
          body[data-page="locations"] section#contentBox .foreignContent .countryBox .countryInfo ul.websiteBox li.website a.linkText:hover {
            color: #ffbc00; }

body[data-page="locations"] .lightBoxCover {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  z-index: 999; }
  body[data-page="locations"] .lightBoxCover .cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: rgba(34, 34, 34, 0.8); }
  body[data-page="locations"] .lightBoxCover .lightBox {
    position: relative;
    width: 1070px;
    max-height: 780px;
    height: 90%;
    background-color: white;
    padding: 60px 20px 20px 20px;
    background-color: #e4e4e4;
    overflow: auto; }
    body[data-page="locations"] .lightBoxCover .lightBox > .colseBtn {
      position: absolute;
      top: 30px;
      right: 30px;
      font-size: 2rem;
      color: #717171;
      cursor: pointer; }
    body[data-page="locations"] .lightBoxCover .lightBox > .title {
      font-size: 1.75rem;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      text-align: center; }
    body[data-page="locations"] .lightBoxCover .lightBox .arrow {
      position: absolute;
      top: 50%;
      cursor: pointer;
      z-index: 9; }
      body[data-page="locations"] .lightBoxCover .lightBox .arrow.left {
        left: 30px; }
        body[data-page="locations"] .lightBoxCover .lightBox .arrow.left .arrowBtn {
          -webkit-transform: rotate(135deg);
          -ms-transform: rotate(135deg);
          transform: rotate(135deg); }
      body[data-page="locations"] .lightBoxCover .lightBox .arrow.right {
        right: 30px; }
        body[data-page="locations"] .lightBoxCover .lightBox .arrow.right .arrowBtn {
          -webkit-transform: rotate(-45deg);
          -ms-transform: rotate(-45deg);
          transform: rotate(-45deg); }
      body[data-page="locations"] .lightBoxCover .lightBox .arrow .arrowBtn {
        width: 30px;
        height: 30px;
        border-bottom: 2px solid #717171;
        border-right: 2px solid #717171; }
    body[data-page="locations"] .lightBoxCover .lightBox .lightBoxSwiper {
      margin-top: 25px;
      text-align: center;
      overflow: hidden;
      max-height: 100vh; }
      body[data-page="locations"] .lightBoxCover .lightBox .lightBoxSwiper .swiper-wrapper {
        height: 100%; }
        body[data-page="locations"] .lightBoxCover .lightBox .lightBoxSwiper .swiper-wrapper .swiper-slide .imgBox {
          max-width: 850px;
          height: 570px;
          overflow: hidden;
          margin: 0 auto;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center; }
          @media (max-width: 768px) {
            body[data-page="locations"] .lightBoxCover .lightBox .lightBoxSwiper .swiper-wrapper .swiper-slide .imgBox {
              height: 50vh; } }
        body[data-page="locations"] .lightBoxCover .lightBox .lightBoxSwiper .swiper-wrapper .swiper-slide .description {
          font-size: 0.9375rem;
          width: 100%;
          max-width: 580px;
          margin: 0 auto;
          margin-top: 10px;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 2;
          overflow: hidden; }

@media (max-width: 1200px) {
  body[data-page="locations"] .lightBoxCover .lightBox {
    width: 768px; } }

@media (max-width: 768px) {
  body[data-page="locations"] .lightBoxCover .lightBox {
    width: 100%;
    height: 100%;
    max-height: 100%; } }

body[data-page="question"] {
  overflow-x: hidden; }
  body[data-page="question"].lock {
    position: fixed; }
  body[data-page="question"] section.section {
    color: white;
    padding: 0 20px; }
  body[data-page="question"] section#filterBox {
    position: relative;
    background-color: #222222;
    padding: 0px;
    overflow: visible; }
    body[data-page="question"] section#filterBox .content[data-class="filerBox"] {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: end;
      -ms-flex-pack: end;
      justify-content: flex-end;
      -webkit-box-align: stretch;
      -ms-flex-align: stretch;
      align-items: stretch;
      font-size: 1.125rem; }
      body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding: 30px 0; }
        @media (max-width: 1200px) {
          body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox {
            -webkit-box-flex: 1;
            -ms-flex: 1 1 auto;
            flex: 1 1 auto;
            padding: 43.5px 0; } }
        body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox .filerNow {
          color: #ffbc00;
          -webkit-user-select: none;
          -moz-user-select: none;
          -ms-user-select: none;
          user-select: none;
          padding: 0 30px;
          font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
          @media (max-width: 1200px) {
            body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox .filerNow {
              position: absolute;
              left: 50%;
              -webkit-transform: translate(-50%, 0);
              -ms-transform: translate(-50%, 0);
              transform: translate(-50%, 0); } }
          @media (max-width: 568px) {
            body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox .filerNow {
              width: 100%;
              text-align: right;
              padding-right: 180px; } }
          @media (max-width: 568px) {
            body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox .filerNow {
              font-size: 1rem; } }
        body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox ul.filters {
          position: relative;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          padding: 0 30px;
          border-left: 2px solid #343434;
          font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
          @media (max-width: 1200px) {
            body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox ul.filters {
              position: absolute;
              right: 80px;
              margin: 0;
              border-left: none; } }
          body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox ul.filters li {
            margin: 0 25px; }
          body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox ul.filters li:first-child {
            margin-left: 0; }
          body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox ul.filters li:last-child {
            margin-right: 0; }
          body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox ul.filters li.filterClass {
            position: relative;
            cursor: pointer; }
            body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox ul.filters li.filterClass:after {
              content: "";
              position: absolute;
              bottom: -10px;
              left: 50%;
              width: 0px;
              height: 4px;
              background-color: transpatent;
              -webkit-transition: all 0.5s, opacity 0s;
              -o-transition: all 0.5s, opacity 0s;
              transition: all 0.5s, opacity 0s;
              -webkit-transform: translateX(-50%);
              -ms-transform: translateX(-50%);
              transform: translateX(-50%); }
            body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox ul.filters li.filterClass:hover:after {
              width: 100%;
              background-color: #ffbc00; }
            @media (max-width: 1440px) {
              body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox ul.filters li.filterClass:nth-child(4) {
                display: none; } }
            @media (max-width: 1366px) {
              body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox ul.filters li.filterClass:nth-child(3) {
                display: none; } }
            @media (max-width: 1200px) {
              body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox ul.filters li.filterClass {
                display: none; } }
          body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox ul.filters li.moreBtn {
            width: 50px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center; }
            @media (max-width: 768px) {
              body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox ul.filters li.moreBtn {
                height: 50px;
                cursor: pointer; } }
            body[data-page="question"] section#filterBox .content[data-class="filerBox"] .mainBox ul.filters li.moreBtn span {
              display: inline-block;
              width: 4px;
              height: 4px;
              background-color: white;
              border-radius: 50%;
              margin-right: 3px;
              margin-left: 3px; }
      body[data-page="question"] section#filterBox .content[data-class="filerBox"] .searchBox {
        width: 24%;
        max-width: 445px;
        min-width: 250px;
        border-left: 2px solid #343434;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        padding: 0 30px; }
        @media (max-width: 1200px) {
          body[data-page="question"] section#filterBox .content[data-class="filerBox"] .searchBox {
            width: 90px;
            min-width: 90px;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center; } }
        body[data-page="question"] section#filterBox .content[data-class="filerBox"] .searchBox span.search, body[data-page="question"] section#filterBox .content[data-class="filerBox"] .searchBox span.searcharrow {
          font-size: 1.5rem;
          color: #989898; }
        body[data-page="question"] section#filterBox .content[data-class="filerBox"] .searchBox span.searcharrow {
          color: white;
          cursor: pointer; }
          @media (max-width: 1200px) {
            body[data-page="question"] section#filterBox .content[data-class="filerBox"] .searchBox span.searcharrow {
              display: none; } }
        body[data-page="question"] section#filterBox .content[data-class="filerBox"] .searchBox input {
          -webkit-box-flex: 1;
          -ms-flex: 1 1 auto;
          flex: 1 1 auto;
          max-width: 80%;
          margin-left: 10px;
          background-color: transparent;
          border: none;
          color: white;
          font-family: "CenturyGothic", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
          @media (max-width: 1200px) {
            body[data-page="question"] section#filterBox .content[data-class="filerBox"] .searchBox input {
              display: none; } }
    body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] {
      position: absolute;
      top: 100%;
      left: 0;
      width: 100%;
      background: rgba(82, 82, 82, 0.9);
      background: -webkit-gradient(linear, left top, left bottom, color-stop(10%, #525252), to(rgba(82, 82, 82, 0.9)));
      background: -webkit-linear-gradient(top, #525252 10%, rgba(82, 82, 82, 0.9) 100%);
      background: -o-linear-gradient(top, #525252 10%, rgba(82, 82, 82, 0.9) 100%);
      background: linear-gradient(top, #525252 10%, rgba(82, 82, 82, 0.9) 100%);
      z-index: 9;
      height: auto;
      overflow: auto; }
      @media (max-width: 1200px) {
        body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] {
          height: calc(100vh - 85px);
          max-height: calc(100vh - 85px); } }
      body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix {
        width: 100%;
        width: 100%;
        max-width: 1125px;
        margin-left: auto;
        margin-right: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-align: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        padding: 95px 0 40px 0; }
        @media (max-width: 1200px) {
          body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix {
            display: block;
            padding: 20px; } }
        body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .titleBox {
          -webkit-box-flex: 1;
          -ms-flex: 1 1 40%;
          flex: 1 1 40%; }
        body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .keywordBox {
          -webkit-box-flex: 1;
          -ms-flex: 1 1 60%;
          flex: 1 1 60%; }
        @media (max-width: 1200px) {
          body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .titleBox {
            text-align: center; } }
        body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .titleBox .title {
          font-size: 1.75rem;
          font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
        body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .titleBox .description {
          font-size: 1rem;
          margin-top: 35px; }
          @media (max-width: 1200px) {
            body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .titleBox .description {
              margin-top: 5px; } }
        body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .keywordBox {
          font-size: 1.125rem;
          font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
          padding: 0 50px; }
          body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .keywordBox ul.keywordList {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            -webkit-overflow-scrolling: touch; }
            @media (max-width: 768px) {
              body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .keywordBox ul.keywordList {
                margin-top: 50px; } }
            body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .keywordBox ul.keywordList li.keyword {
              -webkit-box-flex: 1;
              -ms-flex: 1 1 50%;
              flex: 1 1 50%;
              position: relative;
              margin-bottom: 25px;
              cursor: pointer;
              -webkit-transition: 0.5s;
              -o-transition: 0.5s;
              transition: 0.5s; }
              body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .keywordBox ul.keywordList li.keyword:hover {
                color: #ffbc00; }
        @media (max-width: 1200px) {
          body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .keywordBox {
            margin-top: 20px;
            padding: 0; }
            body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .keywordBox ul.keywordList {
              -webkit-box-pack: justify;
              -ms-flex-pack: justify;
              justify-content: space-between; }
              body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .keywordBox ul.keywordList li.keyword {
                -webkit-box-flex: 0;
                -ms-flex: 0 0 40%;
                flex: 0 0 40%; } }
    @media (max-width: 1200px) and (min-width: 769px) and (max-width: 1200px) {
      body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .keywordBox ul.keywordList {
        width: 100%;
        max-width: 700px;
        margin-left: auto;
        margin-right: auto; }
        body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .keywordBox ul.keywordList li.keyword:nth-child(2n+1) {
          margin-left: 70px; } }
        @media (max-width: 768px) {
          body[data-page="question"] section#filterBox .content[data-class="filerBox-more"] .widthFix .keywordBox ul.keywordList li.keyword {
            -webkit-box-flex: 1;
            -ms-flex: 1 1 100%;
            flex: 1 1 100%;
            text-align: center; } }
    body[data-page="question"] section#filterBox .content[data-class="searchBox-mobile"] {
      position: absolute;
      top: 100%;
      left: 0;
      width: 100%;
      background: rgba(82, 82, 82, 0.9);
      background: -webkit-gradient(linear, left top, left bottom, color-stop(10%, #525252), to(rgba(82, 82, 82, 0.9)));
      background: -webkit-linear-gradient(top, #525252 10%, rgba(82, 82, 82, 0.9) 100%);
      background: -o-linear-gradient(top, #525252 10%, rgba(82, 82, 82, 0.9) 100%);
      background: linear-gradient(top, #525252 10%, rgba(82, 82, 82, 0.9) 100%);
      z-index: 9;
      height: auto; }
      body[data-page="question"] section#filterBox .content[data-class="searchBox-mobile"] .widthFix {
        width: 100%;
        width: 100%;
        max-width: 1125px;
        margin-left: auto;
        margin-right: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-align: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        padding: 20px 30px 20px 0; }
        body[data-page="question"] section#filterBox .content[data-class="searchBox-mobile"] .widthFix input[name="search-mobile"] {
          width: 90%;
          margin-left: 10px;
          background-color: transparent;
          border: none;
          color: white;
          font-family: "CenturyGothic", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
          padding: 10px; }
        body[data-page="question"] section#filterBox .content[data-class="searchBox-mobile"] .widthFix span.searcharrow {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          font-size: 1.5rem;
          color: #989898;
          color: white; }
  body[data-page="question"] section#contentBox {
    background-color: #343434;
    padding-bottom: 310px; }
    @media (max-width: 768px) {
      body[data-page="question"] section#contentBox {
        padding-bottom: 120px; } }
    body[data-page="question"] section#contentBox .content {
      width: 100%;
      max-width: 1125px;
      margin-left: auto;
      margin-right: auto; }
    body[data-page="question"] section#contentBox .titleBox {
      text-align: center;
      padding: 100px 0 40px 0; }
      body[data-page="question"] section#contentBox .titleBox .title {
        font-size: 2.25rem;
        font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        font-weight: bold; }
      body[data-page="question"] section#contentBox .titleBox .description {
        margin-top: 25px; }
        body[data-page="question"] section#contentBox .titleBox .description span.keyword {
          font-size: 1.375rem;
          font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
          font-weight: bold;
          color: #ffbc00; }
    body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList {
      border: 1px solid #989898;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
      body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar, body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent {
        position: relative;
        padding: 40px 40px 40px 200px; }
      body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        font-size: 1.25rem;
        padding-left: 20px; }
        body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .question {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          width: 100%;
          -webkit-box-pack: start;
          -ms-flex-pack: start;
          justify-content: flex-start; }
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .question:before {
            -webkit-box-flex: 0;
            -ms-flex: 0 0 auto;
            flex: 0 0 auto;
            content: attr(data-question);
            display: block;
            width: 170px;
            text-align: center;
            color: #989898; }
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .question .questionTitle {
            -webkit-box-flex: 1;
            -ms-flex: 1 1 auto;
            flex: 1 1 auto;
            padding-right: 40px; }
            body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .question .questionTitle span.keyword {
              background-color: #ffbc00;
              color: #222222;
              padding: 0 2px; }
            @media (max-width: 768px) {
              body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .question .questionTitle {
                margin-top: 10px;
                padding: 0; } }
        @media (max-width: 768px) {
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .question {
            display: block;
            margin-left: 45px; } }
  @media (max-width: 768px) and (max-width: 768px) {
    body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .question {
      margin-left: 20px; } }
        @media (max-width: 768px) {
            body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .question:before {
              width: auto;
              text-align: left; } }
        body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .detailBtn {
          position: relative;
          width: 30px;
          height: 30px;
          cursor: pointer;
          -webkit-transition: 0.5s;
          -o-transition: 0.5s;
          transition: 0.5s; }
          @media (max-width: 768px) {
            body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .detailBtn {
              position: absolute;
              top: 40px;
              right: 40px; } }
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .detailBtn:before, body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .detailBtn:after {
            content: '';
            display: block;
            position: absolute;
            top: 50%;
            left: 50%;
            width: 18px;
            height: 4px;
            background-color: #95c4ff;
            -webkit-transition: 0.5s;
            -o-transition: 0.5s;
            transition: 0.5s; }
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .detailBtn:before {
            -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%); }
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .detailBtn:after {
            -webkit-transform: translate(-50%, -50%) rotate(90deg);
            -ms-transform: translate(-50%, -50%) rotate(90deg);
            transform: translate(-50%, -50%) rotate(90deg); }
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .detailBtn:hover {
            -webkit-transform: rotate(-180deg);
            -ms-transform: rotate(-180deg);
            transform: rotate(-180deg); }
            body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .detailBtn:hover:before, body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionBar .detailBtn:hover:after {
              background-color: #ffbc00; }
      body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent {
        padding-bottom: 60px;
        padding-right: 160px;
        color: #c5c5c5; }
        @media (max-width: 1024px) {
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent {
            padding: 20px 45px 60px 60px; } }
        @media (max-width: 768px) {
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent {
            padding: 0px 30px 60px 30px; } }
        body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent p {
          margin: 35px 0; }
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent p:first-of-type {
            margin-top: 0; }
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent p:last-of-type {
            margin-bottom: 0; }
        body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent .downloadBox {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          -webkit-box-pack: start;
          -ms-flex-pack: start;
          justify-content: flex-start;
          -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
        body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent a[download] {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          position: relative;
          display: flex;
          margin-top: 35px;
          border: none;
          background-color: #ffbc00;
          padding: 15px 20px;
          font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
          color: #222222;
          cursor: pointer;
          -webkit-transition: 0.5s;
          -o-transition: 0.5s;
          transition: 0.5s; }
          @media (min-width: 768px) {
            body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent a[download]:hover {
              -webkit-transform: translateX(5px);
              -ms-transform: translateX(5px);
              transform: translateX(5px); } }
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent a[download]:first-of-type {
            margin-right: 10px; }
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent a[download] span {
            font-weight: bold;
            margin-right: 5px; }
            @media (max-width: 420px) {
              body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent a[download] span {
                -webkit-box-flex: 0;
                -ms-flex: 0 0 auto;
                flex: 0 0 auto;
                font-size: 1.5rem; } }
        body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent a:not([download]) {
          position: relative;
          display: inline-block;
          color: #ffbc00;
          text-decoration: underline;
          -webkit-transition: color 0.5s;
          -o-transition: color 0.5s;
          transition: color 0.5s;
          z-index: 1; }
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent a:not([download]):before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            width: 0;
            height: 100%;
            -webkit-transition: 0.5s;
            -o-transition: 0.5s;
            transition: 0.5s;
            z-index: -1; }
          body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent a:not([download]):hover {
            color: #222222; }
            body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList .questionContent a:not([download]):hover:before {
              width: 100%;
              background-color: #ffbc00; }
    body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList.active {
      background-color: rgba(255, 255, 255, 0.1);
      border: 1px solid white; }
      body[data-page="question"] section#contentBox .questionBox ul.questions li.questionsList.active .detailBtn:after {
        width: 0px; }

body[data-page="warranty"] main section.section, body[data-page="warranty"] main section.titleBox {
  color: white;
  padding: 0 40px;
  background-color: #343434; }
  @media (max-width: 420px) {
    body[data-page="warranty"] main section.section, body[data-page="warranty"] main section.titleBox {
      padding: 0 20px; } }

body[data-page="warranty"] main section.titleBox {
  position: relative;
  background-color: #343434;
  padding: 0px; }
  body[data-page="warranty"] main section.titleBox .content {
    font-size: 1.125rem;
    font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
    body[data-page="warranty"] main section.titleBox .content .titleBox {
      text-align: center;
      padding: 100px 0 40px 0; }
      @media (max-width: 420px) {
        body[data-page="warranty"] main section.titleBox .content .titleBox {
          padding: 60px 0 30px 0; } }
      body[data-page="warranty"] main section.titleBox .content .titleBox .title {
        font-size: 2.25rem;
        font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
      body[data-page="warranty"] main section.titleBox .content .titleBox .description {
        margin-top: 25px; }
    body[data-page="warranty"] main section.titleBox .content ul.sectionBox {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      padding: 10px 0; }
      @media (max-width: 420px) {
        body[data-page="warranty"] main section.titleBox .content ul.sectionBox {
          font-size: 1rem; } }
      body[data-page="warranty"] main section.titleBox .content ul.sectionBox li.sectionTitle {
        position: relative;
        margin: 0 30px;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none; }
        @media (max-width: 667px) {
          body[data-page="warranty"] main section.titleBox .content ul.sectionBox li.sectionTitle {
            margin: 0 20px; } }
        body[data-page="warranty"] main section.titleBox .content ul.sectionBox li.sectionTitle:after {
          content: "";
          position: absolute;
          bottom: -8px;
          left: 50%;
          -webkit-transform: translateX(-50%);
          -ms-transform: translateX(-50%);
          transform: translateX(-50%);
          height: 4px;
          width: 0%;
          background-color: #ffbc00;
          -webkit-transition: 0.5s;
          -o-transition: 0.5s;
          transition: 0.5s; }
        body[data-page="warranty"] main section.titleBox .content ul.sectionBox li.sectionTitle:not(:first-child):before {
          content: "";
          position: absolute;
          top: 50%;
          left: -30px;
          -webkit-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
          transform: translateY(-50%);
          height: 60%;
          width: 1px;
          background-color: #717171; }
          @media (max-width: 667px) {
            body[data-page="warranty"] main section.titleBox .content ul.sectionBox li.sectionTitle:not(:first-child):before {
              left: -20px; } }
        body[data-page="warranty"] main section.titleBox .content ul.sectionBox li.sectionTitle:hover:after, body[data-page="warranty"] main section.titleBox .content ul.sectionBox li.sectionTitle.active:after {
          width: 100%; }

body[data-page="warranty"] main section#warrantyService, body[data-page="warranty"] main section#maintanceForm {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; }
  body[data-page="warranty"] main section#warrantyService .content .titleBox, body[data-page="warranty"] main section#maintanceForm .content .titleBox {
    text-align: center; }
    body[data-page="warranty"] main section#warrantyService .content .titleBox .title, body[data-page="warranty"] main section#maintanceForm .content .titleBox .title {
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-size: 1.875rem; }
    body[data-page="warranty"] main section#warrantyService .content .titleBox .description, body[data-page="warranty"] main section#maintanceForm .content .titleBox .description {
      font-size: 0.9375rem; }

body[data-page="warranty"] main section#warrantyService {
  padding-top: 90px;
  padding-bottom: 90px; }
  @media (max-width: 420px) {
    body[data-page="warranty"] main section#warrantyService {
      padding-top: 45px;
      padding-bottom: 45px; } }
  body[data-page="warranty"] main section#warrantyService .content {
    width: 100%;
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
    padding: 70px 120px 95px 120px;
    border: 1px solid #c7c7c7; }
    @media (max-width: 1200px) {
      body[data-page="warranty"] main section#warrantyService .content {
        padding: 100px; } }
    @media (max-width: 1024px) {
      body[data-page="warranty"] main section#warrantyService .content {
        padding: 60px; } }
    @media (max-width: 667px) {
      body[data-page="warranty"] main section#warrantyService .content {
        padding: 40px; } }
    @media (max-width: 420px) {
      body[data-page="warranty"] main section#warrantyService .content {
        padding: 20px; } }
    body[data-page="warranty"] main section#warrantyService .content .contentBox {
      margin-top: 60px; }
      body[data-page="warranty"] main section#warrantyService .content .contentBox h3 {
        margin: 1.125rem 0; }
      body[data-page="warranty"] main section#warrantyService .content .contentBox p, body[data-page="warranty"] main section#warrantyService .content .contentBox ul {
        color: #c7c7c7;
        margin: 1rem 0 3.5rem 0;
        font-size: 0.9375rem; }
        body[data-page="warranty"] main section#warrantyService .content .contentBox p:last-of-type, body[data-page="warranty"] main section#warrantyService .content .contentBox ul:last-of-type {
          margin-bottom: 0; }
      body[data-page="warranty"] main section#warrantyService .content .contentBox ul {
        list-style-type: disc;
        list-style-position: inside;
        padding: 0; }
        @media (max-width: 420px) {
          body[data-page="warranty"] main section#warrantyService .content .contentBox ul {
            list-style-position: outside;
            padding: 0 0 0 1.125rem; } }

body[data-page="warranty"] main section#maintanceForm {
  padding-top: 135px;
  padding-bottom: 135px; }
  body[data-page="warranty"] main section#maintanceForm .content {
    width: 100%;
    max-width: 820px;
    margin-left: auto;
    margin-right: auto; }
    body[data-page="warranty"] main section#maintanceForm .content .titleBox .description {
      text-align: left;
      margin-top: 45px; }
    body[data-page="warranty"] main section#maintanceForm .content .contentBox {
      padding: 50px 0; }
      body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        font-size: 0.9375rem; }
        @media (max-width: 768px) {
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup {
            display: block; } }
        body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList {
          position: relative;
          -webkit-box-flex: 1;
          -ms-flex: 1 1 0px;
          flex: 1 1 0;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          -webkit-box-align: stretch;
          -ms-flex-align: stretch;
          align-items: stretch;
          padding: 25px 15px;
          border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
          @media (max-width: 768px) {
            body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList {
              display: block; } }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList:after {
            content: "";
            position: absolute;
            top: 100%;
            left: 0;
            width: 0;
            height: 1px;
            background-color: white;
            -webkit-transition: 0.5s;
            -o-transition: 0.5s;
            transition: 0.5s; }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList:not(:first-child) {
            margin-left: 10px; }
            @media (max-width: 768px) {
              body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList:not(:first-child) {
                margin: 0; } }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList label.listTitie {
            -webkit-box-flex: 0;
            -ms-flex: 0 0 auto;
            flex: 0 0 auto;
            font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList label.listTitie + input.listInput, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList label.listTitie + .input.listInput, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList label.listTitie + textarea {
            margin-left: 10px; }
            @media (max-width: 768px) {
              body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList label.listTitie + input.listInput, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList label.listTitie + .input.listInput, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList label.listTitie + textarea {
                margin: 0;
                margin-top: 10px; } }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList input.listInput, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList .input.listInput, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList textarea {
            -webkit-box-flex: 1;
            -ms-flex: 1 1 auto;
            flex: 1 1 auto;
            background-color: transparent;
            border: none;
            color: white;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            padding: 1px 0; }
            body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList input.listInput::-webkit-input-placeholder, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList .input.listInput::-webkit-input-placeholder, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList textarea::-webkit-input-placeholder {
              font-size: 0.875rem;
              color: #cccccc; }
            body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList input.listInput:-ms-input-placeholder, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList .input.listInput:-ms-input-placeholder, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList textarea:-ms-input-placeholder {
              font-size: 0.875rem;
              color: #cccccc; }
            body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList input.listInput::-ms-input-placeholder, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList .input.listInput::-ms-input-placeholder, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList textarea::-ms-input-placeholder {
              font-size: 0.875rem;
              color: #cccccc; }
            body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList input.listInput::placeholder, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList .input.listInput::placeholder, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList textarea::placeholder {
              font-size: 0.875rem;
              color: #cccccc; }
            @media (max-width: 768px) {
              body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList input.listInput, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList .input.listInput, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList textarea {
                margin: 0;
                margin-top: 10px;
                width: 100%; } }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList .input.listInput {
            color: #cccccc; }
            body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList .input.listInput.isInput {
              color: white; }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList textarea {
            min-height: 200px;
            resize: none; }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList ul.selector {
            position: absolute;
            top: 100%;
            left: 0;
            background-color: #cacaca;
            width: 100%;
            text-align: center;
            color: #222222;
            max-height: 300px;
            z-index: 9;
            overflow-y: scroll;
            -webkit-overflow-style: none;
            display: none; }
            body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList ul.selector::-webkit-scrollbar {
              background-color: transparent;
              width: 5px; }
            body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList ul.selector::-webkit-scrollbar-thumb {
              width: 5px;
              background-color: #222222; }
            body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList ul.selector::-webkit-scrollbar-track {
              background-color: rgba(34, 34, 34, 0.2); }
            body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList ul.selector li.option {
              padding: 15px 10px;
              border-bottom: 1px solid rgba(255, 255, 255, 0.8);
              cursor: pointer; }
              body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList ul.selector li.option:hover {
                background-color: #222222;
                border-bottom: 1px solid transparent;
                color: white; }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList .input[data-input="selector"] {
            position: relative;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
            cursor: pointer; }
            body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList .input[data-input="selector"]:after {
              content: "";
              position: absolute;
              top: 50%;
              right: 2.5%;
              -webkit-transform: translateY(-50%);
              -ms-transform: translateY(-50%);
              transform: translateY(-50%);
              border-left: 4.242px solid transparent;
              border-top: 6px solid white;
              border-right: 4.242px solid transparent;
              border-bottom: 0px solid transparent; }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList.required:before {
            content: '*';
            position: absolute;
            top: 25px;
            left: -2.5px; }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList:focus-within:after {
            width: 100%; }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox {
            position: relative;
            width: 1.5625rem;
            height: 1.5625rem;
            margin-left: 10px;
            top: 1.25px; }
            @media (max-width: 768px) {
              body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox {
                position: absolute;
                top: 50%;
                right: 10px;
                -webkit-transform: translateY(-50%);
                -ms-transform: translateY(-50%);
                transform: translateY(-50%); } }
            body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox span.questionBtn {
              display: -webkit-box;
              display: -ms-flexbox;
              display: flex;
              -webkit-box-pack: center;
              -ms-flex-pack: center;
              justify-content: center;
              -webkit-box-align: center;
              -ms-flex-align: center;
              align-items: center;
              position: absolute;
              top: 50%;
              left: 50%;
              -webkit-transform: translate(-50%, -50%);
              -ms-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
              width: 80%;
              height: 80%;
              font-family: 微軟正黑體;
              font-size: 0.75rem;
              border-radius: 50%;
              border: 1px solid white;
              -webkit-user-select: none;
              -moz-user-select: none;
              -ms-user-select: none;
              user-select: none;
              cursor: pointer;
              -webkit-transition: 0.5s;
              -o-transition: 0.5s;
              transition: 0.5s; }
              body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox span.questionBtn:hover {
                border-color: rgba(255, 255, 255, 0.5);
                background-color: rgba(255, 255, 255, 0.5);
                color: #222222; }
            body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox.active span.questionBtn {
              border-color: white;
              background-color: white;
              color: #222222; }
            body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent {
              position: absolute;
              bottom: 45px;
              right: 50%;
              -webkit-transform: translateX(50%);
              -ms-transform: translateX(50%);
              transform: translateX(50%);
              background-color: white;
              color: #222222;
              padding: 75px 50px;
              width: 90vw;
              max-width: 430px;
              display: none; }
              @media (max-width: 1366px) {
                body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent {
                  right: 8.5%;
                  -webkit-transform: translateX(8.5%);
                  -ms-transform: translateX(8.5%);
                  transform: translateX(8.5%); } }
              @media (max-width: 768px) {
                body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent {
                  right: 4%;
                  -webkit-transform: translateX(4%);
                  -ms-transform: translateX(4%);
                  transform: translateX(4%); } }
              @media (max-width: 667px) {
                body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent {
                  right: 0;
                  -webkit-transform: translateX(3.5%);
                  -ms-transform: translateX(3.5%);
                  transform: translateX(3.5%); } }
              body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent .tipTitle {
                font-size: 1.125rem;
                font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
                width: 100%; }
              body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent .tipDescription {
                font-size: 1rem;
                margin-top: 16px;
                font-family: "CenturyGothic", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
                width: 100%; }
                body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent .tipDescription > a {
                  position: relative;
                  font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
                  -webkit-transition: 0.5s;
                  -o-transition: 0.5s;
                  transition: 0.5s; }
                  body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent .tipDescription > a:after {
                    content: "";
                    position: absolute;
                    bottom: -4px;
                    left: 0;
                    width: 100%;
                    height: 4px;
                    background-color: #222222;
                    -webkit-transition: 0.5s;
                    -o-transition: 0.5s;
                    transition: 0.5s; }
                  body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent .tipDescription > a:hover {
                    color: #ffbc00; }
                    body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent .tipDescription > a:hover:after {
                      background-color: #ffbc00; }
              body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent span.icon-cross {
                position: absolute;
                top: 30px;
                right: 30px;
                font-size: 1.5rem;
                color: #989898;
                cursor: pointer; }
              body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent:after {
                content: "";
                position: absolute;
                bottom: -10px;
                left: 50%;
                -webkit-transform: translateX(-50%);
                -ms-transform: translateX(-50%);
                transform: translateX(-50%);
                border-left: 7.77px solid transparent;
                border-top: 11px solid white;
                border-right: 7.77px solid transparent;
                border-bottom: 0px solid transparent; }
                @media (max-width: 1366px) {
                  body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent:after {
                    left: 88.8%; } }
                @media (max-width: 768px) {
                  body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent:after {
                    left: 93.2%; } }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList .verification {
            margin: 0 0 0 10px;
            cursor: pointer; }
            @media (max-width: 768px) {
              body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup .formList .verification {
                margin: 10px 0 0 0; } }
      body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formBtn {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding-top: 50px; }
        body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formBtn button {
          -webkit-box-flex: 1;
          -ms-flex: 1 1 auto;
          flex: 1 1 auto;
          margin: 0 10px;
          padding: 12px;
          background: none;
          border: none;
          border: 1px solid white;
          border-radius: 50px;
          max-width: 170px;
          width: 100%;
          font-size: 0.9375rem;
          font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
          color: white;
          cursor: pointer;
          -webkit-transition: 0.5s;
          -o-transition: 0.5s;
          transition: 0.5s; }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formBtn button:hover {
            background-color: rgba(255, 255, 255, 0.5); }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formBtn button:active, body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formBtn button.submit {
            color: #222222;
            background-color: white; }
          body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formBtn button:active {
            -webkit-transform: scale(0.95);
            -ms-transform: scale(0.95);
            transform: scale(0.95); }
      body[data-page="warranty"] main section#maintanceForm .content .contentBox form#maintance .formGroup.association .formList {
        margin: 0; }

body[data-page="warranty"] footer {
  background-color: transparent !important;
  margin: 0;
  padding: 0;
  overflow: visible;
  z-index: 1; }

body[data-page="contact"] {
  overflow-x: hidden; }
  body[data-page="contact"] main {
    color: white;
    background-color: #343434; }
    body[data-page="contact"] main section .content .titleBox {
      text-align: center; }
      body[data-page="contact"] main section .content .titleBox .title {
        font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        font-size: 1.875rem; }
      body[data-page="contact"] main section .content .titleBox .description {
        font-size: 0.9375rem; }
    body[data-page="contact"] main .stickyFix {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: stretch;
      -ms-flex-align: stretch;
      align-items: stretch; }
      @media (max-width: 1200px) {
        body[data-page="contact"] main .stickyFix {
          display: block; } }
      body[data-page="contact"] main .stickyFix .duckyChannel {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 45%;
        flex: 1 1 45%; }
      body[data-page="contact"] main .stickyFix #contentForm {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 55%;
        flex: 1 1 55%; }
    body[data-page="contact"] main .stickyFix section.duckyChannel .content {
      position: relative;
      width: 100%;
      max-width: 100%;
      padding: 10vh 5vw 11vh 5vw;
      background-color: #1f1f1f;
      top: -4.125vw;
      bottom: auto; }
      body[data-page="contact"] main .stickyFix section.duckyChannel .content.fixed {
        position: fixed;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        max-width: 45%; }
      @media (max-width: 1200px) {
        body[data-page="contact"] main .stickyFix section.duckyChannel .content {
          width: 100%;
          max-width: 70%;
          margin-left: auto;
          margin-right: auto;
          top: -2.125vw; } }
      @media (max-width: 768px) {
        body[data-page="contact"] main .stickyFix section.duckyChannel .content {
          width: 100%;
          max-width: 90%;
          margin-left: auto;
          margin-right: auto;
          top: -8vw; } }
      @media (max-width: 667px) {
        body[data-page="contact"] main .stickyFix section.duckyChannel .content {
          width: 100%;
          max-width: 100%;
          margin-left: auto;
          margin-right: auto;
          top: 0; } }
      body[data-page="contact"] main .stickyFix section.duckyChannel .content .titleBox {
        text-align: left; }
      body[data-page="contact"] main .stickyFix section.duckyChannel .content .goFormBtn {
        position: absolute;
        bottom: 50px;
        right: 50px;
        width: 30px;
        height: 30px;
        border: 1.5px solid white;
        border-radius: 50%;
        overflow: hidden;
        cursor: pointer;
        -webkit-transition: 0.5s;
        -o-transition: 0.5s;
        transition: 0.5s;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center; }
        body[data-page="contact"] main .stickyFix section.duckyChannel .content .goFormBtn span.arrow {
          position: relative;
          width: 30%;
          height: 30%;
          border-bottom: 1.5px solid white;
          border-right: 1.5px solid white;
          -webkit-transform: rotate(45deg);
          -ms-transform: rotate(45deg);
          transform: rotate(45deg);
          top: -1px; }
        @media (max-width: 1200px) {
          body[data-page="contact"] main .stickyFix section.duckyChannel .content .goFormBtn {
            bottom: 2vh;
            right: 50%;
            -webkit-transform: translateX(50%);
            -ms-transform: translateX(50%);
            transform: translateX(50%); }
            body[data-page="contact"] main .stickyFix section.duckyChannel .content .goFormBtn span.arrow {
              -webkit-transform: rotate(45deg);
              -ms-transform: rotate(45deg);
              transform: rotate(45deg);
              -webkit-animation: drop 1.5s infinite ease;
              animation: drop 1.5s infinite ease; } }
      body[data-page="contact"] main .stickyFix section.duckyChannel .content .goFormBtn:hover {
        background-color: white; }
        body[data-page="contact"] main .stickyFix section.duckyChannel .content .goFormBtn:hover span.arrow {
          border-bottom: 1.5px solid #222222;
          border-right: 1.5px solid #222222;
          -webkit-transform: rotate(45deg);
          -ms-transform: rotate(45deg);
          transform: rotate(45deg);
          top: -2px;
          -webkit-animation: drop 1.5s infinite ease;
          animation: drop 1.5s infinite ease; }

@-webkit-keyframes drop {
  0% {
    opacity: 1;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg); }
  100% {
    opacity: 0;
    -webkit-transform: translateY(100%) rotate(45deg);
    transform: translateY(100%) rotate(45deg); } }

@keyframes drop {
  0% {
    opacity: 1;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg); }
  100% {
    opacity: 0;
    -webkit-transform: translateY(100%) rotate(45deg);
    transform: translateY(100%) rotate(45deg); } }
      body[data-page="contact"] main .stickyFix section.duckyChannel .content ul.inforBox {
        margin-top: 50px; }
        body[data-page="contact"] main .stickyFix section.duckyChannel .content ul.inforBox li.infor {
          margin: 15px 0;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          -webkit-box-pack: start;
          -ms-flex-pack: start;
          justify-content: flex-start;
          -webkit-box-align: start;
          -ms-flex-align: start;
          align-items: flex-start; }
          body[data-page="contact"] main .stickyFix section.duckyChannel .content ul.inforBox li.infor span {
            margin-right: 5px; }
          body[data-page="contact"] main .stickyFix section.duckyChannel .content ul.inforBox li.infor span.item {
            margin-left: 15px; }
            body[data-page="contact"] main .stickyFix section.duckyChannel .content ul.inforBox li.infor span.item span.group {
              display: inline-block; }
          body[data-page="contact"] main .stickyFix section.duckyChannel .content ul.inforBox li.infor span.inforTitle {
            font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
            font-weight: bold; }
          body[data-page="contact"] main .stickyFix section.duckyChannel .content ul.inforBox li.infor span.inforText {
            color: #c7c7c7; }
          body[data-page="contact"] main .stickyFix section.duckyChannel .content ul.inforBox li.infor span.icon, body[data-page="contact"] main .stickyFix section.duckyChannel .content ul.inforBox li.infor a.icon-point {
            color: #ffbc00; }
            body[data-page="contact"] main .stickyFix section.duckyChannel .content ul.inforBox li.infor span.icon:before, body[data-page="contact"] main .stickyFix section.duckyChannel .content ul.inforBox li.infor a.icon-point:before {
              color: #ffbc00; }
          body[data-page="contact"] main .stickyFix section.duckyChannel .content ul.inforBox li.infor span.icon {
            font-size: 1.125rem;
            margin-top: 4px; }
          body[data-page="contact"] main .stickyFix section.duckyChannel .content ul.inforBox li.infor a.icon-point {
            margin-left: 10px; }
    body[data-page="contact"] main .stickyFix section#contentForm .content {
      width: 100%;
      max-width: 830px;
      margin-left: auto;
      margin-right: auto;
      padding: 160px 0 100px 0; }
      @media (max-width: 1600px) {
        body[data-page="contact"] main .stickyFix section#contentForm .content {
          width: 100%;
          max-width: 90%;
          margin-left: auto;
          margin-right: auto; } }
      @media (max-width: 768px) {
        body[data-page="contact"] main .stickyFix section#contentForm .content {
          max-width: 100%;
          padding: 100px 5vw; } }
      body[data-page="contact"] main .stickyFix section#contentForm .content .titleBox {
        text-align: center; }
        body[data-page="contact"] main .stickyFix section#contentForm .content .titleBox .title {
          font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
          font-size: 1.875rem; }
        body[data-page="contact"] main .stickyFix section#contentForm .content .titleBox .description {
          font-size: 0.9375rem; }
      body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox {
        padding: 50px 0; }
        body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          font-size: 0.9375rem; }
          @media (max-width: 768px) {
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup {
              display: block; } }
          body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList {
            position: relative;
            -webkit-box-flex: 1;
            -ms-flex: 1 1 0px;
            flex: 1 1 0;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-align: stretch;
            -ms-flex-align: stretch;
            align-items: stretch;
            padding: 25px 15px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
            @media (max-width: 768px) {
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList {
                display: block; } }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList:after {
              content: "";
              position: absolute;
              top: 100%;
              left: 0;
              width: 0;
              height: 1px;
              background-color: white;
              -webkit-transition: 0.5s;
              -o-transition: 0.5s;
              transition: 0.5s; }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList:not(:first-child) {
              margin-left: 10px; }
              @media (max-width: 768px) {
                body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList:not(:first-child) {
                  margin: 0; } }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList label.listTitie {
              -webkit-box-flex: 0;
              -ms-flex: 0 0 auto;
              flex: 0 0 auto;
              font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList label.listTitie + input.listInput, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList label.listTitie + .input.listInput, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList label.listTitie + textarea {
              margin-left: 10px; }
              @media (max-width: 768px) {
                body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList label.listTitie + input.listInput, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList label.listTitie + .input.listInput, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList label.listTitie + textarea {
                  margin: 0;
                  margin-top: 10px; } }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList input.listInput, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList .input.listInput, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList textarea {
              -webkit-box-flex: 1;
              -ms-flex: 1 1 auto;
              flex: 1 1 auto;
              background-color: transparent;
              border: none;
              color: white;
              -webkit-box-sizing: border-box;
              box-sizing: border-box;
              padding: 1px 0; }
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList input.listInput::-webkit-input-placeholder, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList .input.listInput::-webkit-input-placeholder, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList textarea::-webkit-input-placeholder {
                font-size: 0.875rem;
                color: #cccccc; }
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList input.listInput:-ms-input-placeholder, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList .input.listInput:-ms-input-placeholder, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList textarea:-ms-input-placeholder {
                font-size: 0.875rem;
                color: #cccccc; }
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList input.listInput::-ms-input-placeholder, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList .input.listInput::-ms-input-placeholder, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList textarea::-ms-input-placeholder {
                font-size: 0.875rem;
                color: #cccccc; }
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList input.listInput::placeholder, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList .input.listInput::placeholder, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList textarea::placeholder {
                font-size: 0.875rem;
                color: #cccccc; }
              @media (max-width: 768px) {
                body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList input.listInput, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList .input.listInput, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList textarea {
                  margin: 0;
                  margin-top: 10px;
                  width: 100%; } }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList .input.listInput {
              color: #cccccc; }
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList .input.listInput.isInput {
                color: white; }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList textarea {
              min-height: 200px;
              resize: none; }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList ul.selector {
              position: absolute;
              top: 100%;
              left: 0;
              background-color: #cacaca;
              width: 100%;
              text-align: center;
              color: #222222;
              max-height: 300px;
              z-index: 9;
              overflow-y: scroll;
              -webkit-overflow-style: none;
              display: none; }
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList ul.selector::-webkit-scrollbar {
                background-color: transparent;
                width: 5px; }
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList ul.selector::-webkit-scrollbar-thumb {
                width: 5px;
                background-color: #222222; }
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList ul.selector::-webkit-scrollbar-track {
                background-color: rgba(34, 34, 34, 0.2); }
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList ul.selector li.option {
                padding: 15px 10px;
                border-bottom: 1px solid rgba(255, 255, 255, 0.8);
                cursor: pointer; }
                body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList ul.selector li.option:hover {
                  background-color: #222222;
                  border-bottom: 1px solid transparent;
                  color: white; }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList .input[data-input="selector"] {
              position: relative;
              -webkit-user-select: none;
              -moz-user-select: none;
              -ms-user-select: none;
              user-select: none;
              cursor: pointer; }
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList .input[data-input="selector"]:after {
                content: "";
                position: absolute;
                top: 50%;
                right: 2.5%;
                -webkit-transform: translateY(-50%);
                -ms-transform: translateY(-50%);
                transform: translateY(-50%);
                border-left: 4.242px solid transparent;
                border-top: 6px solid white;
                border-right: 4.242px solid transparent;
                border-bottom: 0px solid transparent; }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList.required:before {
              content: '*';
              position: absolute;
              top: 25px;
              left: -2.5px; }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList:focus-within:after {
              width: 100%; }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox {
              position: relative;
              width: 1.875rem;
              height: 1.875rem;
              margin-left: 10px;
              top: 1.25px; }
              @media (max-width: 768px) {
                body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox {
                  position: absolute;
                  top: 50%;
                  right: 10px;
                  -webkit-transform: translateY(-50%);
                  -ms-transform: translateY(-50%);
                  transform: translateY(-50%); } }
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox span.questionBtn {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                position: absolute;
                top: 50%;
                left: 50%;
                -webkit-transform: translate(-50%, -50%);
                -ms-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
                width: 80%;
                height: 80%;
                font-family: 微軟正黑體;
                font-size: 0.75rem;
                border-radius: 50%;
                border: 1px solid white;
                -webkit-user-select: none;
                -moz-user-select: none;
                -ms-user-select: none;
                user-select: none;
                cursor: pointer;
                -webkit-transition: 0.5s;
                -o-transition: 0.5s;
                transition: 0.5s; }
                body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox span.questionBtn:hover {
                  border-color: rgba(255, 255, 255, 0.5);
                  background-color: rgba(255, 255, 255, 0.5);
                  color: #222222; }
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox.active span.questionBtn {
                border-color: white;
                background-color: white;
                color: #222222; }
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent {
                position: absolute;
                bottom: 45px;
                right: 50%;
                -webkit-transform: translateX(50%);
                -ms-transform: translateX(50%);
                transform: translateX(50%);
                background-color: white;
                color: #222222;
                padding: 75px 50px;
                width: 90vw;
                max-width: 430px;
                display: none; }
                @media (max-width: 1366px) {
                  body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent {
                    right: 8.5%;
                    -webkit-transform: translateX(8.5%);
                    -ms-transform: translateX(8.5%);
                    transform: translateX(8.5%); } }
                @media (max-width: 768px) {
                  body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent {
                    right: 4%;
                    -webkit-transform: translateX(4%);
                    -ms-transform: translateX(4%);
                    transform: translateX(4%); } }
                @media (max-width: 667px) {
                  body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent {
                    right: 0;
                    -webkit-transform: translateX(3.5%);
                    -ms-transform: translateX(3.5%);
                    transform: translateX(3.5%); } }
                body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent .tipTitle {
                  font-size: 1.125rem;
                  font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
                  width: 100%; }
                body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent .tipDescription {
                  font-size: 1rem;
                  margin-top: 16px;
                  font-family: "CenturyGothic", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
                  width: 100%; }
                body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent span.icon-cross {
                  position: absolute;
                  top: 30px;
                  right: 30px;
                  font-size: 1.5rem;
                  color: #989898;
                  cursor: pointer; }
                body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent:after {
                  content: "";
                  position: absolute;
                  bottom: -10px;
                  left: 50%;
                  -webkit-transform: translateX(-50%);
                  -ms-transform: translateX(-50%);
                  transform: translateX(-50%);
                  border-left: 7.77px solid transparent;
                  border-top: 11px solid white;
                  border-right: 7.77px solid transparent;
                  border-bottom: 0px solid transparent; }
                  @media (max-width: 1366px) {
                    body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent:after {
                      left: 88.8%; } }
                  @media (max-width: 768px) {
                    body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList span.tipBox .tipContent:after {
                      left: 93.2%; } }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList .verification {
              margin: 0 0 0 10px;
              cursor: pointer; }
              @media (max-width: 768px) {
                body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList .verification {
                  margin: 10px 0 0 0; } }
              body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup .formList .verification--img {
                max-height: 24px; }
        body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formBtn {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          padding-top: 50px; }
          body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formBtn button {
            -webkit-box-flex: 1;
            -ms-flex: 1 1 auto;
            flex: 1 1 auto;
            margin: 0 10px;
            padding: 12px;
            background: none;
            border: none;
            border: 1px solid white;
            border-radius: 50px;
            max-width: 170px;
            width: 100%;
            font-size: 0.9375rem;
            font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
            color: white;
            cursor: pointer;
            -webkit-transition: 0.5s;
            -o-transition: 0.5s;
            transition: 0.5s; }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formBtn button:hover {
              background-color: rgba(255, 255, 255, 0.5); }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formBtn button:active, body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formBtn button.submit {
              color: #222222;
              background-color: white; }
            body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formBtn button:active {
              -webkit-transform: scale(0.95);
              -ms-transform: scale(0.95);
              transform: scale(0.95); }
        body[data-page="contact"] main .stickyFix section#contentForm .content .contentBox form#maintance .formGroup.association .formList {
          margin: 0; }

body[data-page="news"] #overView section, body[data-page="news"] #entryMore section {
  background-color: #343434;
  padding-bottom: 7.8vw; }

body[data-page="news"] #overView .content, body[data-page="news"] #entryMore .content {
  width: 100%;
  max-width: 1360px;
  margin-left: auto;
  margin-right: auto; }
  body[data-page="news"] #overView .content .titleBox, body[data-page="news"] #entryMore .content .titleBox {
    text-align: center;
    padding: 100px 0 40px 0;
    color: white; }
    body[data-page="news"] #overView .content .titleBox .title, body[data-page="news"] #entryMore .content .titleBox .title {
      font-size: 2.25rem;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold; }
    body[data-page="news"] #overView .content .titleBox .description, body[data-page="news"] #entryMore .content .titleBox .description {
      margin-top: 25px; }
  body[data-page="news"] #overView .content nav.filterBox, body[data-page="news"] #entryMore .content nav.filterBox {
    width: 90%;
    margin: 0 auto; }
    @media (min-width: 769px) {
      body[data-page="news"] #overView .content nav.filterBox .selectText, body[data-page="news"] #entryMore .content nav.filterBox .selectText {
        display: none; }
      body[data-page="news"] #overView .content nav.filterBox ul.filterContent, body[data-page="news"] #entryMore .content nav.filterBox ul.filterContent {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        font-weight: bold;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        color: white; }
        body[data-page="news"] #overView .content nav.filterBox ul.filterContent > li.filter, body[data-page="news"] #entryMore .content nav.filterBox ul.filterContent > li.filter {
          position: relative;
          padding: 0 20px;
          margin: 10px 0; }
          body[data-page="news"] #overView .content nav.filterBox ul.filterContent > li.filter:not(:last-child):after, body[data-page="news"] #entryMore .content nav.filterBox ul.filterContent > li.filter:not(:last-child):after {
            content: "";
            position: absolute;
            width: 1px;
            height: 60%;
            top: 50%;
            right: 0;
            -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            transform: translateY(-50%);
            left: auto;
            bottom: auto;
            background-color: #989898; }
          body[data-page="news"] #overView .content nav.filterBox ul.filterContent > li.filter > a, body[data-page="news"] #entryMore .content nav.filterBox ul.filterContent > li.filter > a {
            position: relative; }
            body[data-page="news"] #overView .content nav.filterBox ul.filterContent > li.filter > a:after, body[data-page="news"] #entryMore .content nav.filterBox ul.filterContent > li.filter > a:after {
              content: "";
              position: absolute;
              bottom: -6px;
              left: 50%;
              -webkit-transform: translateX(-50%);
              -ms-transform: translateX(-50%);
              transform: translateX(-50%);
              width: 0;
              height: 3px;
              background-color: #ffbc00;
              -webkit-transition: 0.5s;
              -o-transition: 0.5s;
              transition: 0.5s; }
            body[data-page="news"] #overView .content nav.filterBox ul.filterContent > li.filter > a:hover:after, body[data-page="news"] #overView .content nav.filterBox ul.filterContent > li.filter > a.active:after, body[data-page="news"] #entryMore .content nav.filterBox ul.filterContent > li.filter > a:hover:after, body[data-page="news"] #entryMore .content nav.filterBox ul.filterContent > li.filter > a.active:after {
              width: 100%; } }
  @media (max-width: 768px) {
    body[data-page="news"] #overView .content nav.selectBox, body[data-page="news"] #entryMore .content nav.selectBox {
      position: relative;
      font-family: "CenturyGothic", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      background-color: #ffbc00;
      max-width: 340px;
      color: #000;
      text-align: center;
      border-radius: 20px;
      margin: 0 auto;
      cursor: pointer;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      z-index: 99; }
      body[data-page="news"] #overView .content nav.selectBox.active:after, body[data-page="news"] #entryMore .content nav.selectBox.active:after {
        -webkit-transform: translateY(-50%) rotate(180deg);
        -ms-transform: translateY(-50%) rotate(180deg);
        transform: translateY(-50%) rotate(180deg); }
      body[data-page="news"] #overView .content nav.selectBox.active ul.select, body[data-page="news"] #entryMore .content nav.selectBox.active ul.select {
        opacity: 1; }
      body[data-page="news"] #overView .content nav.selectBox:after, body[data-page="news"] #entryMore .content nav.selectBox:after {
        content: "";
        position: absolute;
        top: 50%;
        right: 8%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        border-left: 5px solid transparent;
        border-top: 8px solid #000;
        border-right: 5px solid transparent;
        border-bottom: 0px solid transparent;
        -webkit-transition: 0.8s;
        -o-transition: 0.8s;
        transition: 0.8s; }
      body[data-page="news"] #overView .content nav.selectBox .selectText, body[data-page="news"] #entryMore .content nav.selectBox .selectText {
        display: block;
        padding: 10px;
        text-align: center; }
      body[data-page="news"] #overView .content nav.selectBox ul.select, body[data-page="news"] #entryMore .content nav.selectBox ul.select {
        display: none;
        position: absolute;
        top: 110%;
        left: 0;
        width: 100%;
        border-radius: 20px;
        background-color: #e4e4e4;
        overflow: auto;
        opacity: 0;
        -webkit-transition: opacity 0.3s 0.1s;
        -o-transition: opacity 0.3s 0.1s;
        transition: opacity 0.3s 0.1s;
        max-height: 300px;
        overflow-y: scroll;
        -webkit-overflow-style: none;
        -ms-overflow-style: -ms-autohiding-scrollbar; }
        body[data-page="news"] #overView .content nav.selectBox ul.select::-webkit-scrollbar, body[data-page="news"] #entryMore .content nav.selectBox ul.select::-webkit-scrollbar {
          background-color: transparent;
          width: 5px; }
        body[data-page="news"] #overView .content nav.selectBox ul.select::-webkit-scrollbar-thumb, body[data-page="news"] #entryMore .content nav.selectBox ul.select::-webkit-scrollbar-thumb {
          width: 5px;
          border-radius: 10px;
          background-color: black; }
        body[data-page="news"] #overView .content nav.selectBox ul.select::-webkit-scrollbar-track, body[data-page="news"] #entryMore .content nav.selectBox ul.select::-webkit-scrollbar-track {
          background-color: rgba(0, 0, 0, 0.2); }
        body[data-page="news"] #overView .content nav.selectBox ul.select li.option, body[data-page="news"] #entryMore .content nav.selectBox ul.select li.option {
          padding: 15px;
          cursor: pointer;
          z-index: 9; }
          body[data-page="news"] #overView .content nav.selectBox ul.select li.option:hover, body[data-page="news"] #entryMore .content nav.selectBox ul.select li.option:hover {
            background-color: #ffbc00; } }

@media (max-width: 1440px) {
  body[data-page="news"] #overView .content, body[data-page="news"] #entryMore .content {
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    width: 92.5%; } }

@media (max-width: 1024px) {
  body[data-page="news"] #overView .content, body[data-page="news"] #entryMore .content {
    width: 100%;
    max-width: 768px;
    margin-left: auto;
    margin-right: auto;
    width: 92.5%; }
    body[data-page="news"] #overView .content #ajaxNewsContent .grid-size, body[data-page="news"] #overView .content #ajaxNewsContent .grid-normal, body[data-page="news"] #entryMore .content #ajaxNewsContent .grid-size, body[data-page="news"] #entryMore .content #ajaxNewsContent .grid-normal {
      width: 50%; }
    body[data-page="news"] #overView .content #ajaxNewsContent .grid-focus, body[data-page="news"] #entryMore .content #ajaxNewsContent .grid-focus {
      width: 100%; } }

@media (max-width: 667px) {
  body[data-page="news"] #overView .content #ajaxNewsContent .grid-size, body[data-page="news"] #overView .content #ajaxNewsContent .grid-normal, body[data-page="news"] #entryMore .content #ajaxNewsContent .grid-size, body[data-page="news"] #entryMore .content #ajaxNewsContent .grid-normal {
    width: 100%; } }

body[data-page="news"] #ajaxNewsContent {
  padding: 55px 0;
  margin: 0 auto; }
  body[data-page="news"] #ajaxNewsContent .grid-size, body[data-page="news"] #ajaxNewsContent .grid-item, body[data-page="news"] #ajaxNewsContent .grid-normal {
    width: 33.33%; }
  body[data-page="news"] #ajaxNewsContent .grid-item, body[data-page="news"] #ajaxNewsContent .grid-normal, body[data-page="news"] #ajaxNewsContent .grid-focus {
    height: 570px;
    float: left;
    margin-top: 22px; }
    @media (max-width: 667px) {
      body[data-page="news"] #ajaxNewsContent .grid-item, body[data-page="news"] #ajaxNewsContent .grid-normal, body[data-page="news"] #ajaxNewsContent .grid-focus {
        height: 400px; } }
  body[data-page="news"] #ajaxNewsContent .grid-focus {
    width: 66.66%; }
  body[data-page="news"] #ajaxNewsContent .grid-focus .articleContent, body[data-page="news"] #ajaxNewsContent .grid-normal .articleContent {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0 10px;
    -webkit-perspective: none;
    perspective: none;
    -webkit-perspective-origin: 50% 50%;
    perspective-origin: 50% 50%; }
    body[data-page="news"] #ajaxNewsContent .grid-focus .articleContent a, body[data-page="news"] #ajaxNewsContent .grid-normal .articleContent a {
      display: block;
      position: relative;
      background-color: white;
      width: 100%;
      height: 100%; }
      body[data-page="news"] #ajaxNewsContent .grid-focus .articleContent a header, body[data-page="news"] #ajaxNewsContent .grid-normal .articleContent a header {
        overflow: hidden; }
        body[data-page="news"] #ajaxNewsContent .grid-focus .articleContent a header .img, body[data-page="news"] #ajaxNewsContent .grid-normal .articleContent a header .img {
          height: 100%;
          background-position: cetner;
          background-size: cover;
          -webkit-transform: scale(1.01);
          -ms-transform: scale(1.01);
          transform: scale(1.01);
          -webkit-transition: 0.5s;
          -o-transition: 0.5s;
          transition: 0.5s; }
      body[data-page="news"] #ajaxNewsContent .grid-focus .articleContent a .newsContantBox, body[data-page="news"] #ajaxNewsContent .grid-normal .articleContent a .newsContantBox {
        padding: 6vh 2.5vw 3vh 2.5vw; }
        @media (max-width: 667px) {
          body[data-page="news"] #ajaxNewsContent .grid-focus .articleContent a .newsContantBox, body[data-page="news"] #ajaxNewsContent .grid-normal .articleContent a .newsContantBox {
            padding: 3vh 2.5vh; } }
        body[data-page="news"] #ajaxNewsContent .grid-focus .articleContent a .newsContantBox .title, body[data-page="news"] #ajaxNewsContent .grid-normal .articleContent a .newsContantBox .title {
          font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
          font-weight: bold; }
        body[data-page="news"] #ajaxNewsContent .grid-focus .articleContent a .newsContantBox .description, body[data-page="news"] #ajaxNewsContent .grid-normal .articleContent a .newsContantBox .description {
          font-size: 0.9375rem; }
        body[data-page="news"] #ajaxNewsContent .grid-focus .articleContent a .newsContantBox time, body[data-page="news"] #ajaxNewsContent .grid-normal .articleContent a .newsContantBox time {
          display: block;
          color: #0098e6;
          font-size: 0.875rem;
          font-style: italic; }
  body[data-page="news"] #ajaxNewsContent .grid-focus .blackWord a .newsContantBox {
    color: #000000;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.5); }
  body[data-page="news"] #ajaxNewsContent .grid-focus .blackWord a:hover .newsContantBox {
    color: #fff; }
  body[data-page="news"] #ajaxNewsContent .grid-focus a:hover .newsContantBox {
    text-shadow: 0 0 10px rgba(0, 0, 0, 0); }
  body[data-page="news"] #ajaxNewsContent .grid-focus a header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
  body[data-page="news"] #ajaxNewsContent .grid-focus a .newsContantBox {
    position: absolute;
    color: white;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 9;
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease; }
    body[data-page="news"] #ajaxNewsContent .grid-focus a .newsContantBox .newsTitle {
      position: absolute;
      width: 84%;
      text-align: left;
      left: 2.5vw;
      bottom: 3vh; }
      body[data-page="news"] #ajaxNewsContent .grid-focus a .newsContantBox .newsTitle .title {
        font-size: 1.625rem;
        margin: 15px 0; }
      body[data-page="news"] #ajaxNewsContent .grid-focus a .newsContantBox .newsTitle .description {
        margin: 15px 0;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden; }
      body[data-page="news"] #ajaxNewsContent .grid-focus a .newsContantBox .newsTitle time {
        margin-top: 40px;
        color: #24b5ff; }
      body[data-page="news"] #ajaxNewsContent .grid-focus a .newsContantBox .newsTitle.newsTitle-BL {
        text-align: left;
        left: 2.5vw;
        bottom: 3vh; }
      body[data-page="news"] #ajaxNewsContent .grid-focus a .newsContantBox .newsTitle.newsTitle-BR {
        text-align: right;
        right: 2.5vw;
        bottom: 3vh; }
      body[data-page="news"] #ajaxNewsContent .grid-focus a .newsContantBox .newsTitle.newsTitle-TL {
        text-align: left;
        left: 2.5vw;
        top: 3vh; }
      body[data-page="news"] #ajaxNewsContent .grid-focus a .newsContantBox .newsTitle.newsTitle-TR {
        text-align: right;
        right: 2.5vw;
        top: 3vh; }
  body[data-page="news"] #ajaxNewsContent .grid-normal a header {
    height: 50%;
    overflow: hidden; }
  body[data-page="news"] #ajaxNewsContent .grid-normal a .newsContantBox {
    height: 50%; }
    body[data-page="news"] #ajaxNewsContent .grid-normal a .newsContantBox .newsTitle {
      position: relative;
      height: 100%; }
      @media (max-width: 768px) {
        body[data-page="news"] #ajaxNewsContent .grid-normal a .newsContantBox .newsTitle {
          padding: 2vw; } }
      body[data-page="news"] #ajaxNewsContent .grid-normal a .newsContantBox .newsTitle .title {
        font-size: 1.375rem; }
        @media (max-width: 420px) {
          body[data-page="news"] #ajaxNewsContent .grid-normal a .newsContantBox .newsTitle .title {
            font-size: 1.25rem; } }
      body[data-page="news"] #ajaxNewsContent .grid-normal a .newsContantBox .newsTitle .description {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden; }
        @media (max-width: 420px) {
          body[data-page="news"] #ajaxNewsContent .grid-normal a .newsContantBox .newsTitle .description {
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            overflow: hidden; } }
      body[data-page="news"] #ajaxNewsContent .grid-normal a .newsContantBox .newsTitle time {
        position: absolute;
        bottom: 0;
        left: 0; }
        @media (max-width: 768px) {
          body[data-page="news"] #ajaxNewsContent .grid-normal a .newsContantBox .newsTitle time {
            left: 2vw; } }
  body[data-page="news"] #ajaxNewsContent .grid-focus a:hover header .img, body[data-page="news"] #ajaxNewsContent .grid-normal a:hover header .img {
    -webkit-transform: scale(1.11);
    -ms-transform: scale(1.11);
    transform: scale(1.11); }
  body[data-page="news"] #ajaxNewsContent .grid-focus a:hover header .moreCover, body[data-page="news"] #ajaxNewsContent .grid-normal a:hover header .moreCover {
    opacity: 1; }
    body[data-page="news"] #ajaxNewsContent .grid-focus a:hover header .moreCover .moreText, body[data-page="news"] #ajaxNewsContent .grid-normal a:hover header .moreCover .moreText {
      letter-spacing: 0; }

#entryContent {
  position: relative;
  padding-top: 120px; }
  @media (max-width: 1520px) {
    #entryContent {
      padding-top: 0; } }
  #entryContent:before, #entryContent:after {
    content: "";
    position: absolute;
    width: 100%;
    left: 0;
    z-index: -1; }
  #entryContent:before {
    top: 0;
    background-color: #3d3d3d;
    height: calc(100% - 200px); }
  #entryContent:after {
    top: calc(100% - 200px);
    background-color: #1e1e1e;
    height: 200px; }
  #entryContent .content {
    width: 100%;
    max-width: 1520px;
    margin-left: auto;
    margin-right: auto; }
  #entryContent article {
    position: relative;
    background-color: #eeeeee;
    padding-bottom: 175px; }
    #entryContent article > .entryTools .content {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      width: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      z-index: 9; }
    #entryContent article > .entryTools.fixed, #entryContent article > .entryTools.lightBoxType {
      width: 100%;
      max-width: 1520px;
      margin-left: auto;
      margin-right: auto; }
      #entryContent article > .entryTools.fixed .content, #entryContent article > .entryTools.lightBoxType .content {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        z-index: 9;
        -webkit-animation: toolBar-fixed 0.5s both;
        animation: toolBar-fixed 0.5s both; }

@-webkit-keyframes toolBar-fixed {
  0% {
    top: -100px; }
  100% {
    top: 0; } }

@keyframes toolBar-fixed {
  0% {
    top: -100px; }
  100% {
    top: 0; } }
    @media (max-width: 1366px) {
      #entryContent article > .entryTools.fixed .content {
        background-color: white;
        -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); } }
    #entryContent article > .entryTools.lightBoxType .content {
      max-width: 1200px;
      left: auto; }
    #entryContent article > .entryTools.bottom .content {
      top: auto;
      bottom: 0;
      z-index: 9; }
    #entryContent article > .entryTools .socialMediaTools {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin-left: 30px; }
    #entryContent article > .entryTools a.self {
      display: block;
      padding: 20px 40px;
      background-color: #292929;
      color: white;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
      #entryContent article > .entryTools a.self:hover {
        background-color: #111111; }
      @media (max-width: 1366px) {
        #entryContent article > .entryTools a.self {
          padding: 20px 35px; } }
    #entryContent article > .entryTools .socialMediaBox {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
    #entryContent article > .entryTools .socialMediaTitle {
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold; }
    #entryContent article > .entryTools .socialMediaIcon > i[class*="icon-"] {
      position: relative;
      top: 1px;
      font-size: 1.25rem;
      margin-left: 1.25vw;
      cursor: pointer;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
      #entryContent article > .entryTools .socialMediaIcon > i[class*="icon-"]:hover {
        color: #ffbc00; }
      @media (max-width: 768px) {
        #entryContent article > .entryTools .socialMediaIcon > i[class*="icon-"] {
          margin-left: 3.5vw; } }
    #entryContent article > header {
      position: relative;
      text-align: center;
      padding: 90px 0;
      z-index: 1; }
      #entryContent article > header > time {
        font-weight: 1.125rem;
        color: #0098e6;
        font-weight: bold;
        font-style: italic;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center; }
        #entryContent article > header > time:before, #entryContent article > header > time:after {
          content: "";
          display: block;
          width: 25px;
          height: 2px;
          background-color: #0098e6;
          margin: 15px; }
      #entryContent article > header > h1 {
        font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        font-weight: bold;
        font-size: 2.25rem;
        margin: 40px 0; }
        @media (max-width: 1366px) {
          #entryContent article > header > h1 {
            padding: 0 10px; } }
      #entryContent article > header > .postImgSwiper {
        position: relative;
        max-width: 970px;
        height: auto;
        overflow: visible; }
        #entryContent article > header > .postImgSwiper .swiper-pagination {
          position: absolute;
          width: 70px;
          top: 0;
          left: 100%;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
          -ms-flex-direction: column;
          flex-direction: column; }
          @media (max-width: 1366px) {
            #entryContent article > header > .postImgSwiper .swiper-pagination {
              -webkit-box-orient: horizontal;
              -webkit-box-direction: normal;
              -ms-flex-direction: row;
              flex-direction: row;
              height: 35px;
              width: 100%;
              left: 0;
              top: 100%;
              margin-top: 10px; } }
          #entryContent article > header > .postImgSwiper .swiper-pagination .bullet {
            width: 30px;
            padding: 10px 0;
            cursor: pointer;
            margin: 6px 0; }
            @media (max-width: 1366px) {
              #entryContent article > header > .postImgSwiper .swiper-pagination .bullet {
                margin: 0 6px;
                padding: 10px 0;
                height: 35px;
                width: auto; } }
            #entryContent article > header > .postImgSwiper .swiper-pagination .bullet:first-child:last-child {
              display: none; }
            #entryContent article > header > .postImgSwiper .swiper-pagination .bullet:before {
              margin: auto;
              content: "";
              display: block;
              width: 6px;
              height: 6px;
              border-radius: 50%;
              background-color: #919191; }
            #entryContent article > header > .postImgSwiper .swiper-pagination .bullet.active:before {
              background-color: #1b1b1b; }
        #entryContent article > header > .postImgSwiper .swiper-wrapper {
          position: relative;
          height: 100%;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center; }
        #entryContent article > header > .postImgSwiper figure {
          position: relative;
          width: 100%;
          height: 100%;
          min-height: 100%;
          max-height: 640px;
          overflow: hidden;
          margin: 0;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
          #entryContent article > header > .postImgSwiper figure figcaption {
            font-size: 0.9375rem; }
          #entryContent article > header > .postImgSwiper figure img {
            width: auto;
            height: auto;
            max-width: 100%;
            max-height: 100%; }
          #entryContent article > header > .postImgSwiper figure .youtube {
            position: relative;
            width: 100%;
            height: 0;
            padding-bottom: 56.25%; }
          #entryContent article > header > .postImgSwiper figure iframe {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%; }
          #entryContent article > header > .postImgSwiper figure .playerCover {
            position: relative; }
          #entryContent article > header > .postImgSwiper figure .playerBtn {
            position: absolute;
            width: 90px;
            height: 90px;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
            border: 1px solid rgba(255, 255, 255, 0.5);
            border-radius: 50%;
            cursor: pointer;
            -webkit-transition: 0.5s;
            -o-transition: 0.5s;
            transition: 0.5s; }
            @media (max-width: 768px) {
              #entryContent article > header > .postImgSwiper figure .playerBtn {
                width: 60px;
                height: 60px; } }
            #entryContent article > header > .postImgSwiper figure .playerBtn:after {
              content: '';
              position: absolute;
              top: 50%;
              left: 50%;
              -webkit-transform: translate(-50%, -50%);
              -ms-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
              border-top: 6.5px solid transparent;
              border-bottom: 6.5px solid transparent;
              border-left: 9.191px solid white;
              -webkit-transition: 0.5s;
              -o-transition: 0.5s;
              transition: 0.5s;
              z-index: 9; }
            #entryContent article > header > .postImgSwiper figure .playerBtn:hover {
              background-color: rgba(255, 255, 255, 0.2); }
              #entryContent article > header > .postImgSwiper figure .playerBtn:hover:after {
                border-left-color: white; }
      #entryContent article > header .backgroundCover {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: calc(100% - 300px);
        min-height: 325px;
        background-color: #dfdfdf;
        z-index: -1; }
    #entryContent article.darkTheme > header, #entryContent article.darkTheme > .entryTools {
      color: white; }
    #entryContent article.darkTheme > .entryTools .self {
      background-color: white;
      color: black; }
      #entryContent article.darkTheme > .entryTools .self:hover {
        background-color: #ccc;
        color: black; }
  #entryContent .entryContent {
    width: 100%;
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
    z-index: 2; }
    @media (max-width: 1366px) {
      #entryContent .entryContent {
        padding: 0 5vw; } }
  #entryContent .haveText {
    width: 100%;
    max-width: 95%;
    margin-left: auto;
    margin-right: auto; }
  #entryContent h2 {
    font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: bold;
    font-size: 1.25rem;
    margin: 1.25rem 0; }
  #entryContent p {
    font-size: 0.9375rem;
    line-height: 2; }
  #entryContent section {
    overflow: auto;
    margin-top: 70px;
    margin-bottom: 70px; }
    #entryContent section figcaption {
      font-size: 0.8125rem;
      margin: 10px 0;
      text-align: center; }
    #entryContent section:first-child {
      margin-top: 0; }
    #entryContent section:last-child {
      margin-bottom: 0; }
    #entryContent section.picturerRight figure, #entryContent section.picturerLeft figure {
      width: 50%;
      overflow: hidden; }
      @media (max-width: 768px) {
        #entryContent section.picturerRight figure, #entryContent section.picturerLeft figure {
          width: 100%; } }
      #entryContent section.picturerRight figure img, #entryContent section.picturerLeft figure img {
        display: block;
        max-width: 423px;
        max-height: 396px;
        margin: 0 auto; }
    #entryContent section.picturerRight figure {
      float: right;
      margin-left: 25px; }
    #entryContent section.picturerLeft figure {
      float: left;
      margin-right: 25px; }
    #entryContent section.picturerTwo {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between; }
      #entryContent section.picturerTwo figure {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 49.7%;
        flex: 0 0 49.7%; }
    #entryContent section.picturerOne img {
      width: 100%; }
    #entryContent section.articleNavBar .navTitle {
      font-size: 1.625rem;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold;
      text-align: center; }
    #entryContent section.articleNavBar ul.linkBox {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-align: stretch;
      -ms-flex-align: stretch;
      align-items: stretch;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      margin: 20px 0; }
      #entryContent section.articleNavBar ul.linkBox > li.linkList {
        margin: 0 2px;
        -webkit-box-flex: 0;
        -ms-flex: 0 1 calc(24% - 4px);
        flex: 0 1 calc(24% - 4px);
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none; }
        @media (max-width: 768px) {
          #entryContent section.articleNavBar ul.linkBox > li.linkList {
            -webkit-box-flex: 0;
            -ms-flex: 0 1 60%;
            flex: 0 1 60%;
            margin: 8px 0; } }
      #entryContent section.articleNavBar ul.linkBox a.link {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        position: relative;
        font-size: 0.875rem;
        padding: 25px 7.5px;
        font-weight: bold;
        height: 100%;
        -webkit-transition: 0.5s;
        -o-transition: 0.5s;
        transition: 0.5s; }
        #entryContent section.articleNavBar ul.linkBox a.link > span {
          -webkit-transition: 0.5s;
          -o-transition: 0.5s;
          transition: 0.5s; }
        #entryContent section.articleNavBar ul.linkBox a.link > .linkType {
          font-size: 1.125rem;
          margin-right: 10px;
          position: relative;
          top: -1px; }
        #entryContent section.articleNavBar ul.linkBox a.link:after {
          content: "";
          position: absolute;
          left: 0;
          bottom: 0px;
          height: 6px;
          width: 100%;
          background-color: #5f5f5f;
          -webkit-transition: 0.5s;
          -o-transition: 0.5s;
          transition: 0.5s; }
        #entryContent section.articleNavBar ul.linkBox a.link:hover:after {
          background-color: #0098e6; }
        #entryContent section.articleNavBar ul.linkBox a.link:active > span {
          color: #0076c4; }
        #entryContent section.articleNavBar ul.linkBox a.link:active:after {
          background-color: #0076c4; }
  #goTop, .goTop, .lightBoxGotop {
    position: absolute;
    bottom: 80px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    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-align: center;
    -ms-flex-align: center;
    align-items: center; }
    #goTop:before, #goTop:after, .goTop:before, .goTop:after, .lightBoxGotop:before, .lightBoxGotop:after {
      content: "";
      position: absolute;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%);
      width: 1px; }
    #goTop:before, .goTop:before, .lightBoxGotop:before {
      height: 60px;
      top: 165%;
      background-color: #000; }
    #goTop:after, .goTop:after, .lightBoxGotop:after {
      height: 93px;
      background-color: white;
      top: calc(165% + 60px); }
    #goTop > svg, .goTop > svg, .lightBoxGotop > svg {
      width: 30px;
      height: 30px;
      cursor: pointer; }
    #goTop .goTopArrow, #goTop .goTopText, .goTop .goTopArrow, .goTop .goTopText, .lightBoxGotop .goTopArrow, .lightBoxGotop .goTopText {
      color: #000;
      fill: #000;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
    #goTop:hover .goTopArrow, #goTop:hover text.goTopText, .goTop:hover .goTopArrow, .goTop:hover text.goTopText, .lightBoxGotop:hover .goTopArrow, .lightBoxGotop:hover text.goTopText {
      fill: #ffbc00; }
    #goTop:hover p.goTopText, #goTop:hover span:before, .goTop:hover p.goTopText, .goTop:hover span:before, .lightBoxGotop:hover p.goTopText, .lightBoxGotop:hover span:before {
      color: #ffbc00; }
    #goTop span:before, .goTop span:before, .lightBoxGotop span:before {
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s;
      display: block;
      color: #000;
      font-weight: bold;
      -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      transform: rotate(90deg);
      font-size: 0.75rem; }
    #goTop text.goTopText, .goTop text.goTopText, .lightBoxGotop text.goTopText {
      fill: #000;
      font-size: 3rem !important;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold; }
    #goTop p.goTopText, .goTop p.goTopText, .lightBoxGotop p.goTopText {
      color: #000;
      font-size: 0.9375rem !important;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold; }

body[data-page="news"] #entryMore {
  padding-top: 130px;
  background-color: #1e1e1e; }
  body[data-page="news"] #entryMore .moduleTitle {
    text-align: center;
    color: white;
    font-size: 2.625rem;
    font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: bold; }

.policy {
  -webkit-overflow-scrolling: touch; }
  .policy-lb {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    overflow-y: scroll;
    z-index: 999;
    display: none; }
    .policy-lb-main {
      padding-top: 160px;
      padding-bottom: 210px;
      position: relative;
      min-height: 100%; }
      @media only screen and (max-width: 1200px) {
        .policy-lb-main {
          padding-top: 100px;
          padding-bottom: 100px; } }
      @media only screen and (max-width: 767px) {
        .policy-lb-main {
          padding-top: 0;
          padding-bottom: 0; } }
    .policy-lb-mask {
      background-color: rgba(0, 0, 0, 0.7);
      top: 0;
      left: 0;
      position: absolute;
      width: 100%;
      height: 100%; }
    .policy-lb-container {
      max-width: 1160px;
      width: 90%;
      margin: 0 auto;
      position: relative;
      overflow: hidden; }
      @media only screen and (max-width: 767px) {
        .policy-lb-container {
          width: 100%; } }
    .policy-lb-block {
      background-color: #fff;
      padding-bottom: 80px; }
    .policy-lb--open {
      position: absolute;
      color: #fff;
      bottom: 0;
      z-index: 5; }
    .policy-lb-inner {
      max-width: 960px;
      width: 90%;
      margin: 0 auto; }
    .policy-lb ul, .policy-lb li {
      list-style: none;
      padding-left: 0; }
    .policy-lb .liboxClose {
      position: absolute;
      right: 20px;
      top: 35px; }
  .policy-bTitle {
    text-align: center;
    color: #fff;
    padding-top: 110px;
    padding-bottom: 90px;
    background-color: #0098e6;
    margin-bottom: 90px; }
    .policy-bTitle__title, .policy-bTitle__subtitle {
      display: block; }
    .policy-bTitle__title {
      font-size: 2.25rem;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold;
      margin-bottom: 10px; }
    .policy-bTitle__subtitle {
      font-size: 0.9375rem; }
  .policy__gutter {
    margin: 0;
    margin-top: 50px;
    margin-bottom: 50px;
    border: 0;
    width: 100%;
    height: 1px;
    background-color: #000; }
  .policy-about__title {
    font-size: 1.125rem;
    font-weight: bold; }
  .policy-about__p {
    font-size: 0.875rem;
    line-height: 2; }
  .policy-li {
    margin-top: 60px;
    margin-bottom: 60px; }
    .policy-li__title {
      font-size: 1.25rem;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold;
      margin-bottom: 10px; }
    .policy-li__p {
      font-size: 0.9375rem;
      font-family: "Myriad Pro", "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
      line-height: 2; }
  .policy-goTop {
    cursor: pointer;
    position: relative; }
    .policy-goTop:after {
      content: '';
      position: absolute;
      left: 50%;
      width: 1px;
      bottom: -90px;
      height: 80px;
      background-color: #000; }
    .policy-goTop__arrow {
      width: 10px;
      height: 10px;
      border-top: 2px solid #000;
      border-right: 2px solid #000;
      -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      transform: rotate(-45deg);
      display: block;
      margin: 0 auto; }
    .policy-goTop__top {
      display: block;
      text-align: center;
      font-family: "CenturyGothic-Bold", Microsoft JhengHei, 微軟正黑體, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: bold;
      font-size: 0.875rem; }

.liboxClose {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #fff;
  position: relative;
  cursor: pointer;
  -webkit-transition: .5s;
  -o-transition: .5s;
  transition: .5s; }
  .liboxClose:hover {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg); }
  .liboxClose .x {
    position: absolute;
    width: 100%;
    height: 100%; }
    .liboxClose .x:after, .liboxClose .x:before {
      content: '';
      position: absolute;
      background-color: #000;
      top: 50%;
      left: 50%; }
    .liboxClose .x:after {
      width: 12px;
      height: 2px;
      -webkit-transform: translate(-50%, -50%) rotate(45deg);
      -ms-transform: translate(-50%, -50%) rotate(45deg);
      transform: translate(-50%, -50%) rotate(45deg); }
    .liboxClose .x:before {
      width: 12px;
      height: 2px;
      -webkit-transform: translate(-50%, -50%) rotate(-45deg);
      -ms-transform: translate(-50%, -50%) rotate(-45deg);
      transform: translate(-50%, -50%) rotate(-45deg); }

@media (max-width: 575px) {
  .detail_libox {
    background-color: black !important; } }

.detail_libox--lbx_box {
  width: 100%;
  height: 100%;
  padding: 0 !important; }
  .detail_libox--lbx_box .lbx_content .detail_container,
  .detail_libox--lbx_box .lbx_content .detail_container .lbx_content {
    width: 100%; }

.detail_libox .container {
  width: 1360px; }
  @media (max-width: 1459px) {
    .detail_libox .container {
      width: 90vw;
      max-width: 100%; } }
  @media (max-width: 575px) {
    .detail_libox .container {
      width: 100vw;
      max-width: 100%; } }

.detail_libox .detail_container {
  padding: 0 !important;
  background-color: transparent !important; }

.detail_libox .iframe-container {
  width: 100%;
  padding-bottom: 56%;
  position: relative; }
  .detail_libox .iframe-container iframe {
    position: absolute;
    left: 0;
    top: 0; }

.hide_lightbox hr.hr {
  background: #000;
  border-radius: 0;
  border: none;
  width: 100%;
  height: 1px; }

.hide_lightbox.product_detail .detail_libox--lbx_box .detail_container {
  width: 1340px;
  max-width: 70%; }
  .hide_lightbox.product_detail .detail_libox--lbx_box .detail_container .lbx_content_inner {
    width: 1060px; }

@media (max-width: 575px) {
  .hide_lightbox.product_detail .detail_libox--lbx_box .detail_container {
    max-width: 100%; } }

.hide_lightbox.news_detail .detail_libox--lbx_box .detail_container {
  width: 1315px;
  max-width: 70%; }
  .hide_lightbox.news_detail .detail_libox--lbx_box .detail_container .lbx_content {
    max-width: 100%; }
  .hide_lightbox.news_detail .detail_libox--lbx_box .detail_container .lbx_content_inner {
    width: 1005px;
    max-width: 100%; }

@media (max-width: 1365px) {
  .hide_lightbox.news_detail .detail_libox--lbx_box .detail_container {
    max-width: 75%; } }

@media (max-width: 991px) {
  .hide_lightbox.news_detail .detail_libox--lbx_box .detail_container {
    max-width: 100%; } }

.hide_lightbox {
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  height: 100vh;
  z-index: 100; }

.detail_libox {
  opacity: 1;
  width: 100%;
  height: 100vh; }
  .detail_libox[data-detail="center"] .detail_libox--lbx_box .detail_container {
    margin-left: auto;
    margin-right: auto; }
    @media (max-width: 991px) {
      .detail_libox[data-detail="center"] .detail_libox--lbx_box .detail_container {
        max-width: 100%; } }
  .detail_libox[data-detail="center"] ~ .nicescroll-rails .nicescroll-cursors {
    border-color: rgba(255, 255, 255, 0.6) !important; }
    @media (max-width: 991px) {
      .detail_libox[data-detail="center"] ~ .nicescroll-rails .nicescroll-cursors {
        border-color: #000 !important; } }
  .detail_libox[data-detail="right"] .detail_libox--lbx_box .detail_container {
    margin-left: auto; }
  .detail_libox .quick_link.detail_footer_full {
    margin-bottom: 0; }
  .detail_libox .detail_container {
    background-color: #ECECEC;
    position: relative; }
  .detail_libox .detail_close {
    font-family: 'mplus-heavy','微軟正黑體';
    position: absolute; }
    .detail_libox .detail_close .liboxClose {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
    .detail_libox .detail_close .txt {
      font-size: 1.0625rem;
      letter-spacing: 1px;
      padding-left: 10px;
      margin-top: 3px; }
    .detail_libox .detail_close .icon-left-arrow {
      font-weight: 900;
      color: rgba(0, 0, 0, 0.7); }
    .detail_libox .detail_close:hover .icon-left-arrow {
      -webkit-animation: fade-in-right 0.6s ease-in-out both;
      animation: fade-in-right 0.6s ease-in-out both; }
  .detail_libox .detail_libox--lbx_box {
    position: relative; }
    .detail_libox .detail_libox--lbx_box .lbx_bg {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      top: 0;
      background-color: rgba(0, 0, 0, 0.8);
      cursor: pointer; }
    .detail_libox .detail_libox--lbx_box .lbx_content {
      padding: 100px 0;
      width: 100%;
      height: 100vh;
      overflow-x: hidden;
      overflow-y: auto; }
      .detail_libox .detail_libox--lbx_box .lbx_content_inner {
        max-width: 100%;
        padding-left: 50px;
        padding-right: 50px;
        margin-left: auto;
        margin-right: auto; }
      @media (max-width: 1199px) {
        .detail_libox .detail_libox--lbx_box .lbx_content {
          padding: 80px 0; } }
      @media (max-width: 991px) {
        .detail_libox .detail_libox--lbx_box .lbx_content_inner {
          padding-left: 40px;
          padding-right: 40px; } }
      @media (max-width: 767px) {
        .detail_libox .detail_libox--lbx_box .lbx_content_inner {
          padding-left: 30px;
          padding-right: 30px; } }
      @media (max-width: 575px) {
        .detail_libox .detail_libox--lbx_box .lbx_content {
          padding-top: 60px;
          padding-bottom: 50px; }
          .detail_libox .detail_libox--lbx_box .lbx_content_inner {
            padding-left: 20px;
            padding-right: 20px; } }
    .detail_libox .detail_libox--lbx_box .lbx_footer.lbx_box {
      width: 100%;
      position: relative;
      padding-top: 80px; }
      .detail_libox .detail_libox--lbx_box .lbx_footer.lbx_box .gotop {
        left: 50%;
        bottom: 0;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%); }
      .detail_libox .detail_libox--lbx_box .lbx_footer.lbx_box .container {
        margin-bottom: 90px; }
      @media (max-width: 575px) {
        .detail_libox .detail_libox--lbx_box .lbx_footer.lbx_box {
          padding-top: 40px; } }
  .detail_libox .banner hr {
    width: 40px;
    height: 5px;
    margin-left: auto;
    margin-right: auto;
    display: block;
    background-color: #6D88AA;
    border: 0; }
  @media (max-width: 767px) {
    .detail_libox article.article + article.article {
      margin-top: 50px; } }
  @media (max-width: 575px) {
    .detail_libox article.article + article.article {
      margin-top: 30px; } }
  @media (max-width: 479px) {
    .detail_libox article.article + article.article {
      margin-top: 25px; } }
  @media (max-width: 767px) {
    .detail_libox article.article:last-of-type {
      margin-bottom: 50px; } }
  @media (max-width: 575px) {
    .detail_libox article.article:last-of-type {
      margin-bottom: 30px; } }
  @media (max-width: 479px) {
    .detail_libox article.article:last-of-type {
      margin-bottom: 25px; } }
  .detail_libox .article_inner {
    width: 900px;
    max-width: 100%; }
    .detail_libox .article_inner.full {
      width: 100%; }
    .detail_libox .article_inner.narrow {
      width: 87%;
      margin: auto; }
    .detail_libox .article_inner__item {
      padding: 10px 0 70px 0; }
      @media (min-width: 992px) and (max-width: 1199px) {
        .detail_libox .article_inner__item {
          padding: 20px 0; } }
      @media (min-width: 768px) and (max-width: 991px) {
        .detail_libox .article_inner__item {
          padding: 30px 0; } }
      @media (max-width: 767px) {
        .detail_libox .article_inner__item {
          padding: 0; } }
      .detail_libox .article_inner__item--title, .detail_libox .article_inner__item--text {
        font-family: 'mplus-regular','微軟正黑體'; }
      .detail_libox .article_inner__item--title {
        color: rgba(0, 0, 0, 0.7);
        font-size: 1.125rem;
        letter-spacing: 0.5px; }
      .detail_libox .article_inner__item--text {
        font-size: 1rem;
        color: rgba(0, 0, 0, 0.6);
        line-height: 25px; }
      .detail_libox .article_inner__item .text {
        font-size: 1rem;
        font-family: 'mplus-regular','微軟正黑體';
        color: rgba(0, 0, 0, 0.6);
        line-height: 25px;
        letter-spacing: -0.4px; }
    .detail_libox .article_inner.img .article_inner__item {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex; }
      .detail_libox .article_inner.img .article_inner__item--left, .detail_libox .article_inner.img .article_inner__item--right {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        max-width: 100%;
        padding: 0 3px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
        .detail_libox .article_inner.img .article_inner__item--left .pic p,
        .detail_libox .article_inner.img .article_inner__item--left .pic figcaption, .detail_libox .article_inner.img .article_inner__item--right .pic p,
        .detail_libox .article_inner.img .article_inner__item--right .pic figcaption {
          font-family: 'mplus-medium','微軟正黑體';
          font-size: 0.9375rem;
          color: rgba(0, 0, 0, 0.6);
          padding: 10px 0;
          color: rgba(0, 0, 0, 0.4); }
        .detail_libox .article_inner.img .article_inner__item--left .pic img, .detail_libox .article_inner.img .article_inner__item--right .pic img {
          display: block; }
      .detail_libox .article_inner.img .article_inner__item--left {
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end; }
      .detail_libox .article_inner.img .article_inner__item--right {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start; }
      @media (max-width: 767px) {
        .detail_libox .article_inner.img .article_inner__item {
          -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; } }
  .detail_libox .article:last-of-type .article_inner__item {
    padding-bottom: 0; }
  .detail_libox .article[class*="g-g"] .article_inner__item {
    margin-left: -30px;
    margin-right: -30px; }
    .detail_libox .article[class*="g-g"] .article_inner__item--left, .detail_libox .article[class*="g-g"] .article_inner__item--right {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      padding-left: 30px;
      padding-right: 30px; }
  .detail_libox .article.g-gr .article_inner__item--left {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1; }
  .detail_libox .article.g-gr .article_inner__item--right {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1; }
  @media (max-width: 767px) {
    .detail_libox .article.g-gr .article_inner__item {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column; }
      .detail_libox .article.g-gr .article_inner__item--left {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2; }
        .detail_libox .article.g-gr .article_inner__item--left .text {
          margin: 1rem 0 1rem; }
      .detail_libox .article.g-gr .article_inner__item--right {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        text-align: center; } }
  .detail_libox .article.g-gl .article_inner__item--left {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1; }
  .detail_libox .article.g-gl .article_inner__item--right {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1; }
  @media (max-width: 767px) {
    .detail_libox .article.g-gl .article_inner__item {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column; }
      .detail_libox .article.g-gl .article_inner__item--left {
        text-align: center; } }
  .detail_libox .detail-slider {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 40px 0; }
    .detail_libox .detail-slider .pic p,
    .detail_libox .detail-slider .pic figcaption {
      font-family: 'mplus-medium','微軟正黑體';
      font-size: 0.9375rem;
      color: rgba(0, 0, 0, 0.6);
      padding-top: 10px; }

.product_detail .detail-slider,
.news_detail .detail-slider {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }
  .product_detail .detail-slider .list-item .pic img,
  .news_detail .detail-slider .list-item .pic img {
    width: 100%; }
  .product_detail .detail-slider .slick-dots li,
  .news_detail .detail-slider .slick-dots li {
    display: inline-block; }
  @media (max-width: 991px) {
    .product_detail .detail-slider .slick-dots,
    .news_detail .detail-slider .slick-dots {
      -webkit-box-orient: horizontal !important;
      -webkit-box-direction: normal !important;
      -ms-flex-direction: row !important;
      flex-direction: row !important;
      width: 100% !important; } }
  @media (max-width: 575px) {
    .product_detail .detail-slider,
    .news_detail .detail-slider {
      padding: 40px 0 20px 0; }
      .product_detail .detail-slider .list-item .pic,
      .news_detail .detail-slider .list-item .pic {
        padding-left: 0;
        padding-right: 0; } }

@media (max-width: 1199px) {
  .product_detail .article .article_inner.full.img,
  .news_detail .article .article_inner.full.img {
    padding-left: 30px;
    padding-right: 30px; } }

@media (max-width: 991px) {
  .product_detail .article .article_inner.full.img,
  .news_detail .article .article_inner.full.img {
    padding-left: 20px;
    padding-right: 20px; } }

@media (max-width: 575px) {
  .product_detail .article .article_inner.full.img,
  .news_detail .article .article_inner.full.img {
    padding-left: 0;
    padding-right: 0; } }

@media (max-width: 1199px) {
  .product_detail .article[class*="g-g"] .article_inner.full.img,
  .news_detail .article[class*="g-g"] .article_inner.full.img {
    padding-left: 0;
    padding-right: 0; }
  .product_detail .article[class*="g-g"] .article_inner__item,
  .news_detail .article[class*="g-g"] .article_inner__item {
    margin-left: 0;
    margin-right: 0; } }

@media (max-width: 991px) {
  .product_detail .article[class*="g-g"] .article_inner__item,
  .news_detail .article[class*="g-g"] .article_inner__item {
    margin-left: -15px;
    margin-right: -15px;
    padding-left: 20px;
    padding-right: 20px; }
    .product_detail .article[class*="g-g"] .article_inner__item--left, .product_detail .article[class*="g-g"] .article_inner__item--right,
    .news_detail .article[class*="g-g"] .article_inner__item--left,
    .news_detail .article[class*="g-g"] .article_inner__item--right {
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
      padding-left: 15px;
      padding-right: 15px; } }

@media (max-width: 575px) {
  .product_detail .article[class*="g-g"] .article_inner__item,
  .news_detail .article[class*="g-g"] .article_inner__item {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0; }
    .product_detail .article[class*="g-g"] .article_inner__item--left, .product_detail .article[class*="g-g"] .article_inner__item--right,
    .news_detail .article[class*="g-g"] .article_inner__item--left,
    .news_detail .article[class*="g-g"] .article_inner__item--right {
      padding-left: 0;
      padding-right: 0; }
    .product_detail .article[class*="g-g"] .article_inner__item--left .text,
    .news_detail .article[class*="g-g"] .article_inner__item--left .text {
      margin-top: 0; } }

@media (max-width: 991px) {
  .product_detail .article_inner.narrow,
  .news_detail .article_inner.narrow {
    width: 100%;
    padding: 0 20px; } }

@media (max-width: 575px) {
  .product_detail .article_inner.narrow,
  .news_detail .article_inner.narrow {
    padding: 0; } }

@media (max-width: 767px) {
  .product_detail .detail_libox--lbx_box .lbx_footer.lbx_box,
  .news_detail .detail_libox--lbx_box .lbx_footer.lbx_box {
    padding-top: 30px; } }

.lbx_header {
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  z-index: 20; }
  .lbx_header .detail_close {
    width: 100%;
    left: 0 !important;
    cursor: pointer;
    top: 18px;
    -webkit-transition: top .5s ease;
    -o-transition: top .5s ease;
    transition: top .5s ease; }
    .lbx_header .detail_close.headerFadeIn {
      top: 0; }
    .lbx_header .detail_close.headerFadeOut {
      top: 18px; }
    @media (max-width: 575px) {
      .lbx_header .detail_close {
        top: 10px; }
        .lbx_header .detail_close.headerFadeOut {
          top: 10px; } }
  .lbx_header .liboxClose {
    background-color: #ececec;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: 12px 60px 12px 60px; }
    @media (max-width: 991px) {
      .lbx_header .liboxClose {
        padding-left: 40px;
        padding-right: 40px; } }
    @media (max-width: 575px) {
      .lbx_header .liboxClose {
        padding-left: 20px;
        padding-right: 20px; } }
    .lbx_header .liboxClose .close {
      color: white;
      font-family: Helvetica, Arial, sans-serif;
      font-size: .6em;
      text-transform: uppercase;
      letter-spacing: 2px;
      -webkit-transition: all .3s ease-in;
      -o-transition: all .3s ease-in;
      transition: all .3s ease-in;
      opacity: 0;
      padding: 50px 0 0 0;
      position: absolute;
      cursor: pointer; }
    .lbx_header .liboxClose span {
      -webkit-transition: all .3s ease-in;
      -o-transition: all .3s ease-in;
      transition: all .3s ease-in; }
    .lbx_header .liboxClose .leftright {
      height: 4px;
      width: 50px;
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg); }
    .lbx_header .liboxClose .rightleft {
      height: 4px;
      width: 50px;
      -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      transform: rotate(-45deg); }
    .lbx_header .liboxClose:hover .close {
      opacity: 1; }
    .lbx_header .liboxClose:hover .leftright {
      -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      transform: rotate(-45deg); }
    .lbx_header .liboxClose:hover .rightleft {
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg); }

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