/*****************************************************
LESS compilation failed due a JavaScript error!

Input: /etc/designs/game/base/game-font.less
Error: FileError: 'css2?family=Montserrat:wght@400;500;600;700&family=Roboto:wght@400;500;700' wasn't found in /etc/designs/game/base/game-font.less on line 2, column 1:
1 @charset "UTF-8";
2 @import url(https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Roboto:wght@400;500;700);
3 


(uncompiled LESS src is included below)
*****************************************************/
@charset "UTF-8";
@import url(https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Roboto:wght@400;500;700);

meta.foundation-version {
  font-family: "/5.5.3/";
}
meta.foundation-mq-small {
  font-family: "/only screen/";
  width: 0;
}
meta.foundation-mq-small-only {
  font-family: "/only screen and (max-width: 40em)/";
  width: 0;
}
meta.foundation-mq-medium {
  font-family: "/only screen and (min-width:40.0625em)/";
  width: 40.0625em;
}
meta.foundation-mq-medium-only {
  font-family: "/only screen and (min-width:40.0625em) and (max-width:64em)/";
  width: 40.0625em;
}
meta.foundation-mq-large {
  font-family: "/only screen and (min-width:64.0625em)/";
  width: 64.0625em;
}
meta.foundation-mq-large-only {
  font-family: "/only screen and (min-width:64.0625em) and (max-width:90em)/";
  width: 64.0625em;
}
meta.foundation-mq-xlarge {
  font-family: "/only screen and (min-width:90.0625em)/";
  width: 90.0625em;
}
meta.foundation-mq-xlarge-only {
  font-family: "/only screen and (min-width:90.0625em) and (max-width:120em)/";
  width: 90.0625em;
}
meta.foundation-mq-xxlarge {
  font-family: "/only screen and (min-width:120.0625em)/";
  width: 120.0625em;
}
meta.foundation-data-attribute-namespace {
  font-family: false;
}
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-family: 'Montserrat', 'Roboto', 'Noto Sans TC', 'Noto Sans SC', 'Noto Sans JP', 'Noto Sans KR', 'Noto Sans Thai', 'Noto Sans Devanagari', 'Noto Sans Arabic', Arial, sans-serif;
}
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*:focus {
  outline: none !important;
}
html,
body {
  font-size: 100%;
}
body {
  background: #fff;
  color: #222;
  cursor: auto;
  font-family: 'Montserrat', 'Roboto', 'Noto Sans TC', 'Noto Sans SC', 'Noto Sans JP', 'Noto Sans KR', 'Noto Sans Thai', 'Noto Sans Devanagari', 'Noto Sans Arabic', Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  line-height: 1.5;
  margin: 0;
  padding: 0;
  position: relative;
}
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
p,
blockquote,
th,
td {
  margin: 0;
  padding: 0;
}
ul {
  list-style: none;
  margin: 0;
}
img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
  border-style: none;
}
svg {
  overflow: hidden;
  vertical-align: middle;
}
a:hover {
  cursor: pointer;
}
.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}
.clearfix:after {
  clear: both;
}

.container {
  width: 100%;
  padding-right: 20px;
  padding-left: 20px;
  margin-right: auto;
  margin-left: auto;
}
@media (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .container {
    max-width: 720px;
    padding-right: 40px;
    padding-left: 40px;
  }
}
@media (min-width: 992px) {
  .container {
    max-width: 960px;
  }
}
@media (min-width: 1200px) {
  .container {
    max-width: 1200px;
    padding-right: 0px;
    padding-left: 0px;
  }
}
.row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  margin-right: -15px;
  margin-left: -15px;
}
.form-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  margin-right: -5px;
  margin-left: -5px;
}
.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12,
.col,
.col-auto,
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm,
.col-sm-auto,
.col-md-1,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md,
.col-md-auto,
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg,
.col-lg-auto,
.col-xl-1,
.col-xl-2,
.col-xl-3,
.col-xl-4,
.col-xl-5,
.col-xl-6,
.col-xl-7,
.col-xl-8,
.col-xl-9,
.col-xl-10,
.col-xl-11,
.col-xl-12,
.col-xl,
.col-xl-auto {
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
}
.col-auto {
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  width: auto;
  max-width: 100%;
}
.col-1 {
  -ms-flex: 0 0 8.333333%;
  flex: 0 0 8.333333%;
  max-width: 8.333333%;
  width: 8.333333%;
}
.col-2 {
  -ms-flex: 0 0 16.666667%;
  flex: 0 0 16.666667%;
  max-width: 16.666667%;
  width: 16.666667%;
}
.col-3 {
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%;
  width: 25%;
}
.col-4 {
  -ms-flex: 0 0 33.333333%;
  flex: 0 0 33.333333%;
  max-width: 33.333333%;
  width: 33.333333%;
}
.col-5 {
  -ms-flex: 0 0 41.666667%;
  flex: 0 0 41.666667%;
  max-width: 41.666667%;
  width: 41.666667%;
}
.col-6 {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%;
  width: 50%;
}
.col-7 {
  -ms-flex: 0 0 58.333333%;
  flex: 0 0 58.333333%;
  max-width: 58.333333%;
  width: 58.333333%;
}
.col-8 {
  -ms-flex: 0 0 66.666667%;
  flex: 0 0 66.666667%;
  max-width: 66.666667%;
  width: 66.666667%;
}
.col-9 {
  -ms-flex: 0 0 75%;
  flex: 0 0 75%;
  max-width: 75%;
  width: 75%;
}
.col-10 {
  -ms-flex: 0 0 83.333333%;
  flex: 0 0 83.333333%;
  max-width: 83.333333%;
  width: 83.333333%;
}
.col-11 {
  -ms-flex: 0 0 91.666667%;
  flex: 0 0 91.666667%;
  max-width: 91.666667%;
  width: 91.666667%;
}
.col-12 {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
  width: 100%;
}
@media (min-width: 576px) {
  .col-sm {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    min-width: 0;
    max-width: 100%;
  }
  .col-sm-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .col-sm-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
    width: 8.333333%;
  }
  .col-sm-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
    width: 16.666667%;
  }
  .col-sm-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
    width: 25%;
  }
  .col-sm-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
    width: 33.333333%;
  }
  .col-sm-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
    width: 41.666667%;
  }
  .col-sm-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
    width: 50%;
  }
  .col-sm-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
    width: 58.333333%;
  }
  .col-sm-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
    width: 66.666667%;
  }
  .col-sm-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
    width: 75%;
  }
  .col-sm-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
    width: 83.333333%;
  }
  .col-sm-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
    width: 91.666667%;
  }
  .col-sm-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
  }
}
@media (min-width: 768px) {
  .col-md {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    min-width: 0;
    max-width: 100%;
  }
  .col-md-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .col-md-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
    width: 8.333333%;
  }
  .col-md-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
    width: 16.666667%;
  }
  .col-md-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
    width: 25%;
  }
  .col-md-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
    width: 33.333333%;
  }
  .col-md-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
    width: 41.666667%;
  }
  .col-md-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
    width: 50%;
  }
  .col-md-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
    width: 58.333333%;
  }
  .col-md-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
    width: 66.666667%;
  }
  .col-md-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
    width: 75%;
  }
  .col-md-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
    width: 83.333333%;
  }
  .col-md-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
    width: 91.666667%;
  }
  .col-md-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
  }
}
@media (min-width: 992px) {
  .col-lg {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    min-width: 0;
    max-width: 100%;
  }
  .col-lg-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .col-lg-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
    width: 8.333333%;
  }
  .col-lg-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
    width: 16.666667%;
  }
  .col-lg-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
    width: 25%;
  }
  .col-lg-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
    width: 33.333333%;
  }
  .col-lg-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
    width: 41.666667%;
  }
  .col-lg-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
    width: 50%;
  }
  .col-lg-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
    width: 58.333333%;
  }
  .col-lg-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
    width: 66.666667%;
  }
  .col-lg-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
    width: 75%;
  }
  .col-lg-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
    width: 83.333333%;
  }
  .col-lg-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
    width: 91.666667%;
  }
  .col-lg-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
  }
}
@media (min-width: 1200px) {
  .col-xl {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    min-width: 0;
    max-width: 100%;
  }
  .col-xl-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .col-xl-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
    width: 8.333333%;
  }
  .col-xl-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
    width: 16.666667%;
  }
  .col-xl-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
    width: 25%;
  }
  .col-xl-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
    width: 33.333333%;
  }
  .col-xl-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
    width: 41.666667%;
  }
  .col-xl-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
    width: 50%;
  }
  .col-xl-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
    width: 58.333333%;
  }
  .col-xl-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
    width: 66.666667%;
  }
  .col-xl-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
    width: 75%;
  }
  .col-xl-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
    width: 83.333333%;
  }
  .col-xl-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
    width: 91.666667%;
  }
  .col-xl-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
  }
}

.f_black {
  color: #000000 !important;
}
.f_white {
  color: #ffffff !important;
}
.f_gray {
  color: #9e9e9e !important;
}
.f_light_gray {
  color: #f2f2f2 !important;
}
.f_pastel_gray {
  color: #cccccc !important;
}
.f_dark_gray {
  color: #333333 !important;
}
.f_silver {
  color: #757575 !important;
}
.f_dark_liver {
  color: #4d4f52 !important;
}
.f_green {
  color: #4590a5 !important;
}
.f_light_green {
  color: #0cb2bd !important;
}
.bg_black {
  background-color: #000000;
}
.bg_white {
  background-color: #ffffff;
}
.bg_gray {
  background-color: #9e9e9e;
}
.bg_light_gray {
  background-color: #f2f2f2;
}
.bg_pastel_gray {
  background-color: #cccccc;
}
.bg_dark_gray {
  background-color: #333333;
}
.bg_silver {
  background-color: #757575;
}
.bg_dark_liver {
  background-color: #4d4f52;
}
.bg_green {
  background-color: #4590a5;
}
.bg_light_green {
  background-color: #0cb2bd;
}
.bg_transparent {
  background-color: transparent;
}
a {
  color: #0cb2bd;
}
a:hover {
  color: #4590a5;
  text-decoration: none;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Montserrat", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic", sans-serif;
  margin-top: 0;
  margin-bottom: 0.5rem;
}
p {
  margin-top: 0;
  margin-bottom: 1rem;
}
p,
span {
  font-family: "Roboto", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic", sans-serif;
}
ul,
ol,
dl {
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.6;
  list-style-position: outside;
  margin-bottom: 1.25rem;
}
input:not([type="checkbox"]):not([type="radio"]),
textarea:not([type="radio"]) {
  -webkit-appearance: none;
  -moz-appearance: none;
  border-radius: 0;
  background-color: #FFFFFF;
  border-style: solid;
  border-width: 1px;
  border-color: #cccccc;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  color: rgba(0, 0, 0, 0.75);
  display: block;
  font-family: inherit;
  font-size: 0.875rem;
  height: 2.3125rem;
  margin: 0 0 1rem 0;
  padding: 0.5rem;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: border-color 0.15s linear, background 0.15s linear;
  -moz-transition: border-color 0.15s linear, background 0.15s linear;
  -ms-transition: border-color 0.15s linear, background 0.15s linear;
  -o-transition: border-color 0.15s linear, background 0.15s linear;
  transition: border-color 0.15s linear, background 0.15s linear;
}
.visible-xs {
  display: none !important;
}
@media (max-width: 800px) {
  .visible-xs {
    display: block !important;
  }
}
.hidden-xs {
  display: block !important;
}
@media (max-width: 800px) {
  .hidden-xs {
    display: none !important;
  }
}
.visible-xs-flex {
  display: none !important;
}
@media (max-width: 800px) {
  .visible-xs-flex {
    display: flex !important;
  }
}
.hidden-xs-flex {
  display: flex !important;
}
@media (max-width: 800px) {
  .hidden-xs-flex {
    display: none !important;
  }
}
table {
  background: #ffffff;
  border: solid 1px #cccccc;
  margin-bottom: 1.25rem;
  table-layout: auto;
}
table caption {
  background: transparent;
  color: #222222;
  font-size: 1rem;
  font-weight: bold;
}
table thead {
  background: #F5F5F5;
}
table thead tr th,
table thead tr td {
  color: #222222;
  font-size: 0.875rem;
  font-weight: bold;
  padding: 0.5rem 0.625rem 0.625rem;
}
table tfoot {
  background: #F5F5F5;
}
table tfoot tr th,
table tfoot tr td {
  color: #222222;
  font-size: 0.875rem;
  font-weight: bold;
  padding: 0.5rem 0.625rem 0.625rem;
}
table tr th,
table tr td {
  color: #222222;
  font-size: 0.875rem;
  padding: 0.5625rem 0.625rem;
  text-align: left;
}
table tr:nth-of-type(even) {
  background: #f2f2f2;
}
button {
  -webkit-appearance: none;
  -moz-appearance: none;
  border-radius: 0;
  border-style: solid;
  border-width: 0;
  cursor: pointer;
  font-family: "Montserrat", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic", sans-serif;
  font-weight: normal;
  line-height: normal;
  position: relative;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  padding: 1rem 2rem 1.0625rem 2rem;
  font-size: 1rem;
  color: #FFFFFF;
  transition: background-color 300ms ease-out;
}
.collapse:not(.in) {
  display: none;
}
.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  transition: height 0.35s ease;
}
@media (prefers-reduced-motion: reduce) {
  .collapsing {
    transition: none;
  }
}
.modal-open {
  overflow: hidden;
}
.modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto;
}
.modal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1070;
  display: none;
  width: 100%;
  height: 100%;
  overflow: hidden;
  outline: 0;
}
.modal-dialog {
  position: relative;
  width: auto;
  margin: 0.5rem;
  pointer-events: none;
}
.modal.fade .modal-dialog {
  transition: -webkit-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
  -webkit-transform: translate(0, -50px);
  transform: translate(0, -50px);
}
@media (prefers-reduced-motion: reduce) {
  .modal.fade .modal-dialog {
    transition: none;
  }
}
.modal.show .modal-dialog,
.modal.in .modal-dialog {
  -webkit-transform: translate(0, 50%);
  transform: translate(0, 50%);
}
.modal.modal-static .modal-dialog {
  -webkit-transform: scale(1.02);
  transform: scale(1.02);
}
.modal-dialog-scrollable {
  display: -ms-flexbox;
  display: flex;
  max-height: calc(99%);
}
.modal-dialog-scrollable .modal-content {
  max-height: calc(99vh);
  overflow: hidden;
}
.modal-dialog-scrollable .modal-header,
.modal-dialog-scrollable .modal-footer {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.modal-dialog-scrollable .modal-body {
  overflow-y: auto;
}
.modal-dialog-centered {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  min-height: calc(99%);
}
.modal-dialog-centered::before {
  display: block;
  height: calc(99vh);
  height: -webkit-min-content;
  height: -moz-min-content;
  height: min-content;
  content: "";
}
.modal-dialog-centered.modal-dialog-scrollable {
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: center;
  justify-content: center;
  height: 100%;
}
.modal-dialog-centered.modal-dialog-scrollable .modal-content {
  max-height: none;
}
.modal-dialog-centered.modal-dialog-scrollable::before {
  content: none;
}
.modal-content {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  pointer-events: auto;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 0.3rem;
  outline: 0;
}
.modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1040;
  width: 100vw;
  height: 100vh;
  background-color: #000;
}
.modal-backdrop.fade {
  opacity: 0;
}
.modal-backdrop.show,
.modal-backdrop.in {
  opacity: 0.6;
}
.modal-header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 1rem 1rem;
  border-bottom: 1px solid #dee2e6;
  border-top-left-radius: calc(-0.7rem);
  border-top-right-radius: calc(-0.7rem);
}
.modal-header .close {
  padding: 1rem 1rem;
  margin: -1rem -1rem -1rem auto;
}
.close {
  float: right;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  opacity: .5;
}
.close:hover {
  color: #000;
  text-decoration: none;
}
.close:not(:disabled):not(.disabled):hover,
.close:not(:disabled):not(.disabled):focus {
  opacity: .75;
}
button.close {
  padding: 0;
  background-color: transparent;
  border: 0;
}
a.close.disabled {
  pointer-events: none;
}
.modal-title {
  margin-bottom: 0;
  line-height: 1.5;
}
.modal-body {
  position: relative;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  padding: 1rem;
}
.modal-footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: end;
  justify-content: flex-end;
  padding: 0.75rem;
  border-top: 1px solid #dee2e6;
  border-bottom-right-radius: calc(-0.7rem);
  border-bottom-left-radius: calc(-0.7rem);
}
.modal-footer > * {
  margin: 0.25rem;
}
.modal-scrollbar-measure {
  position: absolute;
  top: -9999px;
  width: 50px;
  height: 50px;
  overflow: scroll;
}
@media (min-width: 576px) {
  .modal-dialog {
    max-width: 500px;
    margin: 1.75rem auto;
  }
  .modal-dialog-scrollable {
    max-height: calc(96.5%);
  }
  .modal-dialog-scrollable .modal-content {
    max-height: calc(96.5vh);
  }
  .modal-dialog-centered {
    min-height: calc(96.5%);
  }
  .modal-dialog-centered::before {
    height: calc(96.5vh);
    height: -webkit-min-content;
    height: -moz-min-content;
    height: min-content;
  }
  .modal-sm {
    max-width: 300px;
  }
}
@media (min-width: 992px) {
  .modal-lg,
  .modal-xl {
    max-width: 800px;
  }
}
@media (min-width: 1200px) {
  .modal-xl {
    max-width: 1140px;
  }
}
.tooltip {
  position: relative;
  cursor: pointer;
}
@media (min-width:992px) {
  .tooltip:hover .tooltip-content {
    visibility: visible;
  }
}
.tooltip .tooltip-content {
  background: #ffffff;
  box-shadow: 0px 0px 10px #4590A5;
  border-radius: 4px;
  padding: 30px 20px;
  font: normal 700 14px "Roboto", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic";
  line-height: 16px;
  letter-spacing: 0px;
  min-width: 260px;
  color: #757575;
}
@media (min-width:992px) {
  .tooltip .tooltip-content {
    visibility: hidden;
    position: absolute;
    left: 100%;
    top: 50%;
    transform: translate(8px, -50%);
    z-index: 1;
  }
}
.tooltip .tooltip-content h6 {
  margin: 16px 0 8px 0;
  line-height: 16px;
  font: normal 700 14px "Roboto", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic";
  color: #363636;
}
.tooltip .tooltip-content p {
  line-height: 16px;
  font: normal normal 14px "Roboto", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic";
  color: #757575;
  margin-bottom: 0;
}
.tooltip .tooltip-content .modal-header {
  position: absolute;
  top: 5px;
  right: 10px;
  padding: 0;
}
.tooltip-modal .modal-dialog {
  max-width: 720px;
}
.tooltip-modal .modal-dialog .modal-header {
  border-bottom: none;
}
@media (min-width:992px) {
  .tooltip-modal .modal-dialog .modal-header .close span:before,
  .tooltip-modal .modal-dialog .modal-header .close span:after {
    content: ' ';
    position: absolute;
    height: 20px;
    width: 3px;
    top: 15px;
    right: 20px;
    background-color: #4D4F52;
  }
  .tooltip-modal .modal-dialog .modal-header .close span:before {
    transform: rotate(45deg);
  }
  .tooltip-modal .modal-dialog .modal-header .close span:after {
    transform: rotate(-45deg);
  }
  .tooltip-modal .modal-dialog .modal-header span {
    color: transparent;
  }
}
.tooltip-modal .modal-dialog .modal-body {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 80px 60px 80px;
  overflow: auto;
}
@media (max-width:991px) {
  .tooltip-modal .modal-dialog .modal-body {
    justify-content: flex-start;
    padding-bottom: 40px;
    margin-bottom: 20px;
    margin-left: 20px;
  }
}
@media (max-width: 425px) {
  .tooltip-modal .modal-dialog .modal-body {
    padding-left: 0px;
  }
}
.tooltip-modal .modal-dialog .modal-body .modal-table-item {
  margin: 0;
}
.tooltip-modal .modal-dialog .modal-body .modal-table-item li {
  width: 140px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  border: 1px solid #cccccc;
}
.tooltip-modal .modal-dialog .modal-body .modal-table-item li.item-title {
  justify-content: flex-end;
}
.tooltip-modal .modal-dialog .modal-body .modal-table-item li.item-title span {
  font: normal normal 12px "Montserrat", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic";
  line-height: 15px;
  text-align: center;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.tooltip-modal .modal-dialog .modal-body .modal-table-item li.item-title h3 {
  font: normal bold 18px "Roboto", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic";
  line-height: 30px;
  text-align: center;
  letter-spacing: 0.02em;
}
.tooltip-modal .modal-dialog .modal-body::-webkit-scrollbar {
  height: 2px;
}
.tooltip-modal .modal-dialog .modal-body::-webkit-scrollbar-track {
  background: #f2f2f2;
  border-radius: 10px;
}
.tooltip-modal .modal-dialog .modal-body::-webkit-scrollbar-thumb {
  background: #9e9e9e;
  border-radius: 10px;
}
#loading-overlay {
  z-index: 9999;
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
#loading-overlay.active {
  display: flex;
}
#loading-overlay .loading-background {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  background: #ffffff;
  opacity: 0.5;
}
.energy-label {
  margin-top: 30px;
}
@media (max-width:991px) {
  .energy-label {
    padding-top: 20px;
  }
}
.energy-label .icon {
  width: 58px;
  height: 32px;
}
.energy-label .icon img {
  width: inherit;
  height: inherit;
  margin-right: 20px;
}
@media (max-width:991px) {
  .energy-label .icon img {
    margin-right: 15px;
  }
}
.energy-label a {
  color: #000000;
  text-decoration: underline !important;
  font: normal 400 12px "Roboto", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic";
  line-height: 18px;
  letter-spacing: 0em;
}
.energy-label a:hover {
  color: #000000;
}
@media (min-width:992px) {
  .com_title.title_lg h1,
  .com_title.title_lg h2,
  .com_title.title_lg h3,
  .com_title.title_lg div {
    font-size: 48px;
    line-height: 1.3;
  }
  .com_title.title_md h1,
  .com_title.title_md h2,
  .com_title.title_md h3,
  .com_title.title_md div {
    font-size: 37px;
    line-height: 1.3;
  }
  .com_title.title_sm h1,
  .com_title.title_sm h2,
  .com_title.title_sm h3,
  .com_title.title_sm div {
    font-size: 27px;
    line-height: 1.3;
  }
}
@media (max-width:768px) {
  .com_title h1,
  .com_title h2,
  .com_title h3,
  .com_title div {
    font-family: "Montserrat", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic", sans-serif;
  }
}
@media (min-width:992px) {
  .com_sub_title.sub_title_lg {
    font-size: 60px;
    line-height: 1.3;
  }
  .com_sub_title.sub_title_md {
    font-size: 27px;
    line-height: 1.3;
  }
  .com_sub_title.sub_title_sm {
    font-size: 21px;
    line-height: 1.3;
  }
}
@media (max-width:768px) {
  .com_sub_title.sub_title_lg,
  .com_sub_title.sub_title_md,
  .com_sub_title.sub_title_sm {
    font-family: "Montserrat", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic", sans-serif;
  }
}
@media (min-width:992px) {
  .com_text.text_lg p {
    font-size: 21px;
    line-height: 1.25;
  }
  .com_text.text_md p {
    font-size: 18px;
    line-height: 1.25;
  }
  .com_text.text_sm p {
    font-size: 16px;
    line-height: 1.25;
  }
}
.text.parbase .com_text {
  font-size: 18px;
  line-height: 1.25;
}
.text.parbase .com_text a {
  color: #0cb2bd;
  text-decoration: none;
}
.text.parbase .com_text a:hover {
  color: #4590a5;
}
.text.parbase .com_text .text-20 {
  font-size: 20px;
}
.text.parbase .com_text .text-18 {
  font-size: 18px;
}
.text.parbase .com_text .text-16 {
  font-size: 16px;
}
.text.parbase .com_text .text-14 {
  font-size: 14px;
}
.text.parbase .com_text .text-12 {
  font-size: 12px;
}
.text.parbase .com_text h2 {
  font-size: 60px;
  line-height: 1.3;
}
.text.parbase .com_text h3 {
  font-size: 48px;
  line-height: 1.3;
}
.text.parbase .com_text h4 {
  font-size: 37px;
  line-height: 1.3;
}
.text.parbase .com_text h5 {
  font-size: 27px;
  line-height: 1.3;
}
.text.parbase .com_text h6 {
  font-size: 21px;
  line-height: 1.3;
}
.text.parbase .com_text p {
  font-size: 16px;
  line-height: 1.25;
}
.column-control .row {
  max-width: 100%;
  margin: 0;
  display: block;
}
.column-control .row .cols-flex {
  display: flex;
}
@media (max-width:800px) {
  .column-control .row .cols-flex {
    display: block;
  }
}
.column-control .row .multiColWrap {
  width: 50%;
  display: flex;
}
@media (max-width:800px) {
  .column-control .row .multiColWrap {
    width: 100%;
    display: table;
    table-layout: fixed;
  }
}
@media (max-width:800px) {
  .com_container.v_align .multiColWrap [class*="col-"] {
    display: table-cell;
    float: none;
  }
}
.v_align.v_align_top.com_container .multiColWrap {
  align-items: flex-start;
}
.v_align.v_align_middle.com_container .multiColWrap {
  align-items: center;
}
.v_align.v_align_bottom.com_container .multiColWrap {
  align-items: flex-end;
}
@media (max-width:991px) {
  .v_align.v_align_top.com_container [class*="col-"] {
    max-width: 100%;
  }
}
.com_btn_wrap {
  display: flex;
}
.com_btn_wrap.hollow .com_btn,
.com_btn_wrap.solid .com_btn {
  font: normal bold 14px "Montserrat", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic";
  letter-spacing: 0.08em;
  text-transform: capitalize;
  border-radius: 100px;
  padding: 0 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  display: flex !important;
  margin: 0;
}
.com_btn_wrap.hollow .com_btn.large,
.com_btn_wrap.solid .com_btn.large {
  height: 46px;
}
.com_btn_wrap.hollow .com_btn.small,
.com_btn_wrap.solid .com_btn.small {
  height: 38px;
}
.com_btn_wrap.hollow .com_btn:hover,
.com_btn_wrap.solid .com_btn:hover {
  text-decoration: none;
}
.com_btn_wrap.hollow .com_btn {
  color: #cc0040;
  border-color: #cc0040;
  background-color: transparent;
}
.com_btn_wrap.hollow .com_btn:hover {
  color: #cc0040;
  border-color: #cc0040;
  background-color: transparent;
}
.com_btn_wrap.hollow.f_white .com_btn {
  color: #ffffff;
  border-color: #ffffff;
  background-color: transparent;
}
.com_btn_wrap.hollow.f_white .com_btn:hover {
  color: #ffffff;
  border-color: #ffffff;
  background-color: transparent;
}
.com_btn_wrap.hollow.f_black .com_btn {
  color: #000000;
  border-color: #000000;
  background-color: transparent;
}
.com_btn_wrap.hollow.f_black .com_btn:hover {
  color: #000000;
  border-color: #000000;
  background-color: transparent;
}
.com_btn_wrap.solid .com_btn {
  color: #ffffff;
  background-color: #cc0040;
  border-color: #cc0040;
}
.com_btn_wrap.solid .com_btn:hover {
  color: #ffffff;
  border-color: #cc0040;
  background-color: #cc0040;
}
.com_btn_wrap.solid.f_white .com_btn {
  color: #000000;
  background-color: #ffffff;
  border-color: #ffffff;
}
.com_btn_wrap.solid.f_white .com_btn:hover {
  color: #000000;
  border-color: #ffffff;
  background-color: #ffffff;
}
.com_btn_wrap.solid.f_black .com_btn {
  color: #ffffff;
  background-color: #000000;
  border-color: #000000;
}
.com_btn_wrap.solid.f_black .com_btn:hover {
  color: #ffffff;
  border-color: #000000;
  background-color: #000000;
}
.com_btn_wrap.full-btn .com_btn {
  width: 100%;
}
.com_btn_wrap.text-left {
  justify-content: flex-start;
}
.com_btn_wrap.text-center {
  justify-content: center;
}
.com_btn_wrap.text-right {
  justify-content: flex-end;
}
.com_btn_wrap.reset-margin {
  margin: 0;
}
.review_tab_area li {
  font-family: "Montserrat", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic", sans-serif;
}
.review_tab_area li.selected {
  box-shadow: inset 0 -5px 0 #cc0040 !important;
  color: #cc0040 !important;
}
.block .bg_black .review_tab_area li,
.block .bg_dark_liver .review_tab_area li,
.block .bg_dark_gray .review_tab_area li,
.block .bg_silver .review_tab_area li {
  color: #ffffff;
}
.block .bg_white .review_tab_area li,
.block .bg_light_gray .review_tab_area li,
.block .bg_pastel_gray .review_tab_area li {
  color: #000000;
}
.block.text_on_img .com_container {
  width: 100%;
}
.colContainerTwo .block.text_on_img .com_container {
  width: 100%;
}
#locale-switcher {
  display: none;
  background: #f2f2f2;
}
@media (max-width: 386px) {
  #locale-switcher {
    min-height: 202px;
  }
}
@media (max-width: 767px) {
  #locale-switcher {
    min-height: 184px;
  }
}
@media (max-width: 991px) {
  #locale-switcher {
    min-height: 166px;
  }
}
#locale-switcher .container {
  background: #f2f2f2;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font: normal normal 16px "Roboto", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic";
  line-height: 18px;
  letter-spacing: 0.02em;
  color: #000000;
  height: 100px;
  z-index: 1000;
}
#locale-switcher .container p {
  margin-right: 40px;
  margin-bottom: 0;
}
#locale-switcher .container p.ec {
  display: block;
}
#locale-switcher .container p.none {
  display: none;
}
#locale-switcher .container .language {
  margin-right: 20px;
  padding: 0 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #ffffff;
  height: 40px;
  width: 220px;
  position: relative;
  cursor: pointer;
}
#locale-switcher .container .language .toggle {
  width: 8px;
  height: 8px;
  border-top: 2px solid #000000;
  border-right: 2px solid #000000;
  transform: rotate(135deg) translateY(50%);
  transition: 0.3s;
}
#locale-switcher .container .language .language-change {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  background: #ffffff;
  z-index: 1001;
  bottom: -40px;
  left: 0;
  color: #4590a5;
}
#locale-switcher .container .language .language-change .toggle {
  opacity: 0;
}
#locale-switcher .container .language.active .language-change {
  display: flex;
  align-items: center;
  justify-content: space-around;
}
#locale-switcher .container .language.active .toggle {
  transform: rotate(-45deg);
}
#locale-switcher .container a {
  font-family: "Roboto", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic";
}
#locale-switcher .container a.change-btn {
  background: #333333;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 136px;
  height: 40px;
  color: #ffffff;
}
#locale-switcher .container a.close {
  position: absolute;
  width: 28px;
  height: 28px;
  right: -14px;
  top: 35%;
  opacity: 1;
}
#locale-switcher .container a.close::before {
  content: "";
  position: absolute;
  right: 14px;
  width: 1.5px;
  height: 28px;
  background: #000000;
  transform: rotate(45deg);
}
#locale-switcher .container a.close::after {
  content: "";
  position: absolute;
  right: 14px;
  width: 1.5px;
  height: 28px;
  background: #000000;
  transform: rotate(-45deg);
}
@media (max-width:991px) {
  #locale-switcher .container {
    display: block;
    height: auto;
  }
  #locale-switcher .container p {
    width: 90%;
    margin: 0;
    padding-top: 20px;
  }
  #locale-switcher .container p.none {
    padding-bottom: 20px;
  }
  #locale-switcher .container .language {
    margin: 20px 0 8px 0;
  }
  #locale-switcher .container .language.active {
    margin-bottom: 48px;
  }
  #locale-switcher .container .change {
    padding-bottom: 20px;
  }
  #locale-switcher .container a.close {
    right: 20px;
    top: 20px;
  }
}
.cookies-tip {
  background: #4d4f52;
  color: #ffffff;
  font: normal normal 14px "Roboto", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic";
  line-height: 18px;
  position: fixed;
  z-index: 99;
  bottom: 0;
  min-width: 320px;
  width: 100%;
  padding-top: 20px;
  padding-bottom: 40px;
  z-index: 1000;
}
.cookies-tip .tip-content {
  margin: auto;
  max-width: 1280px;
  padding: 0 20px;
}
.cookies-tip .tip-content .btn-content {
  display: block;
  margin-top: 20px;
}
.cookies-tip .tip-content .btn-content span {
  display: inline-block;
}
.cookies-tip .tip-content .settinglink {
  margin-right: 40px;
  display: inline-block;
  font-weight: normal;
  color: #000000;
  text-decoration: underline;
}
@media (max-width: 1024px) {
  .cookies-tip {
    text-align: left;
  }
}
.cookies-tip a {
  font: normal bold 14px "Roboto", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic";
  line-height: 140%;
  color: #ffffff;
}
.cookies-tip .close {
  display: inline-block;
  color: #ffffff;
  text-decoration: none;
  padding: 5px 24px;
  background-color: #000000;
  border-radius: 4px;
  margin-right: 40px;
  opacity: 1;
  line-height: inherit;
  text-shadow: none;
  text-align: center;
  min-width: 120px;
  float: none;
}
@media (max-width:800px) {
  .cookies-tip {
    padding-top: 20px;
    padding-bottom: 0px;
  }
  .cookies-tip .close {
    margin-bottom: 10px;
    margin-right: 60px;
  }
  .cookies-tip .tip-content .btn-content {
    margin-top: 20px;
  }
  .cookies-tip .tip-content .btn-content span {
    padding-bottom: 40px;
  }
}
#liveSupport {
  position: fixed;
  height: 50px;
  width: 50px;
  right: 1%;
  bottom: 12%;
  z-index: 16;
  background-color: #CC0040;
  border-radius: 100%;
  box-shadow: 1px 1px 9px rgba(0, 0, 0, 0.6);
}
#liveSupport .liveSupportBtn span,
#liveSupport .liveSupportArea {
  display: none;
}
#liveSupport .liveSupportBtn {
  width: 100%;
  height: 100%;
  position: relative;
}
#liveSupport .liveSupportBtn img {
  padding: 27%;
}
#liveSupport .liveSupportBtn ul {
  display: flex;
  width: 30px;
  position: absolute;
  top: 45%;
  left: 30%;
}
#liveSupport .liveSupportBtn ul li {
  border-radius: 100%;
  width: 3px;
  border: 3px solid #CC0040;
  background: #CC0040;
  margin-left: 3px;
}
#liveSupport.on {
  background-color: #000000;
}
#liveSupport.on .liveSupportArea {
  background: #FFFFFF;
  box-shadow: 1px 1px 9px rgba(0, 0, 0, 0.6);
  border-radius: 4px;
  display: block;
  position: absolute;
  top: -200px;
  right: 0;
  width: 220px;
  padding: 28%;
}
#liveSupport.on .liveSupportArea ul li a {
  font-family: "Roboto", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic";
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  letter-spacing: 0.02em;
  color: #000000;
}
#liveSupport.on .liveSupportArea ul li:nth-child(-n + 2) {
  margin-bottom: 20px;
}
#liveSupport.on .liveSupportArea ul li:first-child::before {
  content: url('images/live_support/livesupport_twitter.svg');
  margin-right: 12px;
  vertical-align: text-top;
}
#liveSupport.on .liveSupportArea ul li:nth-child(2)::before {
  content: url('images/live_support/livesupport_email.svg');
  margin-right: 12px;
  vertical-align: text-top;
}
#liveSupport.on .liveSupportArea ul li:nth-child(3)::before {
  content: url('images/live_support/livesupport_phone.svg');
  margin-right: 15px;
  vertical-align: text-top;
}
#liveSupport.on .liveSupportArea ul li:last-child {
  font-size: 12px;
  line-height: 15px;
  color: #757575;
  margin-left: 32px;
}
#liveSupport.on .liveSupportBtn {
  position: absolute;
  top: 0;
  left: 0;
}
#liveSupport.on .liveSupportBtn ul {
  display: none;
}
#liveSupport.on .liveSupportBtn span {
  display: block;
  padding-top: 2px;
  opacity: 1;
}
#liveSupport.on .liveSupportBtn img {
  display: none;
}
#liveSupport.on .liveSupportBtn span::before {
  content: '';
  width: 40%;
  padding-top: 3px;
  background-color: #FFFFFF;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  left: 30%;
}
#liveSupport.on .liveSupportBtn span::after {
  content: '';
  width: 40%;
  padding-top: 3px;
  background-color: #FFFFFF;
  transform: rotate(-45deg);
  position: absolute;
  top: 50%;
  left: 30%;
}
@media (max-width:800px) {
  #liveSupport {
    bottom: 3%;
    right: 2%;
    transform: scale(0.9);
  }
  #liveSupport.on .liveSupportArea {
    width: 225px;
  }
  #liveSupport.on .liveSupportArea ul li a {
    font-size: 16px;
  }
}
#goTop {
  color: #9e9e9e;
  position: fixed;
  right: calc(1% - 4px);
  bottom: 3%;
  cursor: pointer;
  z-index: 15;
}
@media (min-width:1024px) {
  #goTop {
    bottom: 5%;
  }
}
@media (max-width:800px) {
  #goTop {
    bottom: 1%;
    right: calc(2% - 4px);
    transform: scale(0.9);
  }
}
/* CLS Optimize */
.game-breadcrumb .container.bread {
  max-width: 1200px;
}
.game-breadcrumb .container.bread p {
  margin: 12px 0;
}
.game-breadcrumb .container.bread a {
  font: normal bold 14px "Roboto", "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "Noto Sans Thai", "Noto Sans Devanagari", "Noto Sans Arabic";
  line-height: 14px;
  color: #4590a5;
}
.game-breadcrumb .container.bread a span {
  margin-right: 19px;
}
/* CLS Optimize End*/
.nav-bar span {
  font-family: inherit;
}