@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;700;900&family=Nunito+Sans:wght@400;500;700;800&display=swap");
/*
 * CSS Document
 * ==========================================================================
 * 版權所有 2023 鉅潞科技網頁設計公司，並保留所有權利。
 * 網站地址: http://www.grnet.com.tw
 * ==========================================================================
 * $Author: Grnet $
 * $Date: 2023/07 $ 
 * */
:root {
  --radius: 10px;
  --radius-page: 20px;
  --gap: 25px;
  --gap-item: 15px;
  --gap-vertical: 110px;
  --w-container: calc(1450px + var(--gap) * 2);
  --w-container-lg: calc(1750px + var(--gap) * 2);
  --w-container-sm: calc(1260px + var(--gap) * 2);
  --h-header: 98px;
  --h-topbar: 0px;
  --h-input: 60px;
  --h-btn: 50px;
  --h-pager: 36px;
  --plyr-control-spacing: 10px;
  --plyr-color-main: rgb(86 138 229);
  --fw-normal: 400;
  --fw-middle: 400;
  --fw-bold: 700;
  --fw-extrabold: 800;
  --fz-def: 16px;
  --fz-menu: 1.125rem;
  --fz-subhead: 2.875rem;
  --fz-subhead-lg: 3.125rem;
  --fz-listname: 1.5rem;
  --fz-listname-lg: 1.625rem;
  --fz-listname-sm: 1.375rem;
  --fz-brief: 1.125rem;
  --fz-input: 1.0625rem;
  --fz-btn: 0.9375rem;
  --fz-h1: 1.875rem;
  --fz-h2: 1.625rem;
  --fz-h3: 1.5rem;
  --fz-h4: 1.375rem;
  --fz-h5: 1.25rem;
  --fz-h6: 1.125rem;
}
:root .is-fixed-header .header {
  --h-header: 98px;
}
:root body.is-has-topbar {
  --h-topbar: 50px;
}
:root .g-btn-round.lg, :root .g-btn-cube.lg {
  --h-btn: 60px;
}

@media (max-width: 1499px) {
  :root {
    --gap-vertical: 80px;
    --h-input: 50px;
    --h-btn: 46px;
    --fz-menu: 1.0625rem;
  }
  :root .g-btn-round.lg, :root .g-btn-cube.lg {
    --h-btn: 50px;
  }
}
@media (max-width: 1299px) {
  :root {
    --gap-vertical: 60px;
    --h-header: 75px;
    --h-topbar: 0px;
    --fz-menu: 1rem;
    --fz-brief: 1.0625rem;
    --fz-subhead: 2rem;
    --fz-subhead-lg: 2.875rem;
    --fz-listname: 1.375rem;
    --fz-listname-lg: 1.5rem;
    --fz-listname-sm: 1.25rem;
  }
  :root .is-fixed-header .header {
    --h-header: 75px;
  }
  :root body.is-has-topbar {
    --h-topbar: 32px;
  }
}
@media (max-width: 991px) {
  :root {
    --fw-bold: 500;
  }
}
@media (max-width: 767px) {
  :root {
    --gap-vertical: 40px;
    --h-header: 60px;
    --h-input: 46px;
    --h-btn: 46px;
    --radius-page: 15px;
    --radius: 6px;
    --fz-subhead: 1.5rem;
    --fz-subhead-lg: 1.875rem;
    --fz-listname: 1.25rem;
    --fz-listname-lg: 1.4125rem;
    --fz-listname-sm: 1.1875rem;
    --fz-brief: 1rem;
    --fz-input: 1rem;
  }
  :root .is-fixed-header .header {
    --h-header: 60px;
  }
  :root .g-btn-round.lg, :root .g-btn-cube.lg {
    --h-btn: 46px;
  }
}
/**!
 * * 保留BS v3隱藏/顯示的樣式 https://getbootstrap.com/docs/3.4/customize/
 * * Bootstrap v3.4.1 (https://getbootstrap.com/)
 * * Copyright 2011-2019 Twitter, Inc.
 * * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
/**! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
img {
  vertical-align: middle;
}

.img-responsive {
  display: block;
  max-width: 100%;
  height: auto;
}

[role=button] {
  cursor: pointer;
}

.center-block {
  display: block;
  margin-right: auto;
  margin-left: auto;
}

.pull-right {
  float: right !important;
}

.pull-left {
  float: left !important;
}

.hide {
  display: none !important;
}

.show {
  display: block !important;
}

.invisible {
  visibility: hidden;
}

.text-hide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

.hidden {
  display: none !important;
}

.affix {
  position: fixed;
}

@-ms-viewport {
  width: device-width;
}
.visible-xs,
.visible-sm,
.visible-md,
.visible-lg,
.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block,
.visible-print,
.visible-print-block,
.visible-print-inline,
.visible-print-inline-block {
  display: none !important;
}

@media (max-width: 767px) {
  .visible-xs {
    display: block !important;
  }
  table.visible-xs {
    display: table !important;
  }
  tr.visible-xs {
    display: table-row !important;
  }
  th.visible-xs,
  td.visible-xs {
    display: table-cell !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-block {
    display: block !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline {
    display: inline !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm {
    display: block !important;
  }
  table.visible-sm {
    display: table !important;
  }
  tr.visible-sm {
    display: table-row !important;
  }
  th.visible-sm,
  td.visible-sm {
    display: table-cell !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-block {
    display: block !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline {
    display: inline !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 992px) and (max-width: 1299px) {
  .visible-md {
    display: block !important;
  }
  table.visible-md {
    display: table !important;
  }
  tr.visible-md {
    display: table-row !important;
  }
  th.visible-md,
  td.visible-md {
    display: table-cell !important;
  }
}
@media (min-width: 992px) and (max-width: 1299px) {
  .visible-md-block {
    display: block !important;
  }
}
@media (min-width: 992px) and (max-width: 1299px) {
  .visible-md-inline {
    display: inline !important;
  }
}
@media (min-width: 992px) and (max-width: 1299px) {
  .visible-md-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 1300px) {
  .visible-lg {
    display: block !important;
  }
  table.visible-lg {
    display: table !important;
  }
  tr.visible-lg {
    display: table-row !important;
  }
  th.visible-lg,
  td.visible-lg {
    display: table-cell !important;
  }
}
@media (min-width: 1300px) {
  .visible-lg-block {
    display: block !important;
  }
}
@media (min-width: 1300px) {
  .visible-lg-inline {
    display: inline !important;
  }
}
@media (min-width: 1300px) {
  .visible-lg-inline-block {
    display: inline-block !important;
  }
}
@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 992px) and (max-width: 1299px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1300px) {
  .hidden-lg {
    display: none !important;
  }
}
@media print {
  .visible-print {
    display: block !important;
  }
  table.visible-print {
    display: table !important;
  }
  tr.visible-print {
    display: table-row !important;
  }
  th.visible-print,
  td.visible-print {
    display: table-cell !important;
  }
}
@media print {
  .visible-print-block {
    display: block !important;
  }
}
@media print {
  .visible-print-inline {
    display: inline !important;
  }
}
@media print {
  .visible-print-inline-block {
    display: inline-block !important;
  }
}
@media print {
  .hidden-print {
    display: none !important;
  }
}
.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
  clear: both;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.disabled,
.disabled:hover {
  cursor: not-allowed;
}

/*
 * Reset
 */
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-tap-highlight-color: transparent;
}
*:before, *:after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

a,
a:visited,
a:hover,
a:focus,
a:active {
  text-decoration: none;
  outline: 0 !important;
  -webkit-tap-highlight-color: transparent;
}

button,
button:visited,
button:hover,
button:focus,
button:active {
  outline: 0 !important;
  -webkit-tap-highlight-color: transparent;
}

a[accesskey] {
  color: transparent !important;
  position: absolute !important;
  top: 0;
  left: 0;
  font-size: 0;
}

img,
a img {
  border: none;
  max-width: 100%;
  height: auto !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: normal;
}

img,
input[type=image],
video,
embed,
iframe,
marquee,
object,
table {
  aspect-ratio: attr(width)/attr(height);
}

video, embed, iframe {
  max-width: 100%;
  height: auto;
  aspect-ratio: 16/9;
}

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

p {
  line-height: inherit;
}

ol.reset,
ul.reset,
li.reset {
  list-style: none;
  margin: 0;
  padding: 0;
}

label {
  font-weight: inherit;
}

input,
button,
textarea,
select,
optgroup,
option {
  font-family: inherit;
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit;
  outline: 0;
  border-radius: 0;
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
  -webkit-tap-highlight-color: transparent;
}

input:not([type=radio]):not([type=checkbox]),
textarea,
select,
input[type=text] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

select::-ms-expand {
  display: none;
}

[type=date].js-datepicker {
  background-image: none;
}

input:not([type=button]),
input:not([type=submit]),
input:not([type=reset]) {
  font-size: 16px !important;
}

input[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
          appearance: none;
  height: 0.625em;
  width: 0.625em;
  margin-right: -8px;
  margin-left: 3px;
  opacity: 0;
  pointer-events: none;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23888' d='M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm0 448c-110.5 0-200-89.5-200-200S145.5 56 256 56s200 89.5 200 200-89.5 200-200 200zm101.8-262.2L295.6 256l62.2 62.2c4.7 4.7 4.7 12.3 0 17l-22.6 22.6c-4.7 4.7-12.3 4.7-17 0L256 295.6l-62.2 62.2c-4.7 4.7-12.3 4.7-17 0l-22.6-22.6c-4.7-4.7-4.7-12.3 0-17l62.2-62.2-62.2-62.2c-4.7-4.7-4.7-12.3 0-17l22.6-22.6c4.7-4.7 12.3-4.7 17 0l62.2 62.2 62.2-62.2c4.7-4.7 12.3-4.7 17 0l22.6 22.6c4.7 4.7 4.7 12.3 0 17z' /%3E%3C/svg%3E");
}

input[type=search]:focus::-webkit-search-cancel-button {
  opacity: 1;
  pointer-events: all;
  cursor: pointer;
}

textarea {
  resize: vertical;
}

\::-webkit-input-placeholder {
  color: #888;
  font-size: 16px;
}

\::-moz-placeholder {
  color: #888;
  font-size: 16px;
}

\:-ms-input-placeholder,
:-moz-placeholder {
  color: #888;
  font-size: 16px;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-transition: background-color 5000s ease-in-out 0s;
  transition: background-color 5000s ease-in-out 0s;
  -webkit-text-fill-color: inherit;
}

::-moz-selection {
  background-color: rgba(195, 0, 110, 0.9);
  color: #fff;
}

::selection {
  background-color: rgba(195, 0, 110, 0.9);
  color: #fff;
}

::-moz-selection {
  background-color: rgba(195, 0, 110, 0.9);
  color: #fff;
}

hr {
  display: block;
  background: none;
  height: 1px;
  width: 100%;
  margin: var(--gap) auto;
  border: none;
  border-top: 1px solid #d2d2d2;
}

@media (max-width: 639px) {
  hr {
    margin: var(--gap) auto;
  }
}
body,
html {
  margin: 0;
  padding: 0;
  font-family: "Nunito Sans", "Noto Sans TC", "Microsoft JhengHei UI", sans-serif;
  color: #333;
  background: #fff;
  font-weight: var(--fw-normal);
  font-size: var(--fz-def);
  line-height: 2;
  word-wrap: break-word;
}

body {
  max-width: 100vw;
  overflow: overlay;
  overflow-x: hidden !important;
  padding-top: calc(var(--h-header) + var(--h-topbar));
}
body::-webkit-scrollbar {
  width: 10px;
  background: rgba(0, 0, 0, 0);
}
body::-webkit-scrollbar-track {
  -webkit-box-shadow: none;
  margin: 0;
}
body::-webkit-scrollbar-thumb {
  -webkit-box-shadow: none;
  border-radius: 50px;
  background: rgba(50, 50, 50, 0.6);
  -webkit-transition: width 0.2s;
  transition: width 0.2s;
}

/*
 * Gotop
 */
.gotop {
  width: var(--h-btn);
  height: var(--h-btn);
  border-radius: 50%;
  background-color: #fff;
  -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
          box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
  position: fixed;
  z-index: 55;
  bottom: var(--gap);
  right: var(--gap);
}
.gotop::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 45%;
  height: 45%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.6' stroke='%23555' class='w-6 h-6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M4.5 10.5L12 3m0 0l7.5 7.5M12 3v18' /%3E%3C/svg%3E") no-repeat 0 0/contain;
}

.pc .gotop:hover {
  background-color: #568ae5;
}
.pc .gotop:hover::before {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}

/*
 * Topbar
 */
.h-topbar {
  background-color: #ff3e41;
  position: fixed;
  z-index: 101;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  text-align: center;
  white-space: nowrap;
  font-size: var(--fz-brief);
  padding: 0;
  margin: 0;
  color: #fff;
  height: var(--h-topbar);
  line-height: var(--h-topbar);
}
.h-topbar .item {
  display: inline-block;
  vertical-align: middle;
  max-width: calc(100% - 80px);
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  color: #fff;
}

.is-has-topbar .h-topbar {
  display: block;
}

.h-topbar-close {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  width: var(--h-topbar);
  height: var(--h-topbar);
  margin-left: 8px;
  font-size: 0;
  background: none;
}
.h-topbar-close::before, .h-topbar-close::after {
  content: "";
  width: 16px;
  height: 1px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -8px;
  background-color: #fff;
  -webkit-transition: height 0.25s;
  transition: height 0.25s;
}
.h-topbar-close::before {
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}
.h-topbar-close::after {
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.pc .h-topbar a:hover {
  color: #fff;
}
.pc .h-topbar-close:hover::before, .pc .h-topbar-close:hover::after {
  height: 2px;
}

/*
 * Header
 */
.header {
  top: var(--h-topbar);
  left: 0;
  right: 0;
  background-color: rgb(255, 255, 255);
  position: fixed;
  z-index: 500;
  -webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.05);
          box-shadow: 0 5px 5px rgba(0, 0, 0, 0.05);
}
.header .container {
  height: var(--h-header);
  -webkit-transition: height 0.35s;
  transition: height 0.35s;
  max-width: var(--w-container-lg);
}

.header-logo {
  position: absolute;
  z-index: 30;
  top: 50%;
  left: var(--gap);
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 300px;
}
.header-logo > a {
  position: relative;
  white-space: nowrap;
}

.logo-img {
  margin: 0;
  padding: 0;
  width: 60px;
  -webkit-transition: width 0.35s;
  transition: width 0.35s;
  display: inline-block;
  vertical-align: middle;
}
.logo-img > * {
  display: block;
  position: relative;
  width: 100%;
  padding-bottom: 100%;
  font-size: 0;
  background: url("../images/logo.svg") no-repeat 0 0/100% auto;
  z-index: 0;
}

.logo-text {
  z-index: 15;
  font-size: 0.8125rem;
  margin-top: 10px;
  color: #222;
  display: inline-block;
  vertical-align: middle;
  line-height: 1.2;
}
.logo-text:hover, .logo-text:active {
  color: #333;
}
.logo-text > span {
  white-space: nowrap;
  display: block;
  -webkit-transform-origin: left center;
      -ms-transform-origin: left center;
          transform-origin: left center;
}
.logo-text .zh {
  font-size: 1.375em;
  font-weight: 600;
}
.logo-text .en {
  color: #666;
  -webkit-transform: scale(0.98);
      -ms-transform: scale(0.98);
          transform: scale(0.98);
}

.is-fixed-header .header {
  -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
          box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}
.is-fixed-header .header .container {
  margin-top: 0;
  height: var(--h-header);
}

/*
 * Top Function
 */
.h-top-funcs {
  z-index: 20;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: right;
  position: absolute;
  right: var(--gap);
  top: 50%;
  gap: 0 10px;
  -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
          transform: translate(0, -50%);
}

.h-top-sign {
  position: relative;
  white-space: nowrap;
  height: var(--h-btn);
  line-height: var(--h-btn);
  border-radius: 50px;
  border: 1px solid #ff3e41;
  padding: 0 5px 0 36px;
}
.h-top-sign::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  left: 12px;
  width: 23px;
  height: 23px;
  background: url(../images/icon_user.svg) no-repeat 0 0/contain;
}
.h-top-sign > a {
  display: inline-block;
  vertical-align: top;
  white-space: nowrap;
  position: relative;
  padding: 0 8px;
  line-height: calc(var(--h-btn) - 10px);
  margin-top: 4px;
  margin-bottom: 5px;
  margin-left: 0.3em;
  color: #ff3e41;
  background-color: transparent;
  border-radius: 50px;
  -webkit-transition: background-color 0.25s;
  transition: background-color 0.25s;
}
.h-top-sign > a::before {
  content: "";
  width: 1px;
  height: 0.9em;
  margin-top: -0.52em;
  -webkit-transform: rotate(40deg);
      -ms-transform: rotate(40deg);
          transform: rotate(40deg);
  background-color: #ff3e41;
  left: -0.3em;
  top: 50%;
  position: absolute;
  display: block;
}
.h-top-sign > a:first-child {
  margin-left: 0;
}
.h-top-sign > a:first-child::before {
  display: none;
}

.pc .h-top-sign:hover {
  border-color: #ff3e41;
  background-color: #ff3e41;
}
.pc .h-top-sign:hover a {
  font-weight: var(--fw-bold);
  color: #fff;
}
.pc .h-top-sign:hover::before {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}

.h-top-contact {
  position: relative;
  height: var(--h-btn);
  line-height: var(--h-btn);
  border-radius: 50px;
  border: 1px solid rgba(51, 51, 51, 0.5);
  padding: 0 12px 0 40px;
  white-space: nowrap;
  color: #333;
  -webkit-transition: background-color 0.25s;
  transition: background-color 0.25s;
}
.h-top-contact::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  left: 12px;
  width: 23px;
  height: 23px;
  background: url(../images/icon_letter.svg) no-repeat 0 0/contain;
  -webkit-filter: brightness(0) invert(1) brightness(30%);
          filter: brightness(0) invert(1) brightness(30%);
}

.pc .h-top-contact:hover {
  background-color: #666;
  color: #fff;
  border-color: #666;
}
.pc .h-top-contact:hover::before {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}

.nav {
  position: fixed;
  z-index: 5;
}

/*
 * Language
 */
.lang-wrap.is-open .lang-switch,
.pc .lang-wrap:hover .lang-switch {
  background-color: #f2f2f2 !important;
  color: #111;
}
.lang-wrap.is-open .lang-switch::after,
.pc .lang-wrap:hover .lang-switch::after {
  border-color: #111 !important;
}
.lang-wrap.is-open .lang-switch::before,
.pc .lang-wrap:hover .lang-switch::before {
  -webkit-filter: none !important;
          filter: none !important;
}
.lang-wrap.is-open .lang-list,
.pc .lang-wrap:hover .lang-list {
  display: block !important;
  -webkit-animation: ani_lang_in 0.35s both ease !important;
          animation: ani_lang_in 0.35s both ease !important;
}

.lang-wrap {
  position: absolute;
  top: 5px;
  right: var(--gap);
}

.lang-switch {
  z-index: 5;
  display: block;
  position: relative;
  height: var(--h-btn);
  line-height: var(--h-btn);
  border-radius: 50px;
  background-color: #fff;
  border: 1px solid #999;
  color: #333;
  white-space: nowrap;
  padding: 0 35px 0 var(--h-btn);
  font-size: 0.9375rem;
  font-weight: var(--fw-middle);
  min-width: 160px;
}
.lang-switch::after {
  content: "";
  display: block;
  position: absolute;
  width: 8px;
  height: 8px;
  border-style: solid;
  border-width: 0 0 2px 2px;
  border-color: #333;
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
  top: 50%;
  margin-top: -5px;
  right: 18px;
}
.lang-switch::before {
  content: "";
  display: block;
  position: absolute;
  width: calc(var(--h-btn) * 0.46);
  height: calc(var(--h-btn) * 0.46);
  display: block;
  left: min(12%, 12px);
  top: 50%;
  margin-top: calc(var(--h-btn) * -0.23);
  background: url(../images/icon_earth.svg) no-repeat 0 0/contain;
  -webkit-filter: brightness(105%);
          filter: brightness(105%);
}

.lang-list {
  display: none;
  position: absolute;
  border-radius: 30px;
  list-style: none;
  margin: -3px;
  padding: 5px;
  width: auto;
  background-color: #353535;
  z-index: 0;
}
.footer .lang-list {
  bottom: -3px;
  left: -3px;
  right: -3px;
  padding-bottom: calc(var(--h-btn) + 10px);
}

.lang-list > li {
  display: block;
}
.lang-list > li > a {
  display: block;
  padding: 10px 5px;
  text-align: center;
  color: #ddd;
  font-weight: var(--fw-middle);
  font-size: 0.875rem;
  line-height: 1.5;
  white-space: nowrap;
  border-radius: 50px;
}
.lang-list > li.current {
  display: none;
}
.lang-list > li.current > a {
  font-size: 0.9375rem;
  color: #ff3e41;
  font-weight: 700;
}

.pc .lang-list > li:hover > a {
  color: #fff;
  font-weight: 700;
}

.header .lang-wrap {
  position: relative;
  top: auto;
  right: auto;
}
.header .lang-switch {
  min-width: var(--h-btn);
  padding: 0 30px 0 40px;
}
.header .lang-list {
  min-width: max(100%, 110px);
}

/*
 * Footer
 */
.footer {
  position: relative;
  z-index: 15;
  padding-top: 40px;
  padding-bottom: 40px;
  background-color: #fff;
  border-top: 1px solid #ddd;
  color: #777;
}
.footer > .container {
  padding-right: calc(180px + var(--gap));
}
.footer a {
  color: inherit;
}
.footer a:hover {
  color: #444;
}

.f-grnet {
  white-space: nowrap;
}

.f-links {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin-right: 0.8em;
}
.f-links a {
  display: inline-block;
  margin: 0 1em;
  position: relative;
  color: #777;
}
.f-links a:hover {
  color: #333;
}
.f-links a::after {
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 15px;
  background-color: #aaa;
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -2px;
  margin-right: calc(0px - 1em - 2px);
}
.f-links a:first-child {
  margin-left: 0;
}

.f-info {
  display: inline-block;
  vertical-align: top;
  padding: 0;
  margin: 0;
}
.f-info ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.f-info ul > li {
  display: inline-block;
  vertical-align: top;
  position: relative;
  padding-left: 2em;
}
.f-info ul > li::before {
  content: "";
  width: 1px;
  height: 1em;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
  background-color: #555;
  left: 0.8em;
  top: 0.4em;
  position: absolute;
  display: block;
}
.f-info ul > li:first-child {
  padding-left: 0;
}
.f-info ul > li:first-child::before {
  display: none;
}
.f-info .tit {
  color: #444;
  white-space: nowrap;
  font-weight: var(--fw-bold);
  display: inline-block;
}

.f-copyright {
  margin-right: 1em;
}

@media (min-width: 1300px) {
  .func-nav-switch {
    display: none;
  }
  .nav {
    display: block !important;
    position: absolute;
    top: 0;
    left: 50%;
    max-width: calc(100% - 650px);
    left: calc(var(--gap) + 300px);
    right: calc(var(--gap) + 430px);
  }
  .menu {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: right;
    width: 100%;
    white-space: nowrap;
  }
  .menu li {
    position: relative;
  }
  .menu .sub-switch {
    position: absolute;
    z-index: 6;
    cursor: pointer;
    height: 100%;
    width: 0;
    right: 0;
    top: 0;
  }
  .menu ul {
    z-index: 10;
    display: none;
    text-align: left;
    position: absolute;
    max-height: calc(100vh - var(--h-header) - 15px);
  }
  .menu li:not(.is-open) > ul {
    display: none !important;
  }
  .menu a {
    display: block;
    color: #333;
    font-size: var(--fz-menu);
    font-weight: var(--fw-middle);
    line-height: 1.5;
    z-index: 5;
    position: relative;
  }
  .menu > li {
    display: inline-block;
    vertical-align: top;
  }
  .menu > li > a {
    white-space: nowrap;
    padding: calc((var(--h-header) - var(--fz-menu) * 1.5) * 0.5) max(15px, 1vw);
    -webkit-transition: padding 0.125s, color 0.125s;
    transition: padding 0.125s, color 0.125s;
  }
  .menu > li > ul {
    border-radius: 5px;
    min-width: 200px;
    left: 50%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    background-color: #fff;
    border: 1px solid #ddd;
    padding: 8px;
    -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.35);
            box-shadow: 0 3px 10px rgba(0, 0, 0, 0.35);
  }
  .menu > li > ul > li {
    display: block;
  }
  .menu > li > ul > li > a {
    padding: 12px 10px;
    font-size: 1rem;
    -webkit-transition: background-color 0.15s;
    transition: background-color 0.15s;
    border-radius: 4px;
  }
  .menu > li.m-more > ul {
    padding: 12px;
    overflow-x: hiden;
    overflow-y: auto;
    width: calc(100vw - var(--gap) * 2);
    max-width: var(--w-container-lg);
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    position: fixed;
  }
  .menu > li.m-more > ul > li {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
            flex: 0 0 20%;
    width: 20%;
  }
  .mb .menu > li > .sub-switch {
    width: 100%;
  }
  .pc .menu > li:hover > a {
    color: #ff3e41;
  }
  .pc .menu > li:hover > ul {
    display: block;
    -webkit-animation: ani_fade_in_center_up 0.25s both;
            animation: ani_fade_in_center_up 0.25s both;
  }
  .pc .menu > li:hover.m-more > ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .pc .menu > li:hover.m-more:not(.is-open) > ul {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-animation: ani_fade_in_center_up 0.25s both;
            animation: ani_fade_in_center_up 0.25s both;
  }
  .pc .menu > li:hover:not(.is-open) > ul {
    display: block !important;
    -webkit-animation: ani_fade_in_center_up 0.25s both;
            animation: ani_fade_in_center_up 0.25s both;
  }
  .pc .menu > li > ul > li:hover > a {
    background-color: #ff3e41;
    color: #fff;
  }
  .mb .menu > li.is-open > a {
    color: #ff3e41;
  }
  .mb .menu > li.is-open > ul {
    display: block !important;
    -webkit-animation: ani_fade_in_center_up 0.25s both;
            animation: ani_fade_in_center_up 0.25s both;
  }
  .mb .menu > li.is-open.m-more > ul {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .mb .menu > li > ul > li.is-open > a {
    background-color: #ff3e41;
    color: #fff;
  }
}
@media (max-width: 1699px) {
  .logo-text .zh {
    font-size: 1.25em;
  }
}
@media (max-width: 1599px) {
  .header .lang-switch {
    font-size: 0;
    padding: 0;
    width: var(--h-btn);
  }
  .header .lang-switch::before {
    left: 50%;
    top: 50%;
    margin: auto;
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
  .header .lang-switch::after {
    display: none;
  }
  .header .lang-list {
    left: auto;
    right: 0;
  }
}
@media (min-width: 1300px) and (max-width: 1599px) {
  .nav {
    max-width: calc(100% - 560px);
    left: calc(var(--gap) + 290px);
    right: calc(var(--gap) + 400px);
  }
  .h-top-sign {
    padding-left: 28px;
  }
  .h-top-sign::before {
    left: 10px;
    width: 20px;
    height: 22px;
  }
  .h-top-sign > a {
    padding: 0 5px;
    font-size: 1rem;
  }
  .h-top-contact {
    padding: 0 10px 0 35px;
    font-size: 1rem;
  }
  .h-top-contact::before {
    left: 10px;
    width: 20px;
    height: 20px;
  }
  .menu > li > a {
    padding-left: max(0.85vw, 8px);
    padding-right: max(0.85vw, 8px);
    font-size: 1rem;
  }
  .menu > li.m-more > ul > li {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    width: 25%;
  }
}
@media (max-width: 1499px) {
  .header .container,
  .is-fixed-header .header .container {
    margin-top: 0;
    height: var(--h-header);
  }
  .header-logo {
    left: calc(var(--gap) - 5px);
    width: 250px;
  }
  .logo-img {
    width: 16%;
  }
  .logo-text {
    font-size: 0.72rem;
  }
  .logo-text .zh {
    font-size: 1.35em;
    font-weight: var(--fw-middle);
  }
  .f-links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-right: 0;
  }
  .f-links a:last-child::after {
    display: none;
  }
}
@media (min-width: 1300px) and (max-width: 1429px) {
  .menu > li > a {
    padding-left: 8px;
    padding-right: 8px;
  }
}
@media (max-width: 1299px) {
  .logo-text {
    font-size: 1.125rem;
  }
  .logo-text .zh {
    font-size: 0.875em;
    margin-top: -5px;
  }
  .logo-text .en {
    -webkit-transform: scale(0.75);
        -ms-transform: scale(0.75);
            transform: scale(0.75);
  }
  .h-topbar {
    font-size: 0.9375rem;
  }
  .h-top-sign > a {
    font-size: 0.9375rem;
  }
  .h-top-contact {
    font-size: 0.9375rem;
  }
  .h-top-funcs {
    right: 0;
  }
  .func-nav-switch {
    position: relative;
    display: inline-block;
    width: var(--h-header);
    height: var(--h-header);
    background-color: #fff;
    font-size: 0;
    -webkit-transition: height 0.25s, top 0.25s, background-color 0.25s;
    transition: height 0.25s, top 0.25s, background-color 0.25s;
  }
  .func-nav-switch > div {
    width: 24px;
    height: 2px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -12px;
    margin-top: -1px;
    background-color: #ff3e41;
    -webkit-transition: margin 0.1s, -webkit-transform 0.1s;
    transition: margin 0.1s, -webkit-transform 0.1s;
    transition: transform 0.1s, margin 0.1s;
    transition: transform 0.1s, margin 0.1s, -webkit-transform 0.1s;
  }
  .func-nav-switch > div:nth-child(1) {
    margin-top: -8px;
  }
  .func-nav-switch > div:nth-child(2) {
    margin-top: -1px;
  }
  .func-nav-switch > div:nth-child(3) {
    margin-top: 6px;
  }
  .pc .func-nav-switch:hover {
    background-color: #f8dede;
  }
  .nav {
    display: none;
    top: calc(var(--h-header) + var(--h-topbar));
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0;
    background-color: #f5f5f5;
    will-change: height;
  }
  .menu {
    padding: 0 0 var(--gap) 0 !important;
    width: 100%;
    max-height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
  }
  .menu::-webkit-scrollbar {
    width: 5px;
    background: rgba(0, 0, 0, 0);
  }
  .menu::-webkit-scrollbar-track {
    -webkit-box-shadow: none;
    margin: 0;
  }
  .menu::-webkit-scrollbar-thumb {
    -webkit-box-shadow: none;
    border-radius: 50px;
    background: rgba(50, 50, 50, 0.6);
    -webkit-transition: width 0.2s;
    transition: width 0.2s;
  }
  .menu li {
    position: relative;
    display: block;
  }
  .menu li .sub-switch {
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 40px;
    display: block;
    z-index: 4;
  }
  .mb .menu li .sub-switch {
    width: 100%;
  }
  .menu li .sub-switch::before {
    content: "";
    position: absolute;
    display: block;
    width: 17px;
    height: 17px;
    top: 20px;
    right: 15px;
    opacity: 1;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' strokeWidth='2' stroke='%23ff3e41' className='w-6 h-6'%3E%3Cpath strokeLinecap='round' strokeLinejoin='round' d='M12 4.5v15m7.5-7.5h-15' /%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: contain;
  }
  .menu li .sub-switch + a {
    z-index: 2;
  }
  .menu li.is-open > .sub-switch::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='%23fff' class='w-6 h-6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19.5 8.25l-7.5 7.5-7.5-7.5' /%3E%3C/svg%3E");
  }
  .menu a {
    display: block;
    line-height: 1.5;
  }
  .menu ul {
    z-index: 10;
    position: relative;
    display: none;
  }
  .menu .is-open > ul {
    display: block;
  }
  .menu > li {
    border-top: 1px solid #ccc;
  }
  .menu > li:first-child {
    border-top: none;
  }
  .menu > li > a {
    padding: 15px var(--gap);
    height: auto;
    color: #333;
    font-size: calc(var(--fz-menu) * 1.0625);
  }
  .menu > li > .sub-switch {
    top: 0;
    left: 0;
    width: 100%;
    border: none;
    position: absolute;
    height: 100%;
    z-index: 10;
  }
  .pc .menu > li:hover > a {
    color: #ff3e41;
  }
  .menu > li.is-open > a {
    background-color: #c03032;
    color: #fff;
  }
  .pc .menu > li.is-open:hover > a {
    color: #fff;
  }
  .menu > li > ul > li {
    border-top: 1px solid #e2aeae;
  }
  .menu > li > ul > li > a {
    padding: 12px var(--gap) 12px calc(var(--gap) * 2);
    background-color: #de797b;
    color: #fff;
  }
  .menu > li > ul > li > a:active {
    background-color: #d86566;
  }
  .is-open-nav .func-nav-switch {
    background-color: #f8dede;
  }
  .is-open-nav .func-nav-switch > div:nth-child(1) {
    margin-top: -1px;
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
  }
  .is-open-nav .func-nav-switch > div:nth-child(2) {
    -webkit-transform: scaleX(0);
        -ms-transform: scaleX(0);
            transform: scaleX(0);
  }
  .is-open-nav .func-nav-switch > div:nth-child(3) {
    margin-top: -1px;
    -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
            transform: rotate(-45deg);
  }
}
@media (max-width: 991px) {
  .lang-wrap {
    top: -15px;
  }
  .lang-switch {
    max-width: 140px;
  }
  .lang-list {
    border-radius: 25px;
  }
  .header .lang-wrap {
    left: auto;
    -webkit-transform: none;
        -ms-transform: none;
            transform: none;
    width: var(--h-btn);
    top: auto;
  }
  .footer .container {
    padding-right: var(--gap);
  }
  .f-links {
    padding-right: calc(160px + var(--gap));
  }
  .f-info ul > li {
    display: block;
    padding-left: 0;
  }
  .f-info ul > li::before {
    display: none;
  }
}
@media (min-width: 580px) and (max-width: 767px) {
  .h-top-contact {
    font-size: 0;
    width: var(--h-btn);
    padding: 0;
  }
  .h-top-contact::before {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
  .h-top-sign {
    padding-left: 5px;
  }
  .h-top-sign::before {
    display: none;
  }
  .h-top-sign span {
    display: inline;
  }
}
@media (max-width: 639px) {
  .logo-text {
    font-size: 1rem;
  }
}
@media (max-width: 579px) {
  .header-logo {
    width: 210px;
  }
  .logo-text {
    font-size: 0.9375rem;
    width: 160px;
  }
  .nav {
    padding-top: calc(var(--h-btn) + 20px);
  }
  .menu > li:first-child {
    border-top: 1px solid #ccc;
  }
  .h-top-contact,
  .h-top-sign {
    display: none;
  }
  .h-top-sign {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    text-align: left;
  }
  .header .lang-wrap {
    display: none;
  }
  .is-open-nav .h-top-funcs {
    position: absolute;
    top: calc(var(--h-header) + var(--h-topbar) + 1px);
    right: 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding-left: calc(var(--gap) - 10px);
    padding-right: calc(var(--gap) - 10px);
    -webkit-transform: translateY(10px);
        -ms-transform: translateY(10px);
            transform: translateY(10px);
  }
  .is-open-nav .func-nav-switch {
    position: absolute;
    top: -10px;
    right: 0;
    -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  .is-open-nav .h-top-contact,
  .is-open-nav .h-top-sign {
    display: inline-block;
    vertical-align: top;
    background-color: #fff;
    -webkit-animation: ani_fade_in 0.25s 0.2s both;
            animation: ani_fade_in 0.25s 0.2s both;
  }
  .is-open-nav .header .lang-wrap {
    display: inline-block;
    vertical-align: top;
    -webkit-animation: ani_fade_in 0.25s 0.2s both;
            animation: ani_fade_in 0.25s 0.2s both;
  }
  .is-close-nav .h-top-contact,
  .is-close-nav .h-top-sign,
  .is-close-nav .header .lang-wrap {
    -webkit-animation: ani_fade_out 0.15s both !important;
            animation: ani_fade_out 0.15s both !important;
  }
  .h-top-sign {
    padding-left: 30px;
  }
  .footer {
    padding-top: 25px;
    padding-bottom: 0;
  }
  .footer .container {
    padding-top: calc(20px + var(--h-btn));
  }
  .lang-wrap {
    top: 0;
    right: auto;
    left: 50%;
    width: calc(100% - var(--gap) * 2);
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
  }
  .lang-switch {
    width: 100%;
    max-width: none;
    min-width: auto;
  }
  .f-links {
    padding-right: 0;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .f-info {
    margin: 10px auto;
  }
  .f-bottom {
    background-color: #eee;
    margin: 0 calc(var(--gap) * -1);
    padding: 15px var(--gap) 25px;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #888;
    width: auto;
  }
}
/*
 * PLUGIN: Swiper Default
 */
.swiper-lazy-preloader {
  width: 64px;
  height: 64px;
  margin-left: -32px;
  margin-top: -32px;
  background: url(../images/loading.gif) no-repeat center center/contain;
  z-index: 10;
  border: none;
}

.swiper-pagination {
  text-align: center;
}
.swiper-pagination .swiper-pagination-bullet {
  position: relative;
  width: 9px;
  height: 9px;
  margin: 0 10px;
  padding: 0;
  display: inline-block;
  vertical-align: middle;
  border: none;
  font-size: 0;
  line-height: 0;
  background-color: #fff;
  border-radius: 10px;
  border: 1px solid #bfbfbf;
  opacity: 1;
  -webkit-transition: background-color 0.25s, border-color 0.25s, -webkit-transform 0.25s;
  transition: background-color 0.25s, border-color 0.25s, -webkit-transform 0.25s;
  transition: background-color 0.25s, border-color 0.25s, transform 0.25s;
  transition: background-color 0.25s, border-color 0.25s, transform 0.25s, -webkit-transform 0.25s;
}
.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #000;
  border-color: #000;
}
.swiper-pagination.swiper-pagination-vertical {
  bottom: auto;
}
.swiper-pagination.swiper-pagination-vertical .swiper-pagination-bullet {
  display: block;
  margin: 10px auto;
}

.pc .swiper-pagination .swiper-pagination-bullet:hover {
  background-color: #f5f5f5;
  border-color: #888;
}
.pc .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:hover {
  background: #000;
  border-color: #000;
}

.swiper-button-prev,
.swiper-button-next {
  width: var(--h-btn);
  height: var(--h-btn);
  position: absolute;
  top: 50%;
  font-size: 0;
  border-radius: 50%;
  margin: 0;
  -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
          transform: translate(0, -50%);
  background-color: transparent;
  border: 1px solid #fff;
}
.swiper-button-prev::before,
.swiper-button-next::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #568ae5;
  z-index: -1;
  -webkit-transform: scale(0);
      -ms-transform: scale(0);
          transform: scale(0);
  -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
          transform-origin: center center;
  -webkit-transition: -webkit-transform 0.15s ease;
  transition: -webkit-transform 0.15s ease;
  transition: transform 0.15s ease;
  transition: transform 0.15s ease, -webkit-transform 0.15s ease;
}
.swiper-button-prev::after,
.swiper-button-next::after {
  content: "";
  width: 25%;
  height: 25%;
  border-style: solid;
  border-color: #fff;
  display: block;
  position: absolute;
  top: 50%;
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.swiper-button-prev:active, .swiper-button-prev:hover,
.swiper-button-next:active,
.swiper-button-next:hover {
  border: 1px solid transparent;
}
.swiper-button-prev:active::before, .swiper-button-prev:hover::before,
.swiper-button-next:active::before,
.swiper-button-next:hover::before {
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}
.swiper-button-prev:active::after, .swiper-button-prev:hover::after,
.swiper-button-next:active::after,
.swiper-button-next:hover::after {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}

.swiper-button-prev {
  left: 0;
}
.swiper-button-prev::after {
  left: 50%;
  border-width: 2px 0 0 2px;
  margin-top: -12.5%;
  margin-left: -9%;
}

.swiper-button-next {
  right: 0;
}
.swiper-button-next::after {
  right: 50%;
  border-width: 0 2px 2px 0;
  margin-top: -12.5%;
  margin-right: -9%;
}

.swiper-initialized {
  overflow: hidden;
  position: relative;
}

.slider-controller {
  white-space: nowrap;
  position: relative;
  width: calc(var(--h-btn) * 2 + 15px);
  height: var(--h-btn);
  line-height: var(--h-btn);
  margin: 20px 0 0 0;
}

.is-center-mode .swiper-wrapper {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

/*
 * PLUGIN: MagnificPopup Default Popup
 */
.mfp-bg {
  background: rgba(0, 0, 0, 0.9);
}

.mfp-zoom {
  cursor: -webkit-zoom-out;
  cursor: zoom-out;
}
.mfp-zoom .mfp-content {
  opacity: 0;
  -webkit-transform: scale(0.98) translateY(10px);
      -ms-transform: scale(0.98) translateY(10px);
          transform: scale(0.98) translateY(10px);
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s ease-in-out;
  transition: opacity 0.3s, -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, opacity 0.3s;
  transition: transform 0.3s ease-in-out, opacity 0.3s, -webkit-transform 0.3s ease-in-out;
}
.mfp-zoom.mfp-ready .mfp-content {
  opacity: 1;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}
.mfp-zoom.mfp-removing .mfp-content {
  opacity: 0;
  -webkit-transform: scale(0.96);
      -ms-transform: scale(0.96);
          transform: scale(0.96);
}

.mfp-wrap .mfp-close,
.mfp-wrap button.mfp-close {
  cursor: pointer !important;
  right: 0;
  top: 0;
  width: auto;
  height: auto;
  display: block;
  opacity: 1;
  margin: 0;
  position: absolute;
  background: none;
  border-radius: 50px;
  border: none;
  font-size: 0 !important;
  padding: 5px 10px;
  line-height: 1.4;
  white-space: nowrap;
  color: #fff;
  text-align: center;
  -webkit-transform: translate(0, -100%);
      -ms-transform: translate(0, -100%);
          transform: translate(0, -100%);
  -webkit-transition: opacity 0.2s, background-color 0.2s, left 0.125s ease, top 0.125s ease;
  transition: opacity 0.2s, background-color 0.2s, left 0.125s ease, top 0.125s ease;
}
.mfp-wrap .mfp-close::before,
.mfp-wrap button.mfp-close::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 18px;
  height: 18px;
  margin-right: 5px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23fff' class='bi bi-x-lg' viewBox='0 0 16 16'%3E%3Cpath d='M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854Z'/%3E%3C/svg%3E") no-repeat center center/contain;
}
.mfp-wrap .mfp-close::after,
.mfp-wrap button.mfp-close::after {
  content: "CLOSE";
  display: inline-block;
  vertical-align: middle;
  font-size: 1rem;
}
.mfp-wrap .mfp-close:hover,
.mfp-wrap button.mfp-close:hover {
  opacity: 1;
}

.mfp-wrap > .mfp-close,
.mfp-wrap > button.mfp-close {
  position: fixed;
  right: var(--gap);
  top: var(--gap);
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
}

.pc .mfp-wrap .mfp-close:hover,
.pc .mfp-wrap button.mfp-close:hover {
  background: #fff;
}
.pc .mfp-wrap .mfp-close:hover::before, .pc .mfp-wrap .mfp-close:hover::after,
.pc .mfp-wrap button.mfp-close:hover::before,
.pc .mfp-wrap button.mfp-close:hover::after {
  -webkit-filter: brightness(0);
          filter: brightness(0);
}

.mfp-figure {
  line-height: 0;
}
.mfp-figure img {
  max-width: 100%;
  height: none !important;
  margin: 0;
  padding: 0;
  line-height: 0;
}

.mfp-block-media.mfp-bg {
  background: #000000;
  opacity: 0.8;
}
.mfp-block-media .mfp-container {
  cursor: auto !important;
  opacity: 0;
  -webkit-transform: scale(0.96);
      -ms-transform: scale(0.96);
          transform: scale(0.96);
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s ease-in-out;
  transition: opacity 0.3s, -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, opacity 0.3s;
  transition: transform 0.3s ease-in-out, opacity 0.3s, -webkit-transform 0.3s ease-in-out;
}
.mfp-block-media.mfp-ready .mfp-container {
  opacity: 1;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}
.mfp-block-media.mfp-removing .mfp-container {
  opacity: 0;
  -webkit-transform: scale(0.96);
      -ms-transform: scale(0.96);
          transform: scale(0.96);
}
.mfp-block-media .mfp-iframe-scaler {
  overflow: visible;
}
.mfp-block-media .mfp-iframe {
  border-radius: 15px;
}
.mfp-block-media .mfp-content {
  position: relative;
  width: 100% !important;
  max-width: min(90vw, 160vh);
  margin: 0 auto;
  padding: 0;
  background: url(../images/loading.gif) no-repeat center center/15vh 15vh;
}
.mfp-block-media .mfp-content::before {
  content: "";
  display: block;
  padding-bottom: 56.25%;
}
.mfp-block-media .mfp-content > *,
.mfp-block-media .mfp-content iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  line-height: 0;
}

.mfp-bulletin .mfp-content {
  border-radius: 5px;
  -webkit-box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.2);
          box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.2);
  max-width: var(--w-container);
  width: 100%;
  padding: max(var(--gap), 3vw);
  background: #fff;
}

.limit-h {
  max-height: min(70vh, 600px);
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 10px;
}
.limit-h::-webkit-scrollbar {
  width: 5px;
}
.limit-h::-webkit-scrollbar-track {
  -webkit-box-shadow: none;
  border-radius: 5px;
  margin: 0;
  background: #ececec;
}
.limit-h::-webkit-scrollbar-thumb {
  -webkit-box-shadow: none;
  border-radius: 5px;
  background: rgba(224, 132, 136, 0.8);
}
.limit-h:hover::-webkit-scrollbar-thumb {
  background: rgb(224, 132, 136);
}

/*
 * PLUGIN: flatpickr Customized
 */
.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange, .flatpickr-day.selected.inRange, .flatpickr-day.startRange.inRange, .flatpickr-day.endRange.inRange, .flatpickr-day.selected:focus, .flatpickr-day.startRange:focus, .flatpickr-day.endRange:focus, .flatpickr-day.selected:hover, .flatpickr-day.startRange:hover, .flatpickr-day.endRange:hover, .flatpickr-day.selected.prevMonthDay, .flatpickr-day.startRange.prevMonthDay, .flatpickr-day.endRange.prevMonthDay, .flatpickr-day.selected.nextMonthDay, .flatpickr-day.startRange.nextMonthDay, .flatpickr-day.endRange.nextMonthDay, .flatpickr-monthSelect-month.selected, .flatpickr-monthSelect-month.startRange, .flatpickr-monthSelect-month.endRange {
  background: #000 !important;
  border-color: #000 !important;
}

.flatpickr-monthSelect-month.inRange, .flatpickr-monthSelect-month.inRange.today, .flatpickr-day.inRange, .flatpickr-day.inRange.today {
  background: #eee !important;
  border-color: #eee !important;
}

.flatpickr-day.inRange, .flatpickr-monthSelect-month.inRange {
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
}

.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)), .flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)), .flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {
  -webkit-box-shadow: -10px 0 0 #000 !important;
          box-shadow: -10px 0 0 #000 !important;
}

.flatpickr-time {
  line-height: 60px;
  max-height: 60px;
}

.flatpickr-time .numInputWrapper {
  height: 60px;
}

.flatpickr-calendar.hasTime .flatpickr-time {
  height: 60px;
  line-height: 60px;
  border: 2px solid #9ec7a6;
}

/*
 * Index Kanban
 */
.i-kanban-slider {
  overflow: hidden;
  position: relative;
  z-index: 10;
}
.i-kanban-slider .swiper-button-prev,
.i-kanban-slider .swiper-button-next {
  border-width: 0;
  background-color: rgba(150, 150, 150, 0.5);
}
.i-kanban-slider .swiper-button-prev {
  left: 50%;
  -webkit-transform: translate(calc(min(100vw - var(--gap) * 2, var(--w-container-lg)) * -0.5), -50%);
      -ms-transform: translate(calc(min(100vw - var(--gap) * 2, var(--w-container-lg)) * -0.5), -50%);
          transform: translate(calc(min(100vw - var(--gap) * 2, var(--w-container-lg)) * -0.5), -50%);
}
.i-kanban-slider .swiper-button-next {
  right: 50%;
  -webkit-transform: translate(calc(min(100vw - var(--gap) * 2, var(--w-container-lg)) * 0.5), -50%);
      -ms-transform: translate(calc(min(100vw - var(--gap) * 2, var(--w-container-lg)) * 0.5), -50%);
          transform: translate(calc(min(100vw - var(--gap) * 2, var(--w-container-lg)) * 0.5), -50%);
}
.i-kanban-slider .scrolldown {
  display: none !important;
  cursor: pointer;
  width: var(--h-btn);
  text-align: center;
  position: absolute;
  z-index: 10;
  left: 50%;
  bottom: var(--gap);
  color: rgb(150, 150, 150);
  font-size: 0.9375rem;
  line-height: 1;
  white-space: nowrap;
  font-weight: var(--fw-bold);
  -webkit-transform: translateX(calc(min(100vw - var(--gap) * 2, var(--w-container-lg)) * -0.5));
      -ms-transform: translateX(calc(min(100vw - var(--gap) * 2, var(--w-container-lg)) * -0.5));
          transform: translateX(calc(min(100vw - var(--gap) * 2, var(--w-container-lg)) * -0.5));
  padding-bottom: calc(10px + max(40px, 8vh));
}
.i-kanban-slider .scrolldown::before, .i-kanban-slider .scrolldown::after {
  content: "";
  height: max(40px, 8vh);
  width: 1px;
  position: absolute;
  display: block;
  left: 50%;
  bottom: 0;
  -webkit-transform-origin: center bottom;
      -ms-transform-origin: center bottom;
          transform-origin: center bottom;
}
.i-kanban-slider .scrolldown::before {
  z-index: 0;
  background-color: #ccc;
}
.i-kanban-slider .scrolldown::after {
  z-index: 1;
  background-color: rgba(150, 150, 150, 0.8);
  -webkit-animation: ani_scrolldown 2s both ease infinite;
          animation: ani_scrolldown 2s both ease infinite;
}
.i-kanban-slider .scrolldown > span {
  display: inline-block;
  -webkit-transform-origin: left bottom;
      -ms-transform-origin: left bottom;
          transform-origin: left bottom;
  -webkit-transform: rotate(90deg) translate(-100%, -120%);
      -ms-transform: rotate(90deg) translate(-100%, -120%);
          transform: rotate(90deg) translate(-100%, -120%);
}

.i-kanban-pic picture,
.i-kanban-pic img,
.i-kanban-pic source {
  width: 100%;
}

@-webkit-keyframes ani_scrolldown {
  0% {
    -webkit-transform: translateY(-100%) scaleY(0);
            transform: translateY(-100%) scaleY(0);
    opacity: 0;
  }
  20% {
    -webkit-transform: translateY(0) scaleY(1);
            transform: translateY(0) scaleY(1);
    opacity: 1;
  }
  40% {
    -webkit-transform: translateY(0%) scaleY(0);
            transform: translateY(0%) scaleY(0);
  }
  60%, 100% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
    opacity: 0;
  }
}

@keyframes ani_scrolldown {
  0% {
    -webkit-transform: translateY(-100%) scaleY(0);
            transform: translateY(-100%) scaleY(0);
    opacity: 0;
  }
  20% {
    -webkit-transform: translateY(0) scaleY(1);
            transform: translateY(0) scaleY(1);
    opacity: 1;
  }
  40% {
    -webkit-transform: translateY(0%) scaleY(0);
            transform: translateY(0%) scaleY(0);
  }
  60%, 100% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
    opacity: 0;
  }
}
/*
 * Index Dates
 */
.i-dates {
  z-index: 1;
  position: relative;
  background-color: #2b4e90;
}
.i-dates .container {
  z-index: 20;
  padding-top: var(--gap-vertical);
  padding-bottom: var(--gap-vertical);
}
.i-dates .i-subhead {
  text-align: center;
  color: #fff;
}

.i-dates-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}
.i-dates-bg .js-parallax-img {
  aspect-ratio: 1920/960;
}

.i-dates-slider {
  position: relative;
}
.i-dates-slider .swiper-pagination {
  text-align: center;
  padding: 0;
  position: relative;
}
.i-dates-slider .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #568ae5;
  border-color: #568ae5;
}

.i-dates-list {
  --gap-inner: min(40px, 1.6rem);
  margin: var(--gap) auto;
}
.i-dates-list .swiper-slide {
  padding-left: var(--gap-item);
  padding-right: var(--gap-item);
}
.i-dates-list .item {
  -webkit-box-shadow: 0 5px 20px rgba(0, 0, 0, 0.25);
          box-shadow: 0 5px 20px rgba(0, 0, 0, 0.25);
  border-radius: var(--radius);
  overflow: hidden;
  background-color: #fff;
  padding: var(--gap-inner);
  padding-bottom: calc(var(--gap-inner) * 2.5);
  position: relative;
}
.i-dates-list .item::before {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  border-radius: 50px;
  position: absolute;
  left: var(--gap-inner);
  bottom: calc(var(--gap-inner) + 10px);
  -webkit-transform: translateY(50%);
      -ms-transform: translateY(50%);
          transform: translateY(50%);
  background-color: #ff3e41;
}
.i-dates-list .item::after {
  content: "";
  display: block;
  position: absolute;
  height: 1px;
  bottom: calc(var(--gap-inner) + 10px);
  left: calc(var(--gap-inner) + 20px);
  right: var(--gap-inner);
  background-color: #ddd;
}
.i-dates-list .name {
  font-size: var(--fz-listname);
  font-weight: var(--fw-extrabold);
  line-height: 1.5;
  margin: 0;
  padding: 0 10px 0 20px;
}
.i-dates-list .date {
  display: block;
  white-space: nowrap;
  font-style: normal;
  margin: 10px 0 0 0;
  padding: 0 10px 0 20px;
  color: #ff3e41;
  font-size: var(--fz-brief);
  font-weight: var(--fw-bold);
}

/*
 * Index Functions
 */
.i-funcs {
  padding-top: 120px;
  padding-bottom: 100px;
  position: relative;
  z-index: 1;
}
.i-funcs::before {
  content: "";
  display: block;
  pointer-events: none;
  position: absolute;
  z-index: 0;
  width: max(140px, 19%);
  background: url(../images/organization_oj2.png) no-repeat 0 0/contain;
  right: 0;
  bottom: -20%;
  aspect-ratio: 365/290;
}

.i-funcs-list {
  --num-func: 6;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  z-index: 5;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  list-style: none;
  margin: 0;
  padding: 0;
}
.i-funcs-list > li {
  max-width: calc(100% - var(--num-func));
  padding: 10px max(var(--gap-item), 2.8vw) var(--gap-item);
  border-left: 1px solid #ddd;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.i-funcs-list > li:first-child {
  border-left: none;
}
.i-funcs-list > li:nth-child(odd) .img::before {
  background-color: #568ae5;
}
.i-funcs-list > li:nth-child(even) .img::before {
  background-color: #c6a582;
}
.i-funcs-list > li > a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #000;
  font-size: var(--fz-brief);
}
.i-funcs-list > li .img {
  width: calc(var(--h-btn) * 2);
  height: calc(var(--h-btn) * 2);
  margin: 0 auto 10px;
  padding: max(15px, var(--h-btn) * 0.4);
  -webkit-transition: -webkit-transform 0.2s, -webkit-filter 0.2s;
  transition: -webkit-transform 0.2s, -webkit-filter 0.2s;
  transition: transform 0.2s, filter 0.2s;
  transition: transform 0.2s, filter 0.2s, -webkit-transform 0.2s, -webkit-filter 0.2s;
  position: relative;
}
.i-funcs-list > li .img img {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
  position: relative;
  z-index: 15;
}
.i-funcs-list > li .img svg {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
  width: 93%;
  height: auto;
  aspect-ratio: 1;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center;
     object-position: center;
  margin: 0 auto;
  display: block;
}
.i-funcs-list > li .img::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  border-radius: 50%;
}
.i-funcs-list > li .img::after {
  content: "";
  display: block;
  -webkit-filter: blur(5px);
          filter: blur(5px);
  width: var(--h-btn);
  height: 5px;
  border-radius: 100%;
  position: absolute;
  z-index: -1;
  bottom: -5px;
  left: 50%;
  margin-left: calc(var(--h-btn) * -0.5);
  background-color: rgba(0, 0, 0, 0.35);
  opacity: 0;
  -webkit-transform: scale(0);
      -ms-transform: scale(0);
          transform: scale(0);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.25s;
  transition: opacity 0.35s, -webkit-transform 0.25s;
  transition: transform 0.25s, opacity 0.35s;
  transition: transform 0.25s, opacity 0.35s, -webkit-transform 0.25s;
}

.pc .i-funcs-list > li a:hover .img {
  -webkit-transform: translateY(-5px);
      -ms-transform: translateY(-5px);
          transform: translateY(-5px);
  -webkit-filter: brightness(102%);
          filter: brightness(102%);
}
.pc .i-funcs-list > li a:hover .img::after {
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
  opacity: 1;
}
.pc .i-funcs-list > li:nth-child(odd) a:hover {
  color: #9b7247;
}
.pc .i-funcs-list > li:nth-child(even) a:hover {
  color: #568ae5;
}

/*
 * Index Speaker
 */
.i-speaker {
  position: relative;
  padding-top: var(--gap-vertical);
  padding-bottom: var(--gap-vertical);
}
.i-speaker + .i-news {
  padding-top: var(--gap-vertical);
}
.i-speaker .i-subhead {
  text-align: center;
}
.i-speaker > .container {
  position: relative;
  z-index: 10;
}
.i-speaker .swiper-button-next {
  right: calc(var(--gap) * -0.5);
}
.i-speaker .swiper-button-prev {
  left: calc(var(--gap) * -0.5);
}
.i-speaker .swiper-pagination {
  bottom: -20px;
  line-height: 0;
}
.i-speaker .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  border: none;
}
.i-speaker .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #51cfed;
}
.i-speaker .swiper-pagination-bullet:hover, .i-speaker .swiper-pagination-bullet:activ e {
  background-color: #c1e7f1;
}
.i-speaker .swiper-button-next,
.i-speaker .swiper-button-prev {
  background-color: #fff;
  border: none;
}
.i-speaker .swiper-button-next::after,
.i-speaker .swiper-button-prev::after {
  -webkit-filter: brightness(0) invert(1) brightness(40%);
          filter: brightness(0) invert(1) brightness(40%);
}
.i-speaker .swiper-button-next:hover::after,
.i-speaker .swiper-button-prev:hover::after {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}

.i-speaker-slider-wrap {
  position: relative;
}

.i-speaker-bg {
  background-color: #00319f;
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.i-speaker-bg::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
  opacity: 0.6;
  background-repeat: repeat-y;
  background-image: url(../images/bg_contourline.png);
  background-size: 1920px auto;
}
.i-speaker-bg::after {
  content: "";
  display: block;
  z-index: 2;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 43%;
  background-color: #f6e8e1;
  position: absolute;
}

.i-speaker-slider {
  margin-left: calc(max(15px, 1.3vw) * -1);
  margin-right: calc(max(15px, 1.3vw) * -1);
}
.i-speaker-slider .swiper-slide {
  padding: max(15px, 1.3vw);
}
.i-speaker-slider .item {
  border-radius: var(--radius);
  background-color: #fff;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
          box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  padding: max(15px, 2vw);
}
.i-speaker-slider .item-top {
  line-height: 1.6;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.i-speaker-slider .item-top .img {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 100px;
  position: relative;
  border-radius: 50%;
  overflow: hidden;
}
.i-speaker-slider .item-top .img img {
  width: 100%;
  height: 100% !important;
  max-width: none !important;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.i-speaker-slider .item-top .img + div {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  padding-left: 15px;
}
.i-speaker-slider .item-top .from {
  font-size: 1.0625rem;
  display: block;
  color: #c6a582;
}
.i-speaker-slider .item-top .name {
  display: block;
  margin: 5px 0;
  font-weight: 700;
  color: #000;
  font-size: var(--fz-listname-sm);
}
.i-speaker-slider .item-top .date {
  display: block;
  font-style: italic;
  color: #888;
  font-size: 1rem;
}
.i-speaker-slider .item-bottom {
  font-size: 1rem;
  color: #333;
  line-height: 1.6;
  padding-top: 20px;
  margin-top: 20px;
  border-top: 1px solid #ddd;
}
.i-speaker-slider .more {
  color: #0069df;
  border: 1px solid #0069df;
  border-radius: 25px;
  line-height: 1.2;
  padding: 3px 15px;
  text-align: center;
  font-size: 1rem;
  display: block;
  max-width: 80px;
  margin: 15px 0 0;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
}
.i-speaker-slider .more:hover {
  background-color: #0069df;
  border-color: #0069df;
  color: #fff;
}

/*
 * Index News
 */
.i-news {
  z-index: 2;
  position: relative;
  overflow: hidden;
  --gap-index-news: 80px;
}
.i-news .container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  min-height: 55vh;
}
.i-news .left {
  position: relative;
  z-index: 0;
  width: max(200px, 31%);
  -webkit-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  background-color: #568ae5;
  color: #fff;
  border-radius: var(--radius);
  padding: calc(var(--gap-index-news) * 1.28) calc(var(--gap-index-news) * 2.4) var(--gap-index-news) calc(var(--gap-index-news) * 1.28);
}
.i-news .left > div {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
.i-news .right {
  position: relative;
  z-index: 1;
  width: 69%;
  padding: calc(var(--gap-index-news) - var(--gap-item)) 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
.i-news .i-subhead {
  margin-bottom: 1rem;
}

.i-news-deco {
  position: absolute;
  z-index: 0;
  right: 0;
  top: 55%;
  -webkit-transform: translate(18%, -50%);
      -ms-transform: translate(18%, -50%);
          transform: translate(18%, -50%);
  pointer-events: none;
  color: rgba(255, 255, 255, 0.05);
  font-size: 20vh;
  font-weight: 900;
}

.i-news-controller {
  width: 100%;
  margin-top: var(--gap-item);
  padding-top: var(--gap-item);
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  -ms-flex-item-align: end;
      align-self: flex-end;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  height: auto;
  -webkit-box-flex: 0 !important;
      -ms-flex: 0 !important;
          flex: 0 !important;
}
.i-news-controller .swiper-button-next,
.i-news-controller .swiper-button-prev {
  position: relative;
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
  margin: 0;
  top: auto;
  border-color: rgba(255, 255, 255, 0.5);
}
.i-news-controller .swiper-button-next::before,
.i-news-controller .swiper-button-prev::before {
  background-color: #fff;
}
.i-news-controller .swiper-button-next:hover::after, .i-news-controller .swiper-button-next:active::after,
.i-news-controller .swiper-button-prev:hover::after,
.i-news-controller .swiper-button-prev:active::after {
  border-color: #568ae5;
  -webkit-filter: none;
          filter: none;
}
.i-news-controller .swiper-button-next {
  margin-left: 10px;
}

.is-less .i-news-controller {
  display: none;
}

.i-news-slider {
  --gap-dates: max(35px, 2rem);
  overflow: hidden;
  min-width: calc(100vw - (100vw - var(--w-container)) * 0.5 - max(200px, 31%) - var(--gap-index-news) - var(--gap) * 2);
  margin-left: calc(var(--gap-index-news) * -1);
  height: 100%;
}
.i-news-slider .swiper-slide {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  padding: var(--gap-item);
}
.i-news-slider .swiper-slide > .item {
  display: block;
  position: relative;
  background-color: #fff;
  border-radius: var(--radius);
  padding: var(--gap-dates) calc(var(--gap-dates) * 1.5);
  padding-bottom: calc(var(--gap-dates) * 2.5);
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
  min-height: 100%;
}
.i-news-slider .swiper-slide > .item::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  border-radius: var(--radius);
  border: 3px solid #568ae5;
  -webkit-transition: opacity 0.25s;
  transition: opacity 0.25s;
  opacity: 0;
}
.i-news-slider .date {
  font-style: normal;
  color: #0069df;
}
.i-news-slider .name {
  font-size: var(--fz-listname-sm);
  font-weight: var(--fw-bold);
  color: #000;
  line-height: 1.6;
  margin: 10px 0;
  padding: 0;
  display: -webkit-box;
  overflow: hidden;
  /**! autoprefixer: off;*/
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
}
.i-news-slider .more {
  position: absolute;
  color: #000;
  line-height: 1.2;
  font-size: 0.875rem;
  bottom: calc(var(--gap-dates) * 1.5);
  left: calc(var(--gap-dates) * 1.5);
  width: calc(100% - var(--gap-dates) * 3);
}
.i-news-slider .more > div {
  display: inline-block;
  padding-bottom: 5px;
  border-bottom: 1px solid #000;
}
.i-news-slider .more::after {
  content: "";
  display: block;
  position: absolute;
  right: calc(var(--gap-dates) * 0.5);
  bottom: calc(var(--gap-dates) * 0.5);
  width: 22px;
  height: 8px;
  border-style: solid;
  border-width: 0 2px 2px 0;
  border-color: #000;
  -webkit-transform: skewX(45deg);
      -ms-transform: skewX(45deg);
          transform: skewX(45deg);
}

.pc .i-news-slider .item:hover::before {
  opacity: 1;
}
.pc .i-news-slider .item:hover .more {
  color: #568ae5;
}
.pc .i-news-slider .item:hover .more > div {
  border-color: #568ae5;
}
.pc .i-news-slider .item:hover .more::after {
  -webkit-animation: ani_infinte_news_aw 0.5s both infinite;
          animation: ani_infinte_news_aw 0.5s both infinite;
  -webkit-filter: invert(58%) sepia(71%) saturate(3256%) hue-rotate(197deg) brightness(95%) contrast(89%);
          filter: invert(58%) sepia(71%) saturate(3256%) hue-rotate(197deg) brightness(95%) contrast(89%);
}

/*
 * Index About
 */
.i-bird {
  position: absolute;
  z-index: 0;
  right: 0;
  top: 1vh;
  width: max(17.18vw, 200px);
  aspect-ratio: 33/36;
  background: url(../images/i_deco_bird.png) no-repeat 0 0/contain;
}

.i-about {
  padding-top: var(--gap-vertical);
  padding-bottom: var(--gap-vertical);
  margin-bottom: calc(var(--gap-vertical) * 0.5);
  position: relative;
}
.i-about::before {
  content: "";
  display: block;
  pointer-events: none;
  position: absolute;
  z-index: 0;
  width: max(180px, 15.8vw);
  background: url(../images/brush2.png) no-repeat 0 0/contain;
  left: min(-70px, -6vw);
  bottom: 20%;
  aspect-ratio: 440/340;
}
.i-about > .container {
  z-index: 10;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.i-about .img {
  width: 48%;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 48%;
          flex: 0 0 48%;
}
.i-about .text {
  padding: calc(var(--gap) * 2) calc(var(--gap) * 3);
  font-size: var(--fz-brief);
}
.i-about .name {
  font-size: var(--fz-subhead);
  color: #000;
  font-weight: var(--fw-extrabold);
  margin-bottom: 1.5rem;
}
.i-about .name span {
  text-transform: uppercase;
  display: block;
  font-weight: var(--fw-normal);
}

/*
 * Index Video
 */
.i-video {
  border-radius: var(--radius);
  overflow: hidden;
  background-color: #020842;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: var(--gap-vertical);
  margin-bottom: calc(var(--gap-vertical) * 0.5);
}
.i-video::before {
  content: "";
  display: block;
  pointer-events: none;
  position: absolute;
  z-index: 0;
  width: max(200px, 30%);
  background: url(../images/brush1.png) no-repeat 0 0/contain;
  left: 72%;
  top: -22%;
  aspect-ratio: 440/340;
}
.i-video::after {
  content: "";
  display: block;
  pointer-events: none;
  position: absolute;
  z-index: 0;
  width: max(160px, 24%);
  background: url(../images/brush2.png) no-repeat 0 0/contain;
  left: 17%;
  bottom: -22%;
  aspect-ratio: 440/340;
}
.i-video.is-video-ready .i-video-img {
  display: none !important;
}
.i-video.is-video-playing .i-video-img {
  display: none;
  -webkit-animation: ani_fade_out 0.5s both;
          animation: ani_fade_out 0.5s both;
}
.i-video .left {
  z-index: 5;
  position: relative;
  padding: calc(var(--gap) * 2) calc(var(--gap) * 3) calc(var(--gap) * 2) 0;
  font-size: var(--fz-brief);
  width: 34%;
}
.i-video .right {
  z-index: 5;
  width: 66%;
  position: relative;
}
.i-video .right iframe,
.i-video .right .plyr {
  aspect-ratio: 830/465;
  position: relative;
  display: block;
}
.i-video .i-subhead {
  text-transform: unset;
  margin-bottom: 1rem;
  font-size: calc(var(--fz-subhead-lg) * 1.2);
}

.i-video-img {
  position: absolute;
  z-index: 5;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.i-video-img img {
  position: relative;
  z-index: 0;
}
.i-video-img svg {
  width: var(--h-btn);
  height: auto;
  position: absolute;
  bottom: var(--gap);
  right: var(--gap);
  -webkit-filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.3));
          filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.3));
  -webkit-transition: -webkit-transform 0.25s;
  transition: -webkit-transform 0.25s;
  transition: transform 0.25s;
  transition: transform 0.25s, -webkit-transform 0.25s;
}
.i-video-img:hover svg {
  -webkit-transform: scale(1.2);
      -ms-transform: scale(1.2);
          transform: scale(1.2);
}

/*
 * Index Plans
 */
.i-plans {
  background: rgb(250, 244, 241);
  background: -webkit-gradient(linear, left bottom, left top, color-stop(30%, rgb(250, 244, 241)), to(rgb(255, 255, 255)));
  background: linear-gradient(0deg, rgb(250, 244, 241) 30%, rgb(255, 255, 255) 100%);
  position: relative;
  padding-bottom: calc(var(--gap-vertical) * 1.5);
  padding-top: calc(var(--gap-vertical) * 0.5);
  position: relative;
}
.i-plans::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  pointer-events: none;
  z-index: 5;
  aspect-ratio: 380/280;
  width: min(380px, 30vw);
  background: url(../images/i_deco_dragon.png) no-repeat 0 0/contain;
}
.i-plans .container {
  z-index: 1;
}
.i-plans .tabs-scroll .tabs-scroll__prev::before,
.i-plans .tabs-scroll .tabs-scroll__next::before {
  border-color: #222;
}
.i-plans .tabs-scroll .tabs-scroll__prev {
  background: rgb(255, 255, 255);
  background: -webkit-gradient(linear, left top, right top, color-stop(50%, rgb(255, 255, 255)), color-stop(98%, rgba(255, 255, 255, 0)));
  background: linear-gradient(90deg, rgb(255, 255, 255) 50%, rgba(255, 255, 255, 0) 98%);
}
.i-plans .tabs-scroll .tabs-scroll__next {
  background: rgb(255, 255, 255);
  background: -webkit-gradient(linear, right top, left top, color-stop(50%, rgb(255, 255, 255)), color-stop(98%, rgba(255, 255, 255, 0)));
  background: linear-gradient(270deg, rgb(255, 255, 255) 50%, rgba(255, 255, 255, 0) 98%);
}

.i-plans-list {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0 calc(var(--gap-item) * -1);
}
.i-plans-list .item {
  overflow: hidden;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(33.3333333333% - var(--gap-item) * 2);
          flex: 0 0 calc(33.3333333333% - var(--gap-item) * 2);
  margin: var(--gap-item);
  padding: calc(var(--gap) * 2) calc(var(--gap) * 1.5);
  background-color: #fff;
  position: relative;
  border-radius: var(--radius);
  -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
          box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
}
.i-plans-list .item::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  border-radius: var(--radius);
  border: 3px solid #ff3e41;
  -webkit-transition: opacity 0.25s;
  transition: opacity 0.25s;
  opacity: 0;
}
.i-plans-list .item.type1::before {
  border-color: #ff3e41;
}
.i-plans-list .item.type1 .g-btn-cube .eff {
  background-color: #ff3e41;
}
.i-plans-list .item.type1 .img::before {
  background-color: #ffebec;
}
.i-plans-list .item.type2::before {
  border-color: #00319f;
}
.i-plans-list .item.type2 .g-btn-cube .eff {
  background-color: #00319f;
}
.i-plans-list .item.type2 .img::before {
  background-color: #e8f2f9;
}
.i-plans-list .item.type3::before {
  border-color: #b08456;
}
.i-plans-list .item.type3 .g-btn-cube .eff {
  background-color: #b08456;
}
.i-plans-list .item.type3 .img::before {
  background-color: #fdf1e5;
}
.i-plans-list .item.type4::before {
  border-color: #a87584;
}
.i-plans-list .item.type4 .g-btn-cube .eff {
  background-color: #a87584;
}
.i-plans-list .item.type4 .img::before {
  background-color: #f8d3e1;
}
.i-plans-list .item:hover::before {
  opacity: 1;
}
.i-plans-list .g-btn-cube {
  position: relative;
  z-index: 10;
  margin: 10px auto 0;
  display: block;
  max-width: 230px;
}
.i-plans-list .name {
  font-size: var(--fz-listname-sm);
  text-align: center;
  display: block;
  margin: 0 auto 15px;
  font-weight: var(--fw-bold);
}
.i-plans-list .img {
  width: calc(var(--h-btn) * 2.8);
  height: calc(var(--h-btn) * 2.8);
  margin: var(--gap-item) auto;
  -webkit-transition: -webkit-transform 0.2s;
  transition: -webkit-transform 0.2s;
  transition: transform 0.2s;
  transition: transform 0.2s, -webkit-transform 0.2s;
  position: relative;
  padding: 2.5%;
}
.i-plans-list .img img {
  width: 100%;
  position: relative;
  z-index: 15;
}
.i-plans-list .img::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  border-radius: 50%;
  background-color: #ffebec;
}
.i-plans-list .price {
  line-height: 1;
  text-align: center;
  display: block;
  white-space: nowrap;
  margin: 0 auto var(--gap);
  font-size: 1rem;
  color: #585858;
}
.i-plans-list .price span {
  font-weight: var(--fw-bold);
  color: #000;
  display: inline-block;
  margin-right: 0.5em;
}
.i-plans-list .price strong {
  font-size: var(--fz-subhead-lg);
  font-weight: var(--fw-extrabold);
}

@media (min-width: 1920px) {
  .i-funcs-list {
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
}
@media (min-width: 1600px) {
  .i-speaker .swiper-button-next {
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    right: calc(var(--gap) * -1 - var(--h-btn));
  }
  .i-speaker .swiper-button-prev {
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    left: calc(var(--gap) * -1 - var(--h-btn));
  }
}
@media (max-width: 1599px) {
  .i-speaker-slider-wrap {
    padding-left: var(--h-btn);
    padding-right: var(--h-btn);
  }
}
@media (max-width: 1499px) {
  .i-news {
    --gap-index-news: 50px;
  }
}
@media (max-width: 1199px) {
  .i-news {
    --gap-index-news: 40px;
  }
  .i-news .i-subhead {
    margin-left: 0;
  }
  .i-news .container {
    min-height: 45vh;
  }
  .i-news-slider .name {
    -webkit-line-clamp: 3;
  }
}
@media (max-width: 991px) {
  .i-funcs {
    padding-top: var(--gap-vertical);
    padding-bottom: var(--gap-vertical);
  }
  .i-funcs::before {
    bottom: -8%;
  }
  .i-funcs-list {
    --num-func: 3;
  }
  .i-funcs-list > li {
    max-width: none;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(100% / var(--num-func));
            flex: 0 0 calc(100% / var(--num-func));
  }
  .i-bird {
    width: max(13vw, 150px);
  }
  .i-about {
    padding-top: 130px;
    padding-bottom: var(--gap);
  }
  .i-about::before {
    bottom: 50%;
  }
  .i-about > .container {
    z-index: 0;
    display: block;
  }
  .i-about .img {
    width: 100%;
    text-align: center;
  }
  .i-about .text {
    padding: var(--gap) 0;
  }
  .i-about .name {
    text-align: center;
  }
  .i-video {
    display: block;
    padding: var(--gap-vertical) var(--gap-item);
    margin: 0 calc(var(--gap) * -1) var(--gap) calc(var(--gap) * -1);
  }
  .i-video::before {
    top: -19%;
    opacity: 0.8;
  }
  .i-video::after {
    bottom: -17%;
    left: 3%;
    opacity: 0.8;
  }
  .i-video .left {
    padding: 0;
    margin: 0 auto var(--gap);
    width: 100%;
    text-align: center;
  }
  .i-video .right {
    width: 100%;
  }
  .i-plans-list {
    margin-bottom: var(--gap-vertical);
  }
  .i-plans-list .item {
    margin-bottom: var(--gap-item);
    padding: var(--gap) var(--gap-item);
  }
  .i-plans-list .item .img {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 70px;
            flex: 0 0 70px;
    width: 70px;
    height: 70px;
    padding: 0;
    margin-bottom: 10px;
  }
  .i-plans-list .item .price strong {
    font-size: var(--fz-subhead);
  }
  .i-plans-list .item .g-btn-cube {
    min-width: auto;
    width: 100%;
  }
}
@media (max-width: 839px) {
  .i-speaker + .i-news {
    padding-top: 0;
  }
  .i-news {
    --gap-index-news: var(--gap);
  }
  .i-news .left {
    left: 0;
    width: 100%;
    border-radius: 0;
    padding-bottom: 50px;
    position: absolute;
  }
  .i-news .right {
    width: 100%;
    margin-top: 120px;
  }
  .i-news-slider {
    min-width: auto;
    margin: 0 auto;
    width: 100%;
  }
  .i-news-slider .swiper-slide > .item {
    width: 100%;
    padding: 20px 20px var(--gap-dates);
  }
  .i-news-slider .swiper-slide .more {
    bottom: 20px;
    left: 20px;
    width: calc(100% - 40px);
  }
  .i-news-slider .swiper-slide .name {
    -webkit-line-clamp: 2;
  }
  .i-news-controller {
    border-top: none;
    position: absolute;
    right: var(--gap);
    top: 10px;
    padding: 0;
    width: auto;
  }
}
@media (min-width: 580px) and (max-width: 991px) {
  .i-funcs-list > li:nth-child(3n+1) {
    border-left: none;
  }
}
@media (max-width: 767px) {
  .i-plans-list .item {
    -ms-flex-preferred-size: calc(50% - var(--gap-item) * 2);
        flex-basis: calc(50% - var(--gap-item) * 2);
  }
}
@media (max-width: 579px) {
  .i-funcs-list {
    --num-func: 2;
  }
  .i-funcs-list > li:nth-child(2n+1) {
    border-left: none;
  }
  .i-plans-list {
    display: block;
    width: auto;
    margin: 0 auto var(--gap-vertical);
  }
  .i-plans-list .item {
    margin: 0 auto var(--gap);
    display: block;
    width: 100%;
  }
}
@media (max-width: 499px) {
  .i-speaker-slider-wrap {
    padding-left: 15px;
    padding-right: 15px;
  }
  .i-speaker-slider .item-top {
    display: block;
    text-align: center;
  }
  .i-speaker-slider .item-top .img {
    margin: 0 auto 15px;
  }
}
.container {
  width: 100%;
  max-width: var(--w-container);
  position: relative;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--gap);
  padding-right: var(--gap);
}
.container.sm {
  max-width: var(--w-container-sm);
}
.container.xs {
  max-width: var(--w-container-xs);
}

.p-mainwrap {
  position: relative;
  z-index: 10;
  min-height: 40vh;
  padding-bottom: calc(var(--gap-vertical) * 0.4);
  padding-top: calc(var(--gap-vertical) * 0.6);
  background: url(../images/page_bg_top.png) no-repeat right 0, url(../images/page_bg_bottom.png) no-repeat right max(250vh, 100%);
  background-size: max(100%, 1200px) auto;
  background-attachment: auto, fixed;
  background-color: #f5f5f5;
}
.p-mainwrap.no-p-top {
  padding-top: 0;
}
.p-mainwrap.no-p-bottom {
  padding-bottom: 0;
}
.p-mainwrap.is-has-article {
  padding-bottom: 0;
}
.p-mainwrap > .container {
  z-index: 10;
}

@media (max-width: 767px) {
  .p-mainwrap {
    padding-top: var(--gap);
    padding-bottom: 2px;
  }
  .p-mainwrap .p-innerwrap {
    margin-top: calc(var(--gap) * -1);
  }
}
.p-innerwrap {
  -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
  border-radius: var(--radius-page);
  background-color: #fff;
  padding: calc(var(--gap-vertical) * 0.5) calc(var(--gap-vertical) * 0.8) calc(var(--gap-vertical) * 0.8);
  font-size: var(--fz-brief);
}

@media (max-width: 767px) {
  .p-innerwrap {
    margin-left: calc(var(--gap) * -1);
    margin-right: calc(var(--gap) * -1);
    padding: var(--gap);
  }
}
.p-memberwrap {
  padding-top: max(var(--gap), var(--gap-vertical) * 0.4);
  padding-bottom: max(var(--gap), var(--gap-vertical) * 0.4);
}
.p-memberwrap.no-p-top {
  padding-top: 0;
}
.p-memberwrap.no-p-bottom {
  padding-bottom: 0;
}

.wrap-half {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 100%;
  position: relative;
}

.wrap-half-left {
  width: 540px;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 540px;
          flex: 0 0 540px;
  z-index: 25;
}

.wrap-half-right {
  width: calc(100% - 540px - var(--h-btn));
  -webkit-box-flex: 1;
      -ms-flex: 1 0 calc(100% - 540px - var(--h-btn));
          flex: 1 0 calc(100% - 540px - var(--h-btn));
  margin-left: var(--h-btn);
}

@media (max-width: 1299px) {
  .wrap-half-left {
    width: 340px;
    -webkit-box-flex: 1;
        -ms-flex: 1 0 340px;
            flex: 1 0 340px;
  }
  .wrap-half-right {
    width: calc(100% - 340px - var(--h-btn));
    -webkit-box-flex: 1;
        -ms-flex: 1 0 calc(100% - 340px - var(--h-btn));
            flex: 1 0 calc(100% - 340px - var(--h-btn));
  }
}
@media (min-width: 992px) {
  .wrap-half-left {
    position: sticky;
    top: var(--h-header);
  }
}
@media (max-width: 991px) {
  .wrap-half {
    display: block;
  }
  .wrap-half-left {
    width: 100%;
    margin: 0 auto 20px;
  }
  .wrap-half-right {
    width: 100%;
    margin-left: auto;
  }
}
/*
 * Subhead
 */
.i-subhead {
  display: block;
  margin: 0 auto var(--gap);
  padding: 0;
  text-transform: uppercase;
  font-weight: var(--fw-extrabold);
  font-size: var(--fz-subhead);
  line-height: 1.1;
}
.i-subhead h1, .i-subhead h2, .i-subhead h3, .i-subhead h4, .i-subhead h5, .i-subhead h6 {
  margin: 0;
  height: 0;
  font: inherit;
}

.p-subhead {
  position: relative;
  display: block;
  margin: 0 auto calc(var(--gap-vertical) * 0.5);
  padding: 60px 0 0 0;
  text-align: center;
  text-transform: uppercase;
  color: #000;
  font-weight: var(--fw-middle);
  font-size: var(--fz-listname-lg);
  line-height: 1.1;
}
.p-subhead h1, .p-subhead h2, .p-subhead h3, .p-subhead h4, .p-subhead h5, .p-subhead h6 {
  margin: 0;
  padding: 0;
  font: inherit;
}
.p-subhead::before {
  content: "";
  display: block;
  width: 1px;
  height: 40px;
  position: absolute;
  top: 0;
  left: 50%;
  background-color: #00319f;
}

@media (max-width: 767px) {
  .p-subhead {
    padding-top: 0;
    margin: 10px auto var(--gap-item) auto;
  }
  .p-subhead::before {
    display: none;
  }
}
/*
 * 按鈕
 */
.btn-wrap {
  text-align: center;
  margin: var(--gap) auto;
}

@media (max-width: 767px) {
  .form-fieldset + .btn-wrap {
    text-align: center !important;
  }
}
@media (max-width: 579px) {
  .form-fieldset + .btn-wrap .g-btn-cube {
    width: 100%;
  }
}
.g-btn-round {
  white-space: nowrap;
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 50px;
  color: #fff;
  background-color: transparent;
  padding: 3px 20px;
  position: relative;
  overflow: hidden;
  -webkit-transition: background-color 0.25s, color 0.25s;
  transition: background-color 0.25s, color 0.25s;
}
.g-btn-round > span {
  position: relative;
}
.g-btn-round::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50px;
  background-color: #fff;
  -webkit-transform: scale(0);
      -ms-transform: scale(0);
          transform: scale(0);
  -webkit-transition: -webkit-transform 0.25s;
  transition: -webkit-transform 0.25s;
  transition: transform 0.25s;
  transition: transform 0.25s, -webkit-transform 0.25s;
}
.g-btn-round:hover, .g-btn-round:active {
  color: #568ae5;
}
.g-btn-round:hover::before, .g-btn-round:active::before {
  -webkit-transform: scale(1.04);
      -ms-transform: scale(1.04);
          transform: scale(1.04);
}

.g-btn-cube {
  position: relative;
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  min-width: 230px;
  height: var(--h-btn);
  line-height: var(--h-btn);
  white-space: nowrap;
  border-radius: 5px;
  border: none;
  padding: 0 25px;
  background-color: #0069df;
  font-size: 0.9375rem;
  letter-spacing: 0.1em;
  font-weight: 400;
  color: #fff;
  overflow: hidden;
  -webkit-transition: background-color 0.25s;
  transition: background-color 0.25s;
}
.g-btn-cube .eff {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 0;
  background-color: #ff3e41;
  -webkit-transform-origin: left top;
      -ms-transform-origin: left top;
          transform-origin: left top;
}
.g-btn-cube.red {
  background-color: #ff3e41;
}
.g-btn-cube.red .eff {
  background-color: #ff585a;
}
.g-btn-cube.line {
  border: 1px solid #999;
  color: #333;
  background-color: #fff;
}
.g-btn-cube.line .eff {
  background-color: #888;
}
.g-btn-cube.gold {
  background-color: #c6a582;
}
.g-btn-cube.gold .eff {
  background-color: #ff3e41;
}
.g-btn-cube > span {
  position: relative;
  z-index: 5;
  display: inline-block;
  vertical-align: middle;
  -webkit-perspective: 1000px;
          perspective: 1000px;
  overflow: hidden;
  margin-bottom: 0.2rem;
}
.g-btn-cube > span > span {
  position: relative;
  display: inline-block;
  vertical-align: top;
}
.g-btn-cube svg {
  width: 1.375rem;
  height: auto;
  display: inline-block;
  vertical-align: middle;
  margin-right: 2px;
}

.pc .g-btn-cube:hover {
  color: #fff;
  border-color: #ff3e41;
}
.pc .g-btn-cube:hover.line {
  border: 1px solid #999;
}

/*
 * Page Kanban
 */
.p-kanban {
  position: relative;
  overflow: hidden;
  min-height: 200px;
  height: min(50vh, 480px);
  background-color: #000;
}
.p-kanban.is-less-height {
  min-height: 150px;
  height: min(37vh, 360px);
}
.p-kanban .container {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  z-index: 10;
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.p-kanban .p-breadcrumb {
  z-index: 5;
}
.p-kanban .js-parallax-img {
  height: 150% !important;
}

.p-kanban-text {
  font-size: var(--fz-subhead-lg);
  font-weight: var(--fw-middle);
  color: #fff;
  line-height: 1.2;
  text-align: center;
}

@media (max-width: 1299px) {
  .p-kanban {
    min-height: auto;
    height: min(30vh, 220px);
  }
  .p-kanban.is-less-height {
    height: min(25vh, 170px);
  }
}
@media (max-width: 767px) {
  .p-kanban {
    height: 150px;
  }
  .p-kanban.is-less-height {
    height: 150px;
  }
  .p-kanban .container {
    padding-bottom: 2rem;
  }
}
/*
 * Breadcrumb
 */
.p-breadcrumb {
  padding: 20px var(--gap);
  line-height: 1.4;
  font-size: 1rem;
  position: relative;
  z-index: 50;
}
.p-breadcrumb ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.p-breadcrumb ul li {
  position: relative;
  display: inline-block;
  vertical-align: top;
  padding-left: 2rem;
  color: #fff;
  font-weight: var(--fw-middle);
}
.p-breadcrumb ul li:before {
  content: "";
  width: 8px;
  height: 8px;
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
  display: block;
  position: absolute;
  border-style: solid;
  border-width: 0 1px 1px 0;
  border-color: rgba(255, 255, 255, 0.7);
  left: 0.7em;
  top: 0.45em;
}
.p-breadcrumb ul li:first-child {
  padding-left: 0;
}
.p-breadcrumb ul li:first-child a {
  font-size: 0;
  padding-left: 0;
  line-height: 0;
  display: inline-block;
  vertical-align: top;
  width: 1.25rem;
  height: 1.25rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.4' stroke='%23fff' class='w-6 h-6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M2.25 12l8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25' /%3E%3C/svg%3E") no-repeat 0 0/contain;
  -webkit-transition: -webkit-transform 0.25s;
  transition: -webkit-transform 0.25s;
  transition: transform 0.25s;
  transition: transform 0.25s, -webkit-transform 0.25s;
}
.pc .p-breadcrumb ul li:first-child a:hover {
  -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1);
}

.p-breadcrumb ul li:first-child:before {
  display: none;
}
.p-breadcrumb ul li a {
  color: #fff;
  text-decoration: none;
  display: block;
}
.p-breadcrumb ul li a:hover {
  text-decoration: underline;
}

@media (max-width: 767px) {
  .p-kanban .p-breadcrumb {
    font-size: 0.875rem;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.5);
  }
  .p-breadcrumb {
    padding-top: 12px;
    padding-bottom: 10px;
  }
  .p-breadcrumb .mb-hide {
    max-width: 8em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .p-breadcrumb ul li {
    font-size: 0.875rem;
    padding-left: 1rem;
    color: rgba(255, 255, 255, 0.8);
  }
  .p-breadcrumb ul li:before {
    width: 6px;
    height: 6px;
    left: 0.3em;
  }
  .p-breadcrumb ul li:first-child a {
    width: 1.125rem;
    height: 1.125rem;
  }
}
/*
 * No-data
 */
.msg-nodata {
  padding: var(--gap) 0;
  margin: auto;
  max-width: 430px;
  text-align: center;
}
.msg-nodata[data-aos] {
  opacity: 0;
  -webkit-transform: translateY(20px);
      -ms-transform: translateY(20px);
          transform: translateY(20px);
  -webkit-transition: opacity 0.6s ease, -webkit-transform 0.6s ease;
  transition: opacity 0.6s ease, -webkit-transform 0.6s ease;
  transition: opacity 0.6s ease, transform 0.6s ease;
  transition: opacity 0.6s ease, transform 0.6s ease, -webkit-transform 0.6s ease;
}
.msg-nodata[data-aos].aos-animate {
  opacity: 1;
  -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
          transform: translateX(0);
}
.msg-nodata .img {
  width: calc(var(--h-btn) * 2);
  height: calc(var(--h-btn) * 2);
  display: block;
  position: relative;
  margin: 0 auto 10px;
}
.msg-nodata .img::before {
  content: "";
  height: 80%;
  width: 80%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.2' stroke='currentColor' class='w-6 h-6'%3E %3Cpath stroke-linecap='round' stroke-linejoin='round' d='M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z' /%3E%3C/svg%3E");
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -webkit-filter: invert(68%) sepia(67%) saturate(4825%) hue-rotate(197deg) brightness(95%) contrast(88%);
          filter: invert(68%) sepia(67%) saturate(4825%) hue-rotate(197deg) brightness(95%) contrast(88%);
}
.msg-nodata .img.letter::before {
  -webkit-filter: none;
          filter: none;
  height: 70%;
  width: 70%;
  background-image: url(../images/icon_sent.svg);
}
.msg-nodata .img.thumb {
  margin-bottom: 1em;
  width: calc(var(--h-btn) * 3);
  height: calc(var(--h-btn) * 3);
}
.msg-nodata .img.thumb::before {
  -webkit-filter: none;
          filter: none;
  background-image: url(../images/icon_thumb.svg);
}
.msg-nodata .img.register {
  margin-bottom: 1em;
  width: calc(var(--h-btn) * 3);
  height: calc(var(--h-btn) * 3);
}
.msg-nodata .img.register::before {
  -webkit-filter: none;
          filter: none;
  background-image: url(../images/icon_register_finish.svg);
}
.msg-nodata .img.check::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.2' stroke='currentColor' class='w-6 h-6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z' /%3E%3C/svg%3E");
}
.msg-nodata .text {
  color: inherit;
  text-align: center;
  font-size: 1.0625rem;
  letter-spacing: 0.05em;
  line-height: 1.8;
  color: #555;
  margin: 0 auto var(--gap);
}
.msg-nodata .text .text-lg {
  font-size: var(--fz-listname-lg);
  font-weight: var(--fw-middle);
  color: #000;
  display: block;
  padding: 0;
  margin: 0 0 20px;
  position: relative;
}
.msg-nodata .text .text-lg strong {
  font-size: 1.1538em;
  line-height: 1.2;
  color: #00319f;
  display: block;
  margin: 0.2em auto;
}

/*
 * Form Commponent
 */
.color-blue {
  color: #00319f;
}

.color-red {
  color: #ff3e41 !important;
}

.color-gray {
  color: #666;
}

.notice {
  padding: 0;
  font-size: 0.875rem;
  color: #888;
}

.notice.warn {
  padding-left: 1.5em;
  position: relative;
  color: #ff3e41 !important;
}
.notice.warn::before {
  content: "";
  display: block;
  position: absolute;
  width: 1.2em;
  height: 1.2em;
  left: 0;
  top: 0.3em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23ff3e41' d='M12 20a8 8 0 1 0 0-16a8 8 0 0 0 0 16m0 2C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10s-4.477 10-10 10m-1-6h2v2h-2zm0-10h2v8h-2z'/%3E%3C/svg%3E") no-repeat 0 0/contain;
}

.form-box .notice {
  position: absolute;
  bottom: -2px;
  left: 0;
  -webkit-transform: translateY(100%);
      -ms-transform: translateY(100%);
          transform: translateY(100%);
}

.form-fieldset {
  background-color: #eef5fa;
  padding: var(--gap) var(--h-btn);
  margin-bottom: var(--gap);
}

@media (max-width: 767px) {
  .form-fieldset {
    margin: 0 calc(var(--gap) * -1) var(--gap);
    padding: var(--gap) var(--gap);
  }
}
.form-fieldset-subhead {
  font-weight: var(--fw-middle);
  font-size: var(--fz-listname);
  color: #000;
  margin: 10px 0 15px;
  font-weight: var(--fw-middle);
}
.form-fieldset-subhead.color-red {
  color: #ff3e41;
}
.form-fieldset-subhead.sm {
  font-size: var(--fz-brief);
}

#member .form-fieldset-subhead {
  font-size: calc(var(--fz-listname) * 0.86);
}

.form-box {
  display: block;
  position: relative;
  margin: 0 0 calc(var(--gap-item) * 1.125);
}
.form-box.form-half {
  display: inline-block;
  vertical-align: top;
  width: calc(50% - var(--gap-item));
}
.form-box.form-half.odd {
  margin-right: calc(var(--gap-item) * 2);
}
.form-box.form-half.even {
  margin-right: 0;
}

.form-box-inline {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.form-box-inline .form-fieldset-subhead,
.form-box-inline .label-style {
  line-height: var(--h-input);
  margin: 0 1em 0 0;
  padding: 0;
  white-space: nowrap;
  -webkit-box-flex: 0;
      -ms-flex: 0;
          flex: 0;
}

@media (max-width: 579px) {
  .form-box-inline {
    display: block;
  }
}
@media (min-width: 500px) {
  .xs-notice {
    margin-top: 0 !important;
    display: inline-block !important;
    vertical-align: top;
  }
}
@media (max-width: 499px) {
  .xs-notice {
    margin-top: 15px !important;
    display: block !important;
    width: 100%;
  }
}
.form-gp-bg {
  background-color: #fff;
  border-radius: 5px;
  margin: 0;
  padding: 2px 15px;
  min-height: var(--h-input);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border: 1px solid #d2d2d2;
}

.form-address .form-gp {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--gap-item);
}
.form-address .select-style {
  width: calc((50% - 140px) / 2 + var(--gap-item) * 0.5);
  -webkit-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  padding-right: 20px;
}
.form-address .input-style {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.form-address .w-small {
  -webkit-box-flex: 0 !important;
      -ms-flex: 0 1 130px !important;
          flex: 0 1 130px !important;
}

@media (max-width: 1299px) {
  .form-box.form-half {
    width: calc(50% - 19px);
  }
  .form-box.form-half.odd {
    margin-right: 30px;
  }
  .form-box.form-half.even {
    margin-right: 0;
  }
  .form-address .form-gp {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .form-address .select-style:not(.w-small) {
    width: calc(50% - var(--gap-item) * 0.5);
    margin-bottom: var(--gap-item);
    margin-right: var(--gap-item);
  }
  .form-address .select-style:not(.w-small):nth-of-type(2) {
    margin-right: 0;
  }
}
@media (max-width: 767px) {
  .form-box.form-half {
    display: block;
    width: 100%;
  }
}
@media (max-width: 579px) {
  .form-address {
    display: block;
  }
  .form-address > * {
    margin-bottom: 10px;
  }
  .form-address .select-style:not(.w-small) {
    width: 100%;
  }
  .form-address .w-small {
    display: block;
    -webkit-box-flex: 0 !important;
        -ms-flex: 0 1 calc(50% - var(--gap-item) * 0.6) !important;
            flex: 0 1 calc(50% - var(--gap-item) * 0.6) !important;
  }
  .form-address .w-small + .input-style,
  .form-address .w-small + .select-style {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
  }
}
.form-tao-id {
  margin-left: calc(var(--gap-item) * -1);
  margin-right: calc(var(--gap-item) * -1);
}
.form-tao-id .radio-style {
  margin: 0 var(--gap-item) var(--gap);
}
.form-tao-id .radio-style em {
  white-space: nowrap;
}

@media (max-width: 991px) {
  .form-tao-id .radio-style {
    -ms-flex-preferred-size: calc(33.3333333333% - var(--gap-item) * 2);
        flex-basis: calc(33.3333333333% - var(--gap-item) * 2);
  }
}
@media (max-width: 579px) {
  .form-tao-id .radio-style {
    -ms-flex-preferred-size: calc(50% - var(--gap-item) * 2);
        flex-basis: calc(50% - var(--gap-item) * 2);
  }
}
@media (max-width: 399px) {
  .form-tao-id {
    display: block !important;
    margin-left: auto;
    margin-right: auto;
  }
  .form-tao-id .radio-style {
    display: block;
    width: 100%;
    margin: 0 auto var(--gap);
  }
}
.form-tao-verify {
  position: relative;
  width: 100%;
}
.form-tao-verify .form-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.form-tao-verify .form-box .form-fieldset-subhead {
  line-height: var(--h-input);
  margin: 0 0.5em 0 0;
  padding: 0;
  white-space: nowrap;
  -webkit-box-flex: 0;
      -ms-flex: 0;
          flex: 0;
}

.btn-verify {
  min-width: 100px;
  margin-left: 1em;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100px;
          flex: 0 0 100px;
  padding: 0;
  margin-bottom: calc(var(--gap-item) * 1.125);
  background-color: #999;
  color: #fff;
  border-radius: 5px;
  font-size: 0.9375rem;
  letter-spacing: 0;
  text-align: center;
  height: var(--h-input);
  line-height: var(--h-input);
}
.btn-verify.is-succeed {
  background-color: rgb(48, 184, 48) !important;
}
.btn-verify.is-succeed::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  margin: -0.2em -0.5em 0 -0.4em;
  width: 1.5rem;
  height: 1.5rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -7 24 24' width='24' fill='%23fff'%3E%3Cpath d='M5.486 9.73a.997.997 0 0 1-.707-.292L.537 5.195A1 1 0 1 1 1.95 3.78l3.535 3.535L11.85.952a1 1 0 0 1 1.415 1.414L6.193 9.438a.997.997 0 0 1-.707.292z'%3E%3C/path%3E%3C/svg%3E") no-repeat 0 0/contain;
}
.btn-verify.is-warning {
  background-color: #ff3e41 !important;
}
.btn-verify.is-warning::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  margin: -0.2em -0.5em 0 -0.4em;
  width: 1.5rem;
  height: 1.5rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-6 -6 24 24' width='24' fill='%23fff'%3E%3Cpath d='M7.314 5.9l3.535-3.536A1 1 0 1 0 9.435.95L5.899 4.485 2.364.95A1 1 0 1 0 .95 2.364l3.535 3.535L.95 9.435a1 1 0 1 0 1.414 1.414l3.535-3.535 3.536 3.535a1 1 0 1 0 1.414-1.414L7.314 5.899z'%3E%3C/path%3E%3C/svg%3E") no-repeat 0 0/contain;
}

@media (max-width: 579px) {
  .form-tao-verify {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .form-tao-verify .row {
    margin-left: auto;
    margin-right: auto;
  }
  .form-tao-verify .col-md-6 {
    padding-left: 0;
    padding-right: 0;
  }
  .btn-verify {
    width: 100%;
    -webkit-box-flex: 0;
        -ms-flex: 0;
            flex: 0;
    min-width: auto;
  }
}
.form-checkac .input-style {
  padding-right: 120px;
}
.form-checkac .form-gp {
  position: relative;
}

.btn-checkac {
  position: absolute;
  display: inline-block;
  vertical-align: middle;
  z-index: 15;
  width: 80px;
  padding: 0;
  border-radius: 5px;
  font-size: 0.9375rem;
  letter-spacing: 0;
  min-width: auto;
  text-align: center;
  height: calc(var(--h-input) * 0.7);
  line-height: calc(var(--h-input) * 0.7);
  right: calc(var(--h-input) * 0.15);
  bottom: calc(var(--h-input) * 0.15);
  color: #fff;
  background-color: #acacac;
}
.btn-checkac::before {
  background-color: #666;
}
.btn-checkac.is-succeed {
  background-color: rgb(48, 184, 48) !important;
}
.btn-checkac.is-succeed::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  margin: -0.2em -0.5em 0 -0.4em;
  width: 1.5rem;
  height: 1.5rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -7 24 24' width='24' fill='%23fff'%3E%3Cpath d='M5.486 9.73a.997.997 0 0 1-.707-.292L.537 5.195A1 1 0 1 1 1.95 3.78l3.535 3.535L11.85.952a1 1 0 0 1 1.415 1.414L6.193 9.438a.997.997 0 0 1-.707.292z'%3E%3C/path%3E%3C/svg%3E") no-repeat 0 0/contain;
}
.btn-checkac.is-warning {
  background-color: #ff3e41 !important;
}
.btn-checkac.is-warning::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  margin: -0.2em -0.5em 0 -0.4em;
  width: 1.5rem;
  height: 1.5rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-6 -6 24 24' width='24' fill='%23fff'%3E%3Cpath d='M7.314 5.9l3.535-3.536A1 1 0 1 0 9.435.95L5.899 4.485 2.364.95A1 1 0 1 0 .95 2.364l3.535 3.535L.95 9.435a1 1 0 1 0 1.414 1.414l3.535-3.535 3.536 3.535a1 1 0 1 0 1.414-1.414L7.314 5.899z'%3E%3C/path%3E%3C/svg%3E") no-repeat 0 0/contain;
}

.form-box.code {
  display: inline-block;
  vertical-align: middle;
  padding-right: 150px;
}

.codeimg {
  display: inline-block;
  width: 140px;
  position: absolute;
  bottom: 0;
  right: 0;
}
.codeimg img {
  width: 100%;
  height: 100%;
  border-radius: 5px;
  max-height: var(--h-input);
  border: 1px solid rgba(255, 255, 255, 0.5);
}

@media (max-width: 767px) {
  .form-box.code {
    width: 100%;
    max-width: 100%;
  }
}
@media screen and (max-width: 479px) {
  .form-box.code {
    padding-right: 0;
  }
  .codeimg {
    position: relative;
    bottom: auto;
  }
}
.js-datepicker {
  padding-right: 25px;
  background-repeat: no-repeat;
  background-position: calc(100% - 8px) center;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='%23666' d='M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857V3.857z'/%3e%3cpath fill='%23666' d='M6.5 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/%3e%3c/svg%3e");
  background-size: auto 16px;
}

.star {
  color: #ff3e41;
  display: inline-block;
  vertical-align: middle;
  margin: -4px 0.3rem 0 0.3em;
  font-style: normal;
  font-weight: 400;
  font-size: 0;
}
.star:before {
  content: "*";
  line-height: 1;
  font-size: 1.22rem;
}

.label-style {
  font-size: 1.0625rem;
  padding: 5px 0;
  line-height: 1.2;
  margin: 0;
  position: relative;
  display: block;
}

.input-style {
  -webkit-box-shadow: none;
          box-shadow: none;
  height: var(--h-input);
  padding: 0 15px;
  width: 100%;
  border-radius: 5px;
  background-color: #fff;
  border: 1px solid #d2d2d2;
}
.input-style:focus {
  background-color: #fff;
  border-color: #ff3e41;
}

.textarea-style {
  -webkit-box-shadow: none;
          box-shadow: none;
  height: calc(var(--h-input) * 3);
  padding: 10px 15px;
  width: 100%;
  display: block;
  outline: none;
  border-radius: 5px;
  background-color: #fff;
  border: 1px solid #d2d2d2;
}
.textarea-style:focus {
  background-color: #fff;
  border-color: #ff3e41;
}

.select-style {
  padding: 0 var(--h-input) 0 15px;
  display: block;
  width: 100%;
  height: var(--h-input);
  line-height: var(--h-input);
  background: #fff url(../images/select_aw.png) right center no-repeat;
  background-size: auto 75%;
  outline: none;
  color: inherit !important;
  border-radius: 5px;
  border: 1px solid #d2d2d2;
}
.select-style:focus {
  background-color: #fff;
  border-color: #ff3e41;
}

.dropdown-style .dropdown-toggle {
  text-align: left;
  position: relative;
  border: none;
  z-index: 15;
  min-width: 186px;
  height: var(--h-btn);
  line-height: var(--h-btn);
  white-space: nowrap;
  background: #ffffff;
  padding: 0 var(--h-input) 0 15px;
  border-radius: 0;
  color: #333;
  font-weight: var(--fw-middle);
  display: inline-block;
  -webkit-box-shadow: 2px 4px 0 rgba(0, 0, 0, 0.1) !important;
          box-shadow: 2px 4px 0 rgba(0, 0, 0, 0.1) !important;
}
.dropdown-style .dropdown-toggle::after {
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -16px;
  font-size: 0;
  width: 32px;
  height: 32px;
  background: url(../images/select_aw.png) right 0 no-repeat;
  background-size: auto 100%;
}
.dropdown-style .dropdown-toggle::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  padding: 2px;
  background: -webkit-gradient(linear, left top, right top, from(#de2126), to(#ed9027));
  background: linear-gradient(to right, #de2126, #ed9027);
  -webkit-mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.dropdown-style .dropdown-toggle:active {
  background: #fff;
  color: #568ae5;
  font-weight: 600;
}
.dropdown-style .dropdown-menu {
  z-index: 60;
  min-width: 180px;
  -webkit-box-shadow: 2px 4px 0 rgba(0, 0, 0, 0.1) !important;
          box-shadow: 2px 4px 0 rgba(0, 0, 0, 0.1) !important;
  padding: 5px 12px;
  border-radius: 0;
}
.dropdown-style .dropdown-menu > a {
  border-top: 1px solid #dcdcdc;
  padding: 10px 15px;
  text-align: left;
  position: relative;
  margin: 0;
}
.dropdown-style .dropdown-menu > a:first-child {
  border-top: none;
}
.dropdown-style .dropdown-menu > a:active {
  background: #eee;
  font-weight: 600;
  color: #333;
}
.dropdown-style .dropdown-menu > ul > li {
  display: block;
}
.dropdown-style .dropdown-menu > ul > li > a {
  font-weight: var(--fw-middle);
  color: #000;
  display: block;
  line-height: 1.4;
  padding: 10px 0 10px 30px;
  margin: 0;
  position: relative;
  border-top: 1px solid #ddd;
}
.dropdown-style .dropdown-menu > ul > li > a::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 0;
  width: 7px;
  height: 7px;
  border-radius: 50px;
  background: #999;
  left: 12px;
  top: 16px;
}
.dropdown-style .dropdown-menu > ul > li > a:active, .dropdown-style .dropdown-menu > ul > li > a:focus {
  background: #fefefe;
  color: #568ae5;
}
.dropdown-style .dropdown-menu > ul > li > a:active::before, .dropdown-style .dropdown-menu > ul > li > a:focus::before {
  background: #568ae5;
}
.dropdown-style .dropdown-menu > ul > li > a.current {
  color: #568ae5;
}
.dropdown-style .dropdown-menu > ul > li > a.current::before {
  background: #568ae5;
}
.dropdown-style .dropdown-menu > ul > li > a.current + ul {
  display: block;
}
.dropdown-style .dropdown-menu > ul > li:hover > a:not(.current) {
  color: #568ae5;
  background: #fefefe;
}
.dropdown-style .dropdown-menu > ul > li:hover > a:not(.current)::before {
  background: #568ae5;
}
.dropdown-style .dropdown-menu > ul > li:first-child > a {
  border-top: none;
}
.dropdown-style .dropdown-menu > ul > li.is-open > ul {
  display: block;
}
.dropdown-style .dropdown-menu > ul > li > ul {
  background: #f8f8f8;
  border-top: 1px solid #ddd;
  display: none;
}
.dropdown-style .dropdown-menu > ul > li > ul > li {
  display: block;
}
.dropdown-style .dropdown-menu > ul > li > ul > li > a {
  font-size: 0.9375em;
  color: #666;
  display: block;
  padding: 4px 0 4px 40px;
  position: relative;
}
.dropdown-style .dropdown-menu > ul > li > ul > li > a::before {
  content: "";
  position: absolute;
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 50px;
  background: #666;
  left: 27px;
  top: 18px;
}
.dropdown-style .dropdown-menu > ul > li > ul > li > a:active, .dropdown-style .dropdown-menu > ul > li > ul > li > a:focus {
  background: #f2f2f2;
  color: #666;
}
.dropdown-style .dropdown-menu > ul > li > ul > li > a:active::before, .dropdown-style .dropdown-menu > ul > li > ul > li > a:focus::before {
  background: #666;
}
.dropdown-style .dropdown-menu > ul > li > ul > li > a.current {
  color: #568ae5;
}
.dropdown-style .dropdown-menu > ul > li > ul > li > a.current::before {
  background: #568ae5;
}
.dropdown-style .dropdown-menu > ul > li > ul > li:hover > a:not(.current) {
  background: #f2f2f2;
  color: #666;
}
.dropdown-style .dropdown-menu > ul > li > ul > li:hover > a:not(.current)::before {
  background: #666;
}
.dropdown-style .dropdown-menu > ul > li > ul > li:hover > a.current {
  background: #f2f2f2;
}
.dropdown-style.show .dropdown-toggle {
  background: -webkit-gradient(linear, right top, left bottom, from(#ed9027), to(#de2126));
  background: linear-gradient(to left bottom, #ed9027, #de2126);
  color: #fff;
}
.dropdown-style.show .dropdown-toggle::after {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}
.dropdown-style.show .dropdown-toggle:hover {
  background-color: #fefefe;
}
.dropdown-style.show .dropdown-menu {
  top: auto !important;
  -webkit-transform: none !important;
      -ms-transform: none !important;
          transform: none !important;
}

.pc .dropdown-style:not(.show) .dropdown-toggle:hover {
  background: #eee;
  color: #568ae5;
  font-weight: 600;
}
.pc .dropdown-style .dropdown-menu > a:hover {
  background: #eee;
  color: #568ae5;
  font-weight: 600;
}

.radio-style {
  padding: 0 0 0 max(26px, var(--h-input) * 0.5);
  margin: 0 10px 0 0;
  position: relative;
  display: inline-block;
  font-weight: normal;
  line-height: 1.4;
  color: inherit;
}
.radio-style em {
  font-style: normal;
  font-weight: normal;
  color: inherit;
  font-size: var(--fz-brief);
}
.radio-style input {
  outline: none;
  z-index: -100 !important;
  width: 1px !important;
  height: 1px !important;
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute;
  opacity: 0;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.radio-style input + span {
  position: absolute;
  display: inline-block;
  vertical-align: top;
  border: 1px solid #d7d7d7;
  background-color: #fff;
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-box-flex: 0;
      -ms-flex: 0;
          flex: 0;
  width: max(22px, var(--h-input) * 0.35);
  height: max(22px, var(--h-input) * 0.35);
  padding: 4px;
  top: 0;
  left: 0;
  border-radius: 50%;
  -webkit-transition: border-color 0.1s;
  transition: border-color 0.1s;
}
.radio-style input + span i {
  display: block;
  width: 100%;
  height: 100%;
  background: #ff3e41;
  -webkit-transform: scale(0);
      -ms-transform: scale(0);
          transform: scale(0);
  font-size: 0;
  border-radius: 50%;
  -webkit-transition: -webkit-transform 0.1s;
  transition: -webkit-transform 0.1s;
  transition: transform 0.1s;
  transition: transform 0.1s, -webkit-transform 0.1s;
}
.radio-style input:checked + span {
  border-color: #ff3e41;
}
.radio-style input:checked + span i {
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}
.radio-style:hover input + span, .radio-style:active input + span {
  border-color: #888;
}
.radio-style:hover input + span i, .radio-style:active input + span i {
  background-color: #ddd;
}
.radio-style:hover input:checked + span, .radio-style:active input:checked + span {
  border-color: #ff3e41;
}
.radio-style:hover input:checked + span i, .radio-style:active input:checked + span i {
  background-color: #ff3e41;
}

.checkbox-style {
  padding: 0.65em 0 0.65em max(30px, var(--h-input) * 0.7);
  margin: 0 10px 0 0;
  position: relative;
  display: inline-block;
  font-weight: normal;
  font-size: 1em;
  white-space: nowrap;
  line-height: 1.4;
}
.checkbox-style em {
  font-style: normal;
}
.checkbox-style input {
  outline: none;
  z-index: -100 !important;
  width: 1px !important;
  height: 1px !important;
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute;
  opacity: 0;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.checkbox-style input + span {
  position: absolute;
  display: inline-block;
  vertical-align: top;
  left: 0;
  top: 0.45em;
  border: 1px solid #aaa;
  background-color: #fff;
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-box-flex: 0;
      -ms-flex: 0;
          flex: 0;
  width: max(26px, var(--h-input) * 0.4);
  height: max(26px, var(--h-input) * 0.4);
  padding: 0;
  position: absolute;
  -webkit-transition: background 0.15s;
  transition: background 0.15s;
}
.checkbox-style input + span i {
  display: inline-block;
  vertical-align: top;
  margin: -4px 0 0 -2px;
  width: 15px;
  height: 9px;
  top: 50%;
  left: 50%;
  position: absolute;
  border-left: 3px solid #ff3e41;
  border-bottom: 3px solid #ff3e41;
  -webkit-transform: scale(0) rotate(-45deg);
      -ms-transform: scale(0) rotate(-45deg);
          transform: scale(0) rotate(-45deg);
  -webkit-transition: -webkit-transform 0.2s;
  transition: -webkit-transform 0.2s;
  transition: transform 0.2s;
  transition: transform 0.2s, -webkit-transform 0.2s;
  -webkit-transform-origin: left bottom;
      -ms-transform-origin: left bottom;
          transform-origin: left bottom;
}
.checkbox-style input:checked + span {
  border-color: #ff3e41;
  background: #fff;
}
.checkbox-style input:checked + span i {
  -webkit-transform: scale(1) rotate(-45deg);
      -ms-transform: scale(1) rotate(-45deg);
          transform: scale(1) rotate(-45deg);
}
.checkbox-style:hover input:checked + span, .checkbox-style:active input:checked + span {
  border-color: #ff3e41;
}

.plupload-wrap .notice {
  display: block;
  margin: 5px 0 0;
  position: relative;
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
}

.plupload-file-wrap {
  position: relative;
  display: block;
}
.plupload-file-wrap input[type=file] {
  z-index: -100 !important;
  width: 1px !important;
  height: 1px !important;
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute;
  opacity: 0;
}
.plupload-file-wrap .input-wrap {
  position: relative;
  padding-right: 130px;
}

.plupload-wrap .plupload-file-button-pos {
  position: absolute;
  right: 0;
  top: 0;
  width: 120px;
}
.plupload-wrap .plupload-browse-button {
  border: 1px solid #2f4f87;
  color: #fff;
  background: #2f4f87, #1c3560;
  /* Vertical gradient */
  background: -webkit-gradient(linear, left top, left bottom, from(#2f4f87), to(#1c3560));
  background: linear-gradient(to bottom, #2f4f87, #1c3560);
  display: block;
  padding: 0;
  text-align: center;
  width: 120px;
  border-radius: 5px;
  height: var(--h-input);
  line-height: calc(var(--h-input) - 2px);
  cursor: pointer;
  position: absolute;
  top: 0;
  right: 0;
}
.plupload-wrap .plupload-browse-button::before {
  content: "選擇檔案";
  display: inline-block;
  padding-left: 25px;
  background: url(../images/icon_upload.svg) no-repeat center left/16px auto;
}
.plupload-wrap .plupload-browse-button:hover {
  color: #fff;
  background: #2957a7, #123d88;
  /* Vertical gradient */
  background: -webkit-gradient(linear, left top, left bottom, from(#2957a7), to(#123d88));
  background: linear-gradient(to bottom, #2957a7, #123d88);
}
.plupload-wrap .plupload-file-queue {
  display: block;
  position: relative;
  height: var(--h-input);
  width: 100%;
  border-radius: 5px;
  overflow: hidden;
}
.plupload-wrap .plupload-file-queue::before {
  content: "尚未選擇檔案...";
  display: block;
  position: absolute;
  width: 100%;
  height: var(--h-input);
  line-height: calc(var(--h-input) - 2px);
  border: 1px solid #ddd;
  background: #fff;
  color: #888;
  top: 0;
  left: 0;
  padding: 0 15px;
}
.plupload-wrap .plupload-file-queue .plupload-progress-wrap {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  overflow: hidden;
}
.plupload-wrap .plupload-file-queue .plupload-progress-wrap .plupload-progress-graph {
  position: absolute;
  width: 100%;
  height: 100%;
  background: #eee;
  top: 0;
  left: 0;
  color: #00319f;
  line-height: calc(var(--h-input) - 2px);
}
.plupload-wrap .plupload-file-queue .plupload-progress-wrap .plupload-progress-graph .plupload-progress-bar {
  float: none;
  position: relative;
  width: 100%;
  height: 100%;
  background: none;
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
  -webkit-transition: none;
  transition: none;
}
.plupload-wrap .plupload-file-queue .plupload-progress-wrap .plupload-progress-graph .plupload-progress-bar > i {
  display: block;
  position: absolute;
  font-style: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 0;
  padding: 0 15px 0 70px;
  height: 100%;
  background: #aec7f3;
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-size: calc(var(--h-input) - 2px);
  top: 0;
  left: 0;
  -webkit-transition: width 0.3s;
  transition: width 0.3s;
}
.plupload-wrap .plupload-file-queue .plupload-progress-wrap .plupload-progress-graph .plupload-progress-bar > span {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  font-size: 0.9375rem;
  text-align: left;
  padding: 0 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 579px) {
  .plupload-file-wrap .plupload-file-button-pos {
    display: block;
    width: 100%;
  }
}
.form-tao-plan .label-style {
  margin-bottom: var(--gap);
}

.radio-tao-plan {
  position: relative;
  width: 100%;
  margin-bottom: var(--gap);
}
.radio-tao-plan.type1 input:checked + .inner::before {
  border-color: #ff3e41;
}
.radio-tao-plan.type1 input:checked + .inner .img::before {
  background-color: #ffebec;
}
.radio-tao-plan.type1 input:checked + .inner .price {
  color: #ff3e41;
}
.radio-tao-plan.type2 input:checked + .inner::before {
  border-color: #00319f;
}
.radio-tao-plan.type2 input:checked + .inner .img::before {
  background-color: #e8f2f9;
}
.radio-tao-plan.type2 input:checked + .inner .price {
  color: #00319f;
}
.radio-tao-plan.type3 input:checked + .inner::before {
  border-color: #b08456;
}
.radio-tao-plan.type3 input:checked + .inner .img::before {
  background-color: #fdf1e5;
}
.radio-tao-plan.type3 input:checked + .inner .price {
  color: #b08456;
}
.radio-tao-plan.type4 input:checked + .inner::before {
  border-color: #a87584;
}
.radio-tao-plan.type4 input:checked + .inner .img::before {
  background-color: #f8d3e1;
}
.radio-tao-plan.type4 input:checked + .inner .price {
  color: #a87584;
}
.radio-tao-plan input {
  outline: none;
  z-index: -100 !important;
  width: 1px !important;
  height: 1px !important;
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute;
  opacity: 0;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.radio-tao-plan input:checked + .inner::before {
  opacity: 1;
}
.radio-tao-plan input:checked + .inner .name {
  color: #000;
}
.radio-tao-plan label {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
  border-radius: var(--radius-page);
}
.radio-tao-plan .inner {
  z-index: 0;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 10px calc(var(--gap) * 2);
  background-color: #fff;
  border-radius: var(--radius-page);
  -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
          box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
}
.radio-tao-plan .inner::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  border-radius: var(--radius-page);
  border: 3px solid #ff3e41;
  -webkit-transition: opacity 0.25s;
  transition: opacity 0.25s;
  opacity: 0;
}
.radio-tao-plan .inner .img {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 min(95px, var(--h-btn) * 2.8);
          flex: 0 0 min(95px, var(--h-btn) * 2.8);
  width: min(95px, var(--h-btn) * 2.8);
  height: min(95px, var(--h-btn) * 2.8);
  margin: var(--gap-item) auto;
  -webkit-transition: -webkit-transform 0.2s;
  transition: -webkit-transform 0.2s;
  transition: transform 0.2s;
  transition: transform 0.2s, -webkit-transform 0.2s;
  position: relative;
  padding: min(10px, var(--h-btn) * 0.25);
}
.radio-tao-plan .inner .img img {
  width: 100%;
  position: relative;
  z-index: 15;
}
.radio-tao-plan .inner .img::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  border-radius: 50%;
  background-color: #f4f4f4;
}
.radio-tao-plan .inner .text {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  text-align: left;
  padding-left: var(--gap-item);
}
.radio-tao-plan .inner .name {
  font-size: var(--fz-listname-sm);
  display: block;
  white-space: nowrap;
  color: #666;
  margin: 0 auto;
  font-weight: var(--fw-middle);
}
.radio-tao-plan .inner .price {
  line-height: 1;
  display: block;
  white-space: nowrap;
  margin: 0 auto;
  font-size: 1rem;
  color: #666;
}
.radio-tao-plan .inner .price span {
  font-weight: var(--fw-bold);
  display: inline-block;
  margin-right: 0.5em;
}
.radio-tao-plan .inner .price strong {
  font-size: calc(var(--fz-subhead) * 0.86);
  font-weight: var(--fw-extrabold);
}

@media (min-width: 768px) and (max-width: 991px) {
  .radio-tao-plan .inner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: var(--gap) var(--gap-item);
  }
  .radio-tao-plan .inner .img {
    text-align: center;
    margin: 5px auto;
  }
  .radio-tao-plan .inner .text {
    padding: 0;
    margin: 0;
    text-align: center;
  }
  .radio-tao-plan .inner .name {
    margin: 0.25rem 0;
  }
}
@media (max-width: 767px) {
  .radio-tao-plan {
    margin-bottom: var(--gap-item);
  }
  .radio-tao-plan .inner {
    padding: 0 var(--gap-item);
  }
  .radio-tao-plan .inner .img {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 70px;
            flex: 0 0 70px;
    width: 70px;
    height: 70px;
    padding: 0;
  }
  .radio-tao-plan .inner .price strong {
    font-size: var(--fz-subhead);
  }
}
/**
 * 表單 密碼
 */
.btn-showpwd {
  width: var(--h-input);
  height: var(--h-input);
  position: absolute;
  z-index: 5;
  right: 0;
  bottom: 0;
  margin: 0;
  font-size: 0;
  white-space: nowrap;
  color: #999;
  background-color: transparent;
  border: none;
  cursor: pointer;
}
.btn-showpwd input {
  outline: none;
  z-index: -100 !important;
  width: 1px !important;
  height: 1px !important;
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute;
  opacity: 0;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.btn-showpwd span {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 45%;
  aspect-ratio: 1;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23555' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5'%3E%3Cpath d='M3 13c3.6-8 14.4-8 18 0'/%3E%3Cpath d='M12 17a3 3 0 1 1 0-6a3 3 0 0 1 0 6'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
.btn-showpwd.is-show-pwd span {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23555' d='M2.22 2.22a.75.75 0 0 0-.073.976l.073.084l4.034 4.035a10 10 0 0 0-3.955 5.75a.75.75 0 0 0 1.455.364a8.5 8.5 0 0 1 3.58-5.034l1.81 1.81A4 4 0 0 0 14.8 15.86l5.919 5.92a.75.75 0 0 0 1.133-.977l-.073-.084l-6.113-6.114l.001-.002l-1.2-1.198l-2.87-2.87h.002l-2.88-2.877l.001-.002l-1.133-1.13L3.28 2.22a.75.75 0 0 0-1.06 0m7.984 9.045l3.535 3.536a2.5 2.5 0 0 1-3.535-3.535M12 5.5c-1 0-1.97.148-2.889.425l1.237 1.236a8.503 8.503 0 0 1 9.899 6.272a.75.75 0 0 0 1.455-.363A10 10 0 0 0 12 5.5m.195 3.51l3.801 3.8a4.003 4.003 0 0 0-3.801-3.8'/%3E%3C/svg%3E");
}
.pc .btn-showpwd:hover {
  color: #666;
}
.pc .btn-showpwd:hover span {
  -webkit-filter: brightness(0.8);
          filter: brightness(0.8);
}

/*
 * Plugin: 頁籤溢出轉滾動
 */
.tabs-scroll {
  position: relative;
}
.tabs-scroll .tabs-scroll__prev, .tabs-scroll .tabs-scroll__next {
  display: none;
  position: absolute;
  width: 35px;
  height: 100%;
  top: 0;
  z-index: 15;
  cursor: pointer;
}
.tabs-scroll .tabs-scroll__prev::before, .tabs-scroll .tabs-scroll__next::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  margin-top: -5px;
  position: absolute;
  top: 50%;
  border-style: solid;
  border-color: #ddd;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}
.tabs-scroll .tabs-scroll__prev.is-hide, .tabs-scroll .tabs-scroll__next.is-hide {
  opacity: 0 !important;
}
.tabs-scroll .tabs-scroll__prev {
  left: calc(var(--gap) * -0.8);
  background: rgb(86, 138, 229);
  background: -webkit-gradient(linear, left top, right top, color-stop(50%, rgb(86, 138, 229)), color-stop(98%, rgba(23, 23, 23, 0)));
  background: linear-gradient(90deg, rgb(86, 138, 229) 50%, rgba(23, 23, 23, 0) 98%);
}
.tabs-scroll .tabs-scroll__prev::before {
  left: 50%;
  border-width: 0 0 1px 1px;
  margin-left: -8px;
}
.tabs-scroll .tabs-scroll__next {
  right: calc(var(--gap) * -0.8);
  background: rgb(86, 138, 229);
  background: -webkit-gradient(linear, right top, left top, color-stop(50%, rgb(86, 138, 229)), color-stop(98%, rgba(23, 23, 23, 0)));
  background: linear-gradient(270deg, rgb(86, 138, 229) 50%, rgba(23, 23, 23, 0) 98%);
}
.tabs-scroll .tabs-scroll__next::before {
  right: 50%;
  border-width: 1px 1px 0 0;
  margin-right: -8px;
}
.tabs-scroll.is-scroll-active .tab-scroll__track {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  padding: 6px 20px 0 0;
}
.tabs-scroll.is-scroll-active .tabs-scroll__prev,
.tabs-scroll.is-scroll-active .tabs-scroll__next {
  display: block;
}
.tabs-scroll .tab-scroll__track {
  position: relative;
  overflow-y: hidden;
  overflow-x: scroll;
  white-space: nowrap;
}
.tabs-scroll .tab-scroll__track::-webkit-scrollbar {
  height: 0;
}
.tabs-scroll .tab-scroll__track::-webkit-scrollbar-track {
  -webkit-box-shadow: none;
  border-radius: 5px;
  margin: 0;
}
.tabs-scroll .tab-scroll__track::-webkit-scrollbar-thumb {
  -webkit-box-shadow: none;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0);
}

.tabs-scroll__link {
  display: inline-block;
  border: none;
  color: #333;
  font-size: 1rem;
  background-color: transparent;
  padding: 1px 20px;
  margin: 0 3px;
  line-height: calc(var(--h-btn) - 2px);
  position: relative;
  overflow: hidden;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  -webkit-transition: background-color 0.25;
  transition: background-color 0.25;
}
.tabs-scroll__link::before {
  content: "";
  position: absolute;
  display: block;
  background-color: #00319f;
  width: auto;
  height: 1px;
  left: 15px;
  right: 15px;
  bottom: 0;
  opacity: 0;
  -webkit-transition: opacity 0.25s;
  transition: opacity 0.25s;
}
.tabs-scroll__link:hover, .tabs-scroll__link:active {
  color: #568ae5;
}
.tabs-scroll__link:hover::before, .tabs-scroll__link:active::before {
  opacity: 0.2;
}
.tabs-scroll__link.active {
  color: #00319f;
}
.tabs-scroll__link.active::before {
  opacity: 1;
}

.tab-scroll__style-underline {
  margin-bottom: var(--gap);
}
.tab-scroll__style-underline .tabs-scroll {
  text-align: center;
}
.tab-scroll__style-underline .tabs-scroll .tab-scroll__track {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: auto;
  max-width: 100%;
  background-color: #eef5fa;
  height: var(--h-btn);
  padding: 5px var(--gap);
  border-radius: 50px;
}

/**!
 * * 分類選單，頁籤轉下拉
 */
.tab-dropdown {
  background-color: #568ae5;
  position: relative;
  z-index: 20;
  margin: 0 auto;
  padding: 0;
}
.tab-dropdown .container {
  margin: 0 auto;
  padding: 15px 5px;
  position: relative;
}

.tab-dropdown__switch {
  display: none;
  position: relative;
  z-index: 1;
}

.tab-dropdown__list {
  position: relative;
  z-index: 1;
  white-space: nowrap;
  list-style: none;
  margin: 0 auto;
  padding: 0;
  width: 100%;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.tab-dropdown__list > li {
  display: inline-block;
  vertical-align: top;
  padding: 0 1em;
  position: relative;
}
.tab-dropdown__list > li::before {
  content: "";
  width: 1px;
  height: 0.9em;
  -webkit-transform: rotate(40deg);
      -ms-transform: rotate(40deg);
          transform: rotate(40deg);
  background-color: rgba(255, 255, 255, 0.2);
  left: 0;
  top: 50%;
  margin-top: -0.52em;
  margin-left: -1px;
  position: absolute;
  display: block;
}
.tab-dropdown__list > li:first-child::before {
  display: none;
}
.tab-dropdown__list > li > a {
  font-size: 1rem;
  line-height: var(--h-pager);
  border-radius: var(--h-pager);
  white-space: nowrap;
  display: inline-block;
  text-align: center;
  padding: 0 15px;
  min-width: 120px;
  position: relative;
  -webkit-transition: background-color 0.25s;
  transition: background-color 0.25s;
  border: none;
  background-color: transparent;
  color: #fff;
  -webkit-transition: -webkit-transform 0.15s ease;
  transition: -webkit-transform 0.15s ease;
  transition: transform 0.15s ease;
  transition: transform 0.15s ease, -webkit-transform 0.15s ease;
}
.tab-dropdown__list > li.active > a {
  background-color: #fff;
  color: #111;
}

@media (min-width: 768px) {
  .tab-dropdown.is-dropdown-active ~ .p-mainwrap:first-of-type .p-subhead:not(.is-keep-show):first-of-type {
    display: none;
  }
  .tab-dropdown.is-dropdown-active .container {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .tab-dropdown.is-dropdown-active .tab-dropdown__switch {
    z-index: 5;
    cursor: pointer;
    display: block;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 var(--h-btn) 0 20px;
    margin: 0;
    border-radius: var(--h-btn);
    line-height: var(--h-btn);
    font-size: 1rem;
    color: #fff;
    top: 0;
    border: none;
    background-color: #568ae5;
    -webkit-transition: all 0.15s;
    transition: all 0.15s;
  }
  .tab-dropdown.is-dropdown-active .tab-dropdown__switch::before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 24px;
    height: 24px;
    margin-right: 10px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23fff' class='w-6 h-6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M10.5 6h9.75M10.5 6a1.5 1.5 0 11-3 0m3 0a1.5 1.5 0 10-3 0M3.75 6H7.5m3 12h9.75m-9.75 0a1.5 1.5 0 01-3 0m3 0a1.5 1.5 0 00-3 0m-3.75 0H7.5m9-6h3.75m-3.75 0a1.5 1.5 0 01-3 0m3 0a1.5 1.5 0 00-3 0m-9.75 0h9.75' /%3E%3C/svg%3E");
  }
  .tab-dropdown.is-dropdown-active .tab-dropdown__switch::after {
    content: "";
    display: block;
    position: absolute;
    width: 8px;
    height: 8px;
    border-style: solid;
    border-width: 2px 2px 0 0;
    border-color: #fff;
    -webkit-transform: rotate(135deg);
        -ms-transform: rotate(135deg);
            transform: rotate(135deg);
    right: 15px;
    top: 50%;
    margin-top: -4px;
  }
  .pc .tab-dropdown.is-dropdown-active .tab-dropdown__switch:hover {
    color: #fff;
    background-color: #407be2;
  }
  .tab-dropdown.is-dropdown-active .tab-dropdown__list {
    display: none;
    z-index: 0;
    margin: 0;
    top: 0;
    left: 0;
    right: 0;
    position: absolute;
    overflow: hidden;
    padding: calc(var(--h-btn) + 10px) 5px 5px 5px;
    border-radius: 25px;
    background: #fff;
    -webkit-box-shadow: 0 8px 15px rgba(0, 0, 0, 0.5) !important;
            box-shadow: 0 8px 15px rgba(0, 0, 0, 0.5) !important;
  }
  .tab-dropdown.is-dropdown-active .tab-dropdown__list > li {
    display: block;
    min-width: auto;
    padding: 0;
    margin: 0;
  }
  .tab-dropdown.is-dropdown-active .tab-dropdown__list > li:before {
    display: none;
  }
  .tab-dropdown.is-dropdown-active .tab-dropdown__list > li > a {
    background: none;
    border: none;
    display: block;
    padding: 12px var(--gap);
    margin: 0;
    font-size: 1rem;
    color: #333;
    line-height: 1.5;
    text-align: left;
    border-radius: 0;
    min-width: auto;
    letter-spacing: 0.1em;
    border-top: 1px solid #ccc;
  }
  .tab-dropdown.is-dropdown-active .tab-dropdown__list > li > a:after {
    display: none;
  }
  .tab-dropdown.is-dropdown-active .tab-dropdown__list > li > a:active {
    color: #222;
    background: #f8f8f8;
  }
  .tab-dropdown.is-dropdown-active .tab-dropdown__list > li:first-child > a {
    border-top: none;
  }
  .tab-dropdown.is-dropdown-active .tab-dropdown__list > li.active > a {
    color: #568ae5;
  }
  .tab-dropdown.is-dropdown-active .tab-dropdown__list > li.active > a:active {
    color: #568ae5;
  }
  .tab-dropdown.is-dropdown-active.is-open .tab-dropdown__list {
    display: block;
  }
  .tab-dropdown.is-dropdown-active.is-open .tab-dropdown__list > li:not(.active) > a:hover {
    color: #222;
    background: #f8f8f8;
  }
  .tab-dropdown.is-dropdown-active.is-open .tab-dropdown__switch {
    margin: 5px;
    top: 5px;
    color: #fff;
    background-color: #568ae5;
  }
  .tab-dropdown.is-dropdown-active.is-open .tab-dropdown__switch::before, .tab-dropdown.is-dropdown-active.is-open .tab-dropdown__switch::after {
    -webkit-filter: brightness(0) invert(1);
            filter: brightness(0) invert(1);
  }
  .pc .tab-dropdown.is-dropdown-active.is-open .tab-dropdown__switch:hover {
    color: #fff;
    background-color: #407be2;
  }
  .tab-dropdown:not(.is-dropdown-active) .tab-dropdown__list {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .pc .tab-dropdown:not(.is-dropdown-active) .tab-dropdown__list > li:not(.active):hover > a {
    background-color: rgba(255, 255, 255, 0.15);
    color: #fff;
  }
  .pc .tab-dropdown:not(.is-dropdown-active) .tab-dropdown__list > li.active:hover > a {
    background-color: #fff;
    color: #111;
  }
}
@media (max-width: 767px) {
  .tab-dropdown ~ .p-mainwrap:first-of-type .p-subhead:not(.is-keep-show):first-of-type {
    display: none;
  }
  .tab-dropdown .container {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .tab-dropdown .tab-dropdown__switch {
    z-index: 5;
    cursor: pointer;
    display: block;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 var(--h-btn) 0 20px;
    margin: 0;
    border-radius: var(--h-btn);
    line-height: var(--h-btn);
    font-size: 1rem;
    color: #fff;
    top: 0;
    border: none;
    background-color: #568ae5;
    -webkit-transition: all 0.15s;
    transition: all 0.15s;
  }
  .tab-dropdown .tab-dropdown__switch::before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 24px;
    height: 24px;
    margin-right: 10px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23fff' class='w-6 h-6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M10.5 6h9.75M10.5 6a1.5 1.5 0 11-3 0m3 0a1.5 1.5 0 10-3 0M3.75 6H7.5m3 12h9.75m-9.75 0a1.5 1.5 0 01-3 0m3 0a1.5 1.5 0 00-3 0m-3.75 0H7.5m9-6h3.75m-3.75 0a1.5 1.5 0 01-3 0m3 0a1.5 1.5 0 00-3 0m-9.75 0h9.75' /%3E%3C/svg%3E");
  }
  .tab-dropdown .tab-dropdown__switch::after {
    content: "";
    display: block;
    position: absolute;
    width: 8px;
    height: 8px;
    border-style: solid;
    border-width: 2px 2px 0 0;
    border-color: #fff;
    -webkit-transform: rotate(135deg);
        -ms-transform: rotate(135deg);
            transform: rotate(135deg);
    right: 15px;
    top: 50%;
    margin-top: -4px;
  }
  .pc .tab-dropdown .tab-dropdown__switch:hover {
    color: #fff;
    background-color: #407be2;
  }
  .tab-dropdown .tab-dropdown__list {
    display: none;
    z-index: 0;
    margin: 0;
    top: 0;
    left: 0;
    right: 0;
    position: absolute;
    overflow: hidden;
    padding: calc(var(--h-btn) + 10px) 5px 5px 5px;
    border-radius: 25px;
    background: #fff;
    -webkit-box-shadow: 0 8px 15px rgba(0, 0, 0, 0.5) !important;
            box-shadow: 0 8px 15px rgba(0, 0, 0, 0.5) !important;
  }
  .tab-dropdown .tab-dropdown__list > li {
    display: block;
    min-width: auto;
    padding: 0;
    margin: 0;
  }
  .tab-dropdown .tab-dropdown__list > li:before {
    display: none;
  }
  .tab-dropdown .tab-dropdown__list > li > a {
    background: none;
    border: none;
    display: block;
    padding: 12px var(--gap);
    margin: 0;
    font-size: 1rem;
    color: #333;
    line-height: 1.5;
    text-align: left;
    border-radius: 0;
    min-width: auto;
    letter-spacing: 0.1em;
    border-top: 1px solid #ccc;
  }
  .tab-dropdown .tab-dropdown__list > li > a:after {
    display: none;
  }
  .tab-dropdown .tab-dropdown__list > li > a:active {
    color: #222;
    background: #f8f8f8;
  }
  .tab-dropdown .tab-dropdown__list > li:first-child > a {
    border-top: none;
  }
  .tab-dropdown .tab-dropdown__list > li.active > a {
    color: #568ae5;
  }
  .tab-dropdown .tab-dropdown__list > li.active > a:active {
    color: #568ae5;
  }
  .tab-dropdown.is-open .tab-dropdown__list {
    display: block;
  }
  .tab-dropdown.is-open .tab-dropdown__list > li:not(.active) > a:hover {
    color: #222;
    background: #f8f8f8;
  }
  .tab-dropdown.is-open .tab-dropdown__switch {
    margin: 5px;
    top: 5px;
    color: #fff;
    background-color: #568ae5;
  }
  .tab-dropdown.is-open .tab-dropdown__switch::before, .tab-dropdown.is-open .tab-dropdown__switch::after {
    -webkit-filter: brightness(0) invert(1);
            filter: brightness(0) invert(1);
  }
  .pc .tab-dropdown.is-open .tab-dropdown__switch:hover {
    color: #fff;
    background-color: #407be2;
  }
}
/**!
 * * 頁籤切換內容
 */
.gr-tab-head {
  position: relative;
  z-index: 2;
  padding: 0;
  margin: 0 auto var(--gap);
}
.gr-tab-head:not(.is-scroll-active) {
  text-align: center;
}

.gr-tab-link {
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 50px;
  color: #555;
  background-color: transparent;
  padding: 12px 20px 10px 20px;
  margin: 0 3px;
  line-height: 1.1;
  position: relative;
  overflow: hidden;
  font-size: var(--fz-brief);
  -webkit-transition: background-color 0.25s, color 0.25s;
  transition: background-color 0.25s, color 0.25s;
}
.gr-tab-link > span {
  position: relative;
}
.gr-tab-link:hover, .gr-tab-link:active {
  border-color: #568ae5;
  color: #0069df;
}
.gr-tab-link.active {
  border-color: #568ae5;
  background-color: #0069df;
  color: #fff;
}

.gr-tab-body {
  position: relative;
  z-index: 9;
}

.gr-tab-content {
  display: none;
}

.gr-tab-content.active {
  display: block;
}

/*
 * Table
 */
.theme-table {
  position: relative;
  overflow-y: hidden;
  overflow-x: auto;
  margin: 0 auto var(--gap);
  border: none;
}
.theme-table::after {
  content: "";
  width: 40px;
  height: 36px;
  background-position: 0 0;
  background-image: url(../images/touch_icon_mb.png);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  pointer-events: none;
  line-height: 1;
  z-index: 20;
  display: block;
  opacity: 0;
  top: 5px;
  right: 25px;
  -webkit-animation: ani_LR 0.8s both linear infinite;
          animation: ani_LR 0.8s both linear infinite;
  -webkit-transition: opacity 0.25s;
  transition: opacity 0.25s;
}
.theme-table.need-scroll {
  background-color: red;
}
.theme-table.need-scroll::after {
  opacity: 0.9;
}
.theme-table::-webkit-scrollbar {
  height: 8px;
}
.theme-table::-webkit-scrollbar-track {
  -webkit-box-shadow: none;
          box-shadow: none;
  border-radius: 0;
  margin: 0;
  background: #ddd;
}
.theme-table::-webkit-scrollbar-thumb {
  -webkit-box-shadow: none;
          box-shadow: none;
  border-radius: 0;
  background: #999;
}
.theme-table:hover::-webkit-scrollbar-thumb {
  background: #666;
}

@-webkit-keyframes ani_LR {
  0%, 100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  50% {
    -webkit-transform: translateX(35%);
            transform: translateX(35%);
  }
}

@keyframes ani_LR {
  0%, 100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  50% {
    -webkit-transform: translateX(35%);
            transform: translateX(35%);
  }
}
.table-post {
  --gap-table-padding: max(15px, 2vw);
}
.table-post table {
  width: 100%;
  max-width: 100%;
  line-height: 1.5;
}
.table-post table th {
  position: relative;
  padding: 12px var(--gap-table-padding);
  font-weight: var(--fw-middle);
  white-space: nowrap;
}
.table-post table td {
  position: relative;
  padding: 20px var(--gap-table-padding);
}
.table-post table th:nth-child(1), .table-post table td:nth-child(1) {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 38%;
          flex: 1 1 38%;
}
.table-post table th:nth-child(2), .table-post table td:nth-child(2) {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 60%;
          flex: 1 1 60%;
}
.table-post table th:nth-child(3), .table-post table td:nth-child(3) {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 140px;
          flex: 1 0 140px;
  text-align: center;
  white-space: nowrap;
}
.table-post table th:nth-child(4), .table-post table td:nth-child(4) {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 140px;
          flex: 1 0 140px;
  text-align: center;
  white-space: nowrap;
}
.table-post table tr {
  border-radius: var(--radius-page);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.table-post table thead tr {
  border-radius: 50px;
  color: #fff;
  -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
          box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
  background: #2f4f87, #1c3560;
  /* Vertical gradient */
  background: -webkit-gradient(linear, left top, left bottom, from(#2f4f87), to(#1c3560));
  background: linear-gradient(to bottom, #2f4f87, #1c3560);
}
.table-post table tbody tr {
  margin: 12px auto;
  border: 1px solid #ccc;
}
.table-post table tbody tr:hover {
  -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
          box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
}
.table-post table tbody td:nth-child(1) {
  text-indent: 1em;
}
.table-post table tbody td:nth-child(1)::after {
  content: "";
  display: block;
  border-radius: 10px;
  width: 9px;
  height: 9px;
  position: absolute;
  top: 26px;
  left: var(--gap-table-padding);
  background-color: #568ae5;
}

.post-state {
  font-style: normal;
  font-size: 0.875rem;
  padding: 3px 10px;
  color: #333;
  border: 1px solid #ccc;
  border-radius: 2px;
  display: inline-block;
  vertical-align: middle;
  background-color: #fff;
}
.post-state.red {
  color: #ff3e41;
  border-color: rgba(255, 62, 65, 0.4);
}

@media (max-width: 767px) {
  .table-post table tr {
    display: block;
  }
  .table-post table th, .table-post table td {
    display: block;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .table-post table thead {
    display: none;
  }
  .table-post table tbody tr {
    margin: 0 auto var(--gap) auto;
    border-color: #bbb;
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
            box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
  }
  .table-post table tbody th, .table-post table tbody td {
    border-top: 1px solid #ddd;
  }
  .table-post table tbody th::before, .table-post table tbody td::before {
    content: attr(data-tit) "：";
  }
  .table-post table tbody th:nth-child(1), .table-post table tbody td:nth-child(1) {
    border-top: none;
  }
  .table-post table tbody th:nth-child(1)::after, .table-post table tbody td:nth-child(1)::after {
    top: 18px;
    left: 18px;
    width: 6px;
    height: 6px;
  }
  .table-post table tbody th:nth-child(3), .table-post table tbody td:nth-child(3) {
    text-align: left;
  }
  .table-post table tbody th:nth-child(4), .table-post table tbody td:nth-child(4) {
    text-align: left;
  }
}
/*
 * Community Links / Share
 */
.g-community {
  position: relative;
}
.g-community .clink {
  display: inline-block;
  vertical-align: top;
  position: relative;
  width: 34px;
  height: 34px;
  margin-top: 5px;
  margin-right: 5px;
  color: inherit;
  font-size: 0;
}
.g-community .clink::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 32px;
  height: 32px;
  pointer-events: none;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background-image: url(../images/icon_community.png);
  background-repeat: no-repeat;
  background-size: auto 100%;
  -webkit-filter: brightness(0) invert(1) brightness(30%);
          filter: brightness(0) invert(1) brightness(30%);
}
.g-community .clink.fb::before {
  background-position: 0 0;
}
.g-community .clink.line::before {
  background-position: 33% 0;
}
.g-community .clink.linkedin::before {
  background-position: 66% 0;
}
.g-community .clink.copy::before {
  width: 25px;
  height: 25px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23333' class='w-6 h-6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M8.25 7.5V6.108c0-1.135.845-2.098 1.976-2.192.373-.03.748-.057 1.123-.08M15.75 18H18a2.25 2.25 0 002.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 00-1.123-.08M15.75 18.75v-1.875a3.375 3.375 0 00-3.375-3.375h-1.5a1.125 1.125 0 01-1.125-1.125v-1.5A3.375 3.375 0 006.375 7.5H5.25m11.9-3.664A2.251 2.251 0 0015 2.25h-1.5a2.251 2.251 0 00-2.15 1.586m5.8 0c.065.21.1.433.1.664v.75h-6V4.5c0-.231.035-.454.1-.664M6.75 7.5H4.875c-.621 0-1.125.504-1.125 1.125v12c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V16.5a9 9 0 00-9-9z' /%3E%3C/svg%3E") !important;
}

.pc .g-community .clink:hover::before {
  -webkit-filter: none;
          filter: none;
}

.g-community.p-share {
  position: relative;
  padding-left: 65px;
}
.g-community.p-share::before {
  content: "SHARE";
  font-weight: 600;
  white-space: nowrap;
  font-size: 0.875rem;
  width: 60px;
  color: #333;
  display: block;
  position: absolute;
  top: 8px;
  left: 0;
}

/*
 * GSAP - Parallax 
 * 常見架構
 外容器
    └ .js-parallax-area 填滿容器 
        └ .js-parallax-img 主要移動物件
 */
.js-parallax-area {
  pointer-events: none;
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  overflow: hidden;
}

.js-parallax-img {
  position: absolute;
  top: 0 !important;
  left: 0;
  width: 100%;
  max-width: none !important;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.js-parallax-img img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  max-width: none !important;
  height: 100% !important;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

/* --- PAGER --- */
.p-pagination {
  white-space: nowrap;
  text-align: center;
  position: relative;
  z-index: 5;
  margin: var(--h-btn) auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.p-pagination a {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  text-align: center;
  font-size: 0.9375rem;
  min-width: var(--h-pager);
  height: var(--h-pager);
  line-height: var(--h-pager);
  border-radius: 4px;
  color: #333;
  border: none;
  background-color: transparent;
  margin: 0 2px;
}
.p-pagination a:active {
  color: #000;
  background-color: #eee;
}
.p-pagination a.current {
  color: #fff;
  background-color: #568ae5;
}
.p-pagination a.current:active {
  color: #fff;
  background-color: #568ae5;
}
.p-pagination a.disabled {
  cursor: not-allowed;
  color: #aaa;
  background-color: transparent;
}
.p-pagination a.disabled:active {
  color: #aaa;
}
.p-pagination a.prev, .p-pagination a.next {
  font-size: 0;
  background-color: transparent;
  margin-left: 5px;
  margin-right: 5px;
  border: 1px solid #ccc;
  background-color: #fff;
  -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.05);
          box-shadow: 0 2px 3px rgba(0, 0, 0, 0.05);
}
.p-pagination a.prev::before, .p-pagination a.next::before {
  content: "";
  display: block;
  position: absolute;
  width: 8px;
  height: 8px;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
  margin-top: -4px;
  top: 50%;
  border-color: #666;
  border-style: solid;
}
.p-pagination a.prev.disabled::before, .p-pagination a.next.disabled::before {
  opacity: 0.2;
}
.p-pagination a.prev:active, .p-pagination a.next:active {
  border-color: #89abe5;
  background-color: #89abe5;
}
.p-pagination a.prev:active::before, .p-pagination a.next:active::before {
  border-color: #fff;
}
.p-pagination a.prev::before {
  margin-left: -3px;
  left: 50%;
  border-width: 0 0 1px 1px;
}
.p-pagination a.next::before {
  margin-right: -3px;
  right: 50%;
  border-width: 1px 1px 0 0;
}
.pc .p-pagination a:hover {
  color: #000;
  background-color: #eee;
}
.pc .p-pagination a.current:hover {
  color: #fff;
  background-color: #568ae5;
}
.pc .p-pagination a.prev:hover, .pc .p-pagination a.next:hover {
  border-color: #89abe5;
  background-color: #89abe5;
}
.pc .p-pagination a.prev:hover::before, .pc .p-pagination a.next:hover::before {
  border-color: #fff;
}
.pc .p-pagination a.prev.disabled, .pc .p-pagination a.next.disabled {
  background-color: #fff;
  border-color: #ccc;
}
.pc .p-pagination a.prev.disabled:hover::before, .pc .p-pagination a.next.disabled:hover::before {
  -webkit-filter: none;
          filter: none;
}

@media screen and (max-width: 767px) {
  .p-pagination .is-hide-mb {
    display: none;
  }
}
/*
* Copy String
*/
.js-copy {
  position: relative;
  cursor: copy;
  -webkit-transition: background-color 0.25s;
  transition: background-color 0.25s;
}

.pc .js-copy:hover {
  background-color: rgba(155, 114, 71, 0.5);
}

.copy-done {
  right: -5px;
  top: 0;
  z-index: 10;
  line-height: 1.1;
  position: absolute;
  font-size: 13px;
  color: #fff;
  padding: 5px;
  white-space: nowrap;
  display: inline-block;
  -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
          transform: translateX(100%);
  background-color: rgba(0, 0, 0, 0.6);
}

.g-community .copy-done {
  right: auto;
  left: 50%;
  -webkit-transform: translate(-50%, -100%);
      -ms-transform: translate(-50%, -100%);
          transform: translate(-50%, -100%);
}

/*
 * Img Hover Effect
 */
.js-imghover {
  overflow: hidden;
  position: relative;
}
.js-imghover img {
  z-index: 0;
  -webkit-transition: -webkit-transform 0.6s;
  transition: -webkit-transform 0.6s;
  transition: transform 0.6s;
  transition: transform 0.6s, -webkit-transform 0.6s;
}
.js-imghover .eff {
  position: absolute;
  z-index: 3;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  pointer-events: none;
}
.js-imghover .eff:after {
  content: "";
  display: block;
  position: absolute;
  z-index: 5;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  -webkit-transform: translateX(-110%) skewX(-10deg);
      -ms-transform: translateX(-110%) skewX(-10deg);
          transform: translateX(-110%) skewX(-10deg);
  background: rgba(255, 255, 255, 0.3);
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(50%, rgba(255, 255, 255, 0.1)), to(rgba(255, 255, 255, 0)));
  background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0) 100%);
  transform: translateX(-110%) skewX(-10deg);
}

.pc a.js-imghover:hover img, .pc a:hover .js-imghover img {
  -webkit-transform: scale(1.02);
      -ms-transform: scale(1.02);
          transform: scale(1.02);
}
.pc a.js-imghover:hover .eff, .pc a:hover .js-imghover .eff {
  opacity: 1;
}
.pc a.js-imghover:hover .eff:after, .pc a:hover .js-imghover .eff:after {
  -webkit-animation: ani_imgeffin 0.5s both ease;
          animation: ani_imgeffin 0.5s both ease;
  -webkit-transform: translateX(110%) skewX(-10deg);
      -ms-transform: translateX(110%) skewX(-10deg);
          transform: translateX(110%) skewX(-10deg);
}

@-webkit-keyframes ani_imgeffin {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-110%) skewX(-10deg);
            transform: translateX(-110%) skewX(-10deg);
  }
  10%, 90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(110%) skewX(-10deg);
            transform: translateX(110%) skewX(-10deg);
  }
}

@keyframes ani_imgeffin {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-110%) skewX(-10deg);
            transform: translateX(-110%) skewX(-10deg);
  }
  10%, 90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(110%) skewX(-10deg);
            transform: translateX(110%) skewX(-10deg);
  }
}
/* ============
 * 動畫
 ============ */
@-webkit-keyframes ani_fade_in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes ani_fade_in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes ani_fade_in_down {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes ani_fade_in_down {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@-webkit-keyframes ani_fade_in_up {
  0% {
    -webkit-transform: translateY(10%);
            transform: translateY(10%);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes ani_fade_in_up {
  0% {
    -webkit-transform: translateY(10%);
            transform: translateY(10%);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@-webkit-keyframes ani_fade_in_right {
  0% {
    -webkit-transform: translate(-30px, 0);
            transform: translate(-30px, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
    opacity: 1;
  }
}
@keyframes ani_fade_in_right {
  0% {
    -webkit-transform: translate(-30px, 0);
            transform: translate(-30px, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
    opacity: 1;
  }
}
@-webkit-keyframes ani_fade_in_left {
  0% {
    -webkit-transform: translate(35px, 0);
            transform: translate(35px, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
    opacity: 1;
  }
}
@keyframes ani_fade_in_left {
  0% {
    -webkit-transform: translate(35px, 0);
            transform: translate(35px, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
    opacity: 1;
  }
}
@-webkit-keyframes ani_fade_out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ani_fade_out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes ani_scale_in {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
@keyframes ani_scale_in {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
@-webkit-keyframes ani_clip_in_left {
  0%, 5% {
    -webkit-clip-path: polygon(80% 0%, 100% 0%, 100% 100%, 80% 100%);
            clip-path: polygon(80% 0%, 100% 0%, 100% 100%, 80% 100%);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
            clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
@keyframes ani_clip_in_left {
  0%, 5% {
    -webkit-clip-path: polygon(80% 0%, 100% 0%, 100% 100%, 80% 100%);
            clip-path: polygon(80% 0%, 100% 0%, 100% 100%, 80% 100%);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
            clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
@-webkit-keyframes ani_clip_in_right {
  0% {
    -webkit-clip-path: polygon(0% 0%, 20% 0%, 20% 100%, 0% 100%);
            clip-path: polygon(0% 0%, 20% 0%, 20% 100%, 0% 100%);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
            clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
@keyframes ani_clip_in_right {
  0% {
    -webkit-clip-path: polygon(0% 0%, 20% 0%, 20% 100%, 0% 100%);
            clip-path: polygon(0% 0%, 20% 0%, 20% 100%, 0% 100%);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
            clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
@-webkit-keyframes ani_clip_in_down {
  0% {
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 20%, 0% 20%);
            clip-path: polygon(0% 0%, 100% 0%, 100% 20%, 0% 20%);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
            clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
@keyframes ani_clip_in_down {
  0% {
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 20%, 0% 20%);
            clip-path: polygon(0% 0%, 100% 0%, 100% 20%, 0% 20%);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
            clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
@-webkit-keyframes ani_clip_in_up {
  0% {
    -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 80%, 0% 80%);
            clip-path: polygon(0% 100%, 100% 100%, 100% 80%, 0% 80%);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
            clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
@keyframes ani_clip_in_up {
  0% {
    -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 80%, 0% 80%);
            clip-path: polygon(0% 100%, 100% 100%, 100% 80%, 0% 80%);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
            clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
@-webkit-keyframes ani_center_in_up {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-50%) translateY(5px) scale(1.1);
            transform: translateX(-50%) translateY(5px) scale(1.1);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}
@keyframes ani_center_in_up {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-50%) translateY(5px) scale(1.1);
            transform: translateX(-50%) translateY(5px) scale(1.1);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}
@-webkit-keyframes ani_center_zoom_in {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%) scale(0);
            transform: translate(-50%, -50%) scale(0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
  }
}
@keyframes ani_center_zoom_in {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%) scale(0);
            transform: translate(-50%, -50%) scale(0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
  }
}
@-webkit-keyframes ani_spin {
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes ani_spin {
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@-webkit-keyframes ani_ring {
  0%, 50%, 100% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  25% {
    -webkit-transform: rotate(10deg);
            transform: rotate(10deg);
  }
  75% {
    -webkit-transform: rotate(-10deg);
            transform: rotate(-10deg);
  }
}
@keyframes ani_ring {
  0%, 50%, 100% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  25% {
    -webkit-transform: rotate(10deg);
            transform: rotate(10deg);
  }
  75% {
    -webkit-transform: rotate(-10deg);
            transform: rotate(-10deg);
  }
}
@-webkit-keyframes ani_infinte_news_aw {
  0%, 100% {
    -webkit-transform: skewX(45deg) translateX(0);
            transform: skewX(45deg) translateX(0);
  }
  50% {
    -webkit-transform: skewX(45deg) translateX(-5px);
            transform: skewX(45deg) translateX(-5px);
  }
}
@keyframes ani_infinte_news_aw {
  0%, 100% {
    -webkit-transform: skewX(45deg) translateX(0);
            transform: skewX(45deg) translateX(0);
  }
  50% {
    -webkit-transform: skewX(45deg) translateX(-5px);
            transform: skewX(45deg) translateX(-5px);
  }
}
@-webkit-keyframes ani_lang_in {
  0% {
    opacity: 0;
    -webkit-transform: translateY(5px) scale(1.1);
            transform: translateY(5px) scale(1.1);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes ani_lang_in {
  0% {
    opacity: 0;
    -webkit-transform: translateY(5px) scale(1.1);
            transform: translateY(5px) scale(1.1);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes ani_width_grow {
  0% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
  }
  100% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
  }
}
@keyframes ani_width_grow {
  0% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
  }
  100% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
  }
}
/* ============
 * 收據
 ============ */
.receipt-scroll {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}

.receipt-container {
  position: relative;
  width: 800px;
  margin: 20px auto 60px;
  padding-right: 40px;
  padding-left: 40px;
  line-height: 1.5;
  color: #000;
}
.receipt-container img {
  display: block;
  vertical-align: middle;
  margin: 0;
  padding: 0;
  border: none;
}
.receipt-container .sheet {
  font-size: 16px;
  font-weight: 600;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  position: absolute;
  right: 10px;
  top: 50%;
  white-space: nowrap;
  -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
          transform: translate(0, -50%);
}
.receipt-container .details {
  width: 100%;
  border-collapse: collapse;
}
.receipt-container .details:nth-of-type(1) {
  margin-bottom: 5px;
}
.receipt-container .details:nth-of-type(1) th, .receipt-container .details:nth-of-type(1) td {
  padding: 5px 10px;
}
.receipt-container .details:nth-of-type(1) td:nth-child(1) {
  width: 70px;
  padding: 0;
}
.receipt-container .details:nth-of-type(1) td:nth-child(1) img {
  width: 60px;
}
.receipt-container .details:nth-of-type(1) td:nth-child(2) {
  font-weight: 600;
  font-size: 22px;
  white-space: nowrap;
  text-align: left;
}
.receipt-container .details:nth-of-type(1) td:nth-child(3) {
  width: auto;
  max-width: 190px;
  font-weight: 600;
  font-size: 18px;
  white-space: nowrap;
  text-align: right;
}
.receipt-container .details:nth-of-type(2) th, .receipt-container .details:nth-of-type(2) td {
  font-size: 18px;
  font-weight: 500;
  padding: 5px 10px;
  text-align: left;
}
.receipt-container .details:nth-of-type(2) td:nth-child(2) {
  text-align: right;
  white-space: nowrap;
}
.receipt-container .details.foot {
  margin-top: 10px;
}
.receipt-container .details.foot th, .receipt-container .details.foot td {
  font-size: 16px;
  font-weight: 500;
  padding: 5px 10px;
  text-align: left;
}
.receipt-container .details.foot td:nth-child(2) {
  text-align: right;
}
.receipt-container .items {
  width: 100%;
  border-collapse: collapse;
  border: 2px solid #000;
}
.receipt-container .items th, .receipt-container .items td {
  padding: 5px 10px;
  border: 1px solid #000;
}
.receipt-container .items tr td:first-child {
  text-align: left;
}

/*
 * News - 列表
 */
.news-list {
  --gap-news: 30px;
}
.news-list .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0;
  padding: var(--gap-news) calc(var(--gap-news) * 0.5);
  border-bottom: 1px solid #ccc;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.news-list .date {
  width: 80px;
  border-radius: var(--radius);
  background-color: #00319f;
  color: #fff;
  padding: 10px;
  line-height: 1;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 80px;
          flex: 0 0 80px;
  text-align: center;
  font-size: 0.875rem;
}
.news-list .date i {
  font-style: normal;
  display: block;
}
.news-list .date .dd {
  display: block;
  font-weight: var(--fw-bold);
  font-size: 2rem;
  padding: 0.1em 0 0.2em 0;
  margin-bottom: 0.2em;
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}
.news-list .date .mm {
  padding: 0.2em 0;
}
.news-list .date + .text {
  padding-left: calc(var(--gap-news) * 2);
}
.news-list .text {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 1rem;
  color: #666;
}
.news-list .name {
  font-weight: var(--fw-middle);
  color: #000;
  font-size: var(--fz-listname-sm);
  transition: color 0.25s;
  display: -webkit-box;
  overflow: hidden;
  /**! autoprefixer: off;*/
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.news-list .brief {
  display: -webkit-box;
  overflow: hidden;
  /**! autoprefixer: off;*/
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  margin: 0;
  padding: 0;
}

.pc .news-list .item:hover .name {
  color: #0069df;
}

@media (max-width: 767px) {
  .news-list {
    --gap-news: 20px;
  }
  .news-list .item {
    padding: var(--gap-news) 0;
  }
  .news-list .date {
    width: 60px;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 60px;
            flex: 0 0 60px;
  }
  .news-list .date .dd {
    font-size: 1.5rem;
  }
  .news-list .date + .text {
    padding-left: var(--gap-news);
  }
  .news-list .text {
    font-size: 0.9375rem;
  }
}
/*
 * News - 詳細
 */
.article-head {
  text-align: center;
  padding-bottom: var(--gap);
}
.article-head .p-subhead {
  margin-bottom: var(--gap);
}

.exhibit-type {
  border-radius: 50px;
  width: min(45px, var(--h-input));
  height: min(45px, var(--h-input));
  border: 1px solid #568ae5;
  background-color: #fff;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.exhibit-type img {
  -o-object-fit: contain;
     object-fit: contain;
}

.article-info {
  text-align: center;
  font-size: 1rem;
  margin: 0 auto var(--gap);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.article-info .color-bg {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  background-color: #568ae5;
  border-radius: 50px;
  line-height: min(45px, var(--h-input));
  padding: 0 15px;
  color: #fff;
  list-style: none;
  display: inline-flex;
}
.article-info .color-bg i {
  font-style: normal;
  margin: 0 0.5em;
}
.article-info .exhibit-type {
  margin-right: 0.5em;
}

@media (max-width: 579px) {
  .exhibit-type {
    width: 35px;
    height: 35px;
  }
  .article-info {
    font-size: 0.875rem;
  }
  .article-info .color-bg {
    line-height: 35px;
  }
}
.editor-wrap + .iframe-wrap {
  margin-top: calc(var(--gap) * 2);
}

.iframe-wrap {
  margin: 0 auto;
}
.iframe-wrap object {
  max-height: calc(90vh - var(--h-header) - var(--h-topbar)) !important;
}

.infolist {
  display: inline-block;
  vertical-align: top;
  font-style: normal;
  list-style: none;
  margin: 15px 0;
  padding: 0;
  font-size: 0.9375rem;
  line-height: 1.5;
}
.infolist > li {
  text-align: left;
  display: block;
  position: relative;
  color: #333;
  padding: 0.25em 0 0.25em 90px;
  margin: 0.5em 0;
}
.infolist > li a {
  color: inherit;
}
.infolist > li a:hover {
  color: #222;
}
.infolist > li > ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.infolist > li > ul > li {
  display: block;
  position: relative;
  padding: 0 0 0 1em;
  margin: 0 0 0.25em 0;
}
.infolist > li > ul > li::before {
  content: "";
  display: block;
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 5px;
  background-color: #666;
  left: 0.1em;
  top: 0.6em;
}
.infolist .tit {
  position: absolute;
  left: 0;
  top: 0;
  display: inline-block;
  vertical-align: top;
  white-space: nowrap;
  line-height: 30px;
  width: 75px;
  padding: 0 10px;
  font-size: 0.875rem;
  text-align: center;
  border-radius: 50px;
  color: #fff;
}
.infolist .tit.color1 {
  background-color: #568ae5;
}
.infolist .tit.color2 {
  background-color: #c6a582;
}
.infolist .tit.color3 {
  background-color: #a87584;
}

@media (max-width: 767px) {
  .infolist {
    font-size: 0.875rem;
  }
  .infolist > li {
    padding: 0.25em 0 0.25em 75px;
  }
  .infolist .tit {
    width: 65px;
    line-height: 24px;
  }
}
/*
 * 籌備會組織
 */
#team .p-subhead {
  margin-bottom: 20px;
}

.team-list {
  --num-team: 4;
  list-style: none;
  padding: 0;
  margin: var(--gap) auto calc(var(--gap-vertical) * 0.8) auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  background-color: #fff;
}
.team-list .item {
  width: calc(100% / var(--num-team) + 1px);
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(100% / var(--num-team) + 1px);
          flex: 0 0 calc(100% / var(--num-team) + 1px);
  text-align: center;
  display: inline-block;
  margin: -1px -1px 0 0;
  border: 1px solid #e8e8e8;
  -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
          box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  -webkit-transition: -webkit-box-shadow 0.3s;
  transition: -webkit-box-shadow 0.3s;
  transition: box-shadow 0.3s;
  transition: box-shadow 0.3s, -webkit-box-shadow 0.3s;
  padding: var(--h-btn) var(--h-pager) var(--h-pager);
}
.pc .team-list .item:hover {
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
          box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
}

.team-list .img {
  text-align: center;
  border-radius: var(--radius-page);
  margin: 0 auto 20px;
  overflow: hidden;
  max-width: 150px;
  aspect-ratio: 1;
}
.team-list .img img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.team-list .name {
  font-size: 1rem;
  color: #555;
}
.team-list .worktitle {
  color: #000;
  display: block;
  font-size: 1.0625rem;
  font-weight: var(--fw-middle);
  margin-bottom: 0.5em;
}

@media (max-width: 1199px) {
  .team-list {
    --num-team: 3;
  }
}
@media (max-width: 839px) {
  .team-list {
    --num-team: 2;
  }
  .team-list .item {
    padding: var(--gap);
  }
}
@media (max-width: 579px) {
  .team-list {
    --num-team: 1;
  }
  .team-list .item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: left;
  }
  .team-list .img {
    margin: 0;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 max(100px, 30%);
            flex: 0 0 max(100px, 30%);
  }
  .team-list .img + .name {
    padding-left: var(--gap);
  }
  .team-list .name {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    text-align: left;
  }
}
/*
 * 籌備會組織
 */
.dates-list {
  --num-dates: 3;
  --gap-dates: max(35px, 2rem);
  padding: 0;
  margin: 0 calc(var(--gap-item) * -1);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.dates-list .item {
  width: calc(100% / var(--num-dates));
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(100% / var(--num-dates));
          flex: 0 0 calc(100% / var(--num-dates));
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin: 0 0 calc(var(--gap-item) * 3) 0;
  padding: 0 var(--gap-item);
}
.dates-list .item a {
  display: block;
  position: relative;
  background-color: #fff;
  border-radius: var(--radius-page);
  padding: var(--gap-dates) calc(var(--gap-dates) * 1.5);
  padding-bottom: calc(var(--gap-dates) * 2.5);
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
          box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  width: 100%;
}
.dates-list .item a::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  border-radius: var(--radius-page);
  border: 3px solid #568ae5;
  -webkit-transition: opacity 0.25s;
  transition: opacity 0.25s;
  opacity: 0;
}
.dates-list .infolist {
  width: 100%;
  border-top: 1px solid #888;
  margin: 20px 0 0 0;
  padding: 20px 0 calc(var(--gap-vertical) * 0.5);
}
.dates-list .name {
  font-size: var(--fz-listname-sm);
  font-weight: var(--fw-bold);
  color: #000;
  line-height: 1.6;
  margin: 10px 0;
  padding: 0;
  min-height: 3.2em;
  display: -webkit-box;
  overflow: hidden;
  /**! autoprefixer: off;*/
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
}
.dates-list .deco {
  pointer-events: none;
  top: calc(var(--gap-dates) * 0.5);
  left: calc(var(--gap-dates) * 0.5);
  position: absolute;
  white-space: nowrap;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  z-index: 10;
}
.dates-list .deco::before, .dates-list .deco::after {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 9px;
  height: 9px;
  border-radius: 15px;
  background-color: #568ae5;
}
.dates-list .deco::before {
  background-color: #00319f;
}
.dates-list .more {
  position: absolute;
  color: #333;
  line-height: 1.2;
  font-size: 0.75rem;
  font-weight: var(--fw-bold);
  bottom: calc(var(--gap-dates) * 1.2);
  left: calc(var(--gap-dates) * 1.5);
  width: calc(100% - var(--gap-dates) * 3);
}
.dates-list .more > div {
  display: inline-block;
  padding-bottom: 5px;
  border-bottom: 1px solid #333;
}
.dates-list .more::after {
  content: "";
  display: block;
  position: absolute;
  right: calc(var(--gap-dates) * 0.5);
  bottom: calc(var(--gap-dates) * 0.5);
  width: 22px;
  height: 8px;
  border-style: solid;
  border-width: 0 2px 2px 0;
  border-color: #000;
  -webkit-transform: skewX(45deg);
      -ms-transform: skewX(45deg);
          transform: skewX(45deg);
}

.pc .dates-list .item a:hover::before {
  opacity: 1;
}
.pc .dates-list .item a:hover .more {
  color: #568ae5;
}
.pc .dates-list .item a:hover .more > div {
  border-color: #568ae5;
}
.pc .dates-list .item a:hover .more::after {
  -webkit-animation: ani_infinte_news_aw 0.5s both infinite;
          animation: ani_infinte_news_aw 0.5s both infinite;
  -webkit-filter: invert(58%) sepia(71%) saturate(3256%) hue-rotate(197deg) brightness(95%) contrast(89%);
          filter: invert(58%) sepia(71%) saturate(3256%) hue-rotate(197deg) brightness(95%) contrast(89%);
}

@media (max-width: 991px) {
  .dates-list {
    --num-dates: 2;
    --gap-dates: max(20px, 2vw);
  }
  .dates-list .item > a {
    padding-top: calc(var(--gap-dates) * 1.5);
  }
  .dates-list .deco {
    left: calc(var(--gap-dates) * 1.5);
    top: var(--gap-dates);
  }
  .dates-list .name {
    height: auto !important;
    min-height: auto;
  }
  .dates-list .infolist {
    margin-top: 10px;
    padding-top: 10px;
  }
}
@media (max-width: 579px) {
  .dates-list {
    --num-dates: 1;
  }
  .dates-list .infolist {
    padding-bottom: 20px;
  }
}
/*
 * 大會相關活動
 */
.exhibitor-list {
  --num-exhibitor: 3;
  --gap-exhibitor: max(25px, 1.5vw);
  padding: 0;
  margin: 0 calc(var(--gap-item) * -1);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.exhibitor-list .item {
  width: calc(100% / var(--num-exhibitor) - var(--gap-item) * 2);
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(100% / var(--num-exhibitor) - var(--gap-item) * 2);
          flex: 0 0 calc(100% / var(--num-exhibitor) - var(--gap-item) * 2);
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  margin: 0 calc(var(--gap-item) * 2) calc(var(--gap-item) * 3) 0;
  padding: var(--gap-exhibitor);
  background-color: #fff;
  border-radius: var(--radius-page);
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
          box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  width: 100%;
}
.exhibitor-list .img {
  width: 50%;
  -webkit-box-flex: 0;
      -ms-flex: 0 1 200px;
          flex: 0 1 200px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.exhibitor-list .img + .text {
  margin-left: var(--gap-exhibitor);
  padding-left: var(--gap-exhibitor);
  border-left: 1px solid #ccc;
}
.exhibitor-list .text {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.exhibitor-list .info {
  margin: 20px 0 0 0;
  padding: 0;
  justify-self: flex-end;
}
.exhibitor-list .info li {
  display: block;
  color: #333;
  font-size: 0.9375rem;
  padding: 0.25em 0;
}
.exhibitor-list .info .tit {
  position: relative;
  display: inline-block;
  vertical-align: top;
  white-space: nowrap;
  padding: 0 0 0 12px;
  margin-right: 5px;
  color: #00319f;
}
.exhibitor-list .info .tit::before {
  content: "";
  display: block;
  width: 5px;
  height: 5px;
  border-radius: 15px;
  background-color: #00319f;
  position: absolute;
  left: 0;
  top: 12px;
}
.exhibitor-list .name {
  font-size: 1rem;
  font-weight: var(--fw-bold);
  color: #000;
  line-height: 1.6;
  margin: 10px 0;
  padding: 0;
}

@media (max-width: 1199px) {
  .exhibitor-list {
    --num-exhibitor: 2;
  }
  .exhibitor-list .item {
    margin-bottom: calc(var(--gap-item) * 2);
  }
  .exhibitor-list .img {
    width: 50%;
    -webkit-box-flex: 0;
        -ms-flex: 0 1 150px;
            flex: 0 1 150px;
  }
}
@media (max-width: 991px) {
  .exhibitor-list {
    --num-exhibitor: 1;
    margin: var(--gap) auto;
  }
  .exhibitor-list .item {
    margin: 0 auto var(--gap);
  }
}
@media (max-width: 579px) {
  .exhibitor-list {
    --gap-exhibitor: 15px;
  }
  .exhibitor-list .item {
    display: block;
  }
  .exhibitor-list .img {
    width: 100%;
    margin-bottom: 10px;
  }
  .exhibitor-list .img img {
    max-width: 150px;
  }
  .exhibitor-list .img + .text {
    margin-left: 0;
    padding-left: 0;
    border-left: none;
  }
  .exhibitor-list .text {
    width: 100%;
    text-align: center;
    display: block;
  }
  .exhibitor-list .name {
    margin: 0 auto 10px;
  }
  .exhibitor-list .info {
    margin-top: 0;
  }
  .exhibitor-list .info > li {
    padding: 0;
  }
}
/*
 * 理事長/會長的話
 */
#chairman {
  --radius-lg: max(100px, 4vw);
  --radius-sm: max(50px, 2.5vw);
}
#chairman .p-innerwrap {
  border-radius: var(--radius-lg) 0 var(--radius-lg) 0;
  padding: calc(var(--gap-vertical) * 0.8);
}

.talk-item {
  padding: calc(var(--gap-vertical) * 0.8) 0;
  border-top: 2px solid #eee;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
.talk-item:first-of-type {
  border-top: none;
  padding-top: 0;
}
.talk-item .left {
  width: max(22%, 150px);
  -webkit-box-flex: 1;
      -ms-flex: 1 0 max(22%, 150px);
          flex: 1 0 max(22%, 150px);
}
.talk-item .left + .right {
  padding-left: max(var(--gap), 3.125vw);
}
.talk-item .right {
  font-size: var(--fz-input);
  color: #333;
}
.talk-item .right p {
  margin: 15px 0;
}
.talk-item .sign {
  font-style: italic;
}
.talk-item .text-gold {
  color: #c6a582;
}
.talk-item .list-roman {
  list-style-type: upper-roman;
  margin: 0;
  padding: 0;
}
.talk-item .list-roman > li {
  display: block;
  position: relative;
  padding: 0 0 5px 0.5em;
  margin-left: 1em;
  display: list-item;
  list-style-position: outside;
}
.talk-item .img-wrap {
  position: sticky;
  top: calc(var(--h-header) + var(--h-topbar));
}
.talk-item .img {
  position: relative;
  aspect-ratio: 280/320;
  line-height: 0;
}
.talk-item .img img {
  border-radius: var(--radius-sm) 0 var(--radius-sm) 0;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  max-width: none;
  width: 100% !important;
  height: 100% !important;
  line-height: 0;
}
.talk-item .img::before, .talk-item .img::after {
  content: "";
  display: inline-block;
  position: absolute;
  pointer-events: none;
  bottom: 0;
  left: 0;
}
.talk-item .img::before {
  background-color: #00319f;
  width: 17px;
  height: 17px;
  margin: 0 0 -22px 0;
}
.talk-item .img::after {
  background-color: #568ae5;
  width: 23px;
  height: 23px;
  margin: 0 0 -15px 17px;
}
.talk-item .name {
  font-size: 1rem;
  line-height: 1.5;
  margin: 25px auto 0;
  color: #000;
  text-align: center;
  display: block;
}

@media (max-width: 767px) {
  #chairman {
    --radius-lg: 0;
    --radius-sm: max(30px, 2vw);
  }
}
@media (max-width: 639px) {
  .talk-item {
    display: block;
  }
  .talk-item .left {
    margin: 0 auto;
  }
  .talk-item .left + .right {
    width: 100%;
    padding-left: 0;
  }
  .talk-item .img-wrap {
    position: relative;
    top: auto;
  }
  .talk-item .img::before, .talk-item .img::after {
    -webkit-transform: scale(0.8) translateX(-15px);
        -ms-transform: scale(0.8) translateX(-15px);
            transform: scale(0.8) translateX(-15px);
  }
}
/*
 * 會員/報名
 */
#member .p-subhead-wrap {
  margin-bottom: var(--gap);
}
#member .p-subhead-wrap p {
  color: #666;
}
#member .p-subhead {
  margin: 0 auto 10px auto;
  padding: 0;
}
#member .p-subhead::before {
  display: none;
}

#register .m-signin-wrap .msg-nodata,
#member .m-signin-wrap .msg-nodata {
  padding-top: 0;
}

@media (max-width: 767px) {
  #register .m-signin-wrap {
    padding-top: var(--gap);
  }
}
@media (min-width: 992px) {
  .m-half {
    padding-right: 0;
  }
  .m-half > * {
    border-left: 1px solid #ddd;
  }
  .m-half > *:first-child {
    border-left: none;
    padding-right: 5vw;
  }
}
@media (max-width: 991px) {
  .m-half > * {
    border-top: 1px solid #ddd;
  }
  .m-half > *:first-child {
    border-top: none;
  }
  .m-half .msg-nodata {
    margin-top: 45px;
  }
}
.member-before,
.member-after {
  position: relative;
  overflow: hidden;
}
.member-before.p-mainwrap,
.member-after.p-mainwrap {
  background-color: #fff;
  background-image: none;
}
.member-before .brush1,
.member-after .brush1 {
  width: max(150px, 23vw);
  aspect-ratio: 440/340;
  position: absolute;
  top: max(5vh, 40px);
  right: 0;
  -webkit-transform: translateX(40%);
      -ms-transform: translateX(40%);
          transform: translateX(40%);
  background: url(../images/brush1.png) no-repeat 0 0/contain;
}
.member-before .brush2,
.member-after .brush2 {
  width: max(100px, 17vw);
  aspect-ratio: 332/257;
  position: absolute;
  top: max(300px, 62vh);
  left: 0;
  -webkit-transform: translateX(-45%);
      -ms-transform: translateX(-45%);
          transform: translateX(-45%);
  background: url(../images/brush2.png) no-repeat 0 0/contain;
}
.member-before .p-breadcrumb,
.member-after .p-breadcrumb {
  position: absolute;
  max-width: var(--w-container);
  width: 100%;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
}
.member-before .p-breadcrumb ul,
.member-after .p-breadcrumb ul {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.member-before .p-breadcrumb ul li,
.member-after .p-breadcrumb ul li {
  color: #666;
}
.member-before .p-breadcrumb ul li:before,
.member-after .p-breadcrumb ul li:before {
  border-color: #888;
}
.member-before .p-breadcrumb ul li:first-child,
.member-after .p-breadcrumb ul li:first-child {
  padding-left: 0;
}
.member-before .p-breadcrumb ul li:first-child a,
.member-after .p-breadcrumb ul li:first-child a {
  -webkit-filter: brightness(0) invert(1) brightness(50%);
          filter: brightness(0) invert(1) brightness(50%);
}
.member-before .p-breadcrumb a,
.member-after .p-breadcrumb a {
  color: #555;
}

.member-before {
  padding-top: var(--gap-vertical) !important;
}

.member-after {
  padding-top: 0 !important;
}
.member-after .m-signin-wrap {
  margin-top: calc(var(--gap) * 2.5);
}

@media (max-width: 767px) {
  .member-before,
  .member-after {
    padding-top: 0 !important;
  }
  .member-after .m-signin-wrap {
    margin-top: 0;
  }
}
.m-signin-wrap {
  position: relative;
  max-width: 780px;
  margin: 0 auto;
  width: 100%;
  background: #eef5fa url(../images/bg_member_form.jpg) repeat-x center top;
  padding: calc(var(--gap-vertical) * 0.8) calc(var(--gap-vertical) * 0.9);
  border-radius: var(--radius);
}
.m-signin-wrap.lg {
  max-width: none;
}

@media (max-width: 767px) {
  .m-signin-wrap {
    width: auto;
    padding: calc(var(--gap-vertical) * 1.5) var(--gap) var(--gap-vertical) var(--gap);
    margin-left: calc(var(--gap) * -1);
    margin-right: calc(var(--gap) * -1);
    border-radius: 0;
  }
}
.m-func-wrap {
  position: relative;
  padding: calc(var(--gap-vertical) * 0.8) 0 var(--gap);
  margin-bottom: var(--gap);
  background-color: #f0f6fb;
}

@media (max-width: 767px) {
  .m-func-wrap {
    padding-top: calc(10px + var(--gap-vertical));
    padding-bottom: 0;
  }
}
.m-func-header {
  position: relative;
  z-index: 10;
}
.m-func-wrap .m-func-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.m-signin-wrap .m-func-header {
  padding-top: calc(var(--gap) + var(--h-pager));
}

@media (max-width: 767px) {
  .m-signin-wrap .m-func-header {
    line-height: 1.8;
  }
}
.m-func-photo {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 max(4.6vw, 70px);
          flex: 0 0 max(4.6vw, 70px);
  overflow: hidden;
  width: max(4.6vw, 70px);
  aspect-ratio: 1;
  border-radius: 50%;
  margin-right: var(--gap-item);
  border: 3px solid #e1ecf4;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.m-func-photo img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.m-signin-wrap .m-func-photo {
  display: none;
}

@media (max-width: 579px) {
  .m-func-photo {
    display: none;
  }
}
.m-func-subhead {
  display: block;
  color: #00319f;
  text-align: center;
  font-size: 1rem;
  margin: 0 auto calc(var(--gap) * 2);
  padding: 0;
  color: #555;
  font-weight: var(--fw-middle);
}
.m-func-subhead .txt1 {
  display: block;
  font-size: var(--fz-listname-lg);
  font-weight: var(--fw-bold);
  margin-bottom: 0.5em;
  color: #00319f;
  line-height: 1.2;
}
.m-func-subhead .txt2 {
  display: block;
  font-weight: var(--fw-bold);
  color: #00319f;
  line-height: 1.2;
}
.m-func-subhead p {
  margin-bottom: 0.3em;
}
.m-signin-wrap .m-func-subhead {
  margin-bottom: 0;
}
.m-signin-wrap .m-func-subhead + form {
  margin-top: calc(var(--gap) * 2);
}

.m-func-wrap .m-func-subhead {
  text-align: left;
  margin: 0;
}

.m-func-notice {
  font-style: normal;
  display: inline-block;
  margin: 20px auto 10px;
  position: relative;
  color: #ff3e41;
}
.m-func-notice::before {
  content: "";
  display: inline-block;
  vertical-align: top;
  margin-right: 0.25em;
  margin-top: 0.3em;
  width: 22px;
  height: 22px;
  background: url(../images/icon_bell.svg) no-repeat 0 0/contain;
}
.m-signin-wrap .m-func-notice {
  margin-bottom: var(--gap);
}
.m-signin-wrap .m-func-notice::before {
  -webkit-filter: invert(32%) sepia(49%) saturate(4041%) hue-rotate(339deg) brightness(104%) contrast(101%);
          filter: invert(32%) sepia(49%) saturate(4041%) hue-rotate(339deg) brightness(104%) contrast(101%);
  -webkit-animation: ani_ring 0.5s both infinite;
          animation: ani_ring 0.5s both infinite;
}

.m-func-wrap .m-func-notice {
  display: inline-block;
  position: absolute;
  width: var(--h-pager);
  height: var(--h-pager);
  right: calc(var(--gap) + var(--h-pager));
  bottom: 7px;
  margin: 0;
  cursor: pointer;
}
.m-func-wrap .m-func-notice::before {
  width: 24px;
  height: 24px;
  margin: -12px 0 0 -12px;
  position: absolute;
  top: 50%;
  left: 50%;
}
.m-func-wrap .m-func-notice.is-read-yet::after {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50px;
  background-color: #ff3e41;
  position: absolute;
  top: 7px;
  right: 6px;
  z-index: 10;
  -webkit-box-shadow: 0 0 0 2px #f0f6fb;
          box-shadow: 0 0 0 2px #f0f6fb;
}
.m-func-wrap .m-func-notice:hover::before {
  -webkit-filter: invert(73%) sepia(93%) saturate(6865%) hue-rotate(336deg) brightness(110%) contrast(116%);
          filter: invert(73%) sepia(93%) saturate(6865%) hue-rotate(336deg) brightness(110%) contrast(116%);
}
.m-func-wrap .m-func-notice.is-open .m-func-notice__popup {
  display: block !important;
  -webkit-animation: ani_fade_in 0.5s both;
          animation: ani_fade_in 0.5s both;
}
.m-func-wrap .m-func-notice.is-open::before {
  -webkit-filter: invert(73%) sepia(93%) saturate(6865%) hue-rotate(336deg) brightness(110%) contrast(116%);
          filter: invert(73%) sepia(93%) saturate(6865%) hue-rotate(336deg) brightness(110%) contrast(116%);
}

.pc .m-func-wrap .m-func-notice:hover .m-func-notice__popup {
  display: block !important;
  -webkit-animation: ani_fade_in 0.5s both;
          animation: ani_fade_in 0.5s both;
}

@media (max-width: 579px) {
  .m-signin-wrap .m-func-notice {
    font-size: 0.875rem;
    margin: 10px auto 15px;
  }
}
.m-func-notice__popup {
  z-index: 50;
}
.m-func-notice__popup a {
  display: inline;
  color: #ff3e41;
  text-decoration: underline;
}
.m-func-notice__popup a:hover {
  color: #ff0b0f;
  text-decoration: none;
}
.m-func-notice__popup .list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: inline-block;
  vertical-align: top;
}
.m-func-notice__popup .list li {
  display: block;
}
.m-signin-wrap .m-func-notice__popup {
  display: inline-block;
  vertical-align: top;
}
.m-signin-wrap .m-func-notice__popup .tit {
  display: inline;
}
.m-signin-wrap .m-func-notice__popup .tit::after {
  content: "：";
}

.m-func-wrap .m-func-notice__popup {
  display: none;
  border-radius: var(--radius);
  position: absolute;
  background-color: #ff3e41;
  color: #fff;
  min-width: 180px;
  font-size: 0.875rem;
  line-height: 1.6;
  padding: 12px;
  top: calc(var(--h-pager) + 10px);
  left: 50%;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15);
          box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15);
}
.m-func-wrap .m-func-notice__popup::after {
  content: "";
  height: 15px;
  display: block;
  position: absolute;
  top: -14px;
  left: 0;
  width: 100%;
}
.m-func-wrap .m-func-notice__popup::before {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 6px 6px 6px;
  border-color: transparent transparent #ff3e41 transparent;
  top: -5px;
  margin-left: -6px;
}
.m-func-wrap .m-func-notice__popup a {
  color: #fff;
}
.m-func-wrap .m-func-notice__popup a:hover {
  color: #f3dbdb;
}
.m-func-wrap .m-func-notice__popup .tit {
  display: block;
  text-align: center;
  padding: 3px 0 8px 0;
  margin: 0 0 10px 0;
  line-height: 1.5;
  font-size: 1rem;
  white-space: nowrap;
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}

.m-func-signout {
  display: none;
}
.m-func-signout::after {
  content: "";
  display: inline-block;
  vertical-align: top;
  margin-left: 0.5em;
  margin-top: 0.2em;
  width: 15px;
  height: 15px;
  background: url(../images/icon_signout.svg) no-repeat 0 0/contain;
}
.m-func-signout:hover::after {
  -webkit-filter: invert(73%) sepia(93%) saturate(6865%) hue-rotate(336deg) brightness(110%) contrast(116%);
          filter: invert(73%) sepia(93%) saturate(6865%) hue-rotate(336deg) brightness(110%) contrast(116%);
}
.m-signin-wrap .m-func-signout {
  margin-top: var(--gap);
}

.m-func-wrap .m-func-signout {
  display: inline-block;
  position: absolute;
  width: var(--h-pager);
  height: var(--h-pager);
  right: 0;
  bottom: 7px;
}
.m-func-wrap .m-func-signout::after {
  width: 20px;
  height: 20px;
  margin: -10px 0 0 -10px;
  position: absolute;
  top: 50%;
  left: 50%;
}

.link-underline {
  line-height: 1.5;
  font-size: var(--fz-input);
  color: #555;
  text-decoration: underline;
}
.link-underline svg {
  width: var(--fz-brief);
  display: inline-block;
  vertical-align: top;
  margin: 0.3em 0.1em 0 0.1em;
}
.link-underline:hover {
  color: #ff3e41;
  text-decoration: none;
}

.m-func-level {
  margin-left: -2px;
}
.m-signin-wrap .m-func-level {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
}

.member-level {
  font-style: normal;
  display: inline-block;
  border: none;
  color: #fff;
  background-color: #555;
  font-size: 0.875rem;
  padding: 1px 20px;
  margin: 0 3px;
  border-radius: 50px;
  line-height: var(--h-pager);
  position: relative;
  overflow: hidden;
}
.member-level.lv1 {
  background-color: #00319f;
}
.member-level.lv2 {
  background-color: #568ae5;
}
.member-level.lv3 {
  background-color: #248ae5;
}
.member-level.lv4 {
  background-color: #56b2e5;
}
.member-level.lv5 {
  background-color: #568abd;
}
.member-level.lv5 {
  background-color: #568a95;
}
.m-func-wrap .member-level {
  font-size: 0.75rem;
  line-height: 25px;
}

.m-func-nav {
  --num-func: 6;
  --gap-item: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  list-style: none;
  padding: 0;
  z-index: 2;
  margin: 0 calc(var(--gap-item) * -1);
}
.m-func-nav > li {
  width: calc(100% / var(--num-func));
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(100% / var(--num-func));
          flex: 0 0 calc(100% / var(--num-func));
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin: 0 0 calc(var(--gap-item) * 2) 0;
  padding: 0 var(--gap-item);
}
.m-func-nav > li.active > a {
  color: #fff;
  background-color: #c6a582;
}
.m-func-nav > li.active > a .img img {
  -webkit-filter: brightness(0) invert(73%) sepia(8%) saturate(1340%) hue-rotate(350deg) brightness(95%) contrast(82%);
          filter: brightness(0) invert(73%) sepia(8%) saturate(1340%) hue-rotate(350deg) brightness(95%) contrast(82%);
}
.m-func-nav > li.active > a .img::before {
  background-color: #fff;
}
.m-func-nav > li > a {
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #333;
  font-size: var(--fz-input);
  position: relative;
  background-color: #fff;
  border-radius: var(--radius-page);
  padding: 40px 10px 25px;
  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
          box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
  width: 100%;
  -webkit-transition: background-color 0.15s;
  transition: background-color 0.15s;
}
.m-func-nav > li .text {
  position: relative;
  z-index: 3;
  white-space: nowrap;
}
.m-func-nav > li .img {
  z-index: 3;
  width: calc(var(--h-btn) * 2);
  height: calc(var(--h-btn) * 2);
  margin: 0 auto 10px;
  padding: min(10%, 15px);
  -webkit-transition: -webkit-transform 0.2s, -webkit-filter 0.2s;
  transition: -webkit-transform 0.2s, -webkit-filter 0.2s;
  transition: transform 0.2s, filter 0.2s;
  transition: transform 0.2s, filter 0.2s, -webkit-transform 0.2s, -webkit-filter 0.2s;
  position: relative;
}
.m-func-nav > li .img img {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
  position: relative;
  z-index: 15;
}
.m-func-nav > li .img::before {
  content: "";
  display: block;
  position: absolute;
  background-color: #c6a582;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  border-radius: 50%;
}
.m-func-nav > li:not(.active) a:hover {
  color: #fff;
  background-color: #c6a582;
}
.m-func-nav > li:not(.active) a:hover .img img {
  -webkit-filter: brightness(0) invert(73%) sepia(8%) saturate(1340%) hue-rotate(350deg) brightness(95%) contrast(82%);
          filter: brightness(0) invert(73%) sepia(8%) saturate(1340%) hue-rotate(350deg) brightness(95%) contrast(82%);
}
.m-func-nav > li:not(.active) a:hover .img::before {
  background-color: #fff;
}
.m-signin-wrap .m-func-nav {
  margin-top: var(--gap);
  margin-bottom: var(--gap);
}

.m-func-wrap .m-func-nav {
  --num-func: 6;
  padding: 8px var(--gap) 8px;
  margin: var(--gap) calc(var(--gap) * -1) 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  overflow-x: overlay;
}
.m-func-wrap .m-func-nav::-webkit-scrollbar {
  height: 5px;
}
.m-func-wrap .m-func-nav::-webkit-scrollbar-track {
  -webkit-box-shadow: none;
          box-shadow: none;
  border-radius: 0;
  margin: 0;
  background: #ddd;
}
.m-func-wrap .m-func-nav::-webkit-scrollbar-thumb {
  -webkit-box-shadow: none;
          box-shadow: none;
  border-radius: 0;
  background: #999;
}
.m-func-wrap .m-func-nav:hover::-webkit-scrollbar-thumb {
  background: #666;
}
.m-func-wrap .m-func-nav.is-scroll-active {
  position: relative;
  background-color: rgba(0, 0, 0, 0.05);
}
.m-func-wrap .m-func-nav > li {
  margin: 0;
  padding: 0 8px;
  width: auto;
}
.m-func-wrap .m-func-nav > li:first-child {
  padding-left: 0;
}
.m-func-wrap .m-func-nav > li:last-child {
  padding-right: 0;
}
.m-func-wrap .m-func-nav > li > a {
  padding: 15px calc(var(--gap-item) * 1.5);
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: var(--radius);
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.m-func-wrap .m-func-nav > li > a::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  border-radius: var(--radius);
  border: 2px solid #c6a582;
  -webkit-transition: opacity 0.25s;
  transition: opacity 0.25s;
  opacity: 0;
}
.m-func-wrap .m-func-nav > li .img {
  width: 40px;
  height: 40px;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 40px;
          flex: 0 0 40px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 8px;
  margin: 0;
}
.m-func-wrap .m-func-nav > li .img + .text {
  padding-left: var(--gap-item);
}
.m-func-wrap .m-func-nav > li .text {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  text-align: left;
}
.m-func-wrap .m-func-nav > li:not(.active) a:hover {
  color: #333;
  background-color: #fff;
}
.m-func-wrap .m-func-nav > li:not(.active) a:hover::before {
  opacity: 1;
}
.m-func-wrap .m-func-nav > li:not(.active) a:hover .img img {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}
.m-func-wrap .m-func-nav > li:not(.active) a:hover .img::before {
  background-color: #c6a582;
}

@media (max-width: 1199px) {
  .m-func-nav {
    --num-func: 3;
  }
  .m-func-nav > li > a {
    padding: 20px 10px 15px;
  }
  .m-func-nav > li .img {
    width: calc(var(--h-btn) * 1.6);
    height: calc(var(--h-btn) * 1.6);
  }
  .m-func-wrap .m-func-nav {
    margin-top: 15px;
  }
}
@media (max-width: 579px) {
  .m-func-nav {
    --num-func: 2;
  }
}
@media (max-width: 499px) {
  .m-func-nav {
    --num-func: 1;
    margin: 0 auto calc(var(--gap) * 2);
  }
  .m-func-nav > li {
    padding: 0;
    margin-bottom: 15px;
  }
  .m-func-nav > li > a {
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
    padding: 10px var(--gap-item);
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .m-func-nav > li .img {
    width: var(--h-btn);
    height: var(--h-btn);
    -webkit-box-flex: 0;
        -ms-flex: 0 0 var(--h-btn);
            flex: 0 0 var(--h-btn);
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 8px;
    margin: 0;
  }
  .m-func-nav > li .img + .text {
    padding-left: var(--gap-item);
  }
  .m-func-nav > li .text {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    text-align: left;
  }
  .m-func-wrap .m-func-nav > li {
    min-width: 45vw;
  }
  .m-func-wrap .m-func-nav > li > a {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .m-func-wrap .m-func-nav > li .img {
    width: 40px;
    height: 40px;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 40px;
            flex: 0 0 40px;
  }
}
.is-only-show-mcenter {
  display: none !important;
}

.m-signin-wrap .is-only-show-mcenter {
  display: block !important;
}

.sec-regist-history {
  background-color: #eef5fa;
  padding: var(--gap);
  border-radius: var(--radius-page);
  border: 1px solid #ddd;
  margin: 0 auto calc(10px + var(--gap));
}
.sec-regist-history .subhead {
  position: relative;
  display: block;
  margin: 0.5em 0 1em;
  padding: 0 0 0 2.5em;
  color: #000;
  font-size: var(--fz-brief);
  font-weight: var(--fw-middle);
}
.sec-regist-history .subhead::before {
  content: "";
  display: block;
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50px;
  background-color: #ff3e41;
  left: 1.25em;
  top: 0.4em;
}
.sec-regist-history .content {
  border-radius: var(--radius-page);
  overflow: hidden;
  background-color: #fff;
  border: 1px solid #eee;
  padding: var(--gap);
}
.sec-regist-history .content + * {
  margin-top: calc(var(--gap) * 1.5);
}
.sec-regist-history .list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.sec-regist-history .list > li {
  line-height: 1.8;
  font-size: 1rem;
  padding: 10px var(--gap);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-top: 2px solid #eee;
}
.sec-regist-history .list > li:first-child {
  border-top: none;
}
.sec-regist-history .list .tit {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 max(150px, 15%);
          flex: 0 0 max(150px, 15%);
  position: relative;
  display: block;
  padding: 0 0 0 1em;
  font-weight: var(--fw-middle);
}
.sec-regist-history .list .tit::before {
  content: "";
  display: block;
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50px;
  background-color: #999;
  left: 0;
  top: 0.8em;
}
.sec-regist-history .list .text {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.sec-regist-history .list .price {
  font-style: normal;
}
.sec-regist-history .list .notice {
  color: #c6a582;
  margin: 0 5px;
}
.sec-regist-history .pay-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 10px;
  border-top: 2px solid #eee;
  padding-top: 10px;
}
.sec-regist-history .pay-info .g-btn-cube {
  min-width: 95px;
  line-height: 40px;
  height: 40px;
  padding: 0;
  text-align: center;
}
.sec-regist-history .pay-info .total {
  white-space: nowrap;
  color: #000;
  margin-left: 1em;
}
.sec-regist-history .pay-info .price {
  display: inline-block;
  font-size: var(--fz-brief);
  margin-left: 10px;
  font-weight: var(--fw-bold);
}
.sec-regist-history .pay-info .price i {
  font-style: normal;
  font-weight: var(--fw-extrabold);
  font-size: calc(var(--fz-listname-lg) * 1.07);
  margin-left: 0.2em;
}

@media (max-width: 767px) {
  .sec-regist-history {
    padding: var(--gap-item) 10px 10px;
  }
  .sec-regist-history .content {
    padding: 10px;
  }
  .sec-regist-history .list > li {
    padding: 0.25em 0;
  }
  .sec-regist-history .pay-info {
    padding-top: 0.25em;
  }
}
@media (max-width: 579px) {
  .sec-regist-history .subhead {
    display: block;
  }
  .sec-regist-history .pay-info {
    padding-top: var(--gap-item);
    display: block;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    text-align: center;
  }
  .sec-regist-history .pay-info .total {
    display: block;
    text-align: center;
  }
}
.extra-list {
  --h-input: 40px;
}
.extra-list .d-flex {
  padding-left: max(35px, var(--h-input) * 0.8);
  border-top: 1px dashed #d2d2d2;
  padding-top: 15px;
  margin-bottom: 15px;
}
.extra-list .d-flex:first-child {
  border-top: none;
  padding-top: 0;
}
.extra-list .d-flex:not(.flex-wrap) .checkbox-style {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 auto;
          flex: 1 0 auto;
}
.extra-list .d-flex.mb-wrap {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.extra-list .d-flex.mb-wrap .block {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
@media (max-width: 991px) {
  .extra-list .d-flex.mb-wrap {
    -ms-flex-wrap: wrap !important;
        flex-wrap: wrap !important;
  }
  .extra-list .d-flex.mb-wrap .checkbox-style {
    margin-bottom: 3px;
  }
  .extra-list .d-flex.mb-wrap .block {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    margin-bottom: 3px;
    --h-input: 32px;
    max-width: 100%;
    line-height: 1.4;
  }
}
.extra-list .d-flex.flex-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap !important;
      flex-wrap: wrap !important;
}
.extra-list .d-flex.flex-wrap .checkbox-style {
  margin-bottom: 3px;
}
.extra-list .d-flex.flex-wrap .block {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  margin-bottom: 3px;
  --h-input: 32px;
  max-width: 100%;
  line-height: 1.4;
}
.extra-list .d-flex.flex-wrap .brief {
  color: #999;
  font-size: 0.9375rem;
}
.extra-list .checkbox-style {
  max-width: 100%;
  white-space: normal;
  margin-left: calc(max(35px, var(--h-input) * 0.8) * -1);
  padding-left: max(35px, var(--h-input) * 0.8);
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
}
.extra-list .w-small {
  -webkit-box-flex: 0 !important;
  -ms-flex: 0 1 100px !important;
  flex: 0 1 100px !important;
  margin: 0;
  display: inline-block !important;
}
.extra-list .w-small.select-style {
  width: auto !important;
  min-width: 100px;
}

.checkbox-style.d-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.checkbox-style.d-flex input + span {
  top: 1.6em;
}

@media (max-width: 991px) {
  .extra-list {
    max-height: none !important;
  }
}
/* 
 * Tab切換
 */
.tabs-nav__list {
  margin: 20px auto 10px;
}
.tabs-nav__list > ul {
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border: none;
  padding: 0;
}
.tabs-nav__list > ul > li {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 50%;
          flex: 1 1 50%;
  display: inline-block;
}
.tabs-nav__list > ul > li:first-child a,
.tabs-nav__list > ul > li:first-child button {
  border-left-width: 1px;
  border-radius: 5px 0 0 5px;
}
.tabs-nav__list > ul > li:last-child a,
.tabs-nav__list > ul > li:last-child button {
  border-radius: 0 5px 5px 0;
}
.tabs-nav__list > ul > li.current a,
.tabs-nav__list > ul > li.current button {
  background-color: #0069df;
  color: #fff;
}
.tabs-nav__list > ul > li:not(.current) a:hover,
.tabs-nav__list > ul > li:not(.current) button:hover {
  background-color: #d5e7f3;
  color: #0069df;
}
.tabs-nav__list > ul a,
.tabs-nav__list > ul button {
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1.2;
  min-height: calc(var(--h-input) * 0.9);
  padding: 10px 15px;
  width: 100%;
  border-radius: 0;
  border-left-width: 0;
  border: 1px solid #c2d8eb;
  background-color: #e8f1f7;
  color: #758da3;
}
@media (min-width: 640px) {
  .tabs-nav__list > ul a br,
  .tabs-nav__list > ul button br {
    display: none;
  }
}

.tabs-nav__content {
  position: relative;
  padding-top: var(--gap);
}

.tabs-nav__panel {
  display: none;
}
.tabs-nav__panel.current {
  display: block;
  -webkit-animation: ani_tabs_show 0.6s both;
          animation: ani_tabs_show 0.6s both;
}

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

@keyframes ani_tabs_show {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@media (min-width: 992px) {
  .m-signin-wrap .col-lg-6:not(.first-regist) {
    max-width: 55%;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
  }
}
@media (min-width: 992px) {
  .m-signin-wrap .first-regist {
    max-width: 45%;
  }
}
.m-signin-wrap .first-regist .msg-nodata {
  max-width: min(500px, 100%);
  width: 100%;
}
@media (min-width: 992px) {
  .m-signin-wrap .first-regist {
    padding-left: 5vw;
  }
}
.m-signin-wrap .first-regist .btn-wrap {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 10px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
.m-signin-wrap .first-regist .g-btn-cube {
  height: auto;
  font-size: clamp(1rem, 0.9116rem + 0.2439vw, 1.125rem);
  padding: 20px 15px;
  line-height: 1.5;
  white-space: normal;
  width: 100%;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(50% - 10px);
          flex: 0 0 calc(50% - 10px);
  min-width: auto;
}
.m-signin-wrap .first-regist .g-btn-cube svg {
  display: block;
  color: #fff;
  width: 3em;
  margin: 5px auto;
  z-index: 5;
  position: relative;
}
.m-signin-wrap .first-regist .g-btn-cube .eff {
  background-color: #008ddf;
}
.m-signin-wrap .first-regist .g-btn-cube:hover {
  color: #fff;
}

/*
 * 報名步驟
 */
.register-steps {
  --w-border: 10px;
  max-width: 1030px;
  margin: var(--gap-vertical) auto calc(var(--gap-vertical) + var(--gap));
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  counter-reset: listStyle;
}
.register-steps::before, .register-steps::after {
  content: "";
  display: block;
  border-radius: 10px;
  height: var(--w-border);
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -5px;
}
.register-steps::before {
  z-index: 0;
  width: 100%;
  background-color: #eee;
}
.register-steps::after {
  z-index: 1;
  background-color: #00319f;
  -webkit-transform-origin: left center;
      -ms-transform-origin: left center;
          transform-origin: left center;
  width: 0;
  -webkit-transition: width 0.5s;
  transition: width 0.5s;
}
.register-steps .item {
  position: relative;
  z-index: 5;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 33.3333333333%;
          flex: 0 0 33.3333333333%;
  text-align: center;
  counter-increment: listStyle;
}
.register-steps .icon {
  max-width: 100px;
  width: max(45%, 80px);
  margin: 0 auto;
  padding: var(--w-border);
  aspect-ratio: 1;
  border-radius: 100px;
  border: var(--w-border) solid #eee;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.register-steps .text {
  position: absolute;
  bottom: -10px;
  left: 50%;
  max-width: 90px;
  text-align: left;
  white-space: nowrap;
  width: max(45%, 80px);
  color: #888;
  font-weight: var(--fw-middle);
  font-size: var(--fz-h5);
  -webkit-transform: translate(-50%, 100%);
      -ms-transform: translate(-50%, 100%);
          transform: translate(-50%, 100%);
}
.register-steps .text::before {
  content: "STEP " counter(listStyle);
  font-weight: var(--fw-bold);
  color: #666;
  font-size: 0.75rem;
  display: block;
  white-space: nowrap;
  line-height: 1.3;
}
.register-steps .state {
  text-align: center;
  display: inline-block;
  vertical-align: top;
  margin-top: 3px;
  padding: 3px 15px;
  border-radius: 50px;
  border: 1px solid #ccc;
  font-size: 0.875rem;
  white-space: nowrap;
  margin-left: 0.5em;
  line-height: 1.5;
  font-style: normal;
  color: #aaa;
  background-color: #fff;
}
.register-steps .state::before {
  content: "Pending";
}
.is-step1 .register-steps::after {
  width: 33%;
}
.is-step1 .register-steps .step1 .icon {
  border-color: #00319f;
  background-color: #00319f;
}
.is-step1 .register-steps .step1 .icon img {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}
.is-step1 .register-steps .step1 .text {
  color: #000;
}
.is-step1 .register-steps .step1 .state {
  background-color: #eee;
  border-color: #ddd;
}
.is-step1 .register-steps .step1 .state::before {
  content: "Is Progress";
  color: #00319f;
}

.is-step2 .register-steps::after {
  width: 66%;
}
.is-step2 .register-steps .step1 .icon, .is-step2 .register-steps .step2 .icon {
  border-color: #00319f;
  background-color: #00319f;
}
.is-step2 .register-steps .step1 .icon img, .is-step2 .register-steps .step2 .icon img {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}
.is-step2 .register-steps .step1 .text, .is-step2 .register-steps .step2 .text {
  color: #000;
}
.is-step2 .register-steps .step1 .state, .is-step2 .register-steps .step2 .state {
  background-color: #eee;
  border-color: #ddd;
}
.is-step2 .register-steps .step1 .state::before {
  content: "Completed";
  color: #ff3e41;
}
.is-step2 .register-steps .step2 .state::before {
  content: "Is Progress";
  color: #00319f;
}

.is-step3 .register-steps::after {
  width: 100%;
}
.is-step3 .register-steps .step1 .icon, .is-step3 .register-steps .step2 .icon, .is-step3 .register-steps .step3 .icon {
  border-color: #00319f;
  background-color: #00319f;
}
.is-step3 .register-steps .step1 .icon img, .is-step3 .register-steps .step2 .icon img, .is-step3 .register-steps .step3 .icon img {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}
.is-step3 .register-steps .step1 .text, .is-step3 .register-steps .step2 .text, .is-step3 .register-steps .step3 .text {
  color: #000;
}
.is-step3 .register-steps .step1 .state, .is-step3 .register-steps .step2 .state, .is-step3 .register-steps .step3 .state {
  background-color: #eee;
  border-color: #ddd;
}
.is-step3 .register-steps .step1 .state::before, .is-step3 .register-steps .step2 .state::before, .is-step3 .register-steps .step3 .state::before {
  content: "Completed";
  color: #ff3e41;
}

@media (max-width: 839px) {
  .register-steps {
    --w-border: 8px;
    margin-bottom: calc(var(--gap-vertical) + var(--gap) * 2);
  }
  .register-steps .text {
    bottom: -5px;
    text-align: center;
    max-width: none;
    font-size: 0.9375rem;
  }
  .register-steps .state {
    font-size: 0.7em;
    display: block;
    margin: 2px auto 0;
    padding: 3px 0;
    min-width: 50px;
  }
}
@media (max-width: 579px) {
  .register-steps {
    --w-border: 5px;
  }
  .register-steps .icon {
    max-width: 70px;
    width: max(40%, 70px);
  }
  .register-steps .text::before {
    display: none;
  }
}
.reg-links {
  position: absolute;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  right: calc(var(--gap-vertical) * -0.4);
  bottom: calc(var(--gap-vertical) * -0.45);
  gap: 0 1.6rem;
}
.reg-links > a {
  position: relative;
  display: inline-block;
  line-height: 1.5;
  color: #555;
  text-decoration: none;
  white-space: nowrap;
}
.reg-links > a::before {
  content: "|";
  font: inherit;
  position: absolute;
  left: -0.85rem;
  top: -0.1em;
  color: #999;
}
.reg-links > a:hover {
  color: #0069df;
  text-decoration: underline;
}
.reg-links > a:first-child::before {
  display: none;
}

@media (max-width: 991px) {
  .reg-links {
    position: relative;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    right: auto;
    bottom: auto;
    margin-top: 20px;
  }
}
/*
 * 聯絡資訊
 */
#contact {
  padding-bottom: 0;
}

.contact-info {
  --num-contact-info: 3;
  --gap-contact-info: max(22px, 2.5vw);
  padding: 0 0 calc(var(--gap-vertical) * 0.5);
  margin: 0 calc(var(--gap-item) * -1);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  list-style: none;
}
.contact-info .item {
  position: relative;
  word-break: break-all;
  width: calc(100% / var(--num-contact-info) - var(--gap-item) * 2);
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(100% / var(--num-contact-info) - var(--gap-item) * 2);
          flex: 0 0 calc(100% / var(--num-contact-info) - var(--gap-item) * 2);
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  margin: 0 var(--gap-item) calc(var(--gap-item) * 3);
  padding: var(--gap-contact-info) var(--gap-contact-info) calc(var(--gap-contact-info) * 0.8);
  background-color: #fff;
  border-radius: var(--radius-page);
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
          box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  width: 100%;
  color: #333;
  line-height: 1.5;
  font-size: var(--fz-input);
  -webkit-transition: background-color 0.15s;
  transition: background-color 0.15s;
}
.pc .contact-info .item:hover {
  background-color: #c6a582;
  color: #fff;
}
.pc .contact-info .item:hover .img {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}
.pc .contact-info .item:hover .tit {
  color: #fff;
}

.contact-info a {
  color: inherit;
}
.contact-info a:hover {
  text-decoration: underline;
}
.contact-info .img {
  max-width: 46px;
  margin-bottom: var(--gap-contact-info);
}
.contact-info .img.bigger {
  max-width: 58px;
}
.contact-info .img img, .contact-info .img svg {
  width: 100%;
}
.contact-info .tit {
  color: #000;
  font-weight: var(--fw-bold);
  display: block;
  margin-bottom: 15px;
  font-size: var(--fz-input);
}

@media (max-width: 991px) {
  .contact-info {
    margin: var(--gap) calc(var(--gap-item) * -1);
  }
  .contact-info .item {
    margin-bottom: var(--gap-item);
  }
  .contact-info .img {
    max-width: 30px;
    margin-bottom: 20px;
  }
  .contact-info .img.bigger {
    max-width: 40px;
  }
}
@media (max-width: 767px) {
  .contact-info {
    --num-contact-info: 1;
  }
  .contact-info .item {
    height: auto !important;
    padding-left: calc(var(--gap-contact-info) + 35px);
  }
  .contact-info .img {
    max-width: 24px;
    margin-bottom: 10px;
    position: absolute;
    top: var(--gap-contact-info);
    left: var(--gap-contact-info);
  }
  .contact-info .img.bigger {
    max-width: 30px;
  }
  .contact-info .tit {
    line-height: 24px;
    margin-bottom: 5px;
  }
}
/*
 * 聯絡表單
 */
.contact-sec2 {
  background: #111 url(../images/contact_bg.jpg) no-repeat 0 0/cover;
  background-attachment: fixed;
  color: #fff;
  padding-top: var(--gap-vertical);
  padding-bottom: var(--gap-vertical);
}
.contact-sec2 .p-subhead {
  color: #fff;
  text-align: left;
  margin: 0;
  padding: 0;
  font-size: var(--fz-subhead);
}
.contact-sec2 .p-subhead::before {
  display: none;
}
.contact-sec2 .p-subhead .txt1 {
  font-weight: var(--fw-extrabold);
}
.contact-sec2 .p-subhead .txt2 {
  margin: var(--gap) 0 var(--gap-item);
  font-size: var(--fz-listname-lg);
}
.contact-sec2 .star {
  color: #fff;
}

.contact-half {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 100%;
}

.contact-half-left {
  width: 350px;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 350px;
          flex: 0 0 350px;
  z-index: 25;
  text-align: left;
  position: sticky;
  top: calc(var(--h-header) + var(--h-topbar));
}

.contact-half-right {
  width: calc(100% - 350px - var(--gap-vertical));
  -webkit-box-flex: 1;
      -ms-flex: 1 0 calc(100% - 350px - var(--gap-vertical));
          flex: 1 0 calc(100% - 350px - var(--gap-vertical));
  margin-left: var(--gap-vertical);
}

.contact-msg {
  max-width: 300px;
}

.contact-form form .label-style {
  line-height: 1.2;
  display: block;
  position: relative;
  font-size: 1rem;
}

@media (min-width: 992px) {
  .contact-half-right {
    position: sticky;
    top: var(--h-header);
  }
  .contact-sec2 .btn-wrap {
    text-align: left;
    margin-left: 0;
  }
  .contact-sec2 .btn-wrap .g-btn-cube {
    margin: 0;
    display: inline-block;
  }
}
@media (max-width: 1199px) {
  .contact-half-left {
    width: 250px;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 250px;
            flex: 0 0 250px;
  }
  .contact-half-right {
    width: calc(100% - 250px - var(--h-btn));
    -webkit-box-flex: 1;
        -ms-flex: 1 0 calc(100% - 250px - var(--h-btn));
            flex: 1 0 calc(100% - 250px - var(--h-btn));
    margin-left: var(--h-btn);
  }
}
@media (max-width: 991px) {
  .contact-sec2 .p-subhead {
    text-align: center;
  }
  .contact-sec2 .p-subhead .txt2 {
    margin-top: 10px;
  }
  .contact-msg {
    max-width: none;
  }
  .contact-half {
    display: block;
  }
  .contact-half-left {
    width: 100%;
    max-width: none;
    margin: 0 auto var(--gap);
    position: relative;
    top: auto;
    text-align: center;
  }
  .contact-half-right {
    width: 100%;
    margin-left: auto;
    padding-left: 0;
  }
}
@media (min-width: 768px) {
  .contact-form form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .contact-form form .form-box:not(.form-half) {
    width: 100%;
  }
}
@media (max-width: 499px) {
  .contact-form {
    margin-left: calc(var(--gap) * -1);
    margin-right: calc(var(--gap) * -1);
    padding-left: var(--gap);
    padding-right: var(--gap);
  }
}
/*
 * E-POSTER 列表
 */
.eposter-list {
  --num-eposter: 4;
  --gap-eposter: 30px;
  padding: 0;
  margin: 0 calc(var(--gap-item) * -1);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.eposter-list .item {
  width: calc(100% / var(--num-eposter) - var(--gap-item) * 2);
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(100% / var(--num-eposter) - var(--gap-item) * 2);
          flex: 0 0 calc(100% / var(--num-eposter) - var(--gap-item) * 2);
  margin: 0 var(--gap-item) calc(var(--gap-item) * 3);
  padding: 0;
  border-radius: var(--radius-page);
  background-color: #fff;
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
  text-align: center;
}
.eposter-list .item::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  border-radius: var(--radius-page);
  border: 3px solid #568ae5;
  -webkit-transition: opacity 0.25s;
  transition: opacity 0.25s;
  opacity: 0;
}
.eposter-list .img {
  text-align: center;
  border-radius: var(--radius-page);
  margin: calc(var(--gap-eposter) * 1.5) auto var(--gap-item);
  overflow: hidden;
  max-width: 150px;
  aspect-ratio: 1;
}
.eposter-list .img img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.eposter-list .text {
  font-size: 0.875rem;
  line-height: 1.4;
  color: #555;
  padding: var(--gap-item) var(--gap-eposter) var(--gap-eposter);
}
.eposter-list .name {
  font-weight: var(--fw-middle);
  color: #000;
  font-size: var(--fz-listname-sm);
  -webkit-transition: color 0.25s;
  transition: color 0.25s;
}
.eposter-list .brief {
  display: -webkit-box;
  overflow: hidden;
  /**! autoprefixer: off;*/
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  margin: 0;
  padding: 0;
}
.eposter-list .more {
  text-align: left;
  color: #333;
  line-height: 1.2;
  font-size: 0.75rem;
  width: 100%;
  font-weight: var(--fw-bold);
  padding: var(--gap) var(--gap-eposter);
  border-top: 1px solid #ccc;
}
.eposter-list .more > div {
  display: inline-block;
  padding-bottom: 5px;
  border-bottom: 1px solid #333;
}
.eposter-list .more::after {
  content: "";
  display: block;
  position: absolute;
  right: var(--gap-eposter);
  bottom: var(--gap);
  margin-bottom: 3px;
  width: 22px;
  height: 8px;
  border-style: solid;
  border-width: 0 2px 2px 0;
  border-color: #000;
  -webkit-transform: skewX(45deg);
      -ms-transform: skewX(45deg);
          transform: skewX(45deg);
}

.pc .eposter-list .item:hover::before {
  opacity: 1;
}
.pc .eposter-list .item:hover .name {
  color: #000;
}
.pc .eposter-list .item:hover .brief {
  color: #000;
}
.pc .eposter-list .item:hover .more {
  border-top-color: #568ae5;
  color: #568ae5;
}
.pc .eposter-list .item:hover .more > div {
  border-color: #568ae5;
}
.pc .eposter-list .item:hover .more::after {
  -webkit-animation: ani_infinte_news_aw 0.5s both infinite;
          animation: ani_infinte_news_aw 0.5s both infinite;
  -webkit-filter: invert(58%) sepia(71%) saturate(3256%) hue-rotate(197deg) brightness(95%) contrast(89%);
          filter: invert(58%) sepia(71%) saturate(3256%) hue-rotate(197deg) brightness(95%) contrast(89%);
}

@media (max-width: 1199px) {
  .eposter-list {
    --num-eposter: 3;
  }
  .eposter-list .text {
    padding: var(--gap-item) var(--gap-eposter) var(--gap-eposter);
  }
}
@media (max-width: 767px) {
  .eposter-list {
    --num-eposter: 2;
    --gap-eposter: 20px;
  }
}
@media (max-width: 579px) {
  .eposter-list {
    --num-eposter: 1;
    --gap-eposter: 15px;
  }
  .eposter-list .item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-bottom: var(--gap);
  }
  .eposter-list .img {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 130px;
            flex: 0 0 130px;
    margin: var(--gap-eposter);
  }
  .eposter-list .text {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    padding: var(--gap-eposter);
    margin: 0;
    text-align: left;
  }
  .eposter-list .name, .eposter-list .brief {
    height: auto !important;
  }
  .eposter-list .more {
    width: 100%;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    padding-top: var(--gap-eposter);
    padding-bottom: var(--gap-eposter);
  }
  .eposter-list .more::after {
    bottom: calc(var(--gap-eposter) + 3px);
  }
}
/*
 * E-POSTER 詳細
 */
.eposter-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  margin: 0 auto var(--gap) auto;
  padding: var(--gap-item);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.eposter-info .img {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 max(215px, 11.2vw);
          flex: 0 0 max(215px, 11.2vw);
  position: relative;
  border-radius: var(--radius-page);
  overflow: hidden;
  z-index: 0;
  position: relative;
  aspect-ratio: 1;
}
.eposter-info .img img {
  -o-object-fit: cover;
     object-fit: cover;
}
.eposter-info .img + .text {
  padding-left: calc(var(--gap) * 2);
}
.eposter-info .text {
  line-height: 1.6;
  color: #555;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 1rem;
  padding: 10px var(--gap) calc(var(--h-pager) * 0.8) var(--gap);
}
.eposter-info .from {
  font-style: normal;
  font-size: 1rem;
}
.eposter-info .name {
  font-size: var(--fz-fieldset-subhead);
  font-weight: var(--fw-bold);
  color: #000;
  display: block;
  margin: 5px 0;
}

@media (max-width: 991px) {
  .eposter-info {
    margin-bottom: var(--gap-item);
  }
  .eposter-info .img {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 max(190px, 10vw);
            flex: 0 0 max(190px, 10vw);
  }
  .eposter-info .img + .text {
    padding-left: var(--gap);
  }
  .eposter-info .text {
    padding-right: 0;
  }
}
@media (max-width: 767px) {
  .eposter-info {
    padding: 0;
  }
  .eposter-info .img {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 max(140px, 10vw);
            flex: 0 0 max(140px, 10vw);
  }
  .eposter-info .img + .text {
    padding-left: var(--gap-item);
  }
}
@media (max-width: 499px) {
  .eposter-info {
    display: block;
  }
  .eposter-info .img {
    width: 100%;
    max-width: 150px;
    margin: 0 auto var(--gap-item);
    text-align: center;
  }
  .eposter-info .img + .text {
    padding-left: 0;
  }
  .eposter-info .text {
    padding: 0;
    margin: 0 auto;
  }
  .eposter-info .brief {
    margin: 5px auto 10px;
  }
  .eposter-info .from, .eposter-info .name {
    display: block;
    text-align: center;
  }
}
.eposter-support {
  padding: var(--gap) 0 0;
  margin: var(--gap);
  border-top: 1px solid #666;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  list-style: none;
}
.eposter-support > li {
  line-height: 1.8;
  font-size: 1rem;
  color: #555;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 30%;
          flex: 1 1 30%;
  margin: var(--gap) 0 0 0;
  border-left: 1px solid #ddd;
  padding: 10px max(15px, 2vw);
}
.eposter-support > li:first-child {
  border-left: none;
  padding-left: 0;
  -ms-flex-preferred-size: 20%;
      flex-basis: 20%;
}
.eposter-support > li:last-child {
  padding-right: 0;
  -ms-flex-preferred-size: 20%;
      flex-basis: 20%;
}
.eposter-support .tit {
  font-size: 0.9375rem;
  color: #000;
  display: block;
  margin-bottom: 0.5em;
  line-height: 1.5;
}
.eposter-support .tit::after {
  content: "／";
  display: inline-block;
  vertical-align: middle;
  margin: 0 0.2em;
}

@media (max-width: 991px) {
  .eposter-support {
    display: block;
    margin: 0;
    padding: 0;
  }
  .eposter-support > li {
    display: block;
    padding: var(--gap-item) 0;
    margin: 0;
    border-left: none;
    border-top: 1px solid #ddd;
  }
  .eposter-support > li:first-child {
    border-top: none;
  }
}
.eposter-tabs {
  margin: var(--gap-vertical) auto var(--gap);
}
.eposter-tabs .tabs-scroll .tabs-scroll__prev::before,
.eposter-tabs .tabs-scroll .tabs-scroll__next::before {
  border-color: #222;
}
.eposter-tabs .tabs-scroll .tabs-scroll__prev {
  background: rgb(255, 255, 255);
  background: -webkit-gradient(linear, left top, right top, color-stop(50%, rgb(255, 255, 255)), color-stop(98%, rgba(255, 255, 255, 0)));
  background: linear-gradient(90deg, rgb(255, 255, 255) 50%, rgba(255, 255, 255, 0) 98%);
}
.eposter-tabs .tabs-scroll .tabs-scroll__next {
  background: rgb(255, 255, 255);
  background: -webkit-gradient(linear, right top, left top, color-stop(50%, rgb(255, 255, 255)), color-stop(98%, rgba(255, 255, 255, 0)));
  background: linear-gradient(270deg, rgb(255, 255, 255) 50%, rgba(255, 255, 255, 0) 98%);
}
.eposter-tabs .editor-wrap, .eposter-tabs .cke_editable {
  line-height: 1.8;
}

/*
 * 參展資訊
 */
.exhibit-list .item {
  background-color: #fff;
  border-radius: var(--radius-page);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  margin: 0 auto var(--gap) auto;
  padding: var(--gap-item);
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
          box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}
.exhibit-list .left {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 max(200px, 20.83vw);
          flex: 0 0 max(200px, 20.83vw);
  position: relative;
}
.exhibit-list .left + .right {
  padding-left: calc(var(--gap) * 2);
}
.exhibit-list .right {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 1rem;
  color: #666;
  padding: 10px var(--gap);
}
.exhibit-list .img {
  border-radius: var(--radius-page);
  overflow: hidden;
  z-index: 0;
  position: relative;
  aspect-ratio: 900/675;
}
.exhibit-list .img img {
  -o-object-fit: cover;
     object-fit: cover;
}
.exhibit-list .exhibit-type {
  position: absolute;
  top: 15px;
  right: 15px;
}
.exhibit-list .name {
  font-weight: var(--fw-bold);
  color: #000;
  font-size: var(--fz-listname-sm);
  transition: color 0.25s;
  display: -webkit-box;
  overflow: hidden;
  /**! autoprefixer: off;*/
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.exhibit-list .infolist {
  margin: 15px 0 0 0;
  padding: 0;
}
.exhibit-list .text {
  margin: 15px 0 0 0;
  padding: 15px 0 0;
  border-top: 1px solid #ccc;
}
.exhibit-list .brief {
  display: -webkit-box;
  overflow: hidden;
  /**! autoprefixer: off;*/
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  margin: 0;
  line-height: 1.8;
}

.pc .exhibit-list .item:hover .name {
  color: #0069df;
}

@media (max-width: 991px) {
  .exhibit-list .left + .right {
    padding-left: var(--gap-item);
  }
  .exhibit-list .infolist {
    margin: 5px 0 0 0;
  }
  .exhibit-list .text {
    margin: 5px 0 0 0;
    padding: 5px 0 0;
  }
  .exhibit-list .brief {
    display: -webkit-box;
    overflow: hidden;
    /**! autoprefixer: off;*/
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
}
@media (max-width: 499px) {
  .exhibit-list .item {
    display: block;
    text-align: center;
  }
  .exhibit-list .left {
    width: 100%;
    margin: 0 auto var(--gap-item);
    text-align: center;
  }
  .exhibit-list .left + .right {
    padding-left: 0;
  }
  .exhibit-list .right {
    padding: 0;
  }
  .exhibit-list .text {
    margin: 10px 0 0 0;
    padding: 10px 0 0;
  }
}
.gallery-wrap {
  margin: var(--gap) auto calc(var(--gap) * 2) auto;
  position: relative;
}
.gallery-wrap .swiper-button-prev,
.gallery-wrap .swiper-button-next {
  border-color: #ccc;
  border-width: 2px;
  background-color: rgba(255, 255, 255, 0.6);
}
.gallery-wrap .swiper-button-prev::after,
.gallery-wrap .swiper-button-next::after {
  border-color: #555;
}
.gallery-wrap .swiper-button-prev::before,
.gallery-wrap .swiper-button-next::before {
  top: -1px;
  left: -1px;
  width: 105%;
  height: 105%;
}
.gallery-wrap .swiper-button-prev:hover, .gallery-wrap .swiper-button-prev:active,
.gallery-wrap .swiper-button-next:hover,
.gallery-wrap .swiper-button-next:active {
  border-color: #568ae5;
}
.gallery-wrap .swiper-button-prev:hover::after, .gallery-wrap .swiper-button-prev:active::after,
.gallery-wrap .swiper-button-next:hover::after,
.gallery-wrap .swiper-button-next:active::after {
  border-color: #fff;
}
.gallery-wrap .swiper-button-prev {
  left: 3px;
}
.gallery-wrap .swiper-button-next {
  right: 3px;
}
.gallery-wrap .swiper-pagination {
  position: relative;
  bottom: auto;
  margin-top: 5px;
}
.gallery-wrap .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #568ae5;
  border-color: #568ae5;
}

.gallery {
  max-width: min(100%, 85vh);
  margin: 0 auto;
}
.gallery .img {
  overflow: hidden;
  width: 100%;
  position: relative;
  aspect-ratio: 900/675;
  border-radius: var(--radius-page);
}
.gallery .img img {
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

@media (max-width: 767px) {
  .gallery-wrap {
    margin-top: 0;
  }
}
/*
 * 演講嘉賓
 */
.speaker-list .item {
  background-color: #fff;
  border-radius: var(--radius-page);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  margin: 0 auto var(--gap) auto;
  padding: var(--gap-item);
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
          box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}
.speaker-list .left {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 max(215px, 11.2vw);
          flex: 0 0 max(215px, 11.2vw);
  position: relative;
}
.speaker-list .left + .right {
  padding-left: calc(var(--gap) * 2);
}
.speaker-list .right {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 1rem;
  color: #666;
  padding: 10px var(--gap) calc(var(--h-pager) * 0.8) var(--gap);
}
.speaker-list .img {
  border-radius: var(--radius-page);
  overflow: hidden;
  z-index: 0;
  position: relative;
  aspect-ratio: 1;
}
.speaker-list .img img {
  -o-object-fit: cover;
     object-fit: cover;
}
.speaker-list .name-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 5px 0;
}
.speaker-list .from {
  color: #666;
  display: inline-block;
  vertical-align: center;
  margin-left: 1em;
  margin-top: -0.2em;
  font-size: var(--fz-input);
}
.speaker-list .from::before {
  content: "∕";
  display: inline-block;
  margin-right: 0.2em;
}
.speaker-list .infolist {
  margin: 10px 0 0;
}
.speaker-list .name {
  display: inline-block;
  vertical-align: center;
  font-weight: var(--fw-bold);
  margin: 0;
  color: #000;
  font-size: var(--fz-listname-sm);
  transition: color 0.25s;
  display: -webkit-box;
  overflow: hidden;
  /**! autoprefixer: off;*/
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.speaker-list .text[open] .text-trigger::after {
  content: "摘要 Less";
}
.speaker-list .text[open] .text-trigger::before {
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}
.speaker-list .text-trigger {
  position: absolute;
  width: auto;
  height: calc(var(--h-pager) * 0.8);
  line-height: calc(var(--h-pager) * 0.8);
  right: var(--gap-item);
  bottom: var(--gap-item);
  padding-left: calc(var(--h-pager) * 0.7);
  font-size: 0;
}
.speaker-list .text-trigger::after {
  content: "摘要 More";
  font-size: 0.875rem;
  color: #555;
}
.speaker-list .text-trigger::before {
  content: "";
  display: block;
  position: absolute;
  top: 3px;
  left: 0;
  height: calc(var(--h-pager) * 0.55);
  width: calc(var(--h-pager) * 0.55);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23333' class='w-6 h-6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M12 4.5v15m7.5-7.5h-15' /%3E%3C/svg%3E") no-repeat center center/100% auto;
  -webkit-transition: -webkit-transform 0.25s;
  transition: -webkit-transform 0.25s;
  transition: transform 0.25s;
  transition: transform 0.25s, -webkit-transform 0.25s;
}
.speaker-list .text-trigger:hover::after {
  color: #ff3e41;
}
.speaker-list .text-trigger:hover::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23ff3e41' class='w-6 h-6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M12 4.5v15m7.5-7.5h-15' /%3E%3C/svg%3E");
}
.speaker-list .text-content {
  margin: 0;
  padding: 15px 0 5px;
  line-height: 1.8;
  border-top: 1px solid #ccc;
  font-size: 0.9375rem;
}

@media (max-width: 991px) {
  .speaker-list .left {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 max(170px, 10vw);
            flex: 0 0 max(170px, 10vw);
  }
  .speaker-list .left + .right {
    padding-left: var(--gap);
  }
  .speaker-list .right {
    padding-right: 0;
  }
}
@media (max-width: 767px) {
  .speaker-list .left {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 max(120px, 10vw);
            flex: 0 0 max(120px, 10vw);
  }
  .speaker-list .left + .right {
    padding-left: var(--gap-item);
  }
}
@media (max-width: 499px) {
  .speaker-list .item {
    display: block;
    text-align: center;
  }
  .speaker-list .left {
    width: 100%;
    max-width: 150px;
    text-align: center;
    margin: 0 auto var(--gap-item);
    text-align: center;
  }
  .speaker-list .left + .right {
    padding-left: 0;
  }
  .speaker-list .right {
    padding-left: 0;
    padding-right: 0;
    padding-top: 10px;
  }
  .speaker-list .name-wrap {
    display: block;
    text-align: center;
    margin: 0 auto;
  }
  .speaker-list .name {
    display: block;
  }
  .speaker-list .from {
    margin-left: 0;
  }
  .speaker-list .from::before {
    display: none;
  }
  .speaker-list .text-content {
    text-align: left;
  }
}
/*
 * 演講日程
 */
:root {
  --color-agenda-header: #456cdb;
  --color-agenda-highlight: #6392e5;
  --color-agenda-border: #ddd;
  --width-agenda-time: 200px;
  --gap-agenda: 20px;
}

@media (max-width: 1199px) {
  :root {
    --width-agenda-time: 140px;
  }
}
.agenda__wrap {
  line-height: 1.6;
  position: relative;
  border-radius: var(--radius);
  border: 1px solid var(--color-agenda-border);
  font-size: 1rem;
}
.agenda__header {
  font-size: var(--fz-brief);
  font-weight: var(--fw-bold);
  color: #fff;
  border-radius: var(--radius) var(--radius) 0 0;
  padding: calc(var(--gap-agenda) * 1.1) var(--gap-agenda);
  -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
          box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
  background: #2f4f87, #1c3560;
  /* Vertical gradient */
  background: -webkit-gradient(linear, left top, left bottom, from(#2f4f87), to(#1c3560));
  background: linear-gradient(to bottom, #2f4f87, #1c3560);
}
.agenda__period {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  border-top: 1px solid var(--color-agenda-border);
}
.agenda__period:first-of-type {
  border-top: none;
}
.agenda__period.state__global {
  text-align: center;
  background: var(--color-agenda-highlight);
  color: #fff !important;
}
.agenda__period.state__global .agenda__topic {
  color: inherit !important;
}
.agenda__period.state__global .agenda__clock, .agenda__period.state__global .agenda__single {
  padding-top: calc(var(--gap-agenda) * 0.6);
  padding-bottom: calc(var(--gap-agenda) * 0.6);
}
.agenda__clock {
  width: var(--width-agenda-time);
  -webkit-box-flex: 0;
      -ms-flex: 0 0 var(--width-agenda-time);
          flex: 0 0 var(--width-agenda-time);
  padding: var(--gap-agenda);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.agenda__group {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 calc(100% - var(--width-agenda-time));
          flex: 1 1 calc(100% - var(--width-agenda-time));
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
.agenda__single {
  border-left: 1px solid var(--color-agenda-border);
  padding: var(--gap-agenda);
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-negative: 1;
      flex-shrink: 1;
  -ms-flex-preferred-size: 50%;
      flex-basis: 50%;
}
.agenda__topic {
  color: #00319f;
  margin: 3px 0;
  padding: 0;
  display: block;
  font-size: 1rem;
}
.agenda__speakers {
  width: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
}
.agenda__speakers .item {
  padding: var(--gap-agenda) 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  border-top: 1px solid var(--color-agenda-border);
}
.agenda__speakers .item:first-of-type {
  border-top: none;
}
.agenda__speakers .pic {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 85px;
          flex: 0 0 85px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  padding-right: var(--gap-item);
}
.agenda__speakers .pic img {
  display: inline-block;
  max-width: 100%;
  height: auto;
  background-color: #ddd;
  border-radius: var(--radius);
  overflow: hidden;
}
.agenda__speakers .text {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.agenda__speakers .place {
  font-size: 0.875rem;
  line-height: 1.2;
  border: 1px solid #888;
  font-style: normal;
  border-radius: 4px;
  padding: 4px 7px 2px 7px;
  display: inline-block;
  vertical-align: middle;
  margin: 3px 5px 5px 0;
}
.agenda__speakers .name {
  display: inline-block;
  vertical-align: middle;
}
.agenda__speakers .feature {
  display: block;
  list-style: none;
  margin: 10px 0 0 0;
  padding: 0;
  font-size: 0.875rem;
}
.agenda__speakers .feature > li {
  position: relative;
  padding-left: 15px;
  margin-bottom: 6px;
  color: #666;
}
.agenda__speakers .feature > li::before {
  content: "";
  display: block;
  position: absolute;
  top: 9px;
  left: 3px;
  width: 4px;
  height: 4px;
  background: #888;
  border-radius: 50px;
}

@media (max-width: 1199px) {
  .agenda__period {
    display: block;
  }
  .agenda__clock {
    position: sticky;
    top: calc(var(--h-header) + var(--h-topbar));
    left: 0;
    width: 100%;
    z-index: 10;
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
            box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
    background-color: var(--color-agenda-header);
    color: #fff;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .is-sticky {
    -webkit-filter: contrast(150%);
            filter: contrast(150%);
    -webkit-box-shadow: 0 15px 15px rgba(0, 0, 0, 0.5);
            box-shadow: 0 15px 15px rgba(0, 0, 0, 0.5);
  }
}
@media (max-width: 991px) {
  .agenda__group {
    display: block;
  }
  .agenda__single {
    width: 100% !important;
    border-left: none;
    border-top: 2px solid var(--color-agenda-border);
  }
  .agenda__single:first-of-type {
    border-top: none;
  }
  .agenda__single:nth-of-type(even) {
    background-color: #f0f0f0;
  }
}
/*temp*/
.agenda__temp {
  position: relative;
  width: 100%;
  overflow-x: auto;
}
.agenda__temp table {
  z-index: 2;
  text-align: center;
  font-size: 1.0625rem;
  font-weight: bold;
  border: 0;
  width: 100%;
  overflow: auto;
  line-height: 1.5;
}
.agenda__temp table thead {
  background: #8064a2;
  color: #fff;
}
.agenda__temp table td,
.agenda__temp table th {
  width: 11.1111111111%;
  vertical-align: middle;
  border: 1px solid #fff;
  padding: 10px 1rem;
}
.agenda__temp table td {
  background: #b6dde8;
}
.agenda__temp table td.red-light {
  background: #f2dbdb;
}
.agenda__temp table td.yellow {
  background: #ffff99;
}
.agenda__temp table td.orange {
  background: #f7caac;
}
.agenda__temp table td.green {
  background: #c2d69b;
  padding: 6px 1rem;
}
.agenda__temp table td.green-light {
  background: #e2efd9;
}
.agenda__temp table td.red {
  background: #c0504d;
  font-weight: bold;
  color: #fff;
  padding: 6px 1rem;
}
.agenda__temp table td.purple {
  background: #e5d1f3;
}
.agenda__temp table td.green-blue {
  background: #34ab8a;
}
.agenda__temp table td.gray {
  background: #efefef;
}
.agenda__temp::-webkit-scrollbar {
  height: 5px;
}
.agenda__temp::-webkit-scrollbar-button {
  background: transparent;
  border-radius: 3px;
}
.agenda__temp::-webkit-scrollbar-track-piece {
  background: transparent;
}
.agenda__temp::-webkit-scrollbar-thumb {
  border-radius: 3px;
  background-color: #666;
  border: 1px solid slategrey;
}
.agenda__temp::-webkit-scrollbar-track {
  -webkit-box-shadow: transparent;
          box-shadow: transparent;
  background: #ddd;
  border-radius: 3px;
}
.agenda__temp:hover::-webkit-scrollbar-thumb {
  background: #666;
}
.agenda__temp::after {
  content: "";
  width: 40px;
  height: 40px;
  background-image: url(../images/touch_icon_mb.png);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  pointer-events: none;
  line-height: 1;
  z-index: 20;
  display: block;
  right: 20px;
  opacity: 0;
  top: 35px;
  -webkit-animation: ani_LR 1.2s both linear infinite;
          animation: ani_LR 1.2s both linear infinite;
  -webkit-transition: opacity 0.25s;
  transition: opacity 0.25s;
}
.agenda__temp.need-scroll::after {
  opacity: 1;
}

@keyframes ani_LR {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  50% {
    -webkit-transform: translateX(10px);
            transform: translateX(10px);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@media (max-width: 1199px) {
  .agenda__temp table {
    font-size: 1rem;
  }
  .agenda__temp table td,
  .agenda__temp table th {
    padding: 12px 10px;
  }
}
@media (max-width: 991px) {
  .agenda__temp {
    max-height: unset;
    overflow-y: hidden;
  }
}
@media (max-width: 767px) {
  .agenda__temp table {
    width: 800px;
    background: #fff;
    border-collapse: separate;
    border-spacing: 0;
  }
  .agenda__temp table td,
  .agenda__temp table th {
    padding: 10px 8px;
  }
}
/*
 * Sitemap
 */
.sitemap-list {
  list-style: none;
  margin: 0;
  padding: 0;
  line-height: 1.4;
}
.sitemap-list .menu-first {
  color: #000;
  -webkit-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  position: relative;
  display: inline-block;
  padding-right: var(--gap-item);
  font-weight: var(--fw-middle);
  white-space: nowrap;
  font-size: var(--fz-listname-sm);
  margin-top: 3px;
  -ms-flex: 0 0 max(19%, 200px);
      flex: 0 0 max(19%, 200px);
}
.sitemap-list .menu-first .num {
  font-style: normal;
  color: #568ae5;
  font-size: 1.0625rem;
  display: block;
  font-weight: 600;
  -webkit-transform: skewX(-10deg);
      -ms-transform: skewX(-10deg);
          transform: skewX(-10deg);
}
.sitemap-list .menu-first ~ .menu-first {
  -ms-flex-negative: 1;
      flex-shrink: 1;
}
.sitemap-list a.menu-first:hover {
  color: #00319f;
}
.sitemap-list ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.sitemap-list > li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 25px;
  padding-bottom: 25px;
  border-top: 1px solid #ddd;
}
.sitemap-list > li:first-child {
  border-top: none;
}
.sitemap-list > li > a {
  display: inline-block;
  white-space: nowrap;
}
.sitemap-list > li > ul {
  margin-top: 1.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.sitemap-list > li > ul > li {
  display: inline-block;
  vertical-align: top;
  padding: 0 calc(var(--gap-item) * 2) 0 0;
  margin: 3px calc(var(--gap-item) * 2) 3px 0;
  position: relative;
}
.sitemap-list > li > ul > li::after {
  content: "";
  display: block;
  position: absolute;
  right: 0;
  top: 0.2em;
  height: 1em;
  width: 1px;
  background-color: #ccc;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}
.sitemap-list > li > ul > li:last-child::after {
  display: none;
}
.sitemap-list > li > ul > li > a {
  color: #555;
  display: inline-block;
}
.sitemap-list > li > ul > li > a:hover {
  color: #00319f;
  text-decoration: underline;
}
.sitemap-list > li.muti {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.sitemap-list > li.muti .menu-first {
  -ms-flex-preferred-size: min(210px, 24%);
      flex-basis: min(210px, 24%);
}

@media (max-width: 991px) {
  .sitemap-list > li > ul > li {
    padding-right: var(--gap-item);
    margin-right: var(--gap-item);
  }
}
@media (max-width: 579px) {
  .sitemap-list > li {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .sitemap-list > li > ul {
    display: block;
  }
  .sitemap-list > li > ul > li {
    padding-right: 0;
    margin-right: 0;
    display: block;
    margin-bottom: 10px;
    font-size: 1.0625rem;
  }
  .sitemap-list > li > ul > li::after {
    display: none;
  }
  .sitemap-list > li.muti {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .sitemap-list > li.muti .menu-first {
    -webkit-box-flex: 0;
        -ms-flex: 0 1 50%;
            flex: 0 1 50%;
    margin-bottom: var(--gap-item);
  }
}
@media (max-width: 449px) {
  .sitemap-list > li {
    display: block;
  }
  .sitemap-list > li > ul {
    margin-left: 2.8em;
  }
  .sitemap-list > li.muti {
    display: block;
  }
  .sitemap-list > li.muti .menu-first {
    width: 100%;
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    padding-bottom: 15px;
    border-bottom: 1px solid #ddd;
  }
  .sitemap-list > li.muti:last-child .menu-first:last-child {
    border-bottom: none;
  }
}
/*
 * Privacy
 */
#privacy .editor-wrap {
  color: #444;
}

/* 
 * 編輯器預設通用樣式
 */
.editor-wrap, .cke_editable {
  font-family: "Nunito Sans", "Noto Sans TC", "Microsoft JhengHei UI", sans-serif;
  color: #454545;
  background: #fff;
  font-weight: var(--fw-normal);
  font-size: var(--fz-brief);
  line-height: 2.2;
}
.editor-wrap img, .cke_editable img {
  line-height: 0;
  display: inline-block;
  border-radius: var(--radius);
}
.editor-wrap ol, .editor-wrap ul, .cke_editable ol, .cke_editable ul {
  margin-top: 0;
  margin-bottom: 1rem;
}
.editor-wrap h1, .editor-wrap h2, .editor-wrap h3, .editor-wrap h4, .editor-wrap h5, .editor-wrap h6, .cke_editable h1, .cke_editable h2, .cke_editable h3, .cke_editable h4, .cke_editable h5, .cke_editable h6 {
  display: block;
  font-weight: 700;
  margin: 15px auto;
  padding: 0;
}
.editor-wrap h1 span, .editor-wrap h2 span, .editor-wrap h3 span, .editor-wrap h4 span, .editor-wrap h5 span, .editor-wrap h6 span, .cke_editable h1 span, .cke_editable h2 span, .cke_editable h3 span, .cke_editable h4 span, .cke_editable h5 span, .cke_editable h6 span {
  font-size: inherit;
}
.editor-wrap h1, .cke_editable h1 {
  font-size: var(--fz-h1);
}
.editor-wrap h2, .cke_editable h2 {
  font-size: var(--fz-h2);
}
.editor-wrap h3, .cke_editable h3 {
  font-size: var(--fz-h3);
}
.editor-wrap h4, .cke_editable h4 {
  font-size: var(--fz-h4);
}
.editor-wrap h5, .cke_editable h5 {
  font-size: var(--fz-h5);
}
.editor-wrap h6, .cke_editable h6 {
  font-size: var(--fz-h6);
}
.editor-wrap blockquote, .cke_editable blockquote {
  padding: 10px 20px;
  margin: 0 0 20px;
  font-size: 17.5px;
  border-left: 5px solid #ddd;
}
.editor-wrap p, .cke_editable p {
  margin-top: 5px;
  margin-bottom: 5px;
}
.editor-wrap hr, .cke_editable hr {
  border: none;
  border-bottom: 1px solid #ddd;
  margin: calc(var(--gap-vertical) * 0.5) auto var(--gap-vertical);
}
.editor-wrap video, .editor-wrap embed, .editor-wrap iframe, .cke_editable video, .cke_editable embed, .cke_editable iframe {
  width: 100%;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: 16/9 !important;
}
.editor-wrap a, .cke_editable a {
  color: #568ae5;
  text-decoration: underline;
}
.editor-wrap a:hover, .cke_editable a:hover {
  color: #0069df;
  text-decoration: none;
}

/*
 * 樣板KIT - 表格樣式
 */
/*
 * 樣板KIT - 區塊粗體標題
 */
.theme-block-title {
  display: block;
  font-size: var(--fz-h5) !important;
  font-weight: var(--fw-middle) !important;
  line-height: 1.6;
  margin-top: 15px;
  margin-bottom: 15px;
  padding: 0;
  color: #000;
}
.theme-block-title h1, .theme-block-title h2, .theme-block-title h3, .theme-block-title h4, .theme-block-title h5, .theme-block-title h6 {
  font: inherit;
  margin: 0;
  padding: 0;
}
.theme-block-title.color-blue {
  color: #00319f;
}

h1.theme-block-title, h2.theme-block-title, h3.theme-block-title, h4.theme-block-title, h5.theme-block-title, h6.theme-block-title {
  font-size: var(--fz-h5) !important;
}

/*
 * 樣板KIT - 底線標題
 */
.theme-underline-title {
  position: relative;
  display: block;
  font-size: var(--fz-h5) !important;
  font-weight: var(--fw-middle) !important;
  line-height: 1.6;
  min-height: calc(var(--fz-h5) * 1.6 + 12px);
  margin: 5px 0 var(--gap);
  padding: 2px 0 10px 1.5em !important;
  border-bottom: 2px solid #ddd;
  color: #000;
}
.theme-underline-title h1, .theme-underline-title h2, .theme-underline-title h3, .theme-underline-title h4, .theme-underline-title h5, .theme-underline-title h6 {
  font: inherit;
  margin: 0;
  padding: 0;
}
.theme-underline-title::before {
  content: "";
  display: block;
  position: absolute;
  top: 0.65em;
  left: 0.2em;
  width: 8px;
  height: 8px;
  background-color: #00319f;
}

h1.theme-block-title, h2.theme-block-title, h3.theme-block-title, h4.theme-block-title, h5.theme-block-title, h6.theme-block-title {
  font-size: var(--fz-h5) !important;
}

/*
 * 樣板KIT - 清單 UL / OL
 */
.theme-list, .editor-wrap ul, .cke_editable ul {
  list-style: none;
  margin: 0 0 var(--gap) 0;
  padding: 0;
}
.theme-list > li, .editor-wrap ul > li, .cke_editable ul > li {
  position: relative;
  padding-left: 1.8em;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  line-height: 1.6;
  display: list-item;
  list-style-position: outside;
}
.theme-list > li::before, .editor-wrap ul > li::before, .cke_editable ul > li::before {
  content: "";
  display: block;
  position: absolute;
  width: 5px;
  height: 5px;
  left: 0.8em;
  top: 0.6em;
  border-radius: 50%;
  background: #666;
}

.theme-list-number, .editor-wrap ol, .cke_editable ol {
  list-style-image: url(data:0);
  list-style: decimal;
  margin: 0 0 var(--gap) 0;
  padding: 0 0 0 2em;
  counter-reset: newcounter;
}
.theme-list-number > li, .editor-wrap ol > li, .cke_editable ol > li {
  position: relative;
  padding: 0 0 0 0.2em;
  margin: 0.5em 0 0.5em -0.5em;
  display: list-item;
  list-style-position: outside;
  line-height: 1.6;
}
.theme-list-number > li > ol, .editor-wrap ol > li > ol, .cke_editable ol > li > ol {
  margin: 0 0 var(--gap) 0.9em;
  padding: 0 0 0 1em;
}
.theme-list-number > li > ol > li, .editor-wrap ol > li > ol > li, .cke_editable ol > li > ol > li {
  position: relative;
  padding: 0;
  margin: 5px 0 5px;
  display: block;
}
.theme-list-number > li > ol > li:first-of-type, .editor-wrap ol > li > ol > li:first-of-type, .cke_editable ol > li > ol > li:first-of-type {
  counter-reset: newcounter;
}
.theme-list-number > li > ol > li::before, .editor-wrap ol > li > ol > li::before, .cke_editable ol > li > ol > li::before {
  width: 1.9rem;
  position: absolute;
  top: 0;
  left: -2.2rem;
  text-align: center;
  white-space: nowrap;
  counter-increment: newcounter;
  content: "(" counter(newcounter) ")";
}

/*
 * 【樣板】單欄圖文
 */
.theme-single-column {
  position: relative;
  display: block;
  text-align: center;
}
.theme-single-column > * {
  display: block;
  margin: 0 auto var(--gap-item);
  height: auto !important;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  z-index: 10;
}
.theme-single-column .pic {
  margin-bottom: var(--gap);
}
.theme-single-column .pic + .text {
  margin-top: var(--gap);
}
.theme-single-column .text {
  max-width: calc(var(--w-container) + var(--gap) * 2);
  margin: 0 auto calc(var(--gap) * 2);
}
.theme-single-column .text + .pic {
  margin-top: var(--gap);
}

/*
 * 【樣板】左圖右文
 */
.theme-r-text-l-pic {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
}
.theme-r-text-l-pic .pic {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 41%;
          flex: 1 0 41%;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  width: 41%;
  line-height: 0;
  position: relative;
  z-index: 10;
}
.theme-r-text-l-pic .text {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 58%;
          flex: 1 0 58%;
  display: inline-block;
  vertical-align: middle;
  width: 58%;
  padding-left: max(3.5vw, var(--gap) * 2);
}
.theme-r-text-l-pic.theme-pic-lager .pic {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 55%;
          flex: 1 0 55%;
  width: 55%;
}
.theme-r-text-l-pic.theme-pic-lager .text {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 45%;
          flex: 1 0 45%;
  width: 45%;
}

/*
 * 【樣板】左文右圖
 */
.theme-r-pic-l-text {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
.theme-r-pic-l-text .pic {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 41%;
          flex: 1 0 41%;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  width: 41%;
  text-align: right;
  line-height: 0;
  position: relative;
  z-index: 10;
}
.theme-r-pic-l-text .text {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 58%;
          flex: 1 0 58%;
  display: inline-block;
  vertical-align: middle;
  width: 58%;
  padding-right: max(3.5vw, var(--gap) * 2);
}
.theme-r-pic-l-text.theme-pic-lager .pic {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 55%;
          flex: 1 0 55%;
  width: 55%;
}
.theme-r-pic-l-text.theme-pic-lager .text {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 45%;
          flex: 1 0 45%;
  width: 45%;
}

/*
 * 【樣板】多欄圖文
 */
.theme-mutiple-columns {
  position: relative;
  margin: 0 calc(var(--gap-item) * -1) var(--gap-vertical) calc(var(--gap-item) * -1);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.theme-mutiple-columns > * {
  display: inline-block;
  vertical-align: top;
  width: calc(33.3333333333% - var(--gap-item) * 2);
  margin: 0 var(--gap-item) calc(var(--gap-item) * 2);
  height: auto !important;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  z-index: 10;
}
.theme-mutiple-columns .pic {
  text-align: center;
  margin-bottom: calc(var(--gap-item) + 10px);
}
.theme-mutiple-columns .pic + .text {
  margin-top: 20px;
}

.theme-r-text-l-pic,
.theme-r-pic-l-text,
.theme-single-column,
.theme-mutiple-columns {
  margin-bottom: calc(var(--gap-vertical) * 0.5);
}
.theme-r-text-l-pic + .theme-r-text-l-pic,
.theme-r-text-l-pic + .theme-r-pic-l-text,
.theme-r-text-l-pic + .theme-single-column,
.theme-r-text-l-pic + .theme-mutiple-columns,
.theme-r-text-l-pic + .theme-columns-icons,
.theme-r-pic-l-text + .theme-r-text-l-pic,
.theme-r-pic-l-text + .theme-r-pic-l-text,
.theme-r-pic-l-text + .theme-single-column,
.theme-r-pic-l-text + .theme-mutiple-columns,
.theme-r-pic-l-text + .theme-columns-icons,
.theme-single-column + .theme-r-text-l-pic,
.theme-single-column + .theme-r-pic-l-text,
.theme-single-column + .theme-single-column,
.theme-single-column + .theme-mutiple-columns,
.theme-single-column + .theme-columns-icons,
.theme-mutiple-columns + .theme-r-text-l-pic,
.theme-mutiple-columns + .theme-r-pic-l-text,
.theme-mutiple-columns + .theme-single-column,
.theme-mutiple-columns + .theme-mutiple-columns,
.theme-mutiple-columns + .theme-columns-icons {
  padding-top: calc(var(--gap-vertical) * 0.5);
}

/*
 * 編輯器樣板 RWD
 */
@media (max-width: 1499px) {
  .theme-columns-icons .item {
    -webkit-box-flex: 1;
        -ms-flex: 1 0 calc(25% - var(--gap-item) * 2);
            flex: 1 0 calc(25% - var(--gap-item) * 2);
  }
}
@media (max-width: 991px) {
  .theme-r-pic-l-text, .theme-r-text-l-pic {
    display: block;
  }
  .theme-r-pic-l-text .pic, .theme-r-text-l-pic .pic {
    display: block;
    width: 100%;
    margin: 0 auto var(--gap) auto;
    padding: 0;
  }
  .theme-r-pic-l-text .text, .theme-r-text-l-pic .text {
    display: block;
    width: 100%;
    padding: 0;
  }
}
@media (max-width: 839px) {
  .theme-columns-icons .item {
    -webkit-box-flex: 1;
        -ms-flex: 1 0 calc(33.3333333333% - var(--gap-item) * 2);
            flex: 1 0 calc(33.3333333333% - var(--gap-item) * 2);
  }
  .theme-mutiple-columns {
    display: block;
    margin: 0 auto;
  }
  .theme-mutiple-columns > * {
    margin: 0 auto calc(var(--gap-item) * 2);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
  }
  .theme-mutiple-columns .pic {
    -ms-flex-preferred-size: 250px;
        flex-basis: 250px;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    overflow: hidden;
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: stretch;
        -ms-flex-pack: stretch;
            justify-content: stretch;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
  }
  .theme-mutiple-columns .pic img {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    -o-object-fit: contain;
       object-fit: contain;
    -o-object-position: center top;
       object-position: center top;
  }
  .theme-mutiple-columns .pic + .text {
    margin-top: 0;
  }
  .theme-mutiple-columns img {
    line-height: 0;
    display: block;
  }
  .theme-mutiple-columns .text {
    -ms-flex-preferred-size: calc(100% - 250px - var(--gap));
        flex-basis: calc(100% - 250px - var(--gap));
    padding-left: var(--gap);
  }
}
@media (max-width: 767px) {
  .theme-single-column .pic + .text {
    margin-top: var(--gap);
  }
  .theme-r-text-l-pic,
  .theme-r-pic-l-text,
  .theme-single-column,
  .theme-mutiple-columns,
  .theme-mutiple-columns-gray {
    margin-bottom: var(--gap-vertical);
  }
  .theme-r-text-l-pic + .theme-r-text-l-pic,
  .theme-r-text-l-pic + .theme-r-pic-l-text,
  .theme-r-text-l-pic + .theme-single-column,
  .theme-r-text-l-pic + .theme-mutiple-columns,
  .theme-r-text-l-pic + .theme-mutiple-columns-gray,
  .theme-r-pic-l-text + .theme-r-text-l-pic,
  .theme-r-pic-l-text + .theme-r-pic-l-text,
  .theme-r-pic-l-text + .theme-single-column,
  .theme-r-pic-l-text + .theme-mutiple-columns,
  .theme-r-pic-l-text + .theme-mutiple-columns-gray,
  .theme-single-column + .theme-r-text-l-pic,
  .theme-single-column + .theme-r-pic-l-text,
  .theme-single-column + .theme-single-column,
  .theme-single-column + .theme-mutiple-columns,
  .theme-single-column + .theme-mutiple-columns-gray,
  .theme-mutiple-columns + .theme-r-text-l-pic,
  .theme-mutiple-columns + .theme-r-pic-l-text,
  .theme-mutiple-columns + .theme-single-column,
  .theme-mutiple-columns + .theme-mutiple-columns,
  .theme-mutiple-columns + .theme-mutiple-columns-gray,
  .theme-mutiple-columns-gray + .theme-r-text-l-pic,
  .theme-mutiple-columns-gray + .theme-r-pic-l-text,
  .theme-mutiple-columns-gray + .theme-single-column,
  .theme-mutiple-columns-gray + .theme-mutiple-columns,
  .theme-mutiple-columns-gray + .theme-mutiple-columns-gray {
    padding-top: var(--gap);
  }
}
@media (max-width: 579px) {
  .theme-p {
    padding: 0;
    margin: 0 0 15px;
  }
  .theme-columns-icons {
    display: block;
  }
  .theme-columns-icons .item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: left;
    padding: 10px;
  }
  .theme-columns-icons .pic {
    max-width: 90px;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 90px;
            flex: 0 0 90px;
  }
  .theme-columns-icons .pic + .text {
    margin-top: 0;
    max-width: none;
    padding-left: var(--gap-item);
  }
  .theme-columns-icons .text {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
  }
  .theme-mutiple-columns > * {
    display: block;
    margin: 0 auto calc(var(--gap) * 2);
  }
  .theme-mutiple-columns .pic {
    width: 100%;
    margin: 0 auto var(--gap) auto;
  }
  .theme-mutiple-columns .pic img {
    position: relative;
    top: auto;
    left: auto;
  }
  .theme-mutiple-columns .pic + .text {
    margin-top: 20px;
  }
  .theme-mutiple-columns .text {
    padding-left: 0;
  }
}
/*
 * 編輯器樣板 動畫
 */
.theme-mutiple-columns [data-scroll=in] {
  -webkit-animation: ani_fade_in_up 1.3s both;
          animation: ani_fade_in_up 1.3s both;
}
.theme-mutiple-columns [data-scroll=in]:nth-child(6n+1) {
  -webkit-animation-delay: 0.02s;
          animation-delay: 0.02s;
}
.theme-mutiple-columns [data-scroll=in]:nth-child(6n+2) {
  -webkit-animation-delay: 0.04s;
          animation-delay: 0.04s;
}
.theme-mutiple-columns [data-scroll=in]:nth-child(6n+3) {
  -webkit-animation-delay: 0.06s;
          animation-delay: 0.06s;
}
.theme-mutiple-columns [data-scroll=in]:nth-child(6n+4) {
  -webkit-animation-delay: 0.08s;
          animation-delay: 0.08s;
}
.theme-mutiple-columns [data-scroll=in]:nth-child(6n+5) {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s;
}
.theme-mutiple-columns [data-scroll=in]:nth-child(6n+6) {
  -webkit-animation-delay: 0.12s;
          animation-delay: 0.12s;
}

.theme-single-column[data-scroll=in] {
  -webkit-animation: ani_fade_in 1.3s both;
          animation: ani_fade_in 1.3s both;
}

@media (min-width: 992px) {
  .theme-r-pic-l-text[data-scroll=in] .pic {
    -webkit-animation: ani_fade_in_right 1.3s both;
            animation: ani_fade_in_right 1.3s both;
  }
  .theme-r-pic-l-text[data-scroll=in] .text {
    -webkit-animation: ani_fade_in_left 1.3s both;
            animation: ani_fade_in_left 1.3s both;
  }
  .theme-r-text-l-pic[data-scroll=in] .pic {
    -webkit-animation: ani_fade_in_left 1.3s both;
            animation: ani_fade_in_left 1.3s both;
  }
  .theme-r-text-l-pic[data-scroll=in] .text {
    -webkit-animation: ani_fade_in_right 1.3s both;
            animation: ani_fade_in_right 1.3s both;
  }
}
@media (max-width: 991px) {
  .theme-r-pic-l-text[data-scroll=in] .pic {
    -webkit-animation: ani_fade_in_up 1.3s both;
            animation: ani_fade_in_up 1.3s both;
  }
  .theme-r-pic-l-text[data-scroll=in] .text {
    -webkit-animation: ani_fade_in_up 1.3s 0.25s both;
            animation: ani_fade_in_up 1.3s 0.25s both;
  }
  .theme-r-text-l-pic[data-scroll=in] .pic {
    -webkit-animation: ani_fade_in_up 1.3s both;
            animation: ani_fade_in_up 1.3s both;
  }
  .theme-r-text-l-pic[data-scroll=in] .text {
    -webkit-animation: ani_fade_in_up 1.3s 0.25s both;
            animation: ani_fade_in_up 1.3s 0.25s both;
  }
}