@charset "UTF-8";
html { font-size: 16px; height: 100%; scroll-behavior: smooth; background-color: #000; }

body { position: relative; display: -ms-flex; display: flex; -ms-flex-direction: column; flex-direction: column; min-height: 100%; font-family: Helvetica, "Helvetica Neue", Arial, "微軟正黑體", "Microsoft JhengHei", "Microsoft YaHei", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "LiHei Pro", sans-serif; line-height: initial; letter-spacing: 0; word-break: break-word; overflow-wrap: break-word; color: #fff; background: linear-gradient(to right, #0f111a, #0d0e0f); }

.wrap { background: radial-gradient(ellipse 100% 415px at bottom, #000f76, rgba(0, 0, 0, 0)); }

.fa, .far, .fas { font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome 5 Pro", "Font Awesome 5 Brands", Helvetica, Helvetica Neue, Arial, 微軟正黑體, Microsoft JhengHei, Microsoft YaHei, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC, LiHei Pro, sans-serif; }

.transition { -o-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }

a { color: inherit; text-decoration: none; outline: 0; transition: 0.3s ease; transition-property: color, border-color, background-color, opacity, filter, transform; }

a:hover { text-decoration: none; }

a:focus { text-decoration: none; }

a[onclick] { cursor: pointer; }

[type=checkbox], [type=radio] { width: 1rem; height: 1rem; vertical-align: middle; }

::-moz-placeholder { color: rgba(255, 255, 255, 0.8); }

:-ms-input-placeholder { /** notice that ie has only a single colon) */ color: rgba(255, 255, 255, 0.8); }

::-webkit-input-placeholder { color: rgba(255, 255, 255, 0.8); }

::placeholder { color: rgba(255, 255, 255, 0.8); }

tr, th, td { margin: initial; padding: initial; line-height: 1.5; }

:root { --swiper-theme-color: #00e6ff; }

.text-gray { color: #828282 !important; }

.text-dark { color: #333 !important; }

.text-black { color: #000 !important; }

.text-brand-inlight { color: #00cfe6 !important; }

.text-success-inlight { color: #00c04d !important; }

.text-danger-inlight { color: #c90043 !important; }

.text-warning-inlight { color: #f9b20f !important; }

.text-color-reset { color: #fff; }

.text-dark-30 { color: rgba(51, 51, 51, 0.3); }

.text-body-50 { color: rgba(255, 255, 255, 0.5); }

.text-body-60 { color: rgba(255, 255, 255, 0.6); }

.text-body-70 { color: rgba(255, 255, 255, 0.7); }

.text-body-80 { color: rgba(255, 255, 255, 0.8); }

.text-brand-line { color: #06C755; }

.text-brand-facebook { color: #1877F2; }

.text-brand-youtube { color: #f00; }

.hover-brand:hover { color: #00e6ff; }

.hover-warning:hover { color: #ffdf00; }

.hover-danger:hover { color: #e2004b; }

.bg-brand-dark-thin, .bg-brand-drak-thin { background-color: rgba(0, 136, 255, 0.2); }

.bg-brand-30 { background-color: rgba(0, 230, 255, 0.3); }

.bg-brand-40 { background-color: rgba(0, 230, 255, 0.4); }

.bg-body { background: linear-gradient(to right, #0f111a, #0d0e0f); }

.bg-light-10 { background: rgba(255, 255, 255, 0.1); }

.bg-gradient { background: linear-gradient(to right, #0f111a, #0d0e0f); }

.bg-gradient-danger { background: linear-gradient(#e2004b, #af003a); }

.bg-gradient-food { background: linear-gradient(#036F9E, transparent 145px); }

.hoverBg-brand-dark-thin:hover, .hoverBg-brand-drak-thin:hover { background-color: rgba(0, 136, 255, 0.2); }

.hoverBg-light-80:hover { background-color: rgba(255, 255, 255, 0.8) !important; }

.bg-brand-line { background-color: #06C755; }

.bg-brand-facebook { background-color: #1877F2; }

.bg-meteor { background: url(../images/bg_1_top.png) center top no-repeat, url(../images/bg_1_btm.png) center bottom no-repeat; background-size: 100% auto, 100% auto; }

.bg-wave { background: url(../images/bg_wave_mobile@2x.png) center bottom no-repeat; background-size: 100% auto; }
@media (min-width: 768px) { .bg-wave { background-image: url(../images/bg_wave@2x.png); } }

.bg-none { background: none; }

@media (min-width: 1200px) { .bg-xl-none { background: none; } }
.table-border-body-30 th, .table-border-body-30 td { border-color: rgba(255, 255, 255, 0.3); }

.border-top-dots { border-top: dotted 5px; }

.border-color-default { border-color: rgba(0, 230, 255, 0.5) !important; }

.border-currentColor { border-color: currentColor !important; }

.border-brand-thin { border-color: rgba(0, 230, 255, 0.3) !important; }

.border-body { border-color: #fff; }

.border-body-opacity { border-color: rgba(255, 255, 255, 0.3) !important; }

.border-body-opacity-10 { border-color: rgba(255, 255, 255, 0.1) !important; }

.border-body-opacity-20 { border-color: rgba(255, 255, 255, 0.2) !important; }

.border-body-opacity-30 { border-color: rgba(255, 255, 255, 0.3) !important; }

.border-body-opacity-50 { border-color: rgba(255, 255, 255, 0.5) !important; }

.border-glow-top-right { position: relative; }
.border-glow-top-right::before { content: ""; position: absolute; top: 0; left: 0; transform: translateY(-50%); width: 50%; height: 5px; background: radial-gradient(farthest-side, #00e6ff, rgba(0, 0, 0, 0)); }

@media (min-width: 768px) { .border-md { border: solid 1px rgba(0, 230, 255, 0.5); } }
.font-monospace { font-family: 'Courier New', Courier, monospace; }

.font-family-reset { font-family: Helvetica, "Helvetica Neue", Arial, "微軟正黑體", "Microsoft JhengHei", "Microsoft YaHei", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "LiHei Pro", sans-serif; }

.font-8 { font-size: 0.5rem !important; }

.font-9 { font-size: 0.563rem !important; }

.font-10 { font-size: 0.625rem !important; }

.font-11 { font-size: 0.688rem !important; }

.font-12 { font-size: 0.75rem !important; }

.font-13 { font-size: 0.813rem !important; }

.font-14 { font-size: 0.875rem !important; }

.font-15 { font-size: 0.938rem !important; }

.font-16 { font-size: 1rem !important; }

.font-17 { font-size: 1.063rem !important; }

.font-18 { font-size: 1.125rem !important; }

.font-19 { font-size: 1.188rem !important; }

.font-20 { font-size: 1.25rem !important; }

.font-21 { font-size: 1.313rem !important; }

.font-22 { font-size: 1.375rem !important; }

.font-23 { font-size: 1.438rem !important; }

.font-24 { font-size: 1.5rem !important; }

.font-25 { font-size: 1.563rem !important; }

.font-36 { font-size: 36px !important; }

.font-50 { font-size: 50px !important; }

.font-60 { font-size: 60px !important; }

.font-80 { font-size: 80px !important; }

.font-90 { font-size: 90px !important; }

.font-95 { font-size: 95px !important; }

.font-100 { font-size: 100px !important; }

.font-120 { font-size: 120px !important; }

.font-1em { font-size: 1em !important; }

.font-2em { font-size: 2em !important; }

.font-size-inherit { font-size: inherit !important; }

.big { font-size: 1.125em; }

.bigger { font-size: 1.25em; }

.smaller { font-size: 0.75em; }

@media (min-width: 768px) { .font-md-8 { font-size: 0.5rem !important; }
  .font-md-9 { font-size: 0.563rem !important; }
  .font-md-10 { font-size: 0.625rem !important; }
  .font-md-11 { font-size: 0.688rem !important; }
  .font-md-12 { font-size: 0.75rem !important; }
  .font-md-13 { font-size: 0.813rem !important; }
  .font-md-14 { font-size: 0.875rem !important; }
  .font-md-15 { font-size: 0.938rem !important; }
  .font-md-16 { font-size: 1rem !important; }
  .font-md-17 { font-size: 1.063rem !important; }
  .font-md-18 { font-size: 1.125rem !important; }
  .font-md-19 { font-size: 1.188rem !important; }
  .font-md-20 { font-size: 1.25rem !important; }
  .font-md-21 { font-size: 1.313rem !important; }
  .font-md-22 { font-size: 1.375rem !important; }
  .font-md-23 { font-size: 1.438rem !important; }
  .font-md-24 { font-size: 1.5rem !important; }
  .font-md-25 { font-size: 1.563rem !important; }
  .font-md-1em { font-size: 1em !important; } }
@media (min-width: 992px) { .font-md-8 { font-size: 0.5rem !important; }
  .font-md-9 { font-size: 0.563rem !important; }
  .font-md-10 { font-size: 0.625rem !important; }
  .font-md-11 { font-size: 0.688rem !important; }
  .font-md-12 { font-size: 0.75rem !important; }
  .font-md-13 { font-size: 0.813rem !important; }
  .font-md-14 { font-size: 0.875rem !important; }
  .font-md-15 { font-size: 0.938rem !important; }
  .font-md-16 { font-size: 1rem !important; }
  .font-md-17 { font-size: 1.063rem !important; }
  .font-md-18 { font-size: 1.125rem !important; }
  .font-md-19 { font-size: 1.188rem !important; }
  .font-md-20 { font-size: 1.25rem !important; }
  .font-md-21 { font-size: 1.313rem !important; }
  .font-md-22 { font-size: 1.375rem !important; }
  .font-md-23 { font-size: 1.438rem !important; }
  .font-md-24 { font-size: 1.5rem !important; }
  .font-md-25 { font-size: 1.563rem !important; } }
.font-normal { font-weight: 400; }

.font-500 { font-weight: 500; }

.font-bold { font-weight: 700; }

.font-900 { font-weight: 900; }

.leading-none { line-height: 1; }

.leading-tight { line-height: 1.25; }

.leading-snug { line-height: 1.375; }

.leading-normal { line-height: 1.5; }

.leading-relaxed { line-height: 1.75; }

.leading-loose { line-height: 2; }

.tracking-normal { letter-spacing: 0em; }

.tracking-wide-xs { letter-spacing: 0.05em; }

.tracking-wide { letter-spacing: 0.1em; }

.tracking-wider { letter-spacing: 0.15em; }

.tracking-widest { letter-spacing: 0.2em; }

.valign-middle { vertical-align: middle; }

.text-ellipsis { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

.truncate { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; min-height: 1em; }

.truncate-2 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; min-height: 2em; }

.truncate-3 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; min-height: 3em; }

@media (min-width: 768px) { .text-md-nowrap { white-space: nowrap; }
  .text-md-ellipsis { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } }
.text-pre-line { white-space: pre-line; }

.white-space-normal { white-space: normal; }

.opacity-0 { opacity: 0; }

.opacity-30 { opacity: .3; }

.opacity-40 { opacity: .4; }

.opacity-50 { opacity: .5; }

.opacity-60 { opacity: .6; }

.opacity-70 { opacity: .7; }

.opacity-80 { opacity: .8; }

.cursor-pointer { cursor: pointer; }

.cursor-not-allowed { cursor: not-allowed; }

.pointer-none { pointer-events: none; }

.pointer-initial { pointer-events: initial; }

.touch-action-none { touch-action: none; }

.hover-zoomIn { transition: 0.3s ease; transition-property: color, border, outline, background, opacity, filter, box-shadow, transform; }
.hover-zoomIn:hover { transform: scale(1.05); }

.dropshadow { filter: drop-shadow(0 3px 6px rgba(0, 0, 0, 0.55)); }

.icon-country { display: inline-block; vertical-align: 10%; padding: 0.25em 0.5em 0.125em; font-size: 0.66em; font-style: normal; font-weight: bold; line-height: 1; border-radius: 2em; background: linear-gradient(-10deg, #c4a44a, #fff5b3 35%, #fff5b3 65%, #edd47a); color: #000; box-shadow: 0 0 0 1px #000; }

.fa-shrimp-black { vertical-align: middle; min-width: 1em; min-height: 1.125em; margin-top: -0.25em; background: url(../images/icon_shrimp_black.svg) center center no-repeat; background-size: contain; }

.fa-line-whiteBg { position: relative; z-index: 0; }
.fa-line-whiteBg::after { content: ""; position: absolute; z-index: -1; top: 50%; left: 50%; width: 0.8em; height: 0.8em; background: #fff; border-radius: 0.25em; transform: translate(-50%, -50%); }

.fa-coins-plus:after { content: "\f055"; vertical-align: text-bottom; font-size: 0.417em; margin: 0; margin-left: -0.5em; }

.fa-dollar-plus { position: relative; width: 1em; height: 1em; padding: 0.125em; box-sizing: content-box; line-height: 1; text-align: center; background-color: #fff; color: #00041F; border-radius: 50%; }
.fa-dollar-plus:after { content: "\f067"; position: absolute; bottom: 0; right: 0; padding: 0.25em; width: 1em; height: 1em; line-height: 1; font-size: 0.5em; text-align: center; box-sizing: content-box; background-color: #00e6ff; color: #fff; border-radius: 50%; transform: scale(0.7) translateX(30%); transform-origin: 100% 100%; }

.fa-gold-star { vertical-align: middle; min-width: 1.25em; min-height: 1em; margin-top: -0.4em; background: url(../images/icon_gold_star.svg) center center no-repeat; background-size: contain; }

.mask { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); }

.w-0 { width: 0; }

.w-1em { width: 1em; }

.w-2em { width: 2em; }

.w-3em { width: 3em; }

.w-4em { width: 4em; }

.w-5em { width: 5em; }

.w-6em { width: 6em; }

.w-7em { width: 7em; }

.w-8em { width: 8em; max-width: 100%; }

.w-9em { width: 9em; max-width: 100%; }

.w-10em { width: 10em; max-width: 100%; }

.w-50px { width: 50px; }

.w-70px { width: 70px; }

.w-75px { width: 75px; }

.w-90px { width: 90px; }

.minw-1em { min-width: 1em; }

.minw-2em { min-width: 2em; }

.minw-3em { min-width: 3em; }

.minw-4em { min-width: 4em; }

.minw-5em { min-width: 5em; }

.minw-6em { min-width: 6em; }

.minw-7em { min-width: 7em; }

.minw-8em { min-width: 8em; }

.minw-9em { min-width: 9em; }

.minw-10em { min-width: 10em; }

.minw-50 { min-width: 50%; }

.maxw-5em { max-width: 5em; }

.maxw-6em { max-width: 6em; }

.maxw-7em { max-width: 7em; }

.maxw-8em { max-width: 8em; }

.maxw-9em { max-width: 9em; }

.maxw-10em { max-width: 10em; }

.maxw-50vw { max-width: 50vw; }

.maxw-75vw { max-width: 75vw; }

.maxw-25 { max-width: 25% !important; }

.maxw-50 { max-width: 50% !important; }

.maxw-100 { max-width: 100% !important; }

@media (min-width: 768px) { .w-md-0 { width: 0; }
  .w-md-4em { width: 4em; }
  .w-md-7em { width: 7em; }
  .w-md-8em { width: 8em; }
  .maxw-md-50 { max-width: 50% !important; } }
.h-0 { height: 0; }

.h-1em { height: 1em; }

.h-2em { height: 2em; }

.h-50-window { height: 50vh; }

.h-fill-window { height: calc(100vh - (4.1 * 16px)); }

.minh-100 { min-height: 100% !important; }

.minh-leading-none { min-height: 1em; }

.minh-leading-tight { min-height: 1.25em; }

.minh-leading-snug { min-height: 1.375em; }

.minh-leading-normal { min-height: 1.5em; }

.minh-leading-relaxed { min-height: 1.75em; }

.minh-leading-loose { min-height: 2em; }

.maxh-75vh { max-height: 75vh; }

@media (min-width: 576px) { .h-sm-fill-window { height: calc(100vh - (4.1 * 18px)); } }
.pt-px { padding-top: 1px; }

.pb-px { padding-bottom: 1px; }

.py-px { padding-top: 1px; padding-bottom: 1px; }

.p-1em { padding: 1em; }

.m-npx { margin: -1px; }

.ml-npx, .mx-npx { margin-left: -1px; }

.mr-npx, .mx-npx { margin-right: -1px; }

.mt-npx, .my-npx { margin-top: -1px; }

.mb-npx, .my-npx { margin-bottom: -1px; }

.mt-n2em { margin-top: -2em; }

.clear { clear: both; }

.overflow-x-hidden { overflow-x: hidden; }

.overflow-x-auto { overflow-x: auto; }

.overflow-y-auto { overflow-y: auto; }

.scrollbar::-webkit-scrollbar-track { background-color: transparent; }

.scrollbar::-webkit-scrollbar { height: 4px; width: 4px; background-color: transparent; }

.scrollbar::-webkit-scrollbar-thumb { border-radius: 10px; background-color: rgba(0, 230, 255, 0.3); }

.sticky-top { position: sticky; top: 0; }
@media (min-width: 1300px) { .sticky-top { top: 3.75rem; } }

.sticky-top-hearder, .sticky-top-header { position: sticky; top: 3.75rem; }

.sticky-top-0 { position: sticky; top: 0; }

.sticky-bottom { position: sticky; bottom: 3.75rem; }
@media (min-width: 1300px) { .sticky-bottom { bottom: 0; } }

.sticky-bottom-0 { position: sticky; bottom: 0; }

.fixed-bottom { bottom: 3.75rem; }
@media (min-width: 1300px) { .fixed-bottom { bottom: 0; } }

.zindex-0 { z-index: 0; }

.zindex-1 { z-index: 1; }

.zindex-2 { z-index: 2; }

.zindex-n1 { z-index: -1; }

.zindex-n2 { z-index: -2; }

.zindex-sticky { z-index: 1020; }

.zindex-sticky-plus { z-index: 1021; }

.zindex-fixed-plus { z-index: 1031; }

.zindex-modal-plus { z-index: 1056; }

@media (min-width: 1200px) { .zindex-xl-2 { z-index: 2; }
  .zindex-xl-3 { z-index: 3; }
  .position-xl-static { position: static; } }
.order-n1 { -webkit-order: -1; order: -1; }

.isMobile .d-isMobile-none { display: none; }

.isDesk .d-isDesk-none { display: none; }

.gutter { padding-left: 23px; padding-right: 23px; }
.gutter-offset { margin-left: -23px; margin-right: -23px; }
@media (min-width: 768px) { .gutter-md { padding-left: 23px; padding-right: 23px; }
  .gutter-md-0 { padding-left: 0; padding-right: 0; }
  .gutter-md-offset { margin-left: -23px; margin-right: -23px; }
  .gutter-offset-md-0 { margin-left: 0; margin-right: 0; } }
@media (min-width: 992px) { .gutter-lg { padding-left: 23px; padding-right: 23px; }
  .gutter-lg-0 { padding-left: 0; padding-right: 0; }
  .gutter-lg-offset { margin-left: -23px; margin-right: -23px; }
  .gutter-offset-lg-0 { margin-left: 0; margin-right: 0; } }
@media (min-width: 1200px) { .gutter-xl { padding-left: 23px; padding-right: 23px; }
  .gutter-xl-0 { padding-left: 0; padding-right: 0; }
  .gutter-xl-offset { margin-left: -23px; margin-right: -23px; }
  .gutter-offset-xl-0 { margin-left: 0; margin-right: 0; } }

.wrap { display: -ms-flex; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-grow: 1; flex-grow: 1; }

.main { -ms-flex-grow: 1; flex-grow: 1; padding-bottom: 5%; }

.inner, .inner-medium, .inner-narrow { max-width: 100%; margin-left: auto; margin-right: auto; }

.inner { width: 1160px; }

.inner-medium { width: 800px; }

.inner-narrow { width: 600px; }

.grid { display: -webkit-flex; -webkit-flex-wrap: wrap; display: flex; flex-wrap: wrap; }
.grid_item { -webkit-flex-shrink: 0; flex-shrink: 0; }
.grid-1 > .grid_item { width: 100%; }
.grid-2 > .grid_item { width: 50%; }
.grid-3 > .grid_item { width: 33.333%; }
.grid-4 > .grid_item { width: 25%; }
.grid-5 > .grid_item { width: 20%; }
.grid-6 > .grid_item { width: 16.667%; }
.grid-7 > .grid_item { width: 14.286%; }
.grid-8 > .grid_item { width: 12.5%; }
.grid-9 > .grid_item { width: 11.111%; }
.grid-10 > .grid_item { width: 10%; }
@media (min-width: 768px) { .grid-md-1 > .grid_item { width: 100%; }
  .grid-md-2 > .grid_item { width: 50%; }
  .grid-md-3 > .grid_item { width: 33.333%; }
  .grid-md-4 > .grid_item { width: 25%; }
  .grid-md-5 > .grid_item { width: 20%; }
  .grid-md-6 > .grid_item { width: 16.667%; }
  .grid-md-7 > .grid_item { width: 14.286%; }
  .grid-md-8 > .grid_item { width: 12.5%; }
  .grid-md-9 > .grid_item { width: 11.111%; }
  .grid-md-10 > .grid_item { width: 10%; } }

.topBar { position: sticky; z-index: 1020; top: 0; height: 3.75rem; line-height: 3.75rem; text-align: center; border-bottom: solid 1px rgba(0, 230, 255, 0.5); background: linear-gradient(to right, #0f111a, #0d0e0f); box-shadow: 0 3px 6px rgba(0, 0, 0, 0.75); }
.topBar_inner { display: -webkit-flex; -webkit-align-items: center; display: flex; align-items: center; height: 100%; }
.topBar_title { -webkit-flex-grow: 1; flex-grow: 1; margin: 0 5rem; font-size: 1.25rem; font-weight: bold; line-height: inherit; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; min-height: 1em; }
.topBar_arrow, .topBar_arrow-end { position: relative; display: -webkit-inline-flex; -webkit-align-items: center; -webkit-align-self: stretch; -webkit-flex-shrink: 0; display: inline-flex; align-items: center; align-self: stretch; flex-shrink: 0; width: 5rem; margin-right: -5rem; padding: 0 1em; font-size: 1rem; cursor: pointer; }
.topBar_arrow-end { -webkit-justify-content: end; justify-content: end; margin-right: 0; margin-left: -5rem; }
.topBar_arrow_text { width: 0; margin-left: 0.5em; font-weight: normal; white-space: nowrap; }
.topBar_menuBtn { -webkit-align-self: center; align-self: center; -webkit-flex-shrink: 0; flex-shrink: 0; padding: 0.75em; width: 1em; height: 1em; line-height: 1em; text-align: center; box-sizing: content-box; color: #fff; background: rgba(0, 230, 255, 0.3); border-radius: 50%; }
@media (min-width: 1300px) { .topBar { height: 3.75rem; line-height: 3.75rem; } }

.btmBar { position: sticky; z-index: 1020; bottom: 0; text-align: center; border-top: solid 1px rgba(0, 230, 255, 0.5); background: linear-gradient(to right, #0f111a, #0d0e0f); box-shadow: 0 -3px 6px rgba(0, 0, 0, 0.75); }

@media (min-width: 1300px) { .headerWrap { position: sticky; z-index: 1020; top: 0; } }
.header { position: relative; height: 3.75rem; line-height: 3.75rem; background-image: url(../images/angle_deco.svg), linear-gradient(to right, #0f111a, #0d0e0f); background-position: right bottom, 0 0; background-repeat: no-repeat, no-repeat; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.75); }
.header::before { content: ""; position: absolute; bottom: 0; left: 0; right: 0; margin-right: 23px; border-top: 1px solid rgba(0, 230, 255, 0.2); }
.header .inner { display: -webkit-flex; -webkit-align-items: center; display: flex; align-items: center; }
.header .logo { max-height: 80%; }
.header_supBadge { position: static; display: inline-block; vertical-align: text-top; margin: -0.5em -0.25em -0.5em -1em; padding: 0.25em; min-width: 1em; height: 1em; line-height: 1.125; text-align: center; font-size: 12px; font-weight: bold; border-radius: 2em; color: #333; background: #00e6ff; box-sizing: content-box; }
.header .updateDot { position: static; vertical-align: text-top; margin: -0.125em -1em 0 -0.5em; font-size: 0.5em; }
@media (max-width: 1299.98px) { .header .header-m-none { display: none; }
  .header .header-m-order-1 { order: 1; }
  .header .header_social { font-size: 32px; }
  .header .header_mobileIcons { font-size: 24px; }
  .header .header_mobileIcons .fa-line-whiteBg { font-size: 1.333em; vertical-align: -0.08em; } }
@media (min-width: 1300px) { .header { height: 3.75rem; line-height: 3.75rem; }
  .header .header-d-none { display: none; }
  .header .inner { width: auto; }
  .header .logo::after { content: ""; display: inline-block; vertical-align: middle; height: 3.75rem; width: 1.75rem; transform: skewX(-35deg); box-shadow: 10px -5px 10px -5px rgba(0, 230, 255, 0.7); } }

.header.header-forQuickmenu { position: static; height: 0; }
@media (min-width: 1300px) { .header.header-forQuickmenu { display: none; } }

.siteMenu_icons_sub { margin-left: -0.75em; font-size: 0.75em; }
@media (max-width: 1299.98px) { .siteMenu { display: -webkit-flex; display: flex; visibility: hidden; opacity: 0; position: fixed; z-index: 1050; top: 0; right: 0; left: 0; bottom: 3.75rem; line-height: 1.25; transition: 0.3s ease; transition-property: color, border, outline, background, opacity, filter, box-shadow, transform; }
  .siteMenu .mask { position: absolute; }
  .siteMenu_body { display: -webkit-flex; -webkit-flex-direction: column; display: flex; flex-direction: column; position: relative; min-width: 300px; max-width: 80vw; padding: 1.5rem 1.25rem; color: #000; background: #F1F4F5; overflow-y: auto; transform: translateX(-100%); transition: 0.3s ease; transition-property: color, border, outline, background, opacity, filter, box-shadow, transform; }
  .siteMenu hr { opacity: 1; background: none; border-top: solid 1px rgba(0, 0, 0, 0.1); }
  .siteMenu_social, .siteMenu_mobileIcons { font-size: 2rem; }
  .siteMenu .nav { -webkit-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; }
  .siteMenu .nav:not(.header-m-none) { display: block; }
  .siteMenu .nav-link { padding-left: 0; padding-right: 0; }
  .siteMenu.open { display: -webkit-flex; display: flex; visibility: visible; opacity: 1; }
  .siteMenu.open .siteMenu_body { transform: translateX(0); } }
@media (min-width: 1300px) { .siteMenu { -webkit-flex-grow: 1; flex-grow: 1; margin-left: 1.25em; }
  .siteMenu_body { display: -webkit-flex; display: flex; }
  .siteMenu .nav-link { padding: 0 0.875rem; }
  .siteMenu_icons { font-size: 1.5em; }
  .siteMenu_icons .nav-link { padding: 0 0.25em; cursor: pointer; } }
@media (min-width: 1300px) and (max-width: 1439px) { .siteMenu_nav .nav-link { font-size: 0.75rem; padding: 0.75em; } }
@media (min-width: 1440px) and (max-width: 1550px) { .siteMenu_nav .nav-link { font-size: 0.875rem; } }

.siteMenu_user { display: -webkit-flex; display: flex; border-bottom: solid 1px rgba(0, 0, 0, 0.1); }
.siteMenu_user_photo { width: 70px; cursor: pointer; }
.siteMenu_user_icon { position: absolute; bottom: 0; right: 0; font-size: 0.75em; width: 2em; height: 2em; line-height: 2em; text-align: center; background: #fff; color: rgba(0, 0, 0, 0.3); border-radius: 50%; transition: 0.3s ease; transition-property: color, border, outline, background, opacity, filter, box-shadow, transform; }
.siteMenu_user_photo:hover .siteMenu_user_icon { color: #000; }
.siteMenu_user_point { font-size: 1.375em; font-weight: bold; line-height: 1; color: #00d8f0; }
@media (min-width: 1300px) { .siteMenu_user { display: none; } }

.sitemenu_share { position: relative; }
.sitemenu_share:after { content: ""; position: absolute; left: 10.5em; top: 100%; width: 10px; height: 5px; clip-path: polygon(0 0, 100% 0, 50% 100%); background: #fff; }

.siteMenu_search { 	/*
	// width: 300px;
	// max-width: 100%;
	padding: 0.5em 1rem;
	margin: -1rem -1rem 1rem;
	border-radius: 0.5rem;
	@include transition;

	&_input{
		width: 100%;
		height: 2.5em;
		margin-left: -0.5em;
		margin-right: -2.5em;
		padding: 0 1em 0 1em;
		border: solid 1px #ddd;
		@include flexbox((
			flex: 1 1 auto,
		));
		@include transition;

		&::placeholder{
			color: #aaa;
			font-size: 14px;
		}
		&:focus,&:focus-visible{
			border-color: $brand;
			box-shadow: 0 0 0 0.2rem rgba($brand,.25);
			outline: none;
			// outline-color: rgba($brand,.25) auto 5px;
			// outline: -webkit-focus-ring-color auto thin;
			  // outline: revert;
		}
	}
	&_backBtn, &_dropdown{
		display: none;
	}
	&_backBtn{
		width: 2.5em;
		text-align: center;
	}
	&_searchBtn{
		width: 2.5em;
		text-align: center;
		opacity: .6;
	}
	&_remove{
		$w: 2em;
		width: $w;
		height: $w;
		line-height: $w;
		text-align: center;
		margin: auto 0;
		border-radius: 2em;
	}
	&.onfocus{
		background-color: #fff;
		box-shadow: 0 12px 12px rgba($black,.1),inset 0 0 0 0 rgba($black,.1);
		.siteMenu_search{
			&_backBtn, &_dropdown{
				display: block;
			}
		}
	}
	*/ }
@media (max-width: 1299.98px) { .siteMenu_search { margin: -0.5em -0.25em 0; }
  .siteMenu_search .searhDropdown_input { color: inherit; border: solid 1px #aaa; }
  .siteMenu_search .searhDropdown_input::placeholder { color: #aaa; font-size: 13px; }
  .siteMenu_search .searhDropdown_input:focus, .siteMenu_search .searhDropdown_input:focus-visible { border-color: #00e6ff; box-shadow: 0 0 0 0.2rem rgba(0, 230, 255, 0.25); outline: none; }
  .siteMenu_search .searhDropdown_input::-webkit-search-cancel-button { background: currentColor; opacity: .6; }
  .siteMenu_search .searhDropdown_dropdown { margin: -0.75em; padding-top: 4.5em; }
  .siteMenu_search .scrollbar.scrollbar { padding: 0 0.75em 0.75em; } }
@media (min-width: 1300px) { .siteMenu_searchWrap { width: 0; height: 3.75rem; margin: auto; margin-right: 0; }
  .siteMenu_search { float: right; font-size: 1.5em; }
  .siteMenu_search .searhDropdown_close { display: none !important; }
  .siteMenu_search .searhDropdown_dropdown { max-height: calc( 90vh - 3.75rem ); margin-bottom: 0.5em; overflow-y: auto; }
  .siteMenu_search .searhDropdown_dropdown::-webkit-scrollbar-thumb { background-color: rgba(0, 0, 0, 0.1); }
  .siteMenu_search:not(.onfocus) .searhDropdown_input { width: 2.5em; margin: 0; padding: 0; opacity: 0; }
  .siteMenu_search:not(.onfocus) .searhDropdown_searchBtn { opacity: 1; }
  .siteMenu_search.onfocus { width: 300px; margin-top: 0.75em; font-size: inherit; } }

body:has(#modal-switchCountry.show) .siteMenu .mask { z-index: 1; }

.header_langLabel:before { content: 'LANG'; }

:lang(zh-TW) .header_langLabel:before, :lang(zh-Hant) .header_langLabel:before, :lang(ja) .header_langLabel:before { content: '語言'; }

.footer { position: relative; padding-bottom: 1.5em; font-size: 0.75rem; line-height: 1.5; text-align: center; color: rgba(255, 255, 255, 0.8); background: #000; border-top: solid 1px rgba(0, 230, 255, 0.6); }

.footer_links { margin: 1.75em 0 1.125em; font-size: 1.167em; }
.footer_links a { padding: 0 0.5em; }

.footer_icon { display: none; }

.copyright { margin: 0.5em 0; }

.footer_info { margin-top: 0.5em; opacity: .8; }
.footer_info_item { display: inline-block; margin: 0 0.25em; }

@media (min-width: 1300px) { .footer::before { content: ""; position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); width: 600px; height: 6px; background: radial-gradient(farthest-side, #00e6ff, rgba(0, 0, 0, 0)); }
  .footer_links { margin-bottom: 0.5em; font-size: 1.143em; }
  .footer_links .footer_icon { padding: 0; }
  .footer_icon { display: inline-block; vertical-align: middle; margin-top: -0.1em; margin-left: 0.25em; padding: 0; font-size: 1.75em; }
  .copyright { margin: 0.25em 0; }
  .footer_info_item { margin: 0; }
  .footer_info_item + .footer_info_item:before { content: "|"; vertical-align: 6%; opacity: .5; margin: 0 0.75em 0 0.5em; } }
@media (min-width: 992px) { .footer { font-size: 0.875rem; }
  .footer_info_item + .footer_info_item:before { margin: 0 1.125em 0 1em; } }
.footerMenu { position: sticky; z-index: 1020; bottom: 0; display: -webkit-flex; -webkit-justify-content: center; display: flex; justify-content: center; height: 3.75rem; padding-right: 0.75em; font-size: 12px; white-space: nowrap; border-top: 1px solid #00e6ff; background: linear-gradient(to bottom, #010313, #001F5D); box-shadow: 0 -1px 10px rgba(0, 230, 255, 0.85); }
.footerMenu::before { content: ""; position: absolute; top: 0; right: 0; width: 25px; height: 25px; background: url(../images/angle_deco.svg) right top no-repeat; background-size: contain; transform: scaleY(-1); }
.footerMenu_item { display: -webkit-flex; -webkit-flex-direction: column; -webkit-align-items: center; -webkit-justify-content: center; -webkit-flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1 1 0; }
.footerMenu_item.triggerNav { width: 3.75rem; width: 3.5rem; margin-right: 0.125em; background: #00e6ff; font-size: 3em; cursor: pointer; -webkit-flex-grow: 0; -webkit-flex-basis: auto; flex-grow: 0; flex-basis: auto; }
.footerMenu_icon { font-size: 2em; }
.footerMenu_icon_sub { display: inline-block; width: 1em; margin-left: -0.5em; margin-right: -0.5em; font-size: 0.583em; font-family: Helvetica, "Helvetica Neue", Arial, "微軟正黑體", "Microsoft JhengHei", "Microsoft YaHei", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "LiHei Pro", sans-serif; font-weight: normal; }
.footerMenu_text { margin-top: 0.25em; }
.footerMenu .updateDot { top: 0; vertical-align: text-top; margin: -0.125em -0.5em -0.125em -0.25em; font-size: 0.5em; }

@media (max-width: 767.98px) { .footerMenu { box-sizing: content-box; padding-bottom: constant(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom); } }
@media (max-width: 374.95px) { .footerMenu { font-size: 2.933vw; }
  .footerMenu .triggerNav { width: 3rem; } }
@media (min-width: 576px) { .footerMenu_item:not(.triggerNav) { -webkit-flex-grow: 0; -webkit-flex-basis: 6em; flex-grow: 0; flex-basis: 6em; padding: 0 1em; }
  .footerMenu_item.triggerNav { margin-right: auto; }
  .footerMenu_item:last-child { margin-right: auto; } }
@media (min-width: 1300px) { .footerMenu { display: none; } }
@media (min-width: 1200px) { .shadow-xl-none { box-shadow: none !important; } }
.table-middle th, .table-middle td { vertical-align: middle; }

.table-border-body-opacity, .table-border-body-opacity th, .table-border-body-opacity td, .table-border-body-opacity thead th { border-color: rgba(255, 255, 255, 0.3) !important; }

.iconBadge { display: inline-block; vertical-align: text-bottom; margin-right: -1em; margin-top: -0.25em; padding: 0.25em; min-width: 1em; height: 1em; line-height: 1em; font-size: 12px; box-sizing: content-box; background: #ffdf00; color: #000; border-radius: 5em; transform: scale(0.66) translateX(-45%); transform-origin: left bottom; }

.badge-crown { display: inline-block; vertical-align: middle; padding: 0; min-width: 2.167em; height: 1.583em; line-height: 2.25; font-size: 0.857em; font-weight: bold; letter-spacing: 0; text-align: center; color: #000; background: url(../images/badge_crown.svg) center center no-repeat; background-size: contain; }

.badge-circle { padding-left: 0.125em; padding-right: 0.125em; min-width: 1.875em; text-align: center; border-radius: 2em; }

.btn-flex-column { display: -webkit-flex; -webkit-flex-direction: column; -webkit-align-items: center; -webkit-justify-content: center; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; }

.btn-group-toggle_check { display: none; }

.active .btn-group-toggle_check { display: inline-block; }

.btn-circle { display: inline-block; vertical-align: middle; padding: 0.75em; width: 1em; height: 1em; line-height: 1em; text-align: center; border-radius: 5em; border-width: 1px; border-style: solid; box-sizing: content-box; }

.btn-circle-width { display: -webkit-inline-flex; -webkit-align-items: center; -webkit-justify-content: center; display: inline-flex; align-items: center; justify-content: center; vertical-align: middle; letter-spacing: 0; border-radius: 50%; }

.toggleTextBtn_text::before { content: attr(data-text); }
.toggleTextBtn.active .toggleTextBtn_text::before { content: attr(data-active-text); }

.btn-pointer:after { content: "\f25a"; display: inline-block; vertical-align: middle; margin-right: -1.125em; margin-left: 0.125em; font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome 5 Pro", "Font Awesome 5 Brands", Helvetica, Helvetica Neue, Arial, 微軟正黑體, Microsoft JhengHei, Microsoft YaHei, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC, LiHei Pro, sans-serif; font-size: 1.25em; font-weight: bold; line-height: 1; filter: drop-shadow(-1px 4px 3px rgba(0, 0, 0, 0.5)); transform: rotate(-30deg) translateY(10%); animation: pointerMove 2s linear infinite; }

@keyframes pointerMove { from,30%,60%,to { transform: rotate(-30deg) translateY(30%); }
  15%,45% { transform: rotate(-30deg) translateY(10%); } }
.nav-arrowDown .active::after { content: '\f0d7'; font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome 5 Pro", "Font Awesome 5 Brands", Helvetica, Helvetica Neue, Arial, 微軟正黑體, Microsoft JhengHei, Microsoft YaHei, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC, LiHei Pro, sans-serif; font-size: 0.875em; margin-left: 0.25em; }

.nav-pills .updateDot { background: #00e6ff; }
.nav-pills .badge { background: #fff; color: black; font-weight: normal; vertical-align: 0.125em; line-height: 0.875; }
.nav-pills .nav-link.active .updateDot, .nav-pills .show > .nav-link .updateDot { background: #fff; }
.nav-pills .nav-link.active.nav-link-danger { color: #fff; background-color: #e2004b; }
.nav-pills .nav-link.active.nav-link-gold { background: linear-gradient(-10deg, #c4a44a, #fff5b3 35%, #fff5b3 65%, #edd47a); }

.nav-trapezoid { display: -webkit-inline-flex; display: inline-flex; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; white-space: nowrap; }
.nav-trapezoid .nav-item { padding-bottom: 6px; }
.nav-trapezoid .nav-item:first-child { margin-left: 0.5em; }
.nav-trapezoid .nav-link { padding: 0.5em 0.75em; cursor: pointer; }
.nav-trapezoid .nav-link.active { position: relative; z-index: 1; margin: 0 0.25em; padding: 0.35em 1.75em; font-weight: bold; color: #000; }
.nav-trapezoid .nav-link.active::before, .nav-trapezoid .nav-link.active::after { content: ""; position: absolute; z-index: -1; top: 0; left: 0; width: 100%; height: 100%; box-sizing: content-box; transform: perspective(2px) rotateX(-1deg) scaleY(145%); transform-origin: top; border-radius: 0 0 5px 5px; }
.nav-trapezoid .nav-link.active::before { border: solid 1px #00e6ff; border-top: 0; margin-left: 1px; padding-bottom: 3px; }
.nav-trapezoid .nav-link.active::after { background: #00e6ff; }
.nav-trapezoid .nav-link-danger { color: #e2004b; }
.nav-trapezoid .nav-link-danger.active { color: #fff; }
.nav-trapezoid .nav-link-danger.active::before { border-color: #e2004b; }
.nav-trapezoid .nav-link-danger.active::after { background: #e2004b; }

.nav-step { display: -webkit-inline-flex; display: inline-flex; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; min-width: -moz-available; min-width: -webkit-fill-available; letter-spacing: 0.1em; text-align: center; white-space: nowrap; border-bottom: solid 2px rgba(0, 230, 255, 0.5); }
.nav-step .nav-item { margin-bottom: -2px; }
.nav-step .nav-item a { cursor: pointer; }
.nav-step .nav-item a:after { content: ""; display: block; width: 0.571em; height: 0.5em; margin: 0.286em auto 0; background: currentColor; clip-path: polygon(0 0, 100% 0, 50% 100%); }
.nav-step .nav-item { color: rgba(255, 255, 255, 0.5); border-color: transparent; }
.nav-step .nav-item.active { color: #fff; }
.nav-step .nav-item.done { border-bottom: solid 4px #00e6ff; color: rgba(0, 230, 255, 0.5); }
.nav-step .nav-item.done.active { color: #00e6ff; }

.nav-y-wide .nav-link { padding-top: 0.75em; padding-bottom: 0.75em; }

.collapseArrow::before, [aria-expanded="true"] .collapseArrow::before { content: "\f107"; }

.collapsed .collapseArrow::before, [aria-expanded="false"] .collapseArrow::before { content: "\f105"; }

[data-toggle] { cursor: pointer; }

.modal_close { position: absolute; z-index: 2; top: 0; right: 0; padding: 0; }

.modalBack, .modalBack-end { display: -webkit-inline-flex; -webkit-align-items: center; -webkit-justify-content: center; -webkit-align-self: stretch; display: inline-flex; align-items: center; justify-content: center; align-self: stretch; width: 2em; margin-right: -2em; font-size: 1rem; cursor: pointer; }

.modalBack-end { margin-right: 0; margin-left: -2em; }

.modalBack_text { width: 0; margin-left: 0.5em; font-weight: normal; white-space: nowrap; }

.modal-full { padding-right: 0 !important; }
.modal-full .modal-dialog { margin: 0; height: 100%; max-height: 100%; max-width: none; }
.modal-full .modal-content { height: 100%; max-height: 100%; border: 0; border-radius: 0; background: linear-gradient(to right, #0f111a, #0d0e0f); border: 0; }
.modal-full .modal-header-deco { flex-wrap: wrap; min-height: 3.75rem; line-height: 3.75rem; margin-bottom: 4px; border: 0; }
.modal-full .modal-header-deco::after { content: ""; width: 100%; height: 4px; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.15) 1px, transparent 3px), linear-gradient(to right, #f8b81f, #ee6723 30%, #e4042a); }

.modal-nav .modal-dialog { max-width: 260px; margin: 0; height: 100%; max-height: 100%; transform: translateX(-100%); transition: 0.3s ease; transition-property: color, border, outline, background, opacity, filter, box-shadow, transform; }
.modal-nav .modal-content { height: 100%; max-height: 100%; border: 0; border-radius: 0; }
.modal-nav.show .modal-dialog { transform: translateX(0); }

.modal-bottom .modal-dialog { position: absolute; bottom: 0; left: 0; right: 0; max-width: none; margin: auto 0 0; max-height: 100%; transform: translateY(100%); transition: 0.3s ease; transition-property: color, border, outline, background, opacity, filter, box-shadow, transform; }
.modal-bottom .modal-content { border: 0; border-radius: 10px 10px 0 0; }
.modal-bottom .modal-content:before { content: ""; position: absolute; top: 0; left: 0; right: 0; margin: 8px auto; width: 40px; border-top: 4px solid #e7e7e7; border-radius: 4px; }
.modal-bottom.show .modal-dialog { transform: translateY(0); }

.form-wideSpacing .form-group { margin-bottom: 1.75rem; }

.swiper-common .swiper-button-prev, .swiper-common .swiper-rtl .swiper-button-next { left: 0; }
.swiper-common .swiper-button-next, .swiper-common .swiper-rtl .swiper-button-prev { right: 0; }
@media (max-width: 767.98px) { .swiper-common { margin-left: -23px; margin-right: -23px; padding-left: 23px; padding-right: 23px; --swiper-navigation-size: 2em; } }

.datepicker.datepicker-dropdown { padding: 0.75em; color: #000; }
.datepicker.datepicker table tr td, .datepicker .datepicker table tr th { width: 2.25em; height: 2.125em; }
.datepicker.datepicker table tr td.new, .datepicker.datepicker table tr td.old { color: rgba(0, 0, 0, 0.5); }
.datepicker.datepicker table tr td.disabled, .datepicker.datepicker table tr td.disabled:hover { color: currentColor; opacity: .3; }
.datepicker.datepicker table tr td.today { background-color: rgba(0, 230, 255, 0.2); border-color: rgba(0, 230, 255, 0.4); }
.datepicker.datepicker table tr td.selected, .datepicker.datepicker table tr td.selected.highlighted, .datepicker.datepicker table tr td.active.active, .datepicker.datepicker table tr td.active.highlighted.active, .datepicker.datepicker table tr td.active.highlighted:active, .datepicker.datepicker table tr td.active:active { background-color: #00e6ff; border-color: #00e6ff; color: #fff; text-shadow: none; }

.t-check-in, .t-check-out, .t-datepicker { float: none; }

.t-dates { padding: 0; height: auto; white-space: nowrap; }

.t-date-info-title.t-date-info-title { position: static; display: inline-block; font-size: inherit; margin: 0 0 0 0.5em; opacity: .8; }

.t-datepicker-day { left: 0; z-index: 1000; color: #444850; }
.t-datepicker-day td { white-space: nowrap; }

.t-arrow-top { z-index: 1000; }

.t-check-out .t-datepicker-day { right: 0; left: auto; }

.sweet-alert { color: #333; }

.dropzone.dropzone { padding: 0.5rem; background: none; border: dashed 2px rgba(0, 230, 255, 0.5); border-radius: 5px; }
.dropzone.dropzone .dz-preview.dz-image-preview { background: none; }
@media (max-width: 767.98px) { .dropzone.dropzone .dz-preview { margin: 1.5%; width: 30%; min-height: 80px; }
  .dropzone.dropzone .dz-preview .dz-image { width: 100%; height: 0; padding-bottom: 100%; }
  .dropzone.dropzone .dz-preview .dz-details { padding: 1.5em 1em; }
  .dropzone.dropzone .dz-preview .dz-success-mark, .dropzone.dropzone .dz-preview .dz-error-mark { margin: 0; }
  .dropzone.dropzone .dz-preview .dz-success-mark svg, .dropzone.dropzone .dz-preview .dz-error-mark svg { width: 2rem; height: 2rem; transform: translate(-50%, -50%); } }

lite-youtube { background-color: #000; position: relative; display: block; contain: content; background-position: center center; background-size: cover; cursor: pointer; max-width: 720px; }
lite-youtube::before { content: ''; display: block; position: absolute; top: 0; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAdklEQVQoz42QQQ7AIAgEF/T/D+kbq/RWAlnQyyazA4aoAB4FsBSA/bFjuF1EOL7VbrIrBuusmrt4ZZORfb6ehbWdnRHEIiITaEUKa5EJqUakRSaEYBJSCY2dEstQY7AuxahwXFrvZmWl2rh4JZ07z9dLtesfNj5q0FU3A5ObbwAAAABJRU5ErkJggg==); background-position: top; background-repeat: repeat-x; height: 60px; padding-bottom: 50px; width: 100%; transition: all 0.2s cubic-bezier(0, 0, 0.2, 1); }
lite-youtube::after { content: ""; display: block; padding-bottom: calc(100% / (16 / 9)); }
lite-youtube > iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; border: 0; }
lite-youtube > .lty-playbtn { display: block; width: 68px; height: 48px; position: absolute; cursor: pointer; transform: translate3d(-50%, -50%, 0); top: 50%; left: 50%; z-index: 1; background-color: transparent; /* YT's actual play button svg */ background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 68 48"><path d="M66.52 7.74c-.78-2.93-2.49-5.41-5.42-6.19C55.79.13 34 0 34 0S12.21.13 6.9 1.55c-2.93.78-4.63 3.26-5.42 6.19C.06 13.05 0 24 0 24s.06 10.95 1.48 16.26c.78 2.93 2.49 5.41 5.42 6.19C12.21 47.87 34 48 34 48s21.79-.13 27.1-1.55c2.93-.78 4.64-3.26 5.42-6.19C67.94 34.95 68 24 68 24s-.06-10.95-1.48-16.26z" fill="red"/><path d="M45 24 27 14v20" fill="white"/></svg>'); filter: grayscale(100%); transition: filter 0.1s cubic-bezier(0, 0, 0.2, 1); border: none; }
lite-youtube:hover > .lty-playbtn, lite-youtube .lty-playbtn:focus { filter: none; }
lite-youtube .lyt-activated { cursor: unset; }
lite-youtube .lyt-activated::before, lite-youtube .lyt-activated > .lty-playbtn { opacity: 0; pointer-events: none; }

.lyt-visually-hidden { clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }

[type="radio"], [type="checkbox"] { position: relative !important; vertical-align: -10%; margin-right: 0.25em; -webkit-appearance: none; background: #00041F; border: solid 1px rgba(0, 230, 255, 0.5); }
[type="radio"]:checked, [type="checkbox"]:checked { border-color: #00e6ff; }

[type="radio"] { border-radius: 50%; }
[type="radio"]:checked::before { content: ""; position: absolute; top: 50%; left: 50%; width: 0.5em; height: 0.5em; border-radius: 50%; background: #00e6ff; transform: translate(-50%, -50%); }

[type="checkbox"] { border-radius: 3px; }
[type="checkbox"]:checked { background: #00e6ff; color: #000; }
[type="checkbox"]:checked::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #00041F; -webkit-clip-path: polygon(9% 49%, 42% 79%, 95% 28%, 86% 19%, 42% 61%, 18% 39%); clip-path: polygon(9% 49%, 42% 79%, 95% 28%, 86% 19%, 42% 61%, 18% 39%); }

.is-invalid [type="radio"], .is-invalid [type="checkbox"] { border-color: #ffdf00; }
.is-invalid ~ .form-check-span { color: #ffdf00; }

[type="search"] { padding-right: 2.75em; }
[type="search"]:placeholder-shown { padding-right: 1em; }
[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; width: 0.75rem; height: 0.75rem; margin: auto 0.25em; background: #fff; -webkit-clip-path: polygon(20% 0%, 0% 20%, 30% 50%, 0% 80%, 20% 100%, 50% 70%, 80% 100%, 100% 80%, 70% 50%, 100% 20%, 80% 0%, 50% 30%); clip-path: polygon(20% 0%, 0% 20%, 30% 50%, 0% 80%, 20% 100%, 50% 70%, 80% 100%, 100% 80%, 70% 50%, 100% 20%, 80% 0%, 50% 30%); cursor: pointer; }

.custom-file-input ~ .custom-file-label::after { content: '\f07c'; font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome 5 Pro", "Font Awesome 5 Brands", Helvetica, Helvetica Neue, Arial, 微軟正黑體, Microsoft JhengHei, Microsoft YaHei, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC, LiHei Pro, sans-serif; font-weight: 900; }

.input-text { padding: 0; border: 0; color: inherit; background: transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=); }

.form_maxlength_text { margin: 0.25em 0 0; font-size: 0.875rem; font-weight: 400; text-align: right; color: rgba(255, 255, 255, 0.7); }

.switch { display: inline-block; margin: 0; font-size: 1.5rem; }
.switch input { display: block; width: 2em; height: 1em; margin: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: solid 1px rgba(255, 255, 255, 0.5); border-radius: 1em; box-sizing: content-box; cursor: pointer; transition: .3s ease; }
.switch input::before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; width: 0.75em; height: 0.75em; margin: 0.125em; clip-path: none; background: rgba(255, 255, 255, 0.4); border-radius: 100%; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); transition: .3s ease; }
.switch input:checked { background-color: #00e6ff; border-color: #00e6ff; }
.switch input:checked::before { margin-left: calc(100% - 0.875em); background: #000; background: #fff; clip-path: none; }

.list-unstyled { list-style: none; margin: 0; padding: 0; }

.list-decimal { list-style: decimal; padding-left: 1.25em; }

.list-dash { list-style: none; padding-left: 1.25em; }
.list-dash li:before { content: '-'; display: inline-block; width: 1.25em; margin-left: -1.25em; text-indent: 0.25em; }

.title-deco { font-size: 1.25rem; font-weight: bold; color: #00e6ff; }
.title-deco::before { content: ""; display: inline-block; vertical-align: middle; width: 1em; height: 1em; margin-top: -0.125em; margin-right: 0.125em; background: url(../images/icon_titledeco.svg) center center no-repeat; background-size: contain; }
@media (min-width: 768px) { .title-deco { font-size: 1.5rem; } }

.title { font-size: 1.25rem; font-weight: bold; }
@media (min-width: 768px) { .title { font-size: 1.5rem; } }

.title-s { font-size: 1.125rem; font-weight: bold; }
@media (min-width: 768px) { .title-s { font-size: 1.25rem; } }

.title-glow { position: relative; }
.title-glow::after { content: ""; position: absolute; bottom: 0; left: 3em; transform: translate(-50%, 50%); width: 9.4em; height: 5px; background: radial-gradient(farthest-side, #00e6ff, rgba(0, 0, 0, 0)); }

@media (min-width: 768px) { .title-md-glow { position: relative; }
  .title-md-glow::after { content: ""; position: absolute; bottom: 0; left: 3em; transform: translate(-50%, 50%); width: 9.4em; height: 5px; background: radial-gradient(farthest-side, #00e6ff, rgba(0, 0, 0, 0)); } }
.title-boardArrow { font-weight: bold; color: #ffdf00; }
.title-boardArrow::before { content: ""; display: inline-block; vertical-align: -0.15em; width: 2.273em; height: 1em; margin-right: 0.125em; background: url(../images/quiz_arrow.png) center center no-repeat; background-size: contain; }

.imgfit, .avater { /*需要裁切的圖 (比例須個別另下) */ display: block; position: relative; overflow: hidden; text-align: left; }

.avater { padding-top: 100%; border-radius: 50%; }

.imgfit-1x1 { /* 寬高 1:1; */ padding-top: 100%; }

.imgfit-2x1 { /* 寬高 1:1; */ padding-top: 50%; }

.imgfit-3x1 { /* 寬高 3:1 */ padding-top: 33.33%; }

.imgfit-3x2 { /* 寬高 3:2 */ padding-top: 66.66%; }

.imgfit-3x4 { /* 寬高 3:4 */ padding-top: 133.33%; }

.imgfit-4x3 { /* 寬高 4:3 */ padding-top: 75%; }

.imgfit-16x9 { /* 寬高 16:9 */ padding-top: 56.25%; }

.imgfit-meta { /* 寬高 16:9 */ padding-top: 52.356%; }

.imgfit-quizBg { padding-top: 135%; }

.imgfit-game { padding-top: 134%; border-radius: 0.25rem; }

.imgfit img, .avater img { position: absolute; top: 0; width: 100%; height: 100%; object-fit: cover; }

.imgfit iframe, .imgfit lite-youtube { position: absolute; top: 0; left: 0; width: 160px; height: 90px; min-width: 100%; min-height: 100%; max-width: 100%; max-height: 100%; }

.imgfit-contain img { object-fit: contain; }

.imgfit-scale-down img { object-fit: scale-down; }

.imgfit .mask { position: absolute; }

.avater { background: #000; }
.avater img { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6); }
.avater img:nth-child(-n+4) { width: 50%; height: 50%; }
.avater img:nth-child(2) { left: 50%; }
.avater img:nth-child(3) { top: 50%; }
.avater img:nth-child(4) { top: 50%; left: 50%; }
.avater img:nth-child(n+5) { display: none; }
.avater img:first-child:last-child { width: 100%; height: 100%; }
.avater img:nth-child(1):nth-last-child(3) { width: 100%; height: 45%; }
.avater img:nth-child(2):nth-last-child(2) { width: 50%; height: 55%; top: 45%; left: 0; }
.avater img:nth-child(3):nth-last-child(1) { width: 50%; height: 55%; top: 45%; left: 50%; }
.avater img:nth-child(1):nth-last-child(2) { width: 50%; height: 100%; }
.avater img:nth-child(2):nth-last-child(1) { width: 50%; height: 100%; top: 0; left: 50%; }

.imgfit_fixtags { position: absolute; top: 0; left: 0; right: 0; bottom: 0; padding: 0.25em; }
.imgfit_fixtags-rb { left: auto; top: auto; }
.imgfit_fixtags .badge { margin-right: 0.25em; margin-bottom: 0.25em; }

.imgfit_editIcon { position: absolute; bottom: 0; right: 0; width: 2em; height: 2em; line-height: 2em; text-align: center; color: #00e6ff; background: #fff; border-radius: 50%; }

.avaterSub { position: absolute; bottom: 0; right: 0; width: 40%; margin-right: -5%; }

.imgfitIcon { position: absolute; bottom: 0; right: 0; width: 1em; }

@media screen\0 { .imgfit { z-index: 0; }
  .imgfit img { position: absolute; z-index: 1; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100% !important; height: auto !important; } }
/*圖文編輯器*/
.editor { font-size: 1rem; font-weight: 400; line-height: 1.75; word-wrap: break-word; word-break: break-word; clear: both; }

.editor:after { content: ""; display: block; height: 0; clear: both; }

.editor img { max-width: 100%; height: auto !important; vertical-align: baseline; }

.editor iframe { max-width: 100%; }

.editor [href] { color: #00e6ff; }

@media (max-width: 991.98px) { .editor iframe[src*="youtube"], .editor iframe[src*="vimeo"], .editor iframe[src*="facebook"], .editor iframe[src*="instagram"] { width: 100%; /*height: 56.25%;*/ height: -webkit-calc( (100vw - 20px) * 0.5625); height: -moz-calc( (100vw - 20px) * 0.5625); height: calc( (100vw - 20px) * 0.5625); } }
/* google 驗證 */
.g-recaptcha > * { display: block; margin: 0 auto; }
@media (max-width: 365px) { .g-recaptcha { transform: scale(0.83); transform-origin: 0 0; } }

.box-borderDeco { position: relative; margin-bottom: 0.5em; background: url(../images/angle_deco.svg) right bottom no-repeat; background-color: rgba(0, 136, 255, 0.2); border: solid 1px rgba(0, 230, 255, 0.5); border-right-color: #00e6ff; border-bottom-color: #00e6ff; }
.box-borderDeco::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 4px 0 0 4px; z-index: -1; border: solid rgba(0, 230, 255, 0.5); border-width: 0 1px 1px 0; }
.box-borderDeco-gold { border-color: #ffeb3b; background-image: none; }
.box-borderDeco-gold::before { border-color: rgba(255, 235, 59, 0.5); }
.box-borderDeco-gold::after { content: ""; position: absolute; right: 0; bottom: 0; margin: -1px; width: 25px; height: 25px; background: linear-gradient(-50deg, #b58114, #fced9c 50%, #fced9c 60%, #b37e10); clip-path: polygon(100% 0, 100% 100%, 0 100%); }
@media (min-width: 768px) { .box-borderDeco::before { margin: 6px 0 0 6px; } }

.avaterGroup_item { display: inline-block; margin-right: -10px; width: 24px; }
.avaterGroup .avater { background: #fff; box-shadow: 0 0 1px 1px #fff; }
.avaterGroup_more { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: -webkit-flex; -webkit-justify-content: center; -webkit-align-items: center; display: flex; justify-content: center; align-items: center; padding-top: 0.125em; font-size: 12px; font-weight: bold; letter-spacing: -0.075em; text-indent: -0.1em; background: #fff; color: #00e6ff; }
@media (min-width: 768px) { .avaterGroup_item { width: 34px; margin-right: -13px; }
  .avaterGroup_more { font-size: 15px; } }

.productLike { position: absolute; right: 0; bottom: 0; margin: 5px; font-size: 22px; color: #fff; filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.01)); }
.productLike.active { color: #e2004b; text-shadow: 0 0 1px #fff, 1px 0 0 #fff, -1px 0 0 #fff, -1px 0 0 #fff, 0 1px 0 #fff, 0 -1px 0 #fff; }

.scores { flex-shrink: 0; white-space: nowrap; }
.scores_item { opacity: .3; cursor: pointer; }
.scores .active { opacity: 1; color: #ffdf00; }

.levelNext_icon { display: inline-block; height: 1em; width: auto; margin-top: -0.5em; }
.levelNext_icon + .levelNext_icon { margin-left: -0.25em; font-size: 1.3em; }
.levelNext_icon + .levelNext_icon + .levelNext_icon { font-size: 1.69em; }

.updateDot { display: inline-block; width: 0.75em; height: 0.75em; font-size: 0.625rem; border-radius: 50%; background: currentColor; }

.pager { display: -webkit-flex; -webkit-flex-wrap: wrap; -webkit-justify-content: center; display: flex; flex-wrap: wrap; justify-content: center; font-size: 0.875rem; }
.pager_item { opacity: .5; }
.pager_item:hover { opacity: 1; }
.pager a { display: block; padding: 0.5em 0.75em; }
.pager .active { font-weight: bold; color: #00e6ff; opacity: 1; }
.pager .active a::after { content: ""; display: block; border-top: 2px solid; margin-bottom: -2px; transform: translateY(0.125em); }

.gutter .pager { margin-right: -0.875em; margin-left: -0.875em; }

.scrollList { overflow-x: auto; }
.scrollList::-webkit-scrollbar { display: none; }
.scrollList_cont { display: -webkit-inline-flex; display: inline-flex; }
.scrollList_item { position: relative; width: 40vw; margin-right: 3vw; }
.scrollList-wide .scrollList_item { width: 56vw; }
@media (min-width: 576px) { .scrollList_cont { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin-right: -1rem; }
  .scrollList_item { width: 33.33%; padding-right: 1rem; margin: 0 0 1rem; }
  .scrollList-wide .scrollList_item { width: 50%; } }

.medal { position: relative; display: inline-block; }
.medal_reflect { display: none; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: 5.641%; border-radius: 100%; clip-path: polygon(0 0, 100% 0, 100% 48%, 0 48%); transform: rotate(-45deg); }
.medal_bg { display: block; margin: 0 auto -1em; height: 1em; }
.medal_bg-iron ~ .medal_reflect { display: block; background: linear-gradient(to right, #fff, transparent); opacity: .45; }
.medal_bg-silver ~ .medal_reflect { display: block; background: linear-gradient(to right, #73CCFF, transparent); opacity: .4; }
.medal_bg-gold ~ .medal_reflect { display: block; background: linear-gradient(to right, #FFDF00, transparent); opacity: .3; }
.medal_icon { display: block; margin: 0 auto; height: 1em; }
.medal_sub { position: absolute; bottom: 0; right: 0; height: 0.45em; width: auto; transform: translate(10%, 10%); }

.progressBar { background: rgba(255, 255, 255, 0.3); border-radius: 5px; }
.progressBar_now { border-top: 5px solid #00e6ff; border-radius: inherit; }

.step { display: flex; padding-left: 0; list-style: none; counter-reset: step; }
.step li { display: -webkit-inline-flex; -webkit-align-items: center; -webkit-flex: 1 1 auto; display: inline-flex; align-items: center; flex: 1 1 auto; counter-increment: step; }
.step li::before { content: counter(step); -webkit-flex-shrink: 0; flex-shrink: 0; display: inline-block; width: 1em; height: 1em; line-height: 1; margin-right: 0.5em; padding: 0.25em; font-size: 0.75em; letter-spacing: 0; text-align: center; color: #000; background: #00e6ff; border-radius: 1em; box-sizing: content-box; }
.step li::after { content: "\f101"; float: right; margin: 0 auto; padding: 0.5em 0.5em; font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome 5 Pro", "Font Awesome 5 Brands", Helvetica, Helvetica Neue, Arial, 微軟正黑體, Microsoft JhengHei, Microsoft YaHei, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC, LiHei Pro, sans-serif; font-weight: bold; opacity: .3; }
.step li:last-child::after { content: none; }
.step :not(.active)::before { filter: grayscale(1); opacity: .6; }
.step :not(.active) .step_text { opacity: .6; }
@media (max-width: 767.98px) { .step { -webkit-justify-content: center; justify-content: center; font-size: 1.125rem; }
  .step li { -webkit-flex: 0 0 auto; flex: 0 0 auto; }
  .step :not(.active) .step_text { display: none; } }

.vsTag { position: relative; z-index: 1; -webkit-align-self: start; align-self: start; margin: 25% -1.3em 0; width: 2em; height: 2em; line-height: 2em; font-size: 13px; letter-spacing: -0.1em; text-indent: -0.1em; text-align: center; background: #000; color: #fff; border-radius: 50%; transform: translateY(-50%); }

.searhDropdown { position: relative; }
.searhDropdown_top { position: relative; z-index: 1; }
.searhDropdown_input { width: 100%; height: 2.5em; padding-left: 1em; padding-right: 2.75em; border-radius: 2em; background: transparent; }
.searhDropdown_input::-webkit-search-cancel-button { background: currentColor; opacity: .6; }
.searhDropdown_input:placeholder-shown { padding-right: 1em; }
.searhDropdown_searchBtn { margin-left: -2.5em; cursor: pointer; }
.searhDropdown_close { display: none; }
.searhDropdown_dropdown { display: none; position: absolute; top: 0; left: 0; right: 0; margin: -0.5em; padding-top: 4em; background-color: #fff; border-radius: 0.25rem; box-shadow: 0 12px 12px rgba(0, 0, 0, 0.1), inset 0 0 0 0 rgba(0, 0, 0, 0.1); transition: 0.3s ease; transition-property: color, border, outline, background, opacity, filter, box-shadow, transform; }
.searhDropdown .scrollbar { max-height: 60vh; padding: 0 0.5em 0.5em; overflow-y: auto; }
.searhDropdown .scrollbar::-webkit-scrollbar-thumb { background-color: rgba(0, 0, 0, 0.1); }
.searhDropdown_result_item:hover { margin: 0 -0.5em; padding-left: 0.5em; padding-right: 0.5em; background-color: rgba(0, 0, 0, 0.05); }
.searhDropdown_remove { width: 2em; height: 2em; line-height: 2em; text-align: center; margin: auto 0; border-radius: 2em; }
.searhDropdown_dropdown_emptyText { display: none; }
.searhDropdown_result:empty ~ .searhDropdown_dropdown_emptyText { display: block; }
.searhDropdown_result:empty ~ .searhDropdown_dropdown_title { display: none; }

.searhDropdown.onfocus { z-index: 2; color: #333; }
.searhDropdown.onfocus .searhDropdown_input { color: inherit; border: solid 1px #ddd; }
.searhDropdown.onfocus .searhDropdown_input::placeholder { color: #aaa; font-size: 14px; }
.searhDropdown.onfocus .searhDropdown_input:focus, .searhDropdown.onfocus .searhDropdown_input:focus-visible { border-color: #00e6ff; background: transparent; box-shadow: 0 0 0 0.2rem rgba(0, 230, 255, 0.25); outline: none; }
.searhDropdown.onfocus .searhDropdown_close, .searhDropdown.onfocus .searhDropdown_dropdown { display: block; }

:root { --animate-duration: 1s; --animate-delay: 1s; --animate-repeat: 1; }

.animate__animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both; }

@keyframes shakeX { from,
	to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  10%,
	30%,
	50%,
	70%,
	90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); }
  20%,
	40%,
	60%,
	80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } }
.animate__shakeX { -webkit-animation-name: shakeX; animation-name: shakeX; }

@keyframes headShake { 0% { -webkit-transform: translateX(0); transform: translateX(0); }
  6.5% { -webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg); }
  18.5% { -webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg); }
  31.5% { -webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg); }
  43.5% { -webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg); }
  50% { -webkit-transform: translateX(0); transform: translateX(0); } }
.animate__headShake { -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-name: headShake; animation-name: headShake; }

.translated-ltr body { top: 0 !important; }
.translated-ltr .skiptranslate { display: none !important; }

.goog-logo-link { display: none !important; }

.goog-te-gadget { color: transparent !important; }

.goog-te-banner-frame.skiptranslate { display: none !important; }

a[href="https://translate.google.com"] { display: none !important; }

.modal-switchCountry a { cursor: pointer; }
.modal-switchCountry a:hover { background: rgba(255, 255, 255, 0.1); }

.switchLang .fa-solid, .switchLang .fa { display: none; }
.switchLang .active { color: #00e6ff; }
.switchLang .active .fa-solid, .switchLang .active .fa { display: inline-block; }

.swiper-slide.swiper-slide-homeSpace.swiper-slide-homeSpace { width: 50px; }
@media (min-width: 768px) { .swiper-slide.swiper-slide-homeSpace.swiper-slide-homeSpace { width: 110px; } }

.swiper-slide.swiper-slide-innerSpace.swiper-slide-innerSpace { display: none; width: 0; }
@media (min-width: 1160px) { .swiper-slide.swiper-slide-innerSpace.swiper-slide-innerSpace { display: block; width: calc( ( 100% - 1160px ) / 2 ); } }

.kv { z-index: 0; border-bottom: 1px solid rgba(0, 230, 255, 0.3); background: #000; }
.kv .imgfit { padding-top: 50%; }
@media (min-width: 576px) { .kv .imgfit { padding-top: 34.722%; } }

.marquee { position: relative; display: -webkit-flex; display: flex; height: 68px; font-size: 15px; border: solid #F3E188; border-width: 1px 0; background: rgba(0, 0, 0, 0.6); }
.marquee::before { content: ""; position: absolute; top: 0; right: 0; transform: translateY(-50%); width: 50%; max-width: 375px; height: 5px; background: radial-gradient(farthest-side, #ffffff, #ffef7e 20%, rgba(255, 239, 126, 0)); }
.marquee_deco { -webkit-flex-shrink: 0; flex-shrink: 0; margin: -1px 0; }
.marquee_deco img { width: auto; height: 68px; }
.marquee_winner { font-size: 1.2em; }
.marquee_winner_item .medal { vertical-align: middle; margin: -0.5em 0; font-size: 1.333em; }
.marquee_contest { padding-right: 0.5em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; min-height: 1em; display: block; white-space: nowrap; text-overflow: ellipsis; }
.marquee_more { float: right; margin-top: 0.25em; font-size: 0.875rem; font-weight: normal; color: #00e6ff; }
@media (max-width: 767.98px) { .marquee_slider_item { padding: 0.75em 0 0 0.25em; }
  .marquee_winner { height: 1.333em; line-height: 1.333em; font-weight: bold; color: #ffdf00; }
  .marquee_winner_item { min-width: 4.5em; max-width: 6em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; min-height: 1em; }
  .marquee_winner_item:first-child { min-width: 3.75em; }
  .marquee_winner_item + .marquee_winner_item:before { content: ""; display: inline-block; vertical-align: middle; width: 4px; height: 4px; border-radius: 100%; background: #fff; margin: 0 0.125em 0 0.25em; } }
@media (min-width: 768px) { .marquee { height: 53px; line-height: 53px; border-width: 1px; font-size: 22px; font-weight: bold; }
  .marquee_deco { margin: -1px; }
  .marquee_deco img { height: 53px; }
  .marquee_winner { -webkit-flex-shrink: 0; flex-shrink: 0; max-width: 75%; font-size: 0.955em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; min-height: 1em; }
  .marquee_winner_item { margin-left: 0.5em; }
  .marquee_winner_item .medal { font-size: 1.714em; }
  .marquee_more { margin-top: 0; font-size: 1rem; } }
@media (min-width: 768px) and (max-width: 1199.98px) { .marquee { font-size: 18px; } }

.homeContest { border-top: solid 1px rgba(0, 230, 255, 0.5); }
.homeContest .swiper-wrapper { padding-bottom: 1em; }
.homeContest .swiper-slide { width: 210px; }
.homeContest_item { display: block; margin: 0 5px; }
@media (min-width: 992px) { .homeContest { position: relative; background: rgba(0, 0, 0, 0.6); border: solid 1px rgba(0, 230, 255, 0.5); }
  .homeContest::before { content: ""; position: absolute; top: 0; left: 0; transform: translateY(-50%); width: 50%; height: 5px; background: radial-gradient(farthest-side, #00e6ff, rgba(0, 0, 0, 0)); }
  .homeContest::after { content: ""; position: absolute; bottom: 0; right: 0; transform: translateY(50%); width: 50%; height: 5px; background: radial-gradient(farthest-side, #00e6ff, rgba(0, 0, 0, 0)); } }

.idxMediaWrap { --idxMediaGutter: 1rem; padding-left: var(--idxMediaGutter); padding-right: var(--idxMediaGutter); }

.idxMedia { margin-left: calc(var(--idxMediaGutter) * -1); margin-right: calc(var(--idxMediaGutter) * -1); padding-left: var(--idxMediaGutter); padding-right: var(--idxMediaGutter); }
.idxMedia .swiper-button-next, .idxMedia .swiper-button-prev { width: var(--idxMediaGutter); }
.idxMedia .swiper-button-next:after, .idxMedia .swiper-button-prev:after { --swiper-navigation-size: var(--idxMediaGutter); }
.idxMedia .swiper-button-prev, .idxMedia .swiper-rtl .swiper-button-next { left: calc(var(--idxMediaGutter) * -0.25); }
.idxMedia .swiper-button-next, .idxMedia .swiper-rtl .swiper-button-prev { right: calc(var(--idxMediaGutter) * -0.25); }
@media (min-width: 768px) { .idxMediaWrap { --idxMediaGutter: 2rem; } }

.quizBanner { position: relative; display: block; background: rgba(0, 0, 0, 0.6) url(../images/bg_prize_mobile@2x.png) center -1px no-repeat; background-size: 100% auto; border: solid 2px rgba(0, 230, 255, 0.5); border-radius: 0.5rem; box-shadow: 0 4px 0 rgba(0, 230, 255, 0.5); transition-property: all; }
.quizBanner::after { content: "\f25a"; position: absolute; bottom: -9%; left: 85%; font-size: 2rem; font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome 5 Pro", "Font Awesome 5 Brands", Helvetica, Helvetica Neue, Arial, 微軟正黑體, Microsoft JhengHei, Microsoft YaHei, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC, LiHei Pro, sans-serif; font-weight: 900; transform: rotate(-35deg); transform-origin: center; filter: drop-shadow(0 1px 5px #000); }
@media (min-width: 768px) { .quizBanner::after { bottom: 10%; left: 50%; margin-left: 200px; } }
.quizBanner:active { box-shadow: 0 0 rgba(0, 230, 255, 0.5); transform: translateY(4px); }

.idxQuiz .swiper-slide { width: auto; }
.idxQuiz .swiper-scrollbar-drag, .idxQuiz .swiper-pagination-progressbar-fill { background: rgba(255, 255, 255, 0.3); }
.idxQuiz_item { display: block; width: calc(50vw - 0.5rem); padding-right: 1rem; }
.idxQuiz_btn { position: absolute; bottom: 0; left: 0; right: 0; padding: 0.25em; background: rgba(226, 0, 75, 0.8); text-align: center; }
@media (min-width: 576px) { .idxQuiz_item { width: 200px; } }
@media (min-width: 992px) { .idxQuiz_item { width: 250px; } }

.idxVideo .swiper-slide { width: auto; }
.idxVideo_item { display: block; width: 53.333vw; margin-right: 1rem; }
.idxVideo_item .imgfit { pointer-events: none; }
@media (min-width: 576px) { .idxVideo_item { width: 40vw; } }
@media (min-width: 992px) { .idxVideo_item { width: 360px; } }

.homeStars .swiper-slide { padding: 0 0.5rem; }
.homeStars_item { padding: 10px 13px; font-size: 14px; }
.homeStars_photo { width: 80px; margin-right: 18px; }
.homeStars_rank { position: relative; width: 8.5em; height: 2.429em; margin-left: -1.929em; margin-right: -0.858em; padding-left: 1em; font-size: 14px; font-weight: bold; line-height: 2em; text-align: center; background: center bottom no-repeat; background-size: contain; background-image: url(../images/homestars_rankbg_blue.png); color: #000; }
.homeStars_rank .big { margin: 0 0.125em; font-size: 1.563em; font-weight: bold; font-style: italic; vertical-align: -0.05em; }
.homeStars_name { margin-bottom: 0.125em; font-size: 1.429em; font-weight: bold; }
.homeStars_numBlock { line-height: 1.714em; white-space: nowrap; }
.homeStars_pointTag { font-size: 14px; line-height: 1.33; }
.homeStars_point { min-width: 2em; font-size: 1.857em; font-weight: bold; color: #00e6ff; }
.homeStars_teamLevel { font-size: 1.571em; font-weight: bold; color: #00e6ff; }
.homeStars_badge { font-size: 2.143em; }
.homeStars_badge img { height: 1em; width: auto; }
.homeStars_badge .medal_sub { height: 0.6em; margin-right: -0.125em; }
.homeStars_rankChange { font-size: 15px; font-weight: bold; letter-spacing: 0.05em; }
.homeStars_person .avaterGroup { margin-top: 2px; padding-right: 5px; margin-right: 0.5em; -webkit-flex-shrink: 0; flex-shrink: 0; }
.homeStars_person .avaterGroup_item { width: 24px; margin-right: -5px; }
.homeStars_item-standout .homeStars_rank { background-image: url(../images/homestars_rankbg@2x.png); color: #592211; }
.homeStars_item-standout .homeStars_point, .homeStars_item-standout .homeStars_teamLevel { color: #ffdf00; }
@media (min-width: 768px) { .homeStars .swiper-slide { width: 376px; padding: 0 0.75rem; }
  .homeStars_photo .imgfit { width: 8.444em; } }
@media (min-width: 1200px) { .homeStars_item { font-size: 1.125em; }
  .homeStars_photo .avater { margin-top: 0.75em; } }

.homeTrade { position: relative; }
.homeTrade .avater { width: 3.5em; }
.homeTrade_bubble { padding: 0.5em 1em 0; font-size: 12px; line-height: 1.125; text-align: center; color: #000; background: #00e6ff; border-radius: 13px; }
.homeTrade_bubble::after { content: ""; display: block; width: 10px; height: 8px; margin-top: 0.4em; margin-bottom: -7px; background: inherit; clip-path: polygon(0 0, 100% 0, 0 100%); }
.homeTrade_bubble .fa-solid { display: block; font-size: 2em; margin-bottom: 0.125em; }
@media (max-width: 767.98px) { .homeTrade_item { padding-right: 0.25em; border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
  .homeTrade_item_cont { padding: 0.75em 0.75em 1.125em; padding-left: 0; } }
@media (min-width: 768px) { .homeTrade_item { padding-right: 1rem; background: rgba(0, 136, 255, 0.2); border-radius: 0.5rem; }
  .homeTrade_item_cont { padding: 1em; padding-left: 1.125em; } }

.homeProducts { text-align: center; }
.homeProducts .swiper-slide { width: auto; }
.homeProducts_item { width: 35vw; margin: 0.5em; }
.homeProducts .productLike { position: absolute; right: 0; bottom: 0; margin: 5px; font-size: 22px; }
@media (min-width: 768px) { .homeProducts_item { width: 200px; margin: 10px; }
  .homeProducts .productLike { margin: 10px; font-size: 24px; } }

.homeStores_item { display: block; margin-bottom: 1em; }
.homeStores .swiper { --swiper-pagination-bullet-inactive-color: #fff; --swiper-pagination-bullet-inactive-opacity: .3; padding-left: 23px; padding-right: 23px; padding-bottom: 2em; }
@media (max-width: 767.98px) { .homeStores .swiper { height: 28em; padding-bottom: 1em; }
  .homeStores .swiper .swiper-slide { height: 12.5em; } }

.memberLink { position: relative; z-index: 0; font-size: 0.875rem; color: #00e6ff; }
@media (min-width: 768px) { .memberLink { font-size: 1rem; } }

.memberTopInfo { font-size: 12px; margin-bottom: 5%; padding-bottom: 5%; border-bottom: solid 1px rgba(0, 230, 255, 0.5); }
.memberTopInfo_photo { width: 5.833em; }
.memberTopInfo_photo_icon { position: absolute; bottom: 0; right: 0; width: 2em; height: 2em; line-height: 2em; font-size: 0.917em; text-align: center; color: #00e6ff; background: #fff; border-radius: 50%; }
.memberTopInfo_link { margin-top: 0.3em; }
.memberTopInfo_name { width: 100%; margin: 0.125em 0 auto; padding-bottom: 0.5em; font-size: 1.667em; font-weight: bold; }
.memberTopInfo_id { display: block; font-size: 0.6em; font-weight: normal; opacity: .8; pointer-events: none; }
.memberTopInfo_label { margin-bottom: 0.25em; opacity: .8; }
.memberTopInfo_num { display: block; font-size: 1.5em; font-weight: bold; }
.memberTopInfo_team { width: 100%; margin-top: 5%; }
.memberTopInfo_team_photo { -webkit-flex-shrink: 0; flex-shrink: 0; width: 2em; margin-right: 2%; }
.memberTopInfo_team_name { font-size: 1.333em; }
@media (min-width: 768px) { .memberTopInfo { font-size: 16px; }
  .memberTopInfo_photo { width: 115px; margin-right: 5%; }
  .memberTopInfo_num { font-size: 1.875em; }
  .memberTopInfo_num .fas { font-size: 0.875em; vertical-align: 0.06em; } }

.memberBtnGroup .linePayImg { height: 1.75em; margin: -0.25em; padding: 0.25em 1em; background: #fff; border-radius: 5em; }
.memberBtnGroup [class*="btn-outline"] .memberBtnGroup_note { font-size: 0.813em; color: #fff; opacity: .8; }
.memberBtnGroup .btn:hover .memberBtnGroup_note, .memberBtnGroup .btn:active .memberBtnGroup_note, .memberBtnGroup .btn.active .memberBtnGroup_note { color: inherit; }

body.person .isTeam, body.person .isWheel, body.person .isTogether, body.person .isOpponent { display: none !important; }
body.wheel .isPerson, body.wheel .isTogether, body.wheel .isOpponent, body.wheel .notWheel { display: none !important; }
body.together .isPerson, body.together .isWheel, body.together .isOpponent, body.together .notTogether { display: none !important; }
body.opponent .isPerson, body.opponent .isTogether, body.opponent .isWheel, body.opponent .notOpponent { display: none !important; }

.finalPrizeGroup_item + .finalPrizeGroup_item { margin-top: 1em; padding-top: 1em; border-top: solid 1px rgba(0, 230, 255, 0.3); }

.myhostAddgiftBtn { float: right; margin: 0.75em 0 0; font-size: 0.875em; color: #00e6ff; cursor: pointer; }

.cycleList { counter-reset: cycle; }
.cycleList_cycle { counter-increment: cycle; counter-reset: child; margin-bottom: 1em; }
.cycleList_title { -webkit-flex-grow: 1; flex-grow: 1; margin-bottom: 0; font-weight: bold; font-size: 1.125em; }
.cycleList_title::before { content: "第 " counter(cycle) " 輪"; }
.cycleList_child { counter-increment: child; padding: 1.25em 1em; }
.cycleList_child + .cycleList_child { border-top: 1px solid rgba(0, 230, 255, 0.5); }
.cycleList_child:nth-child(2n) { background: #000; }
.cycleList_child_title:before { content: "第" counter(child) "場名稱 "; }
.cycleList_child_promotNote { display: none; }
.cycleList_cycle:last-of-type .cycleList_child:last-of-type .cycleList_child_promotNote { display: block; }
.cycleList_removeCycle { font-size: 0.875em; }
.cycleList_addChild { float: right; margin-top: 0.25em; font-size: 0.875em; }

.avaterList_item { position: relative; }
.avaterList_item-empty { display: block; align-self: flex-start; margin: -3%; padding-bottom: 106%; font-size: 10px; border: dashed 1px; color: #00e6ff; border-radius: 5px; }
.avaterList_item-empty .fas { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.avaterList_item_info { display: block; }
.avaterList_name { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; min-height: 1em; margin: 0.25em 0; font-size: 10px; opacity: .7; }
.avaterList-search .avaterList_name { margin: 0.5em 0; font-size: 12px; }
.avaterList_btn { position: absolute; top: 0; right: 0; width: 1em; height: 1em; margin: -0.5em -1em; padding: 0.25em; font-size: 12px; text-align: center; box-sizing: content-box; border-radius: 50%; border: solid 0.5em transparent; background-clip: padding-box; cursor: pointer; }
.avaterList_btn:hover { transform: scale(1.2); }
.avaterList_btn-danger { color: #fff; background-color: #e2004b; }
.avaterList_btn-success { color: #000; background-color: #27ff7e; }
.avaterList_btn-brand { color: #000; background-color: #00e6ff; }
@media (min-width: 768px) { .avaterList_item-empty { font-size: 12px; }
  .avaterList_btn { margin: -0.5em; font-size: 12px; } }

.removeList { width: 100%; margin-bottom: 1em; padding-bottom: 1em; border-bottom: solid 1px rgba(0, 230, 255, 0.3); }
.removeList:empty { display: none; }

.contestListHTML { scroll-behavior: unset; }

.contestStickyFilter { position: sticky; z-index: 1; top: 0; }
.contestStickyFilter a { cursor: pointer; }
@media (min-width: 1300px) { .contestStickyFilter { z-index: 2; top: 3.75rem; } }

.contestList_photo { width: 8em; font-size: 12px; }
@media (min-width: 992px) { .contestList_photo { font-size: 16px; } }
.contestList_title { margin: -0.05em 0 0.25em; font-size: 1.429em; font-weight: bold; line-height: 1; color: #00e6ff; }
.contestList_time { color: #fff; }
.contestList_week { vertical-align: 0.1em; font-size: 0.85em; }
.contestList .badge { margin: 0 0.25em 0.25em 0; padding: 0.4em 0.5em; font-size: 12px; font-weight: normal; vertical-align: middle; }
.contestList_LiveTag { display: block; padding: 0.25em; font-size: 12px; color: #000; background: #27ff7e; text-align: center; }
.contestList .isLive .imgfit { box-shadow: 0 0 0 2px #27ff7e; border-radius: 2px; }
.contestList .isLive .imgfit_fixtags { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), transparent 2em); }
.contestList .isLive .imgfit_fixtags::before { content: '\f03d'; float: right; margin: 0 0.25em; font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome 5 Pro", "Font Awesome 5 Brands", Helvetica, Helvetica Neue, Arial, 微軟正黑體, Microsoft JhengHei, Microsoft YaHei, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC, LiHei Pro, sans-serif; font-weight: bold; font-size: 14px; color: #27ff7e; text-shadow: 0 3px 3px rgba(0, 0, 0, 0.1); }

.contestSingingBtn { background: linear-gradient(#e2004b, #af003a); }
.contestSingingBtn_pointer { font-size: 1.5em; transform: scale(1.2) rotate(-30deg) translateY(10%); transition: 0.3s ease; transition-property: color, border, outline, background, opacity, filter, box-shadow, transform; animation: pointerMove 2s ease infinite; }

.contestBanner { display: block; object-fit: cover; width: 100%; max-height: 66.667vw; }
@media (min-width: 768px) { .contestBanner { max-height: 400px; } }

.contestBannerMask { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: -webkit-flex; -webkit-align-items: center; -webkit-justify-content: center; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.8); }

.contestPhotos .mask { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: -webkit-flex; -webkit-align-items: center; -webkit-justify-content: center; display: flex; align-items: center; justify-content: center; font-size: 4.267vw; letter-spacing: 0.1em; background: rgba(0, 0, 0, 0.7); }
.contestPhotos .more ~ .grid_item { display: none; }
.contestPhotos_item { position: relative; }
.contestPhotos_remove { position: absolute; top: 0; right: 0; width: 1em; height: 1em; margin: -0.125em; padding: 0.25em; font-size: 14px; line-height: 1; text-align: center; color: #000; background: #ffdf00; border-radius: 50%; box-sizing: content-box; }
@media (min-width: 768px) { .contestPhotos .mask { font-size: 1.5rem; } }

.contestSChedule { line-height: 1.5; }
.contestSChedule_item { display: -webkit-flex; -webkit-flex-wrap: wrap; display: flex; flex-wrap: wrap; }
.contestSChedule_dt { min-width: 6.5em; padding-right: 0.5em; }
.contestSChedule_dd { -webkit-flex-grow: 1; flex-grow: 1; }
.contestSChedule_view { float: right; margin-right: -0.5em; padding: 0 0.5em; font-size: 0.813em; line-height: 1.75; color: #00e6ff; }

.contestPlayers_avater { display: block; border-radius: 100%; }
.contestPlayers_avater[aria-expanded="true"] { outline: solid 4px #00e6ff; outline-offset: 1px; }
.contestPlayers_sort { position: absolute; bottom: 0; right: 0; margin: -0.125em -0.25em; min-width: 1.25em; height: 1.25em; line-height: 1.25em; font-size: 12px; letter-spacing: -0.05em; text-align: center; color: black; background: rgba(255, 255, 255, 0.8); border-radius: 2px; }
.contestPlayers .isFemale .contestPlayers_name { color: #ff7567; }
.contestPlayers .isFemale .contestPlayers_sort { background: rgba(255, 117, 103, 0.9); }

.prize { margin-top: 100px; padding-top: 1px; background-image: linear-gradient(#A57D24, #D8BD62 20%, #F1DD80 30%, #FBF2A8 50%, #F1DD80 75%, #A57D24), url(../images/bg_prize_mobile@2x.png); background-size: 100% 2px, 100% auto; background-position: center top , center top; background-repeat: no-repeat, no-repeat; }
.prize_topDeco { display: block; margin: -0.658em auto 0; font-size: 105px; }
.prize_titleDeco { vertical-align: -10%; height: 1.65em; width: auto; margin-right: -0.25em; }
.prize_bonus { font-size: 2em; font-weight: bold; color: #00e6ff; }
.prize_btmDeco { display: block; width: 100%; margin: 10% auto; text-align: center; }
@media (min-width: 768px) { .prize { background-image: linear-gradient(#A57D24, #D8BD62 20%, #F1DD80 30%, #FBF2A8 50%, #F1DD80 75%, #A57D24), url(../images/bg_prize.png); background-size: 100% 2px, 1100px auto; min-height: 550px; } }

.winner { font-size: 0.875em; }
.winner_item-center { width: 6em; margin-top: 3em; text-align: center; }
.winner_item-center .winner_crown { position: relative; z-index: 1; display: block; width: 2.5em; height: 2.083em; margin: 0 auto -0.25em; padding-top: 0.75em; font-size: 1em; font-weight: bold; color: #000; background: url(../images/crown.svg) center bottom no-repeat; background-size: contain; }
.winner_item-center .avater { width: 4em; padding-top: 4em; margin: 0 auto; }
.winner_item-center .dropdown-menu .avater { width: 100%; padding-top: 100%; margin: 0; }
.winner_item-center .winner_name { margin: 0.25em 0 0; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.winner_item-center .winner_shrimpNum { margin: 0; font-size: 1.5em; font-weight: bold; }
.winner_item-center .match_shrimpNum { font-size: 1.5em; }
.winner_item-1 { width: 6.714em; margin-top: 0; }
.winner_item-1 .winner_crown { width: 3.429em; height: 2.5em; margin-bottom: -0.5em; padding-top: 1.25em; font-size: 1.167em; background-image: url(../images/crown_big.svg); }
.winner_item-1 .avater { width: 5em; padding-top: 5em; }
.winner_item-2:not(.order-0) { -webkit-order: -1; order: -1; }
.winner_item { width: 43%; max-width: 10em; margin: 0.75em 0.5em; }
.winner_item .winner_tag { font-size: 1.286em; font-weight: bold; color: #ffdf00; }
.winner_item .winner_name { margin: 0; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; min-height: 1em; }
.winner_item .winner_shrimpNum { margin: 0; }

@media (max-width: 767.98px) { .otherWinnersStart ~ .winner_item:nth-child(2n+3):last-child { margin-right: 11.5em; }
  .otherWinnersStart + .winner_item.winner_item:last-child { margin-right: 0.5em; } }

.match { margin-top: 80px; margin-bottom: 2.5em; padding-bottom: 3em; border-bottom: solid 1px rgba(255, 255, 255, 0.6); background: url(../images/bg_match_mobile@2x.png) center center; background-size: cover; }
@media (min-width: 768px) { .match { background-image: url(../images/bg_match.png); } }
.match_title { position: relative; padding-top: 1px; }
.match_title::before, .match_title::after { content: ""; position: absolute; top: 0; width: calc(50% - 60px); border-top: solid 1px rgba(255, 255, 255, 0.6); }
.match_title::before { left: 0; }
.match_title::after { right: 0; }
.match_title_pic { display: block; font-size: 148px; width: 1em; margin: -0.271em auto 1.5rem; }
.match_label { font-size: 1em; text-align: center; line-height: 1.25; }
.match_group { position: relative; margin-top: 20px; text-align: center; }
.match_group::before { content: ""; display: block; height: 10px; border: solid rgba(255, 255, 255, 0.5); border-width: 1px 1px 0; }
.match_group::after { content: ""; position: absolute; width: 10px; height: 8px; bottom: 100%; left: 50%; clip-path: polygon(50% 0, 100% 100%, 0 100%); background: rgba(255, 255, 255, 0.5); transform: translate(-50%, -5px); }
.match_group-extra:before { border-color: #ff1663; }
.match_group-extra::after { background: #ff1663; }
.match_group-extra .match_label { color: #ff1663; }
.match_players { display: -webkit-inline-flex; -webkit-flex-wrap: wrap; -webkit-justify-content: center; display: inline-flex; flex-wrap: wrap; justify-content: center; }
.match_players_item { width: calc( ( 100vw - 46px ) / 6 ); max-width: 3.25rem; }
.match_players_item > .position-relative, .match_players_item .avaterWrap { max-width: 2.5rem; margin: auto; }
@media (min-width: 390px) { .match_players_item { max-width: 3.5rem; } }
.match-together .match_players_item { width: calc( ( 100vw - 46px ) / 6 ); max-width: 4.5rem; }
.match-opponent .match_players_item { width: calc( ( 100vw - 46px ) / 4 ); max-width: 6rem; }
.match-opponent .match_players_item > .position-relative, .match-opponent .match_players_item .avaterWrap { max-width: 4rem; }
.match_group-opponent .match_players_item { width: calc( ( 100vw - 46px ) / 2 ); max-width: 10rem; }
.match_group-opponent .match_players_item_child { padding-right: 0.6em; }
.match_group-opponent .match_players_item_child ~ .match_players_item_child { padding-left: 0.6em; padding-right: 0; }
.match_group-opponent .vsTag { transform: translateY(-75%); }
@media (min-width: 646px) { .match_group-opponent .match_players_item { width: calc( 600px / 4 ); max-width: 10rem; } }
.match .avater::after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(-20deg, #000, transparent 45%); }
.match .avater-noAfter::after { content: none; }
.match_name { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; min-height: 1em; margin: 0.25em 0; font-size: 0.813em; text-align: center; }
.match_shrimpNum { position: absolute; right: 0; bottom: 0; margin-right: -0.25em; line-height: 1; font-size: 1rem; }
.match_pkWinTag { display: inline-block; padding: 0 0.6em; font-size: 0.75em; color: #ffdf00; border: solid 1px rgba(255, 223, 0, 0.8); border-radius: 2em; }

.wheelTabWrap { transition: 0.3s ease; transition-property: color, border, outline, background, opacity, filter, box-shadow, transform; }
.wheelTabWrap.fixed { background: #000; }
.wheelTabWrap::-webkit-scrollbar { display: none; }

.stay { opacity: .5; }
.stay.match_players_item { opacity: 1; }
.stay.match_players_item > :not(.dropdown-menu) { opacity: .3; }
.stay .avater { filter: grayscale(100%); }

[data-toggle="dropdown"][aria-expanded="true"] > .avater, .avater[data-toggle="dropdown"][aria-expanded="true"] { outline: solid 4px #00e6ff; outline-offset: 1px; }

.contestScore_topTag { display: block; height: 1em; margin: -1.125em -0.5em 0.125em; line-height: 1; font-size: 0.857em; opacity: .7; }

.nameDiv[contenteditable="true"] { padding: 0.25em 0.5em; }

.applyPickMember .active .avaterList_item_info .avater, .applyPickMember :checked ~ .avaterList_item_info .avater { outline: solid 4px #00e6ff; outline-offset: 1px; }

.pickMemberSort { counter-reset: sort; }
.pickMemberSort .drag_item { counter-increment: sort; }
.pickMemberSort_sortNum:before { content: "第 " counter(sort) " 棒"; }

.gu-mirror .pickMemberSort_sortNum { opacity: 0; }

.hostSeat_item { position: relative; }
.hostSeat_num { position: absolute; top: 0; left: 0; margin: -1%; padding: 0.25em; min-width: 1.5em; border-radius: 1em; font-size: 1em; letter-spacing: -0.1em; text-indent: -0.1em; }
.hostSeat_avaterText { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: -webkit-flex; -webkit-align-items: center; -webkit-justify-content: center; display: flex; align-items: center; justify-content: center; color: rgba(0, 230, 255, 0.8); background: rgba(0, 230, 255, 0.3); }
.hostSeat_name { min-height: 1em; }

.hostSeat-opponent_vsTag { position: sticky; z-index: 1; top: 100px; left: 50%; width: 0; height: 0; margin-top: -0.5px; -webkit-align-self: flex-start; align-self: flex-start; }
.hostSeat-opponent_vsTag::before { content: "VS"; display: block; white-space: nowrap; width: 2.625em; height: 1.5em; line-height: 1.5em; font-size: 12px; font-weight: bold; letter-spacing: -0.1em; text-align: center; background: #00e6ff; color: #000; border-radius: 0 0 2em 2em; transform: translate(-50%, 0); }
.hostSeat-opponent .hostSeat_item { height: 4em; box-shadow: 0 0 0 1px rgba(0, 230, 255, 0.5); }
.hostSeat-opponent .hostSeat_item .hostSeat_item_numTag { position: relative; z-index: 1; }

.hostSeat-opponent:not(.flex-row-reverse) .secHalf .hostSeat_item { -webkit-flex-direction: row-reverse; flex-direction: row-reverse; text-align: right; }
.hostSeat-opponent:not(.flex-row-reverse) .secHalf .hostSeat_item_row { -webkit-flex-direction: row-reverse; flex-direction: row-reverse; }
.hostSeat-opponent:not(.flex-row-reverse).hostSeat-rounded .fstHalf .hostSeat_item:nth-child(1) { border-top-left-radius: 0.25rem; }
.hostSeat-opponent:not(.flex-row-reverse).hostSeat-rounded .fstHalf .hostSeat_item:nth-last-child(1) { border-bottom-left-radius: 0.25rem; }
.hostSeat-opponent:not(.flex-row-reverse).hostSeat-rounded .fstHalf .hostSeat_item .hostSeat_item_numTag { margin-left: -1em; }
.hostSeat-opponent:not(.flex-row-reverse).hostSeat-rounded .secHalf .hostSeat_item:nth-child(1) { border-top-right-radius: 0.25rem; }
.hostSeat-opponent:not(.flex-row-reverse).hostSeat-rounded .secHalf .hostSeat_item:nth-last-child(1) { border-bottom-right-radius: 0.25rem; }
.hostSeat-opponent:not(.flex-row-reverse).hostSeat-rounded .secHalf .hostSeat_item .hostSeat_item_numTag { margin-right: -1em; }

.hostSeat-opponent.flex-row-reverse .fstHalf .hostSeat_item { -webkit-flex-direction: row-reverse; flex-direction: row-reverse; text-align: right; }
.hostSeat-opponent.flex-row-reverse .fstHalf .hostSeat_item_row { -webkit-flex-direction: row-reverse; flex-direction: row-reverse; }
.hostSeat-opponent.flex-row-reverse.hostSeat-rounded .fstHalf .hostSeat_item:nth-child(1) { border-top-right-radius: 0.25rem; }
.hostSeat-opponent.flex-row-reverse.hostSeat-rounded .fstHalf .hostSeat_item:nth-last-child(1) { border-bottom-right-radius: 0.25rem; }
.hostSeat-opponent.flex-row-reverse.hostSeat-rounded .fstHalf .hostSeat_item .hostSeat_item_numTag { margin-right: -1em; }
.hostSeat-opponent.flex-row-reverse.hostSeat-rounded .secHalf .hostSeat_item:nth-child(1) { border-top-left-radius: 0.25rem; }
.hostSeat-opponent.flex-row-reverse.hostSeat-rounded .secHalf .hostSeat_item:nth-last-child(1) { border-bottom-left-radius: 0.25rem; }
.hostSeat-opponent.flex-row-reverse.hostSeat-rounded .secHalf .hostSeat_item .hostSeat_item_numTag { margin-left: -1em; }

.hostPickupPlayer.active .grid_item { opacity: .6; }
.hostPickupPlayer .grid_item.active { opacity: 1; }
.hostPickupPlayer .grid_item.active .avater { box-shadow: 0 0 0 3px #00e6ff; }

.hostInputPkTag-opponent { width: 4em; transform: translate(-50%, -100%); }

.inputShrimp-opponent .secHalf .willReverse-row { flex-direction: row-reverse; text-align: right; }
.inputShrimp-opponent.flex-row-reverse .fstHalf .willReverse-row { flex-direction: row-reverse; text-align: right; }
.inputShrimp-opponent.flex-row-reverse .secHalf .willReverse-row { flex-direction: row; text-align: left; }
.inputShrimp-opponent .inputShrimp_Mask { display: none; position: absolute; z-index: 2; top: 0; left: 0; right: 0; bottom: 0; -webkit-align-items: center; -webkit-justify-content: center; align-items: center; justify-content: center; margin: -1px; border-radius: 0.25rem; background: #3E3F44; color: rgba(255, 255, 255, 0.5); }
.inputShrimp-opponent .inputShrimp_item { border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
.inputShrimp-opponent .inputShrimp_item:nth-child(2n) { background: rgba(255, 255, 255, 0.06); }
.inputShrimp-opponent .inputShrimp_item.disabled .inputShrimp_numtag { background: #68696C; color: rgba(255, 255, 255, 0.5); }
.inputShrimp-opponent .inputShrimp_item.disabled .inputShrimp_Mask { display: -webkit-flex; display: flex; }

.imgfit-profile { height: 300px; }

.profileBanner { margin-bottom: -1.75em; position: relative; }
.profileBanner .imgfit:after { content: ""; position: absolute; bottom: 0; left: 0; right: 0; height: 2em; background: linear-gradient(to top, #0e1015 1%, rgba(14, 16, 21, 0)); }
.profileBanner .imgfit_editIcon { z-index: 1; }

.profileActionBtns .btn { -webkit-flex: 1 1 0; flex: 1 1 0; padding: 0.25rem; }
.profileActionBtns .btn + .btn { margin-left: 0.5rem; }

.profileScor_label { margin-bottom: 0.125em; font-size: 0.875em; opacity: .8; }
.profileScor_num { font-size: 2.125em; font-weight: bold; color: #00e6ff; }
.profileScor_num_unit { font-size: 0.529em; }
.profileScor .levelNext { display: inline-block; }

.profileScore_img { width: 120px; margin-left: 3%; margin-right: 1em; text-align: center; }
.profileScore_img .medal { text-align: center; }
.profileScore_title { display: block; font-size: 1.5em; line-height: 1.2; }
.profileScore_subtitle { display: block; font-size: 1.125em; }

.profileBrief_trigger { display: none; margin-top: .125em; margin-bottom: 1.25em; text-align: right; }
.profileBrief_trigger_mask { position: relative; height: 2em; margin-top: -1.75em; background: linear-gradient(to top, rgba(0, 4, 31, 0) 0, #00041f 5%, #00041f 6%, rgba(0, 4, 31, 0)); transition: 0.3s ease; transition-property: color, border, outline, background, opacity, filter, box-shadow, transform; }
.profileBrief_trigger_close { display: none; }
.profileBrief_target.toggle { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; min-height: 3em; }
.profileBrief_target.toggle ~ .profileBrief_trigger { display: block; }
.profileBrief_open:checked ~ .profileBrief_target.toggle { display: block; }
.profileBrief_open:checked ~ .profileBrief_trigger .profileBrief_trigger_mask { opacity: 0; }
.profileBrief_open:checked ~ .profileBrief_trigger .profileBrief_trigger_close { display: block; }

.profilePK { min-height: 120px; }
.profilePK_mask { position: relative; width: 100%; height: 120px; margin-top: -120px; background: linear-gradient(to top, rgba(0, 4, 31, 0) 0, #00041f 5%, #00041f 6%, rgba(0, 4, 31, 0)); pointer-events: none; }
.profilePK_mask .btn { pointer-events: auto; }

.profileMyTeam .item:nth-child(n+4) { display: none !important; }

.proPhotos { position: relative; overflow: hidden; }
.proPhotos .swiper-pagination { bottom: 0; margin-bottom: 10px; }
@media (max-width: 1199.98px) { .proPhotos { margin-bottom: 10%; } }

.proTitle { font-size: 1.375rem; font-weight: bold; color: #00e6ff; }
@media (min-width: 768px) { .proTitle { font-size: 1.625rem; } }

.proPrice { font-size: 1.5rem; font-weight: bold; line-height: 1; color: #ffdf00; }
.proPrice_unit { display: inline-block; margin-left: 0.25em; font-size: 0.48em; font-weight: normal; color: #fff; }
@media (min-width: 768px) { .proPrice { font-size: 1.75rem; } }

.proCart { bottom: -100vh; }
.proCart_btn { margin-top: 0.5rem; }
.proCart_close { display: none; position: absolute; top: 0; right: 0; margin: 0.5em; padding: 0.5em; width: 1em; height: 1em; line-height: 1em; font-size: 0.875rem; text-align: center; border-radius: 50%; box-sizing: content-box; background: rgba(0, 230, 255, 0.3); }
.proCart .proTitle { display: none; }
@media (min-width: 576px) { .proCart_btn span { font-size: 1.11em; } }
.proCart.isSticky { position: fixed; z-index: 1031; bottom: 0; left: 0; right: 0; padding: 1rem 1rem 0; background: #000; opacity: 0; transform: translateY(100%); transition: .3s ease; transition-property: opacity,transform,bottom; border-top: solid 1px rgba(0, 230, 255, 0.6); box-shadow: 0 -5px 10px rgba(0, 0, 0, 0.3); }
.proCart.isSticky .proCart_close { display: block; }
.proCart.isSticky.open { bottom: 0; opacity: 1; transform: translateY(0); }
.proCart.isSticky.open .proTitle { display: block; }

.proCartWrap .mask { display: none; }

.proCartWrap:has(.open) .mask { display: block; z-index: 1030; }

.addToAny-gray .a2a_svg, .addToAny-gray .a2a_count { border-radius: 2em !important; }
.addToAny-gray .a2a_svg { padding: 0.25em !important; transition: 0.3s ease; transition-property: color, border, outline, background, opacity, filter, box-shadow, transform; }
.addToAny-gray.a2a_kit a:not(:hover) .a2a_svg { background: rgba(0, 230, 255, 0.3) !important; }
.addToAny-gray a:hover .a2a_svg, .addToAny-gray a:hover .a2a_svg svg { opacity: 1 !important; }

.storeDetailLike { position: static; float: right; margin: -0.125em -0.25em; padding: 0.25em; font-weight: 400; font-size: 22px; opacity: .8; cursor: pointer; }
.storeDetailLike:hover { font-weight: 900; }
.storeDetailLike.active { color: #e2004b; font-weight: 900; text-shadow: none; opacity: 1; }

.storeIntro_toggleOpen { display: none; margin-top: 0.25em; padding: 0.25em; text-align: center; cursor: pointer; }
.storeIntro_toggleOpen .fa-solid { transform: rotate(90deg); }
.storeIntro.isClose .storeIntro_toggleOpen { display: block; margin-top: -0.25em; }
.storeIntro.isClose .storeIntro_toggleOpen .fa-solid { transform: none; }
.storeIntro.isClose .editor { max-height: 14em; overflow: hidden; -webkit-mask-image: linear-gradient(to top, transparent, #000 2em); mask-image: linear-gradient(to top, transparent, #000 2em); }
.storeIntro-7em.isClose .editor { max-height: 7em; }

.storeFoodTitle { display: flex; align-items: center; justify-content: center; font-size: 0.875em; }
.storeFoodTitle_mainTitle { margin: 0; font-size: 2em; font-weight: bold; white-space: nowrap; color: #FFFF8A; }
.storeFoodTitle-signatureDish { line-height: 1; }
.storeFoodTitle-signatureDish .storeFoodTitle_mainTitle { font-size: 2.857em; }
.storeFoodTitle-signatureDish .storeFoodTitle_mainTitle_decoLeft { width: 0.9em; height: auto; margin: 0 -0.25em; vertical-align: text-top; }
.storeFoodTitle-signatureDish .storeFoodTitle_mainTitle_decoRight { width: 0.875em; height: auto; margin: 0 -0.25em; vertical-align: text-bottom; }
.storeFoodTitle-signatureDish .storeFoodTitle_deco-left, .storeFoodTitle-signatureDish .storeFoodTitle_deco-right { align-self: flex-end; margin: 0 -0.5em; }
.storeFoodTitle-popular { line-height: 1; }
.storeFoodTitle-popular .storeFoodTitle_mainTitle { font-size: 2.857em; }
.storeFoodTitle-popular .storeFoodTitle_people-left { width: 3.143em; height: auto; margin: 0 0.5em -0.125em 0; vertical-align: text-bottom; position: relative; z-index: 2; }
.storeFoodTitle-popular .storeFoodTitle_people-right { width: 4.643em; height: auto; margin: 0 -0.25em -0.125em 0; vertical-align: text-bottom; position: relative; z-index: 2; }
.storeFoodTitle-popular .storeFoodTitle_deco-left, .storeFoodTitle-popular .storeFoodTitle_deco-right { align-self: flex-end; margin: 0 -0.5em; }
@media (max-width: 767.98px) { .storeFoodTitle-popular .storeFoodTitle_mainTitle { font-size: 2.571em; letter-spacing: -0.05em; } }
.storeFoodTitle-chef { line-height: 1; }
.storeFoodTitle-chef .storeFoodTitle_mainTitle { font-size: 2.857em; }
.storeFoodTitle-chef .storeFoodTitle_chef-left { width: 3.357em; height: auto; margin: 0 -0.25em 0 0.5em; vertical-align: text-bottom; }
.storeFoodTitle-chef .storeFoodTitle_chef-right { width: 2.286em; height: auto; margin: 0 -0.25em; vertical-align: text-bottom; }
.storeFoodTitle-chef .storeFoodTitle_deco-left, .storeFoodTitle-chef .storeFoodTitle_deco-right { align-self: flex-end; margin: 0 -0.5em; }
.storeFoodTitle-new { line-height: 1; }
.storeFoodTitle-new .storeFoodTitle_mainTitle { font-size: 2.857em; }
.storeFoodTitle-new .storeFoodTitle_mainTitle_decoLeft { width: 0.675em; height: auto; margin: 0 -0.25em 0 -0.35em; vertical-align: text-top; }
.storeFoodTitle-new .storeFoodTitle_mainTitle_decoRight { width: 0.6em; height: auto; margin: 0 -0.25em 0.2em; vertical-align: text-bottom; }
.storeFoodTitle-new .storeFoodTitle_deco-left, .storeFoodTitle-new .storeFoodTitle_deco-right { align-self: flex-end; margin: 0 -0.75em; }
@media (min-width: 768px) { .storeFoodTitle { font-size: 1rem; }
  .storeFoodTitle_mainTitle { font-size: 2.5em; line-height: 1; }
  .storeFoodTitle_deco-left, .storeFoodTitle_deco-right { height: 3.25em; width: auto; } }

.storeFoodComment_cont { -webkit-mask-image: linear-gradient(to top, transparent, #000 7em); mask-image: linear-gradient(to top, transparent, #000 7em); }
.storeFoodComment_box { position: relative; margin-top: 0.75em; padding: 0.5em 0.75em 0; background: #484242; border-radius: 0.5rem; }
.storeFoodComment_box::before { content: ""; position: absolute; bottom: 100%; left: 25px; width: 13px; height: 8px; clip-path: polygon(50% 0, 100% 100%, 0 100%); background: inherit; transform: translateX(-50%); }
.storeFoodComment_box .mask { background: rgba(0, 0, 0, 0.8); }

.cart { margin-top: 1em; }

.card-header_collapseIcon { float: right; line-height: inherit; transition: 0.3s ease; transition-property: color, border, outline, background, opacity, filter, box-shadow, transform; }
.card-header_collapseIcon:before { font-size: 0.875rem; }

.card-header:hover .card-header_collapseIcon { opacity: 1; }

.card-header.collapsed .card-header_collapseIcon { transform: rotate(180deg); }

.cart_proList_pic { width: 4.5em; margin-right: 0.75rem; }
@media (min-width: 768px) and (max-width: 991.98px) { .cart_proList_pic { width: 100px; } }
@media (min-width: 1200px) { .cart_proList_pic { width: 100px; } }

.cart_form_group { border: 0; }
.cart_form_group + .cart_form_group .card-header { border-top: solid 1px rgba(0, 230, 255, 0.3); }
.cart_form_group .card-header { border-color: rgba(0, 230, 255, 0.3); }

.cart_form_map { margin-top: 0.5em; }
.cart_form_map iframe { width: 100%; height: 150px; }

.form-check .form-control-toggle { display: none; }
.form-check .form-check-input:checked ~ .form-control-toggle { display: block; }

.deliveryForm, .invoiceForm { display: none; }

.cart_resultTitle { margin: 1.25em auto; font-size: 2rem; text-align: center; }
.cart_resultTitle_icon { margin-right: 0.25em; vertical-align: 0.025em; font-size: 2.25em; }
@media (max-width: 991.98px) { .cart_resultTitle { display: -webkit-flex; display: flex; line-height: 1.5; font-size: 1.25rem; } }

.cart_result_price { font-size: 1.625em; font-weight: bold; line-height: 1; color: #ffdf00; }

.gameBanner { padding-top: 36%; }

.gameBannerSlider { --swiper-pagination-bullet-inactive-color: #fff; --swiper-pagination-bullet-inactive-opacity: .4; }
.gameBannerSlider .swiper-pagination { bottom: 0.25rem; }
@media (min-width: 768px) { .gameBannerSlider .swiper-pagination { position: static; margin: 0.5rem auto; transform: none !important; } }

.game_glowBox { position: relative; background: rgba(0, 0, 0, 0.6); border: solid 1px rgba(0, 230, 255, 0.5); }
.game_glowBox::before { content: ""; position: absolute; top: 0; left: 0; transform: translateY(-50%); width: 50%; height: 5px; background: radial-gradient(farthest-side, #00e6ff, rgba(0, 0, 0, 0)); }
.game_glowBox::after { content: ""; position: absolute; bottom: 0; right: 0; transform: translateY(50%); width: 50%; height: 5px; background: radial-gradient(farthest-side, #00e6ff, rgba(0, 0, 0, 0)); }

.gameMarquee, .gameMarquee_item { transition: height .3s ease; }

.gameTop .btn { display: block; margin-top: 0.5rem; padding: 0.5em 0.5em; }
@media (min-width: 768px) { .gameTop .btn { display: inline-block; margin-left: 0.25em; } }

@media (min-width: 768px) { .gameLeisure { background: url(../images/game_leisure_bg_1440x300.png) center top no-repeat; background-size: 100% auto; } }
@media (max-width: 767.98px) { .gameRank .tab-content { position: relative; }
  .gameRank .table { background: rgba(0, 0, 0, 0.6); }
  .gameRank .gameRank_bg { position: absolute; z-index: -1; bottom: 100%; left: 0; width: 180px; height: 103px; margin: 0 0 calc(-3em - 2px) 1rem; background: url(../images/game_rank_girl.png) 0 bottom no-repeat; background-size: contain; } }

.gameList { display: -webkit-flex; -webkit-flex-wrap: wrap; display: flex; flex-wrap: wrap; margin: 0 -3px; }
.gameList_item { width: 33.33%; padding: 8px 3px; }
.gameList_tagAge { position: absolute; top: 0; right: 0; width: 35px; height: auto; margin: 5px; }
@media (min-width: 768px) { .gameList_item { width: 12.5%; padding: 10px 5px; } }

.gameSwiper { margin: 0 -2px; }
.gameSwiper .gameList_item { width: auto; padding: 0; }
.gameSwiper .swiper-slide { position: relative; width: 33%; padding: 0 2px; }
.gameSwiper .swiper-pagination, .gameSwiper .swiper-button-next, .gameSwiper .swiper-button-prev { position: static; transform: none !important; }
.gameSwiper .swiper-pagination-bullet { background: #fff; opacity: .4; }
.gameSwiper .swiper-pagination-bullet-active { background: #00e6ff; opacity: 1; }
.gameSwiper_arrow { opacity: .4; }
.gameSwiper_arrow:active { opacity: 1; }
.gameSwiper_arrow.swiper-button-disabled { opacity: .1; }
.gameSwiper_moreMask { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: -webkit-flex; -webkit-flex-direction: column; -webkit-justify-content: center; -webkit-align-items: center; display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 0 2px; border-radius: 0.25rem; background: rgba(0, 51, 95, 0.9); }
.gameSwiper_moreMask .fa-solid { margin-bottom: 0.125em; font-size: 2em; opacity: .4; }
@media (min-width: 768px) { .gameSwiper { margin: 0 -5px; }
  .gameSwiper .swiper-slide { padding: 0 5px; } }

@media (min-width: 992px) { .gameLoddy { position: relative; }
  .gameLoddy::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 300px; background: url(../images/game_lobby_title_bg.png) center top no-repeat; background-size: 100%; } }

.gameLoddy_top .inner { position: relative; }
.gameLoddy_top_girl { position: absolute; top: 0; left: 0; margin: 1.067%; width: 29.867%; }
@media (max-width: 991.98px) { .gameLoddy_top { background: url(../images/game_lobby_title_bg_m.png) center center no-repeat; background-size: cover; }
  .gameLoddy_top .inner { padding: 2.25em 0 1.5em 34.4%; } }
@media (min-width: 992px) { .gameLoddy_top_girl { margin: 2.328% 0 0 -5.173%; width: 24.741%; }
  .gameLoddy_top_textwrap { padding: 63px 0 1em; } }

.gameLoddy_news .game_glowBox { position: relative; padding: 1em 80px 1em 1em; line-height: 1.8; background: rgba(0, 136, 255, 0.2); }
.gameLoddy_news_deco { position: absolute; bottom: 0; right: 0; width: 100px; margin-right: -19px; }
@media (min-width: 992px) { .gameLoddy_news .title-boardArrow { margin-top: -1.875em; }
  .gameLoddy_news .game_glowBox { padding: 1.25em 120px 1.25em 1.25em; }
  .gameLoddy_news_deco { width: 140px; } }

.gameLeisure_news .game_glowBox { position: relative; min-height: 10.5em; padding: 1em 60px 2.25em 1em; background: rgba(0, 136, 255, 0.2); }
.gameLeisure_news li { margin-bottom: 0.25em; }
.gameLeisure_news li .fa-solid { line-height: 1.25; }
.gameLeisure_news_deco { position: absolute; bottom: 0; right: 0; width: 122px; margin-right: -16px; }
@media (min-width: 992px) { .gameLeisure_news .game_glowBox { height: 270px; padding: 0; line-height: 1.5; }
  .gameLeisure_news ul { height: 100%; padding: 2.5em 120px 2.75em 1.5em; overflow-y: auto; }
  .gameLeisure_news li { margin-bottom: 0.444em; font-size: 1.125em; }
  .gameLeisure_news_deco { width: 172px; } }

.gameRank .table { border: solid 1px rgba(0, 230, 255, 0.5); }
@media (min-width: 992px) { .gameRank, .gameRank .tab-content { display: -webkit-flex; -webkit-flex-direction: column; display: flex; flex-direction: column; }
  .gameRank .tab-pane { max-height: 219px; border: solid 1px rgba(0, 230, 255, 0.5); overflow-y: auto; }
  .gameRank .table { border: 0; } }

.gameMmo { background: #F5F8FD; color: #394247; }
.gameMmo .title-boardArrow { color: #00335f; }
.gameMmo .text-brand { color: #00A6E2 !important; }
@media (min-width: 768px) { .gameMmo { background: #F5F8FD url(../images/game_mmo_bg_1440x300.png) center top no-repeat; background-size: 100% auto; } }

.gameMmo_news_box { position: relative; min-height: 150px; line-height: 1.5; background: #fff; border: solid 1px rgba(0, 0, 0, 0.2); }
.gameMmo_news ul { margin: 0; padding: 1em 55px 1em 1em; }
.gameMmo_news li { margin-bottom: 0.25em; }
.gameMmo_news li .fa-solid { line-height: inherit; }
.gameMmo_news_deco { position: absolute; bottom: -1px; right: 0; width: 95px; margin-right: -38px; }
@media (min-width: 992px) { .gameMmo_news { margin-top: -2.125em; }
  .gameMmo_news_box { display: -webkit-flex; -webkit-flex-direction: column; -webkit-justify-content: center; display: flex; flex-direction: column; justify-content: center; min-height: 0; margin-right: 45px; line-height: 1.5; }
  .gameMmo_news ul { height: calc((100vw - 3rem ) / 2 * ( 135 / 375)); padding-right: 40px; overflow-y: auto; }
  .gameMmo_news_deco { width: 88px; margin-right: -44px; } }
@media (min-width: 1200px) { .gameMmo_news_box { margin-right: 32px; }
  .gameMmo_news ul { height: 118px; } }
@media (min-width: 1192px) { .gameMmo_news ul { height: 118px; padding-top: 0.75em; padding-bottom: 0.5em; } }

.gameMmo .gameBannerSlider { --swiper-pagination-bullet-inactive-color: #000; margin-bottom: -3em; }

.rankBox { position: relative; margin: 1.5em 0; padding: 1em 0.75em; border: solid 1px #ffdf00; background: rgba(0, 136, 255, 0.2); }
.rankBox::before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; margin: -6px 0; background-repeat: no-repeat; background-image: url(../images/box_deco_top_left.png), url(../images/box_deco_top_right.png), url(../images/box_deco_bottom_left.png), url(../images/box_deco_bottom_right.png); background-position: 0 0, 100% 0, 0 100%, 100% 100%; background-size: auto 12px, auto 5px, auto 5px, auto 12px; }
.rankBox_avater { width: 57px; margin-left: -5px; }
.rankBox_name { margin-bottom: 0; font-weight: bold; font-size: 20px; }
.rankBox_divider { margin: 0.75em 4px 0.25em; border-top: solid 1px rgba(255, 223, 0, 0.3); }
.rankBox_divider::before, .rankBox_divider::after { content: ""; float: left; width: 4px; height: 4px; border-radius: 50%; margin: -3px -6px; background: rgba(255, 223, 0, 0.4); }
.rankBox_divider::after { float: right; }
@media (min-width: 768px) { .rankBox { margin: 2em 0; }
  .rankBox_img { width: 30%; text-align: center; } }

.shrimpSellShareBar .btn-outline { color: #fff; border-color: rgba(255, 255, 255, 0.3); }
.shrimpSellShareBar .btn-outline:hover { background: rgba(0, 230, 255, 0.3); }
.shrimpSellShareBar .btn-outline.active { color: #00e6ff; border-color: rgba(0, 230, 255, 0.7); }

.shrimpSellCard { margin-bottom: 1.5rem; }
.shrimpSellCard .card-header { position: sticky; z-index: 2; top: 50px; padding-left: 2em; background: #0b2743; }
.shrimpSellCard .card-header-shrimpMy { top: 0; }
@media (min-width: 1200px) { .shrimpSellCard .card-header { top: 110px; }
  .shrimpSellCard .card-header-shrimpMy { top: 60px; } }
.shrimpSellCard .shrimpSellTag { position: absolute; top: 0; bottom: 0; left: 0; width: 1em; height: 1em; line-height: 1; margin: 0.375em -0.375em; padding: 0.4em 0.875em 0.3em 0.4em; font-size: 1rem; font-weight: bold; color: #000; background: #ffdf00; clip-path: polygon(0 0, 80% 0, 100% 50%, 80% 100%, 0 100%); box-sizing: content-box; }
.shrimpSellCard-closed .card-body { position: relative; }
.shrimpSellCard-closed .card-body::before { content: ""; position: absolute; z-index: 1; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.7); }
.shrimpSellCard-closed .card-body::after { content: "已結單"; position: absolute; z-index: 1; top: 48%; left: 50%; padding: 0.25em 1em; color: #e2004b; font-size: 2rem; font-weight: bold; line-height: 1; white-space: nowrap; border: solid 3px; border-radius: 5px; transform: rotate(-15deg) translate(-50%, -50%); transform-origin: 0 0; text-shadow: 2px 3px 5px #000; }

.shrimpSell_secNav { border: solid 1px rgba(0, 230, 255, 0.5); border-top: 0; border-radius: 0 0 5px 5px; }

.shrimpCardBanner { margin-bottom: -40px; }
.shrimpCardBanner .imgfit:after { content: ""; position: absolute; z-index: 0; bottom: 0; left: 0; right: 0; height: 70px; background: linear-gradient(to top, #0e1015 1%, rgba(14, 16, 21, 0)); }
.shrimpCardBanner_btns { position: absolute; z-index: 2; top: 0; left: 0; margin: 0.25em; }
.shrimpCardBanner_btns .btn { background: rgba(0, 51, 95, 0.6); }

.chat_bubble, .emoji, .chat_input { font-family: Helvetica, Helvetica Neue, Arial, 微軟正黑體, Microsoft JhengHei, Microsoft YaHei, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC, LiHei Pro, sans-serif, Noto Color Emoji, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol; font-variant-emoji: emoji; }

.chatDetail .footerWrap { display: none; }

.wrap-chat, .chat { display: flex; flex-direction: column; padding: 0; }

.wrap-chat { overflow: hidden; }
@media (min-width: 576px) { .wrap-chat { padding: 1.5rem; } }

.chat, .chat_cont { flex: 1 1 0%; max-height: 100%; }

.chat_cont { position: relative; height: 100%; overflow: hidden; }
@media (max-width: 767.98px) { .chat_cont { border-width: 5px 0 0; } }

@media (max-width: 767.98px) { .wrap-chat .gameMenu_cont { font-size: 0.875em; }
  .wrap-chat .cont-border { border-top-width: 1px; } }
.chat_time { display: block; font-size: 0.75em; text-align: center; opacity: .8; }
.chat_system { display: flex; align-items: center; justify-content: center; margin-bottom: 1.5em; font-size: 0.875em; text-align: center; opacity: .8; }
.chat_system::before, .chat_system::after { content: ""; flex-grow: 1; width: 4em; max-width: 10%; border-top: 1px dashed; opacity: .4; }
.chat_system_text { margin: 0 0.5em; }
.chat_msg { display: flex; margin-bottom: 1.5em; }
.chat_msg_avater { width: 2em; margin-top: 0.125em; flex-shrink: 0; }
.chat_msg_text { max-width: 80%; padding: 0 0.5em; }
.chat_msg .chat_time { align-self: flex-end; margin-bottom: 0.5em; flex-shrink: 0; }
.chat_bubble { position: relative; z-index: 0; float: left; max-width: 100%; margin-top: 0.25em; background: #404040; border-radius: 1em; }
.chat_bubble:before { content: ""; position: absolute; z-index: -1; top: 0; right: 100%; font-size: 0.75em; border-style: solid; border-width: 1em 1.75em 1em 0; border-color: transparent #404040; transform: rotate(40deg) translate(25%, -15%); transform-origin: 100% 100%; }
.chat_bubble_text { padding: 0.5em 0.875em; word-wrap: break-word; word-break: break-word; white-space: pre-line; }
@media (hover: none) { .chat_bubble { cursor: pointer; } }
.chat_bubble_reply { display: -webkit-flex; display: flex; padding: 0.5em 0.875em; font-size: 0.875em; border-bottom: solid 1px rgba(255, 255, 255, 0.1); }
.chat_bubble_reply_text { color: gray; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; min-height: 2em; }
@media (min-width: 576px) { .chat_system, .chat_msg { margin-bottom: 2em; } }

.chat_msg-right { justify-content: flex-end; }
.chat_msg-right .chat_bubble { float: right; color: #000; background: #00e6ff; }
.chat_msg-right .chat_bubble:before { left: 100%; right: auto; border-width: 1em 0 1em 1.75em; border-color: transparent #00e6ff; transform: rotate(-40deg) translate(-25%, -15%); transform-origin: 0 100%; }
.chat_msg-right .chat_bubble_reply { border-color: rgba(0, 0, 0, 0.15); }
.chat_msg-right .chat_bubble_reply_text { color: #005c66; }

.chat_toBtm { -webkit-flex-shrink: 0; flex-shrink: 0; width: 2em; height: 2em; line-height: 2em; text-align: center; border-radius: 50%; background: rgba(255, 255, 255, 0.3); cursor: pointer; }
.chat_toBtm:focus { color: #fff; background: #00e6ff; }

.chat_newNotice { float: left; position: sticky; left: 50%; transform: translateX(-50%); cursor: pointer; }
.chat_newNotice .badge { transition: 0.3s ease; transition-property: all; }
.chat_newNotice .badge.opacity-0 { margin-bottom: -2em; pointer-events: none; }
.chat_newNotice_badge { display: block; }

.chat_type { border-width: 1px 0 0; }

.chat_input { padding-right: 1.875em; }

.iphone .hasKeyboard { transform: translateY(44px); }

.chat_toggleEmoji { position: absolute; top: 0; right: 0; bottom: 0; margin: auto; }

.fg-emoji-container { bottom: 3.75rem; }

.fg-emoji-picker-search input { color: #333; }

@media (min-width: 992px) { .fg-emoji-container { bottom: 6.25rem; } }
.emojionearea { -webkit-align-self: stretch; align-self: stretch; }
.emojionearea .emojionearea-editor { min-height: 100%; font-size: 1rem; }
.emojionearea .emojionearea-button { top: 0; bottom: 0; width: 2.5em; height: 3em; }
.emojionearea .emojionearea-button > div { top: 0; bottom: 0; right: 0; margin: auto; }

.chat_topBar { display: flex; align-items: center; padding-right: 0.5em; }

.chat_topBar_talker { display: flex; align-items: center; align-self: stretch; flex: 1 1 0; padding: 0.75em 1em; overflow: hidden; white-space: nowrap; cursor: pointer; }
.chat_topBar_talker_avater { flex-shrink: 0; width: 2em; margin-right: 0.5em; }
.chat_topBar_talker_id { margin-left: 0.5em; font-size: 0.875em; opacity: .6; }
@media (max-width: 767.98px) { .chat_topBar_talker { padding: 0.25em 1em; }
  .chat_topBar_talker_id { display: none; } }

.chat_topBar_switchTalker { width: 300px; }

.toggleChartUserList { margin-left: -1px; padding: 0.375rem; border-top-left-radius: 0; border-bottom-left-radius: 0; outline: 0; box-shadow: none !important; }

.chat_userListWrap { height: 100%; max-width: 0; overflow-x: hidden; overflow-y: auto; transition: max-width .3s; }
.chat_userListWrap.open { max-width: 300px; border-right: 1px solid #00e6ff; }

.chat_userList { overflow: hidden; }
.chat_userList_item { position: relative; z-index: 0; }
.chat_userList_item > a { cursor: pointer; }
.chat_userList_remove { display: none; }
.chat_userList .avater { width: 2em; }
.chat_userList .badge-hasUpdate { position: absolute; top: 0; left: 0; margin: 0.125em 0.25em; font-size: 1.5em; }
.chat_userList .active { color: #fff; background: linear-gradient(to right, #0f111a, #0d0e0f); }
@media (min-width: 576px) { .chat_userList { width: 260px; }
  .chat_userList_item { border-bottom: 1px solid rgba(255, 255, 255, 0.35); }
  .chat_userList_remove { display: block; margin-right: 0.25em; z-index: -1; opacity: 0; }
  .chat_userList .avater { width: 3em; }
  .chat_userList_item:hover .chat_userList_remove { z-index: 1; opacity: 1; } }

.userCard_avater { display: block; width: 7em; margin: 0 auto 1em; }

.userCard_footer { justify-content: center; text-align: center; color: #fff; border-top: 0; }
.userCard_footer a:hover { color: inherit; opacity: .8; }

.quickMsgBtns { display: inline-block; }
.quickMsgBtns ~ .quickMsgBtns_edit { display: inline-block; }
.quickMsgBtns ~ .quickMsgBtns_edit::before { content: attr(data-text); }
.quickMsgBtns.d-none ~ .quickMsgBtns_edit { float: right; }
.quickMsgBtns.d-none ~ .quickMsgBtns_edit::before { content: attr(data-text-2); }

.quickMsgInput { min-height: 3.5em; }

.chat_actionMenu { position: fixed; top: 80px; font-size: 0.875em; color: #333; }
.chat_actionMenu .list-group-item { background: #fff; }

.quoteMsg { display: block; display: -webkit-flex; display: flex; }

.emoji { display: none; position: absolute; bottom: 66px; width: 16.5em; max-width: calc(100vw - 1rem); height: 17em; max-height: calc(100vh - 250px); margin-bottom: 0.25em; font-size: 1.35em; border-radius: 0.25rem; color: #333; background: #fff; overflow: hidden; }

.emojiTab { display: -webkit-flex; display: flex; padding: 0 0.25em; height: 2.5rem; line-height: 2.5rem; background: #eee; }
.emojiTab_item { display: inline-block; text-align: center; -webkit-flex: 1 1 auto; flex: 1 1 auto; }

.emojiList { height: calc(100% - 2.5rem); padding: 0.25em; overflow-y: scroll; }
.emojiList_groupTitle { margin: 0; padding: 0.5em 0.25rem 0.25em; font-size: 1rem; opacity: .8; }
.emojiList a, .emojiList_item { display: inline-block; vertical-align: middle; min-width: 1.6em; width: 10%; padding: 0.125em 0; text-align: center; cursor: pointer; }

.countShrimp_reverseColumn { padding: 0.5em; font-size: 0.875em; text-align: center; background: rgba(255, 255, 255, 0.1); cursor: pointer; }

.countShrimpList { background-image: linear-gradient(to right, transparent, rgba(0, 136, 255, 0.15), transparent); background-size: 200% 100%; background-position: 0 0; transition: .2s ease; }
@media (min-width: 768px) { .countShrimpList { border: solid rgba(255, 255, 255, 0.1); border-width: 0 1px 1px; } }
.countShrimpList_group { background-image: linear-gradient(to bottom, transparent, rgba(0, 90, 255, 0.1), transparent); background-size: 100% 200%; background-position: 0 100%; transition: .2s ease; }
.countShrimpList_group.flex-column-reverse { background-position: 0 0; }
.countShrimpList_col { margin-bottom: -1px; padding: 0 1rem; }
.countShrimpList .form-control { border-color: rgba(255, 255, 255, 0.3); border-radius: 0; }
.countShrimpList .active { position: relative; z-index: 1; }
.countShrimpList .active .form-control { color: #33ebff; font-weight: bold; border-color: #00e6ff; box-shadow: inset 0 0 0 1px #00e6ff; }
.countShrimpList .active[data-color="danger"] { z-index: 2; }
.countShrimpList .active[data-color="danger"] .form-control { color: #ff1663; border-color: #e2004b; box-shadow: inset 0 0 0 1px #e2004b; }
.flex-column > .countShrimpList_col:nth-child(10n+6), .flex-column > .countShrimpList_col:nth-child(10n+7), .flex-column > .countShrimpList_col:nth-child(10n+8), .flex-column > .countShrimpList_col:nth-child(10n+9), .flex-column > .countShrimpList_col:nth-child(10n) { background: rgba(0, 136, 255, 0.2); }
.flex-column > .countShrimpList_col:nth-child(10n+6), .flex-column > .countShrimpList_col:nth-child(10n+1) { padding-top: 0.5rem; }
.flex-column > .countShrimpList_col:nth-child(10n), .flex-column > .countShrimpList_col:nth-child(10n+5), .flex-column > .countShrimpList_col:last-child { padding-bottom: 0.5rem; }
.flex-column > .countShrimpList_col:nth-child(5n+1) .form-control { border-radius: 0.25rem 0.25rem 0 0; }
.flex-column > .countShrimpList_col:nth-child(5n) .form-control, .flex-column > .countShrimpList_col:last-child .form-control { border-radius: 0 0 0.25rem 0.25rem; }
.flex-column-reverse > .countShrimpList_col:nth-last-child(10n+6), .flex-column-reverse > .countShrimpList_col:nth-last-child(10n+7), .flex-column-reverse > .countShrimpList_col:nth-last-child(10n+8), .flex-column-reverse > .countShrimpList_col:nth-last-child(10n+9), .flex-column-reverse > .countShrimpList_col:nth-last-child(10n) { background: rgba(0, 136, 255, 0.2); }
.flex-column-reverse > .countShrimpList_col:nth-last-child(10n+6), .flex-column-reverse > .countShrimpList_col:nth-last-child(10n+1) { padding-top: 0.5rem; }
.flex-column-reverse > .countShrimpList_col:nth-last-child(10n), .flex-column-reverse > .countShrimpList_col:nth-last-child(10n+5), .flex-column-reverse > .countShrimpList_col:first-child { padding-bottom: 0.5rem; }
.flex-column-reverse > .countShrimpList_col:nth-last-child(5n+1) .form-control { border-radius: 0.25rem 0.25rem 0 0; }
.flex-column-reverse > .countShrimpList_col:nth-last-child(5n) .form-control, .flex-column-reverse > .countShrimpList_col:first-child .form-control { border-radius: 0 0 0.25rem 0.25rem; }
.countShrimpList hr { grid-column-start: 2; }
.countShrimpList:not(.flex-row-reverse) .countShrimpList_left .countShrimpList_col { padding-left: 0.75rem; }
.countShrimpList:not(.flex-row-reverse) .countShrimpList_left .countShrimpList_col .counter { margin-left: 0.5em; }
.countShrimpList:not(.flex-row-reverse) .countShrimpList_right .countShrimpList_col { padding-right: 0.75rem; }
.countShrimpList:not(.flex-row-reverse) .countShrimpList_right .countShrimpList_col .counter { -webkit-order: -1; order: -1; margin-right: 0.5em; }
.countShrimpList.flex-row-reverse { background-position: 100% 0; }
.countShrimpList.flex-row-reverse .countShrimpList_right .countShrimpList_col { padding-left: 0.75rem; }
.countShrimpList.flex-row-reverse .countShrimpList_right .countShrimpList_col .counter { margin-left: 0.5em; }
.countShrimpList.flex-row-reverse .countShrimpList_left .countShrimpList_col { padding-right: 0.75rem; }
.countShrimpList.flex-row-reverse .countShrimpList_left .countShrimpList_col .counter { -webkit-order: -1; order: -1; margin-right: 0.5em; }

.counter { position: relative; font-size: 1.25em; }
.counter .form-control { padding: 0.25em 1.5em; height: 2.35em; font-size: inherit; text-align: center; }
.counter_btn { position: absolute; top: 0; bottom: 0; display: -webkit-flex; -webkit-align-items: center; display: flex; align-items: center; padding: 0 0.5em; font-size: 0.65em; color: rgba(255, 255, 255, 0.5); background-clip: content-box; cursor: pointer; }
.counter_btn-minus { left: -0.5em; }
.counter_btn-plus { right: -0.5em; }
.counter_btn .fa-solid { padding: 0.75em; }
@media (max-width: 767.98px) { .counter .form-control { pointer-events: none; }
  .counter_btn-minus { width: calc(33%); padding-right: 0; border-radius: 0 0.5em 0.5em 0; }
  .counter_btn-plus { -webkit-justify-content: end; justify-content: end; width: calc(66% + 0.5em); padding-left: 0; border-radius: 0.5em 0 0 0.5em; background-color: rgba(51, 109, 204, 0.15); }
  .counter_btn-plus .fa-solid { margin-left: auto; } }
@media (min-width: 768px) { .counter_btn { -webkit-justify-content: center; justify-content: center; width: 6em; background-color: rgba(51, 109, 204, 0.15); } }
.counter_btn:active, .counter_btn:target { color: #00e6ff; background-color: rgba(0, 136, 255, 0.3); opacity: 1; }
@media (hover: hover) { .counter_btn:hover { color: #00e6ff; background-color: rgba(0, 136, 255, 0.3); opacity: 1; } }

.quiz .table th, .quiz .table td { padding-top: 0.5em; padding-bottom: 0.5em; }
@media (min-width: 576px) { .quiz_topBanner { padding-top: 300px; background: center 0 no-repeat; background-image: url(../images/banner_quiz_desk.png), linear-gradient(#270100, transparent); background-size: auto 100%, 100% 100%; } }

.quizList_question { position: relative; overflow: hidden; }
.quizList_question::after { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 2em; transform: rotate(-40deg) scaleY(180%); background-image: radial-gradient(closest-side, #a8a8a8 0%, rgba(0, 0, 0, 0) 100%); background-repeat: no-repeat; animation: shinning 4s linear infinite; animation-delay: inherit; mix-blend-mode: color-dodge; pointer-events: none; margin-left: -20%; opacity: 0; }
.quizList_question_item { display: block; background: rgba(0, 136, 255, 0.2); }
.quizList_question_item .fa-solid { margin-right: 0.4em; --fa-beat-scale: 1.2; }
.quizList_question_item .fa-solid::before { animation: changeColor 1s cubic-bezier(0.4, 0, 0.6, 1) infinite; transition-delay: 0s; transition-duration: 0s; }
.quizList_question_item:hover { color: #000; background: #ffdf00; }
.quizList_question_item:hover .fa-solid::before { animation-name: changeColor2; }

@keyframes shinning { from { margin-left: -30%; }
  20%,to { margin-left: 160%; }
  from,1%,19%,to { opacity: 0; }
  18%,22% { opacity: .6; } }
@keyframes changeColor { 0%, 100% { color: currentColor; }
  50% { color: #ffdf00; } }
@keyframes changeColor2 { 0%, 100% { color: currentColor; }
  50% { color: #e2004b; } }
.quizMultiple { background: #00335f; border: solid rgba(0, 230, 255, 0.5); border-width: 1px 0; }
.quizMultiple_slider { padding: 0 40px 0.5rem; }
.quizMultiple_sliderThumb { padding: 0.5em 40px; font-size: 1.125em; text-align: center; white-space: nowrap; }
.quizMultiple_sliderThumb .fa-solid, .quizMultiple_sliderThumb .fas { margin: 0 0.25em; font-size: 0.778em; opacity: .5; }
.quizMultiple_sliderThumb .swiper-slide { width: auto; opacity: .5; }
.quizMultiple_sliderThumb .swiper-slide.swiper-slide-thumb-active { font-weight: bold; opacity: 1; }
.quizMultiple_sliderThumb .swiper-slide + .swiper-slide { padding-left: 1.75em; }
.quizMultiple_sliderThumb .swiper-slide + .swiper-slide::before { content: '\f178'; margin: 0 0.25em 0 -2.5em; vertical-align: 0.125em; font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome 5 Pro", "Font Awesome 5 Brands", Helvetica, Helvetica Neue, Arial, 微軟正黑體, Microsoft JhengHei, Microsoft YaHei, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC, LiHei Pro, sans-serif; font-weight: bold; font-size: 0.5em; opacity: .5; }
.quizMultiple_sliderThumb .swiper-slide::after { content: '\f304'; margin-left: 0.125em; vertical-align: 0.125em; font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome 5 Pro", "Font Awesome 5 Brands", Helvetica, Helvetica Neue, Arial, 微軟正黑體, Microsoft JhengHei, Microsoft YaHei, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC, LiHei Pro, sans-serif; font-weight: bold; font-size: 0.75em; }
.quizMultiple_sliderThumb .swiper-slide.checked { color: #27ff7e; }
.quizMultiple_sliderThumb .swiper-slide.checked::after { content: '\f00c'; }
.quizMultiple_slider_navigation { position: absolute; z-index: 2; bottom: 0.75rem; padding: 1em 0.5em; font-size: 12px; color: #000; background: #00e6ff; cursor: pointer; transform: scale(0.7); }
.quizMultiple_slider_navigation .fa-solid { display: block; margin-bottom: 0.125em; font-size: 2em; }
.quizMultiple_slider_navigation.prev { left: 0; border-radius: 0 2em 2em 0; transform-origin: 0 100%; }
.quizMultiple_slider_navigation.next { right: 0; border-radius: 2em 0 0 2em; transform-origin: 100% 100%; }
.quizMultiple_slider_navigation.swiper-button-disabled { color: #fff; background: #001b33; }
@media (min-width: 768px) { .quizMultiple { border-width: 1px; border-radius: 0.5rem; } }

.quizOptionList { margin: 0 2px; display: -webkit-flex; -webkit-flex-wrap: wrap; display: flex; flex-wrap: wrap; }
@supports not (display: grid) { .quizOptionList hr { display: none; } }
@supports (display: grid) { .quizOptionList { display: grid; grid-template-columns: repeat(2, 1fr); }
  .quizOptionList hr { position: relative; grid-column: 1/3; grid-row: 5; margin: -1px 0 0; } }
.quizOptionList_item { position: relative; display: -webkit-flex; display: flex; width: 50%; margin: 0; padding: 0.5em; border-bottom: solid 1px rgba(255, 255, 255, 0.3); }
.quizOptionList_item::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; border-left: solid 1px #4d4d4d; margin: 0.5em -1px; }
@supports (display: grid) { .quizOptionList_item { width: 100%; } }
.quizOptionList_item_bg { position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; margin: -1px; background: rgba(0, 136, 255, 0.2); opacity: 0; transition: 0.3s ease; transition-property: color, border, outline, background, opacity, filter, box-shadow, transform; }
.quizOptionList_ckeckbox { -webkit-flex-shrink: 0; flex-shrink: 0; margin-top: 0.2em; margin-right: 0.25em; }
.quizOptionList_ckeckbox:checked ~ div .quizOptionList_btnGroup { display: flex; }
.quizOptionList_ckeckbox:checked ~ div .quizOptionList_input { display: block; }
.quizOptionList_ckeckbox:checked ~ .quizOptionList_item_bg { opacity: 1; }
.quizOptionList .active .quizOptionList_item_bg { opacity: 1; }
.quizOptionList_input { display: none; }
.quizOptionList_triggerRecord { float: right; margin: -2em -0.75em -0.75em; padding: 0.75em; line-height: 1.25; }
.quizOptionList_dropdown { z-index: 1020; width: 330px; }
@media (min-width: 768px) { .quizOptionList_item::after { margin: 0.5em 0; }
  .quizOptionList_item::before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; border-left: solid 1px #4d4d4d; margin: 0.5em -1px; } }

.quizWinText { position: relative; text-align: center; margin-bottom: 10%; font-size: 1.25em; }
.quizWinText_bg { position: relative; z-index: -1; margin-bottom: -20%; }
.quizWinText_text { filter: drop-shadow(0 0 1em #000) drop-shadow(0 0 1em #000) drop-shadow(0 0 1em #000); }

.quizMyBetList { display: -webkit-flex; -webkit-flex-direction: column; display: flex; flex-direction: column; border: solid currentColor; border-width: 0 0 1px; }
.quizMyBetList_item { border-radius: 0.75em 0.75em 0 0; box-shadow: 0 -1px 0 .5px; overflow: hidden; }
.quizMyBetList_item_head { background: rgba(0, 136, 255, 0.2); }
.quizMyBetList_item.isWin { -webkit-order: -1; order: -1; background: rgba(171, 17, 46, 0.2); }
.quizMyBetList_item.isWin .quizMyBetList_item_head { background: #cb175d; }
.quizMyBetList_theadIcon { display: block; transform: translateY(-1.35em); height: 0; }
.quizMyBetList th, .quizMyBetList td { padding: 0.25rem; }
.quizMyBetList th:first-child, .quizMyBetList td:first-child { padding-left: 0; }
.quizMyBetList th:last-child, .quizMyBetList td:last-child { padding-right: 0; }
.quizMyBetList .table.border th:first-child, .quizMyBetList .table.border td:first-child { padding-left: 0.5em; }
.quizMyBetList .table.border th:last-child, .quizMyBetList .table.border td:last-child { padding-right: 0.5em; }
@media (min-width: 768px) { .quizMyBetList { border: solid rgba(255, 255, 255, 0.3); border-width: 0 1px 1px; } }

.demonstrationScore { counter-reset: seatNumber; }
.demonstrationScore_divider { position: relative; margin: 0 -1px; border-left: solid 2px; }
.demonstrationScore_item { counter-increment: seatNumber; padding: .5rem 0; padding-right: 0.5em; }
.demonstrationScore_badge { width: 2em; height: 2em; line-height: 2em; margin-left: -1em; margin-right: 0.25em; text-align: center; border-radius: 50%; font-size: 0.875rem; }
.demonstrationScore_badge::before { content: counter(seatNumber); }
.demonstrationScore_pkShrimp { display: inline-block; vertical-align: super; width: 0; margin-left: -0.125em; white-space: nowrap; font-size: 0.75em; color: #ffdf00; }
.demonstrationScore_item.flex-row-reverse { padding-right: 0; }
.demonstrationScore_item.flex-row-reverse .demonstrationScore_badge { margin-left: 0.25em; margin-right: -1em; background: #0088FF !important; }

.demonstrationResultWinTag { position: absolute; left: 100%; bottom: 0; display: -webkit-flex; -webkit-justify-content: center; -webkit-align-items: center; display: flex; justify-content: center; align-items: center; width: 78px; height: 78px; font-size: 47px; font-weight: bold; color: #e2004b; border: solid 5px; border-radius: 50%; transform: translate(-10%, 24%) rotate(15deg); }

.class, .class .bg-body { background: #F7F7F6; }
.class .header { z-index: 1; }
.class .wrap { background: none; }
.class .main { color: #333; }
.class hr { border-color: rgba(0, 0, 0, 0.1); }
.class .border-bottom, .class .border-top { border-color: #ddd !important; }
.class .contestPlayers_sort { background: #ddd; }
.class .modal-content { color: #333; background: #fff; }
.class .modal-content .close, .class .modal-content .close:hover { color: #000; }
.class .modal-content .modal-header { border-bottom-color: #eee; }
.class .modal-content .text-brand { color: #0088FF !important; }
.class .modal-content .text-warning { color: #ff9100f0 !important; }
.class .modal-content .btn-outline-brand { background: transparent; color: #0088FF; border-color: initial; }
.class .modal-content .btn-outline-brand:hover { color: #212529; background-color: #00e6ff; border-color: #00e6ff; }

.class_mainInfo { background: #FAEFC5; border-radius: 0.5rem; }
.class_mainInfo-border { border-top: solid 4px #e2004b; border-radius: 0 0 0.5rem 0.5rem; }

.swiper-teach .swiper-button-prev, .swiper-teach .swiper-rtl .swiper-button-next { left: 0; }
.swiper-teach .swiper-button-next, .swiper-teach .swiper-rtl .swiper-button-prev { right: 0; }
@media (max-width: 767.98px) { .swiper-teach { margin-left: -23px; margin-right: -23px; --swiper-navigation-size: 2em; } }

.tagBadgeTextThumb { position: absolute; z-index: 2; top: 0; left: 0; width: 60px; margin: -20px 8px; height: auto; }

.foodSlider .swiper-slide { transition: .5s ease; }
.foodSlider .swiper-slide:not(.swiper-slide-active) { opacity: .5; }
.foodSlider .swiper-horizontal > .swiper-pagination-bullets, .foodSlider .swiper-pagination-bullets.swiper-pagination-horizontal, .foodSlider .swiper-pagination-custom, .foodSlider .swiper-pagination-fraction { bottom: 0; --swiper-pagination-bullet-inactive-color: #fff; }
@media (min-width: 768px) { .foodSlider .imgfit { border-radius: 0.5em; } }

.title-food { height: 300px; background: url(../images/title_food_v2_mobile.png) center center no-repeat; background-size: cover; border: solid #fff; border-width: 7px 0 3px; }
.title-food_link { display: block; height: 100%; }
@media (min-width: 768px) { .title-food { background-image: url(../images/title_food_v2_desk.png); } }

.foodLikeBox { position: absolute; z-index: 1; bottom: 0; right: 0; padding: 0.25em; }

.foodRank_item { padding-left: 30px; }
.foodRank_rank { width: 1em; margin-left: -30px; margin-right: 2px; font-size: 60px; line-height: 0.7; letter-spacing: -0.1em; text-align: right; white-space: nowrap; }
.foodRank_text { padding-left: 32px; }
.foodRank-row .foodRank_item { width: 50%; }
.foodRank-row .foodRank_rank { position: relative; z-index: 1; margin-right: -20px; }
@media (min-width: 768px) { .foodRank-row .foodRank_item { width: 20%; } }
@media (max-width: 767.98px) { .foodRank-slider.swiper { height: 85vw; background: linear-gradient(transparent, transparent 20%, #036F9E 20%, transparent 65%, transparent 70%, #036F9E 70%, transparent); }
  .foodRank-slider .swiper-slide { height: 50% !important; } }
@media (min-width: 768px) { .foodRank-slider.swiper { background: linear-gradient(transparent, transparent 50%, #036F9E 50%, transparent); } }
.foodRank-userSlider.swiper { background: linear-gradient(transparent, transparent 40%, #810F50 40%, transparent); }
.foodRank-userSlider .foodRank_rank { position: relative; z-index: 1; margin-right: -15px; filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.3)); }
.foodRank-userSlider .foodRank_text { padding-left: 17px; }

.foodCouponBox { max-width: 345px; margin: 120px auto 1em; padding: 0.75em 1em; color: #fff; background: #e2004b; border-radius: 10em 10em 7px 7px; text-align: center; }
.foodCouponBox_img { width: 309px; margin-top: -112px; margin-bottom: -10px; }

.foodTopPhoto .imgfit { height: 55vw; -webkit-mask-image: linear-gradient(to top, transparent, #000 6rem); mask-image: linear-gradient(to top, transparent, #000 6rem); }
@media (min-width: 768px) { .foodTopPhoto .imgfit { height: 220px; } }
.foodTopPhoto_tag { position: absolute; top: 0; right: 0; margin: 0.5em; }
.foodTopPhoto_title { position: relative; margin-top: -1em; font-size: 2.25rem; font-weight: bold; text-align: center; }

.foodAlbum { display: grid; grid-template-columns: 65% 35%; }
.foodAlbum_item:first-child { grid-row-start: 1; grid-row-end: 4; }
.foodAlbum .mask { background: rgba(0, 0, 0, 0.7); border: solid 1px rgba(255, 255, 255, 0.3); }

.foodPhotoBox { display: flex; align-items: center; justify-content: center; height: calc(100vh - 285px); background: #000; border-bottom: solid 1px rgba(255, 255, 255, 0.3); }
@supports (height: calc(100dvh)) { .foodPhotoBox { height: calc(100dvh - 285px); } }
.foodPhotoBox img { max-width: 100%; max-height: 100%; width: auto; height: auto; }

.foodPhotoBox_arrow { position: relative; z-index: 2; bottom: 0; left: 0; right: 0; display: flex; height: 40px; justify-content: center; align-items: center; }

.foodPhotoComment { position: relative; height: 187px; margin-top: -40px; }
.foodPhotoComment_cont { position: absolute; bottom: 0; left: 0; right: 0; height: 100%; min-height: 0; padding-top: 40px; overflow: hidden; background: linear-gradient(rgba(0, 0, 0, 0.4), #000 3em); transition: .3s ease; }
.foodPhotoComment_btns { position: absolute; z-index: 2; top: 0; right: 0; padding-right: 23px; padding-top: 0.25em; }
.foodPhotoComment_open { position: absolute; bottom: 0; left: 0; right: 0; height: 4em; padding-top: 1.75em; text-align: center; background: linear-gradient(to top, #000 1.75em, transparent); cursor: pointer; }
.foodPhotoComment_close { display: none; position: absolute; top: 0; left: 0; right: 0; padding: 0.25em; text-align: center; cursor: pointer; }
.foodPhotoComment_edit { position: absolute; bottom: 0; right: 0; margin-right: 23px; margin-bottom: 0.75em; }
.foodPhotoComment.open { z-index: 3; }
.foodPhotoComment.open .foodPhotoComment_cont { height: auto; min-height: 70vh; max-height: calc(100vh - 150px); overflow-y: auto; border-top: solid 1px rgba(255, 255, 255, 0.3); }
@supports (height: calc(100dvh)) { .foodPhotoComment.open .foodPhotoComment_cont { max-height: calc(100dvh - 150px); } }
.foodPhotoComment.open .foodPhotoComment_open { display: none; }
.foodPhotoComment.open .foodPhotoComment_close { display: block; }

.wheel { max-width: 400px; margin: 0 auto; }
.wheel_wheel { position: relative; z-index: 1; }
.wheel_wheel::before { content: ""; position: absolute; z-index: 2; top: 0; left: 50%; width: 10%; margin-top: -3.5%; padding-bottom: 15.588%; background: url(../activity/gift_2025/wheel_top_deco.png) center bottom no-repeat; background-size: contain; filter: drop-shadow(1px 5px 3px rgba(0, 0, 0, 0.7)); transform: translateX(-50%); }
.wheel_wheel::after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border: solid #850404 10px; border-radius: 100%; filter: drop-shadow(1px 3px 3px rgba(0, 0, 0, 0.5)); }
.wheel_face { display: block; width: 100%; transition: ease 3s; }
.wheel_center { position: absolute; z-index: 2; top: 50%; left: 50%; width: 19.118%; padding-bottom: 19.118%; background: url(../activity/gift_2025/wheel_center.png) center center no-repeat; background-size: contain; transform: translate(-50%, -50%); filter: drop-shadow(1px 4px 4px rgba(0, 0, 0, 0.5)); }
.wheel_box { margin: -16.177% 10px 0; padding-bottom: 22.059%; background: #A70808; clip-path: polygon(13.235% 0, 86.765% 0, 100% 100%, 0 100%); }
.wheel_bottom { padding: 10px; background: #750909; text-align: center; border-radius: 4px; }

/*# sourceMappingURL=style.css.map */
