@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Noto+Sans+TC:wght@100..900&display=swap");
:root {
  --fs-def: 16px;
}

/* 
 * 全域變數
 */
:root {
  --color-main: rgb(62 186 186);
  --color-main2: rgb(64 176 176);
  --color-orange: rgb(235 95 33);
  --color-yellow: rgb(235 185 76);
  --ff-def: "Inter", "Noto Sans TC", "Microsoft JhengHei UI", sans-serif;
  --fs-subhead: clamp(26 / 16 * var(--fs-def, 16px), 16.0975609756 / 16 * var(--fs-def, 16px) + 1.7073170732vw, 40 / 16 * var(--fs-def, 16px));
  --fs-subhead-lg: clamp(30 / 16 * var(--fs-def, 16px), 8.7804878049 / 16 * var(--fs-def, 16px) + 3.6585365854vw, 60 / 16 * var(--fs-def, 16px));
  --fs-listname: clamp(19 / 16 * var(--fs-def, 16px), 14.0487804878 / 16 * var(--fs-def, 16px) + 0.8536585366vw, 26 / 16 * var(--fs-def, 16px));
  --fs-listname-lg: clamp(20 / 16 * var(--fs-def, 16px), 12.9268292683 / 16 * var(--fs-def, 16px) + 1.2195121951vw, 30 / 16 * var(--fs-def, 16px));
  --fs-listname-sm: clamp(17 / 16 * var(--fs-def, 16px), 12.0487804878 / 16 * var(--fs-def, 16px) + 0.8536585366vw, 24 / 16 * var(--fs-def, 16px));
  --fs-btn: clamp(16 / 16 * var(--fs-def, 16px), 13.1707317073 / 16 * var(--fs-def, 16px) + 0.487804878vw, 20 / 16 * var(--fs-def, 16px));
  --fs-brief: clamp(16 / 16 * var(--fs-def, 16px), 14.5853658537 / 16 * var(--fs-def, 16px) + 0.243902439vw, 18 / 16 * var(--fs-def, 16px));
  --fs-h1: clamp(28 / 16 * var(--fs-def, 16px), 25.1707317073 / 16 * var(--fs-def, 16px) + 0.487804878vw, 32 / 16 * var(--fs-def, 16px));
  --fs-h2: clamp(26 / 16 * var(--fs-def, 16px), 23.1707317073 / 16 * var(--fs-def, 16px) + 0.487804878vw, 30 / 16 * var(--fs-def, 16px));
  --fs-h3: clamp(24 / 16 * var(--fs-def, 16px), 22.5853658537 / 16 * var(--fs-def, 16px) + 0.243902439vw, 26 / 16 * var(--fs-def, 16px));
  --fs-h4: clamp(22 / 16 * var(--fs-def, 16px), 20.5853658537 / 16 * var(--fs-def, 16px) + 0.243902439vw, 24 / 16 * var(--fs-def, 16px));
  --fs-h5: clamp(20 / 16 * var(--fs-def, 16px), 18.5853658537 / 16 * var(--fs-def, 16px) + 0.243902439vw, 22 / 16 * var(--fs-def, 16px));
  --fs-h6: clamp(18 / 16 * var(--fs-def, 16px), 16.5853658537 / 16 * var(--fs-def, 16px) + 0.243902439vw, 20 / 16 * var(--fs-def, 16px));
  --w-container: 1490px;
  --w-container-md: 1420px;
  --w-container-sm: 1260px;
  --h-input: 45px;
  --h-btn: 45px;
  --h-header: 160px;
  --gap: 25px;
  --gap-sec: max(50px, 5.7vw);
  --gap-leave: calc(max(0px, ((100vw - var(--w-container)) * 0.5)) + var(--gap));
}
:root [data-fontsize=l] {
  --fs-listname-sm: clamp(17 / 16 * var(--fs-def, 16px), 13.4634146341 / 16 * var(--fs-def, 16px) + 0.6097560976vw, 22 / 16 * var(--fs-def, 16px));
}
:root [data-fontsize=s] {
  --w-container: 1290px;
}
:root [data-fontsize=l] {
  --w-container: 1520px;
}
:root [data-fontsize=s] {
  --w-container-md: 1200px;
}
:root [data-fontsize=l] {
  --w-container-md: 1490px;
}
:root [data-fontsize=s] {
  --w-container-sm: 1180px;
}
:root [data-fontsize=l] {
  --w-container-sm: 1350px;
}
:root [data-fontsize=m] .header {
  --w-container: 1560px;
}
:root [data-fontsize=l] .header {
  --w-container: 1760px;
}
:root [data-fontsize=l] {
  --h-input: 50px;
  --h-btn: 50px;
}
:root [data-fontsize=s] {
  --h-input: 38px;
  --h-btn: 38px;
}
:root [data-fontsize=s] {
  --h-header: 150px;
}
:root [data-fontsize=l] {
  --h-header: 180px;
}
:root [data-fontsize=s] {
  --gap-sec: max(35px, 3.6vw);
}
:root [data-fontsize=s] {
  --gap-leave: calc(max(0px, ((100vw - var(--w-container)) * 0.5)) + var(--gap));
}
:root .container.sm {
  --gap-leave: calc(max(0px, ((100vw - var(--w-container-sm)) * 0.5)) + var(--gap));
}

@media (max-width: 1599px) {
  :root {
    --h-header: 160px;
  }
  :root [data-fontsize=s] {
    --h-header: 150px;
  }
  :root [data-fontsize=l] {
    --h-header: 100px;
  }
}
@media (max-width: 1399px) {
  :root [data-fontsize=m] {
    --h-header: 100px;
  }
}
@media (max-width: 1199px) {
  :root [data-fontsize=s] {
    --h-header: 100px;
  }
}
@media (max-width: 991px) {
  :root {
    --h-input: 45px;
  }
}
@media (max-width: 767px) {
  :root {
    --gap: 20px;
  }
  :root [data-fontsize=s], :root [data-fontsize=m], :root [data-fontsize=l] {
    --h-header: 70px;
  }
}
@media (max-width: 639px) {
  [data-fontsize=s], [data-fontsize=m], [data-fontsize=l] {
    --h-input: 45px;
    --h-btn: 45px;
  }
}
/* 
 * Reset
 */
* {
  min-width: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: relative;
}
*::before, *::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

body {
  margin: 0;
}

:focus-visible,
:focus,
.is-focus > a {
  outline: -webkit-focus-ring-color solid 2px;
  outline-color: #ff8945;
  outline-style: solid;
  outline-width: 3px;
  outline: 3px dashed #ff8945;
}

h1, h2, h3, h4, h5, h6 {
  text-wrap: pretty;
}

p {
  text-wrap: pretty;
}

a {
  text-decoration: none;
}

a[accesskey],
.tactile {
  font-size: 0.875rem !important;
  color: var(--color-main);
  line-height: 1.5;
  position: absolute !important;
  top: 0;
  left: 0;
  z-index: 50;
}
a[accesskey] span,
.tactile span {
  color: transparent;
}
a[accesskey]:focus,
.tactile:focus {
  opacity: 1;
}
a[accesskey]:focus span,
.tactile:focus span {
  color: var(--color-main);
}

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

img, picture, svg, video, canvas {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
  font-style: italic;
  background-repeat: no-repeat;
  background-size: cover;
}

hr {
  border: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  margin: var(--gap) auto;
}

img {
  -o-object-position: center;
     object-position: center;
  -o-object-fit: cover;
     object-fit: cover;
}

input, button, textarea, select {
  font: inherit;
}

::-webkit-input-placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
:-moz-placeholder {
  font-size: 1rem;
  font-weight: 420;
  color: #aaa;
  opacity: 1;
}

input[type=date]::-webkit-inner-spin-button {
  display: none;
  -webkit-appearance: none;
}

textarea {
  resize: vertical;
}

body, html {
  margin: 0;
  padding: 0;
  font-family: var(--ff-def);
  font-weight: 420;
  color: #000;
  background-color: #fff;
  line-height: 1.8;
  word-wrap: break-word;
  text-wrap: pretty;
}
body *, html * {
  scrollbar-width: thin;
}

html {
  font-size: var(--fs-def);
}

body {
  font-size: 1.25rem;
  padding-top: var(--h-header);
}
@media (max-width: 767px) {
  body {
    font-size: 1.125rem;
  }
}

/**!
 * * 保留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: 1199px) {
  .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: 1199px) {
  .visible-md-block {
    display: block !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline {
    display: inline !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 1200px) {
  .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: 1200px) {
  .visible-lg-block {
    display: block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline {
    display: inline !important;
  }
}
@media (min-width: 1200px) {
  .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: 1199px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .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;
}

.sr-only-focusable:active, .sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}

/**
 * Header
 */
.header {
  z-index: 1000;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background-color: #fff;
  -webkit-transition: -webkit-transform 0.35s cubic-bezier(0.64, 0.69, 0.75, 1.05);
  transition: -webkit-transform 0.35s cubic-bezier(0.64, 0.69, 0.75, 1.05);
  transition: transform 0.35s cubic-bezier(0.64, 0.69, 0.75, 1.05);
  transition: transform 0.35s cubic-bezier(0.64, 0.69, 0.75, 1.05), -webkit-transform 0.35s cubic-bezier(0.64, 0.69, 0.75, 1.05);
}
.header > .container {
  z-index: 50;
  height: calc(var(--h-header) - var(--h-header) * 0.2);
  -webkit-transition: height 0.25s;
  transition: height 0.25s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 0 max(3vw, var(--gap));
  margin-top: calc(var(--h-header) * 0.2);
}
[data-fontsize=s] .header > .container {
  height: calc(var(--h-header) - var(--h-header) * 0.1);
  margin-top: calc(var(--h-header) * 0.1);
}

.logo {
  margin: 0;
  padding: 0;
  width: 660px;
  display: block;
  max-width: calc(var(--h-header) * 1.4);
  -ms-flex-item-align: center;
      align-self: center;
}
.logo > * {
  display: block;
  position: relative;
  width: 100%;
  padding-bottom: 48.4848484848%;
  font-size: 0;
  background: url("../images/logo.png") no-repeat 0 0/contain;
  z-index: 0;
}

.is-fixed-header .header {
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
          box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}

.h-func__wrap {
  position: absolute;
  top: calc(var(--h-header) * 0.06);
  right: var(--gap);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--fs-listname-sm);
  gap: 0 20px;
}

.h-func__item {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.h-func__link {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #000;
  white-space: nowrap;
  border: none;
  background-color: transparent;
  cursor: pointer;
}
.h-func__link.icon-member::before {
  width: var(--h-input);
  height: var(--h-input);
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  margin-right: 5px;
  content: "";
  display: inline-block;
  background: url(../images/icon_member.svg) no-repeat center center/contain;
}
.h-func__link.icon-search::before {
  width: var(--h-input);
  height: var(--h-input);
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  margin-right: 5px;
  content: "";
  display: inline-block;
  background: url(../images/icon_search.svg) no-repeat center center/contain;
}
.h-func__link.icon-sitemap::before {
  width: var(--h-input);
  height: var(--h-input);
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  margin-right: 5px;
  content: "";
  display: inline-block;
  background: url(../images/icon_sitemap.svg) no-repeat center center/contain;
}

.search__pop {
  display: none;
  position: absolute;
  right: -2px;
  background-color: var(--color-main);
  padding: 10px 10px 10px var(--h-input);
  width: 300px;
  z-index: 1000;
  border-radius: 3px;
  -webkit-box-shadow: 0 0 0 max(100vw, 100vh) rgba(0, 0, 0, 0.3);
          box-shadow: 0 0 0 max(100vw, 100vh) rgba(0, 0, 0, 0.3);
  -webkit-transition: -webkit-transform 0.35s;
  transition: -webkit-transform 0.35s;
  transition: transform 0.35s;
  transition: transform 0.35s, -webkit-transform 0.35s;
}
.search__pop.is-open {
  display: block;
  -webkit-animation: ani_search_open 0.35s;
          animation: ani_search_open 0.35s;
}
.search__pop form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
}
.search__close {
  z-index: 3;
  position: absolute;
  left: 0;
  top: 10px;
  width: var(--h-input);
  height: var(--h-input);
  border: none;
  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='%23fff' d='M18.3 5.71a.996.996 0 0 0-1.41 0L12 10.59L7.11 5.7A.996.996 0 1 0 5.7 7.11L10.59 12L5.7 16.89a.996.996 0 1 0 1.41 1.41L12 13.41l4.89 4.89a.996.996 0 1 0 1.41-1.41L13.41 12l4.89-4.89c.38-.38.38-1.02 0-1.4'/%3E%3C/svg%3E") no-repeat center center/20px auto;
  font-size: 0;
  cursor: pointer;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
}
.search__input {
  z-index: 0;
  width: 100%;
  height: var(--h-input);
  padding: 0 var(--h-input) 0 10px;
  font-size: var(--fs-listname-sm);
  border: 1px solid var(--color-main);
  background-color: #fff;
  color: #000;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
}
.search__input:focus {
  border-color: var(--color-main);
}
.search__send {
  z-index: 2;
  position: absolute;
  right: 0;
  top: 0;
  border: none;
  width: var(--h-input);
  height: var(--h-input);
  background: url(../images/icon_search.svg) no-repeat center center/contain;
  font-size: 0;
  cursor: pointer;
  -webkit-transition: -webkit-transform 0.25s;
  transition: -webkit-transform 0.25s;
  transition: transform 0.25s;
  transition: transform 0.25s, -webkit-transform 0.25s;
}
.pc .search__send:hover {
  -webkit-transform: scale(1.05);
      -ms-transform: scale(1.05);
          transform: scale(1.05);
}

.fontsize__switch {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  white-space: nowrap;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  margin-right: 5px;
}
.fontsize__popup {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0 5px;
}
.fontsize__popup > li {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
.fontsize__popup [type=radio] {
  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;
}
.fontsize__popup [type=radio] + label {
  border: none;
  cursor: pointer;
  width: var(--h-input);
  height: var(--h-input);
  line-height: var(--h-input);
  display: block;
  background-color: #fff;
  color: #000;
  -webkit-transition: background-color 0.25s;
  transition: background-color 0.25s;
  white-space: nowrap;
  font-size: var(--fs-listname-sm);
  text-align: center;
}
.fontsize__popup [type=radio]:checked + label {
  background-color: rgba(62, 186, 186, 0.4);
  color: #000;
}
.fontsize__popup [type=radio]:focus + label {
  outline: 2px solid #ffce74;
}
.fontsize__popup #fontsize-s + label {
  text-indent: 0.125em;
}
.fontsize__popup #fontsize-l + label {
  text-indent: 0.125em;
}

.nav .menu ul, .nav .sitemap-info, .nav .sitemap-subhead, .nav .sitemap-close {
  display: none;
}

.sitemap-info {
  background-color: rgba(62, 186, 186, 0.05);
  padding: 10px var(--gap);
}
.sitemap-info ol {
  padding: 0 0 0 2rem;
  margin: 1em 0;
}
.sitemap-info ol > li {
  margin: 0.25em 0;
  padding: 0;
}
.sitemap-info p {
  margin-bottom: 0;
}
.sitemap-info kbd {
  border: 1px solid var(--color-main);
  background-color: rgba(62, 186, 186, 0.05);
  border-radius: 5px;
  padding: 0 10px;
}

@media (min-width: 1200px) {
  [data-fontsize=s] #header > .container > .nav {
    display: block !important;
    opacity: 1 !important;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    border-bottom: 1px solid var(--color-main);
  }
  [data-fontsize=s] #header > .container > .nav > #navigation {
    display: block;
  }
  [data-fontsize=s] #header > .container > .nav > #navigation > .menu {
    height: auto !important;
  }
  [data-fontsize=s] #header > .container > .nav > #navigation > .menu > li {
    position: relative !important;
    -webkit-transform: none !important;
        -ms-transform: none !important;
            transform: none !important;
    top: auto !important;
    left: auto !important;
  }
  [data-fontsize=s] .menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 0 15px;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  [data-fontsize=s] .menu > li {
    display: inline-block;
    vertical-align: top;
  }
  [data-fontsize=s] .menu > li::before {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 0px;
    margin-left: -7px;
    width: 14px;
    height: 14px;
    border-radius: 14px;
    background-color: var(--color-main);
    -webkit-transition: -webkit-transform 0.25s;
    transition: -webkit-transform 0.25s;
    transition: transform 0.25s;
    transition: transform 0.25s, -webkit-transform 0.25s;
    -webkit-transform: scale(0);
        -ms-transform: scale(0);
            transform: scale(0);
  }
  [data-fontsize=s] .menu > li > a {
    display: block;
    text-align: center;
    font-size: var(--fs-listname-sm);
    opacity: 1 !important;
    color: #000;
    line-height: 1.5;
    white-space: nowrap;
    -webkit-transition: color 0.25s;
    transition: color 0.25s;
    padding: 25px 0 12px 0;
    -webkit-transform: none !important;
        -ms-transform: none !important;
            transform: none !important;
  }
  [data-fontsize=s] .menu > li > a::after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    bottom: -1px;
    width: 100%;
    height: 3px;
    -webkit-transform-origin: left top;
        -ms-transform-origin: left top;
            transform-origin: left top;
    background-color: var(--color-main);
    -webkit-transition: -webkit-transform 0.25s;
    transition: -webkit-transform 0.25s;
    transition: transform 0.25s;
    transition: transform 0.25s, -webkit-transform 0.25s;
    -webkit-transform: scaleX(0) translateX(-50%);
        -ms-transform: scaleX(0) translateX(-50%);
            transform: scaleX(0) translateX(-50%);
  }
  .pc [data-fontsize=s] .menu > li:hover::before {
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
  }
  .pc [data-fontsize=s] .menu > li:hover > a {
    color: #000;
  }
  .pc [data-fontsize=s] .menu > li:hover > a::after {
    -webkit-transform: scaleX(1) translateX(-50%);
        -ms-transform: scaleX(1) translateX(-50%);
            transform: scaleX(1) translateX(-50%);
  }
  [data-fontsize=s] .fontsize__switch {
    display: none;
  }
  [data-fontsize=s] .fontsize__popup::before {
    content: "字級";
    color: #000;
    white-space: nowrap;
    margin-right: 0.25em;
  }
}
@media (min-width: 1400px) {
  [data-fontsize=m] #header > .container > .nav {
    display: block !important;
    opacity: 1 !important;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    border-bottom: 1px solid var(--color-main);
  }
  [data-fontsize=m] #header > .container > .nav > #navigation {
    display: block;
  }
  [data-fontsize=m] #header > .container > .nav > #navigation > .menu {
    height: auto !important;
  }
  [data-fontsize=m] #header > .container > .nav > #navigation > .menu > li {
    position: relative !important;
    -webkit-transform: none !important;
        -ms-transform: none !important;
            transform: none !important;
    top: auto !important;
    left: auto !important;
  }
  [data-fontsize=m] .menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 0 15px;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  [data-fontsize=m] .menu > li {
    display: inline-block;
    vertical-align: top;
  }
  [data-fontsize=m] .menu > li::before {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 0px;
    margin-left: -7px;
    width: 14px;
    height: 14px;
    border-radius: 14px;
    background-color: var(--color-main);
    -webkit-transition: -webkit-transform 0.25s;
    transition: -webkit-transform 0.25s;
    transition: transform 0.25s;
    transition: transform 0.25s, -webkit-transform 0.25s;
    -webkit-transform: scale(0);
        -ms-transform: scale(0);
            transform: scale(0);
  }
  [data-fontsize=m] .menu > li > a {
    display: block;
    text-align: center;
    font-size: var(--fs-listname-sm);
    opacity: 1 !important;
    color: #000;
    line-height: 1.5;
    white-space: nowrap;
    -webkit-transition: color 0.25s;
    transition: color 0.25s;
    padding: 25px 0 12px 0;
    -webkit-transform: none !important;
        -ms-transform: none !important;
            transform: none !important;
  }
  [data-fontsize=m] .menu > li > a::after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    bottom: -1px;
    width: 100%;
    height: 3px;
    -webkit-transform-origin: left top;
        -ms-transform-origin: left top;
            transform-origin: left top;
    background-color: var(--color-main);
    -webkit-transition: -webkit-transform 0.25s;
    transition: -webkit-transform 0.25s;
    transition: transform 0.25s;
    transition: transform 0.25s, -webkit-transform 0.25s;
    -webkit-transform: scaleX(0) translateX(-50%);
        -ms-transform: scaleX(0) translateX(-50%);
            transform: scaleX(0) translateX(-50%);
  }
  .pc [data-fontsize=m] .menu > li:hover::before {
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
  }
  .pc [data-fontsize=m] .menu > li:hover > a {
    color: #000;
  }
  .pc [data-fontsize=m] .menu > li:hover > a::after {
    -webkit-transform: scaleX(1) translateX(-50%);
        -ms-transform: scaleX(1) translateX(-50%);
            transform: scaleX(1) translateX(-50%);
  }
  [data-fontsize=m] .fontsize__switch {
    display: none;
  }
  [data-fontsize=m] .fontsize__popup::before {
    content: "字級";
    color: #000;
    white-space: nowrap;
    margin-right: 0.25em;
  }
}
@media (min-width: 1600px) {
  [data-fontsize=l] #header > .container > .nav {
    display: block !important;
    opacity: 1 !important;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    border-bottom: 1px solid var(--color-main);
  }
  [data-fontsize=l] #header > .container > .nav > #navigation {
    display: block;
  }
  [data-fontsize=l] #header > .container > .nav > #navigation > .menu {
    height: auto !important;
  }
  [data-fontsize=l] #header > .container > .nav > #navigation > .menu > li {
    position: relative !important;
    -webkit-transform: none !important;
        -ms-transform: none !important;
            transform: none !important;
    top: auto !important;
    left: auto !important;
  }
  [data-fontsize=l] .menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 0 15px;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  [data-fontsize=l] .menu > li {
    display: inline-block;
    vertical-align: top;
  }
  [data-fontsize=l] .menu > li::before {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 0px;
    margin-left: -7px;
    width: 14px;
    height: 14px;
    border-radius: 14px;
    background-color: var(--color-main);
    -webkit-transition: -webkit-transform 0.25s;
    transition: -webkit-transform 0.25s;
    transition: transform 0.25s;
    transition: transform 0.25s, -webkit-transform 0.25s;
    -webkit-transform: scale(0);
        -ms-transform: scale(0);
            transform: scale(0);
  }
  [data-fontsize=l] .menu > li > a {
    display: block;
    text-align: center;
    font-size: var(--fs-listname-sm);
    opacity: 1 !important;
    color: #000;
    line-height: 1.5;
    white-space: nowrap;
    -webkit-transition: color 0.25s;
    transition: color 0.25s;
    padding: 25px 0 12px 0;
    -webkit-transform: none !important;
        -ms-transform: none !important;
            transform: none !important;
  }
  [data-fontsize=l] .menu > li > a::after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    bottom: -1px;
    width: 100%;
    height: 3px;
    -webkit-transform-origin: left top;
        -ms-transform-origin: left top;
            transform-origin: left top;
    background-color: var(--color-main);
    -webkit-transition: -webkit-transform 0.25s;
    transition: -webkit-transform 0.25s;
    transition: transform 0.25s;
    transition: transform 0.25s, -webkit-transform 0.25s;
    -webkit-transform: scaleX(0) translateX(-50%);
        -ms-transform: scaleX(0) translateX(-50%);
            transform: scaleX(0) translateX(-50%);
  }
  .pc [data-fontsize=l] .menu > li:hover::before {
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
  }
  .pc [data-fontsize=l] .menu > li:hover > a {
    color: #000;
  }
  .pc [data-fontsize=l] .menu > li:hover > a::after {
    -webkit-transform: scaleX(1) translateX(-50%);
        -ms-transform: scaleX(1) translateX(-50%);
            transform: scaleX(1) translateX(-50%);
  }
  [data-fontsize=l] .fontsize__switch {
    display: none;
  }
  [data-fontsize=l] .fontsize__popup::before {
    content: "字級";
    color: #000;
    white-space: nowrap;
    margin-right: 0.25em;
  }
}
@media (min-width: 1400px) and (max-width: 1649px) {
  [data-fontsize=m] .logo {
    max-width: calc(var(--h-header) * 1.2);
  }
}
@media (min-width: 1600px) and (max-width: 1649px) {
  [data-fontsize=l] .logo {
    max-width: calc(var(--h-header) * 1.2);
  }
}
@media (max-width: 1599px) {
  [data-fontsize=l] .logo {
    max-width: calc(var(--h-header) * 1.9);
  }
  [data-fontsize=l] .header {
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
            box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  }
  [data-fontsize=l] .header > .container {
    margin-top: 0;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: var(--h-header);
  }
  [data-fontsize=l] .nav {
    display: none;
    top: var(--h-header);
    right: 0;
    left: auto;
    position: fixed;
    width: 100%;
    height: calc(100dvh - var(--h-header));
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-transform-origin: right center;
        -ms-transform-origin: right center;
            transform-origin: right center;
    padding: var(--gap-sec) var(--gap);
    z-index: 1001;
    background-color: #fff;
  }
  .is-open-nav [data-fontsize=l] .nav {
    display: block;
  }
  [data-fontsize=l] .h-func__wrap {
    position: relative;
    top: auto;
    gap: 0 10px;
    margin-right: -10px;
  }
  [data-fontsize=l] .h-func__link {
    gap: 0;
    white-space: nowrap;
  }
  [data-fontsize=l] .h-func__link .xs-hidden {
    display: none;
  }
  [data-fontsize=l] .h-func__link::before {
    margin-right: 0;
  }
  [data-fontsize=l] .menu {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0 0 max(2vh, var(--h-header)) 0;
    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: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}
@media (max-width: 1599px) and (min-aspect-ratio: 1.2) {
  [data-fontsize=l] .menu {
    padding: 0;
  }
}
@media (max-width: 1599px) {
  [data-fontsize=l] .menu > li {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    display: block;
    margin: 0;
    padding: 0;
    overflow: hidden;
    text-align: center;
  }
  [data-fontsize=l] .menu a {
    font-weight: var(--fw-semibold);
    display: inline-block;
    color: #fff;
    padding: min(25px, 1vh) 0;
    -webkit-transition: -webkit-transform 0.2s;
    transition: -webkit-transform 0.2s;
    transition: transform 0.2s;
    transition: transform 0.2s, -webkit-transform 0.2s;
  }
  .pc [data-fontsize=l] .menu a:hover {
    color: #c1e08f;
  }
  [data-fontsize=l] .is-open-nav:not(.is-close-nav) .nav {
    display: block;
  }
  [data-fontsize=l] .is-open-nav:not(.is-close-nav) .nav__burger {
    background-color: var(--color-main);
  }
  [data-fontsize=l] .is-open-nav:not(.is-close-nav) .nav__burger > div:nth-child(1) {
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
    margin-top: 0;
  }
  [data-fontsize=l] .is-open-nav:not(.is-close-nav) .nav__burger > div:nth-child(2) {
    display: none;
  }
  [data-fontsize=l] .is-open-nav:not(.is-close-nav) .nav__burger > div:nth-child(3) {
    -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
            transform: rotate(-45deg);
    margin-top: 0;
  }
  [data-fontsize=l] .fontsize__switch {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 0;
  }
  [data-fontsize=l] .fontsize__switch::before {
    width: calc(var(--h-input) * 0.8);
    height: var(--h-input);
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    content: "";
    display: inline-block;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%233EBABA' d='M4.877 2.017c.31 0 .588.19.7.48l1.561 4.048l-.804 2.07l-.035-.077l-.303-.788H3.758l-.304.788a.75.75 0 1 1-1.4-.54l2.123-5.501a.75.75 0 0 1 .7-.48m-.54 4.233h1.08l-.54-1.4zM10.2 4.486a.75.75 0 0 0-1.401 0L5.733 12.5a.75.75 0 0 0 .018 1.5h.454a1 1 0 0 0 .092 0l.955-.003a.75.75 0 0 0 .087-1.495l.383-1h3.555l.386 1.008a.75.75 0 0 0 .088 1.495L13.252 14a.75.75 0 0 0 .013-1.5l-.748-1.955a1 1 0 0 0-.047-.123zM10.703 10H8.295L9.5 6.853z'/%3E%3C/svg%3E") no-repeat center center/95% auto;
  }
  [data-fontsize=l] .fontsize__popup {
    display: none;
  }
  [data-fontsize=l] .fontsize__popup.is-open {
    position: absolute;
    left: 50%;
    top: 100%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 5px;
    gap: 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    background-color: #fff;
    border-radius: 50px;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
            box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  }
  [data-fontsize=l] .fontsize__popup.is-open [type=radio] + label {
    display: block;
    border-radius: 100px;
  }
}
@media (max-width: 1399px) {
  [data-fontsize=m] .logo {
    max-width: calc(var(--h-header) * 1.9);
  }
  [data-fontsize=m] .header {
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
            box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  }
  [data-fontsize=m] .header > .container {
    margin-top: 0;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: var(--h-header);
  }
  [data-fontsize=m] .nav {
    display: none;
    top: var(--h-header);
    right: 0;
    left: auto;
    position: fixed;
    width: 100%;
    height: calc(100dvh - var(--h-header));
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-transform-origin: right center;
        -ms-transform-origin: right center;
            transform-origin: right center;
    padding: var(--gap-sec) var(--gap);
    z-index: 1001;
    background-color: #fff;
  }
  .is-open-nav [data-fontsize=m] .nav {
    display: block;
  }
  [data-fontsize=m] .h-func__wrap {
    position: relative;
    top: auto;
    gap: 0 10px;
    margin-right: -10px;
  }
  [data-fontsize=m] .h-func__link {
    gap: 0;
    white-space: nowrap;
  }
  [data-fontsize=m] .h-func__link .xs-hidden {
    display: none;
  }
  [data-fontsize=m] .h-func__link::before {
    margin-right: 0;
  }
  [data-fontsize=m] .menu {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0 0 max(2vh, var(--h-header)) 0;
    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: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}
@media (max-width: 1399px) and (min-aspect-ratio: 1.2) {
  [data-fontsize=m] .menu {
    padding: 0;
  }
}
@media (max-width: 1399px) {
  [data-fontsize=m] .menu > li {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    display: block;
    margin: 0;
    padding: 0;
    overflow: hidden;
    text-align: center;
  }
  [data-fontsize=m] .menu a {
    font-weight: var(--fw-semibold);
    display: inline-block;
    color: #fff;
    padding: min(25px, 1vh) 0;
    -webkit-transition: -webkit-transform 0.2s;
    transition: -webkit-transform 0.2s;
    transition: transform 0.2s;
    transition: transform 0.2s, -webkit-transform 0.2s;
  }
  .pc [data-fontsize=m] .menu a:hover {
    color: #c1e08f;
  }
  [data-fontsize=m] .is-open-nav:not(.is-close-nav) .nav {
    display: block;
  }
  [data-fontsize=m] .is-open-nav:not(.is-close-nav) .nav__burger {
    background-color: var(--color-main);
  }
  [data-fontsize=m] .is-open-nav:not(.is-close-nav) .nav__burger > div:nth-child(1) {
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
    margin-top: 0;
  }
  [data-fontsize=m] .is-open-nav:not(.is-close-nav) .nav__burger > div:nth-child(2) {
    display: none;
  }
  [data-fontsize=m] .is-open-nav:not(.is-close-nav) .nav__burger > div:nth-child(3) {
    -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
            transform: rotate(-45deg);
    margin-top: 0;
  }
  [data-fontsize=m] .fontsize__switch {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 0;
  }
  [data-fontsize=m] .fontsize__switch::before {
    width: calc(var(--h-input) * 0.8);
    height: var(--h-input);
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    content: "";
    display: inline-block;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%233EBABA' d='M4.877 2.017c.31 0 .588.19.7.48l1.561 4.048l-.804 2.07l-.035-.077l-.303-.788H3.758l-.304.788a.75.75 0 1 1-1.4-.54l2.123-5.501a.75.75 0 0 1 .7-.48m-.54 4.233h1.08l-.54-1.4zM10.2 4.486a.75.75 0 0 0-1.401 0L5.733 12.5a.75.75 0 0 0 .018 1.5h.454a1 1 0 0 0 .092 0l.955-.003a.75.75 0 0 0 .087-1.495l.383-1h3.555l.386 1.008a.75.75 0 0 0 .088 1.495L13.252 14a.75.75 0 0 0 .013-1.5l-.748-1.955a1 1 0 0 0-.047-.123zM10.703 10H8.295L9.5 6.853z'/%3E%3C/svg%3E") no-repeat center center/95% auto;
  }
  [data-fontsize=m] .fontsize__popup {
    display: none;
  }
  [data-fontsize=m] .fontsize__popup.is-open {
    position: absolute;
    left: 50%;
    top: 100%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 5px;
    gap: 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    background-color: #fff;
    border-radius: 50px;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
            box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  }
  [data-fontsize=m] .fontsize__popup.is-open [type=radio] + label {
    display: block;
    border-radius: 100px;
  }
}
@media (max-width: 1199px) {
  [data-fontsize=s] .logo {
    max-width: calc(var(--h-header) * 1.9);
  }
  [data-fontsize=s] .header {
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
            box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  }
  [data-fontsize=s] .header > .container {
    margin-top: 0;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: var(--h-header);
  }
  [data-fontsize=s] .nav {
    display: none;
    top: var(--h-header);
    right: 0;
    left: auto;
    position: fixed;
    width: 100%;
    height: calc(100dvh - var(--h-header));
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-transform-origin: right center;
        -ms-transform-origin: right center;
            transform-origin: right center;
    padding: var(--gap-sec) var(--gap);
    z-index: 1001;
    background-color: #fff;
  }
  .is-open-nav [data-fontsize=s] .nav {
    display: block;
  }
  [data-fontsize=s] .h-func__wrap {
    position: relative;
    top: auto;
    gap: 0 10px;
    margin-right: -10px;
  }
  [data-fontsize=s] .h-func__link {
    gap: 0;
    white-space: nowrap;
  }
  [data-fontsize=s] .h-func__link .xs-hidden {
    display: none;
  }
  [data-fontsize=s] .h-func__link::before {
    margin-right: 0;
  }
  [data-fontsize=s] .menu {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0 0 max(2vh, var(--h-header)) 0;
    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: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}
@media (max-width: 1199px) and (min-aspect-ratio: 1.2) {
  [data-fontsize=s] .menu {
    padding: 0;
  }
}
@media (max-width: 1199px) {
  [data-fontsize=s] .menu > li {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    display: block;
    margin: 0;
    padding: 0;
    overflow: hidden;
    text-align: center;
  }
  [data-fontsize=s] .menu a {
    font-weight: var(--fw-semibold);
    display: inline-block;
    color: #fff;
    padding: min(25px, 1vh) 0;
    -webkit-transition: -webkit-transform 0.2s;
    transition: -webkit-transform 0.2s;
    transition: transform 0.2s;
    transition: transform 0.2s, -webkit-transform 0.2s;
  }
  .pc [data-fontsize=s] .menu a:hover {
    color: #c1e08f;
  }
  [data-fontsize=s] .is-open-nav:not(.is-close-nav) .nav {
    display: block;
  }
  [data-fontsize=s] .is-open-nav:not(.is-close-nav) .nav__burger {
    background-color: var(--color-main);
  }
  [data-fontsize=s] .is-open-nav:not(.is-close-nav) .nav__burger > div:nth-child(1) {
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
    margin-top: 0;
  }
  [data-fontsize=s] .is-open-nav:not(.is-close-nav) .nav__burger > div:nth-child(2) {
    display: none;
  }
  [data-fontsize=s] .is-open-nav:not(.is-close-nav) .nav__burger > div:nth-child(3) {
    -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
            transform: rotate(-45deg);
    margin-top: 0;
  }
  [data-fontsize=s] .fontsize__switch {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 0;
  }
  [data-fontsize=s] .fontsize__switch::before {
    width: calc(var(--h-input) * 0.8);
    height: var(--h-input);
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    content: "";
    display: inline-block;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%233EBABA' d='M4.877 2.017c.31 0 .588.19.7.48l1.561 4.048l-.804 2.07l-.035-.077l-.303-.788H3.758l-.304.788a.75.75 0 1 1-1.4-.54l2.123-5.501a.75.75 0 0 1 .7-.48m-.54 4.233h1.08l-.54-1.4zM10.2 4.486a.75.75 0 0 0-1.401 0L5.733 12.5a.75.75 0 0 0 .018 1.5h.454a1 1 0 0 0 .092 0l.955-.003a.75.75 0 0 0 .087-1.495l.383-1h3.555l.386 1.008a.75.75 0 0 0 .088 1.495L13.252 14a.75.75 0 0 0 .013-1.5l-.748-1.955a1 1 0 0 0-.047-.123zM10.703 10H8.295L9.5 6.853z'/%3E%3C/svg%3E") no-repeat center center/95% auto;
  }
  [data-fontsize=s] .fontsize__popup {
    display: none;
  }
  [data-fontsize=s] .fontsize__popup.is-open {
    position: absolute;
    left: 50%;
    top: 100%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 5px;
    gap: 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    background-color: #fff;
    border-radius: 50px;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
            box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  }
  [data-fontsize=s] .fontsize__popup.is-open [type=radio] + label {
    display: block;
    border-radius: 100px;
  }
}
@media (max-width: 639px) {
  .logo {
    left: -5px;
  }
  [data-fontsize=s] .h-func__link, [data-fontsize=m] .h-func__link, [data-fontsize=l] .h-func__link {
    font-size: 0;
  }
  [data-fontsize=s] .h-func__link .xs-hidden, [data-fontsize=m] .h-func__link .xs-hidden, [data-fontsize=l] .h-func__link .xs-hidden {
    display: none;
  }
  .h-func__wrap {
    right: 5px;
  }
  .search__pop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
  }
}
@media (max-width: 399px) {
  .logo {
    width: var(--h-header);
  }
  .logo > * {
    overflow: hidden;
    aspect-ratio: 105/100;
    padding-bottom: 0;
    background-size: auto 100%;
  }
}
/**
 * Footer
 */
.gotop {
  position: fixed;
  z-index: 500;
  bottom: var(--gap);
  right: var(--gap);
  background-color: var(--color-main);
  width: var(--h-btn);
  border-radius: 50px;
  aspect-ratio: 1;
  opacity: 0;
  pointer-events: none;
  -webkit-transform: scale(0);
      -ms-transform: scale(0);
          transform: scale(0);
  -webkit-transition: -webkit-transform 0.35s;
  transition: -webkit-transform 0.35s;
  transition: transform 0.35s;
  transition: transform 0.35s, -webkit-transform 0.35s;
  font-size: 0;
}
.gotop::before {
  content: "";
  display: block;
  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='%23fff' d='M13 20h-2V8l-5.5 5.5l-1.42-1.42L12 4.16l7.92 7.92l-1.42 1.42L13 8z'/%3E%3C/svg%3E") no-repeat center/60% auto;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
}
.gotop:hover {
  background-color: var(--color-main2);
}

.is-fixed-header .gotop {
  opacity: 1;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
  pointer-events: auto;
}

.footer {
  background-color: var(--color-main2);
  color: #fff;
  text-align: center;
  padding: 2.5em 0;
  margin: 0;
  font-size: clamp(1.125rem, 0.9482rem + 0.4878vw, 1.375rem);
}
.footer > .container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 0 max(6vw, var(--gap));
}

.f-left {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  text-align: left;
}
.f-left .links {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.f-left .links a {
  color: #fff;
  display: inline-block;
  white-space: nowrap;
  margin-left: 1em;
}
.f-left .links a::before {
  content: "|";
  position: absolute;
  left: -0.7em;
  top: 0.2em;
  display: inline-block;
  vertical-align: middle;
  width: auto;
  font-size: 0.8em;
}
.f-left .links a:first-child {
  margin-left: 0;
}
.f-left .links a:first-child::before {
  display: none;
}
.pc .f-left .links a:hover {
  color: #fff;
  text-decoration: underline;
}

.f-right {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  text-align: left;
  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;
  max-width: max(45vw, 700px);
}

.f-contact {
  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;
  gap: 0 var(--gap);
  color: #fff;
}
.f-contact svg {
  width: 1.75em;
}
.f-contact li {
  white-space: nowrap;
}
.f-contact a {
  color: #fff;
}
.pc .f-contact a:hover {
  color: #fff;
  text-decoration: underline;
}

.f-copyright {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  gap: 0 var(--gap);
  margin-top: 10px;
}
.f-copyright .a11y-icon {
  display: inline-block;
}
.f-copyright .a11y-icon img {
  height: 35px;
  max-width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

@media (max-width: 1449px) {
  .footer {
    font-size: clamp(1rem, 0.9116rem + 0.2439vw, 1.125rem);
  }
}
@media (max-width: 1149px) {
  .footer .container {
    display: block;
  }
  .f-right {
    margin-top: var(--gap);
  }
  .f-contact {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}
@media (max-width: 767px) {
  .footer {
    font-size: 1rem;
  }
  .f-contact {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}
@media (max-width: 579px) {
  .f-contact {
    display: block;
    margin-bottom: 15px;
  }
  .f-copyright {
    display: block;
  }
  .f-copyright .a11y-icon {
    display: block;
  }
}
/**
 * sticky
 */
.sticky {
  position: sticky;
  top: var(--h-header);
}

@media (min-width: 992px) {
  .sticky {
    top: calc(var(--h-header) + 10px);
  }
}
/* 
 * Container
 */
.container {
  width: 100%;
  max-width: calc(var(--w-container) + var(--gap) * 2);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--gap);
  padding-right: var(--gap);
}
.container.sm {
  max-width: calc(var(--w-container-sm) + var(--gap) * 2);
}
.container.md {
  max-width: calc(var(--w-container-md) + var(--gap) * 2);
}

@media (max-width: 767px) {
  .pc-only {
    display: none;
  }
}

@media (min-width: 768px) {
  .mb-only {
    display: none;
  }
}

.main-wrap {
  padding-top: calc(var(--gap-sec) * 0.6);
  padding-bottom: var(--gap-sec);
  background: url(../images/pbg.png) no-repeat 0 0/cover;
  min-height: calc(100vh - var(--h-header) - 150px);
}
.main-wrap > * {
  z-index: 10;
}
.main-wrap::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  z-index: 0;
  pointer-events: none;
  border-style: solid;
  border-width: max(29vw, 120px) max(29vw, 120px) 0 0;
  border-color: rgba(64, 176, 176, 0.15) transparent transparent transparent;
}
@media (max-width: 499px) {
  .main-wrap {
    padding-top: var(--gap);
  }
}

.align-end {
  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;
}

.align-start {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.align-center {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/* 
 * Animation
 */
@-webkit-keyframes ani_kanban_in {
  from {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
}
@keyframes ani_kanban_in {
  from {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
}
@-webkit-keyframes ani_fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes ani_fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes ani_fadein_right {
  from {
    opacity: 0;
    -webkit-transform: translateX(25%);
            transform: translateX(25%);
  }
  to {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@keyframes ani_fadein_right {
  from {
    opacity: 0;
    -webkit-transform: translateX(25%);
            transform: translateX(25%);
  }
  to {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@-webkit-keyframes ani_fadein_left {
  from {
    opacity: 0;
    -webkit-transform: translateX(-25%);
            transform: translateX(-25%);
  }
  to {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@keyframes ani_fadein_left {
  from {
    opacity: 0;
    -webkit-transform: translateX(-25%);
            transform: translateX(-25%);
  }
  to {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@-webkit-keyframes ani_fadein_up {
  from {
    opacity: 0;
    -webkit-transform: translateY(15%);
            transform: translateY(15%);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes ani_fadein_up {
  from {
    opacity: 0;
    -webkit-transform: translateY(15%);
            transform: translateY(15%);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes ani_search_open {
  from {
    opacity: 0;
    -webkit-transform: translateY(-102%);
            transform: translateY(-102%);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes ani_search_open {
  from {
    opacity: 0;
    -webkit-transform: translateY(-102%);
            transform: translateY(-102%);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes ani_bounce {
  0%, 25%, 100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.08);
            transform: scale(1.08);
  }
}
@keyframes ani_bounce {
  0%, 25%, 100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.08);
            transform: scale(1.08);
  }
}
@-webkit-keyframes ani_maxHeight_show {
  0% {
    overflow: hidden;
    max-height: 0;
  }
  100% {
    overflow: visible;
    max-height: 100vh;
  }
}
@keyframes ani_maxHeight_show {
  0% {
    overflow: hidden;
    max-height: 0;
  }
  100% {
    overflow: visible;
    max-height: 100vh;
  }
}
/*
 * Customized AOS Animation
 */
/* 
 * PLUGIN: Swiper
 */
.swiper-slide {
  height: auto;
}

.swiper-button-next, .swiper-button-prev {
  -webkit-box-shadow: none;
          box-shadow: none;
  display: block;
  font-size: 0;
  width: var(--h-btn);
  height: var(--h-btn);
  z-index: 5;
  box-shadow: none;
  top: 50%;
  color: #fff;
  border-radius: 100px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  background-color: #fff;
  -webkit-transition: margin 0.25s, background-color 0.25s 0.15s;
  transition: margin 0.25s, background-color 0.25s 0.15s;
}
.swiper-button-next.swiper-button-lock, .swiper-button-prev.swiper-button-lock {
  opacity: 0;
  pointer-events: none;
}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
  opacity: 0.3 !important;
  cursor: not-allowed;
  pointer-events: auto !important;
}
.swiper-button-next::before, .swiper-button-prev::before {
  display: none !important;
}
.swiper-button-next::after, .swiper-button-prev::after {
  content: "";
  position: absolute;
  display: block;
  width: calc(var(--h-btn) * 0.5);
  height: auto;
  aspect-ratio: 1;
  top: 50%;
  margin: 0;
  border: none;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
.pc .swiper-button-next:hover, .pc .swiper-button-prev:hover {
  border: none;
  background-color: var(--color-main);
}
.pc .swiper-button-next:hover::after, .pc .swiper-button-prev:hover::after {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}

.swiper-button-prev {
  left: 0;
}
.swiper-button-prev::after {
  left: 50%;
  -webkit-transform: translate(-55%, -50%);
      -ms-transform: translate(-55%, -50%);
          transform: translate(-55%, -50%);
  background-image: url("data:image/svg+xml,%3Csvg  xmlns='http://www.w3.org/2000/svg'  width='24'  height='24'  viewBox='0 0 24 24'  fill='none'  stroke='%23333'  stroke-width='1.6'  stroke-linecap='round'  stroke-linejoin='round'  class='icon icon-tabler icons-tabler-outline icon-tabler-chevron-left'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M15 6l-6 6l6 6' /%3E%3C/svg%3E");
}

.swiper-button-next {
  right: 0;
}
.swiper-button-next::after {
  right: 50%;
  -webkit-transform: translate(55%, -50%);
      -ms-transform: translate(55%, -50%);
          transform: translate(55%, -50%);
  background-image: url("data:image/svg+xml,%3Csvg  xmlns='http://www.w3.org/2000/svg'  width='24'  height='24'  viewBox='0 0 24 24'  fill='none'  stroke='%23333'  stroke-width='1.6'  stroke-linecap='round'  stroke-linejoin='round'  class='icon icon-tabler icons-tabler-outline icon-tabler-chevron-right'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M9 6l6 6l-6 6' /%3E%3C/svg%3E");
}

.swiper-pagination {
  --swiper-pagination-bottom: max(6.7vh, var(--gap));
  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;
  font-size: 0;
  z-index: 10;
  line-height: 0;
  position: absolute;
  left: 0;
  width: 100%;
  top: auto;
}
@media (max-width: 991px) {
  .swiper-pagination {
    --swiper-pagination-bottom: 10px;
  }
}

.swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  margin: 0;
  padding: 0;
  border-radius: 20px;
  background-color: #fff;
  opacity: 1;
  -webkit-transition: width 0.35s;
  transition: width 0.35s;
}
.pc .swiper-pagination-bullet:hover {
  background-color: #eee;
}

.swiper-pagination-bullet-active {
  background-color: #fff;
  width: 23px;
}

.is-center-mode .swiper-wrapper {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.is-center-mode .swiper-button-next, .is-center-mode .swiper-button-prev {
  display: none;
}

/* 
 * PLUGIN: MagnificPopup
 */
.mfp-bg {
  background: none;
}

.mfp-nav {
  cursor: unset;
  position: fixed;
}
.mfp-nav .mfp-container {
  background-color: #fff;
  border: var(--gap) solid var(--color-main);
  overflow-y: auto;
}
.mfp-nav .mfp-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  padding: var(--gap);
}
.mfp-nav.mfp-ready .mfp-content {
  opacity: 1;
}
.mfp-nav.mfp-removing .mfp-content {
  opacity: 0;
}
.mfp-nav .sitemap-info, .mfp-nav .sitemap-subhead {
  display: block;
}
.mfp-nav .menu {
  width: 100%;
  margin-right: calc(var(--gap) * -1);
  margin-top: var(--gap);
  margin-bottom: var(--gap);
  display: block;
}
.mfp-nav .menu > li {
  width: calc(50% - var(--gap));
  display: inline-block;
  vertical-align: top;
  margin-bottom: var(--gap);
  border: 1px solid var(--color-main);
  border-radius: 6px;
}
.mfp-nav .menu > li > a {
  padding: 0.5em 1em;
  background-color: var(--color-main);
  color: #fff;
  text-align: center;
  display: block;
  border-radius: 5px;
}
.mfp-nav .menu > li > a:hover {
  background-color: var(--color-main2);
  color: #fff;
}
.mfp-nav .menu > li > ul {
  margin: 0;
  padding: 10px;
}
.mfp-nav .menu > li > ul > li {
  display: block;
}
.mfp-nav .menu > li > ul > li > a {
  display: block;
  padding: 0.25em 1em 0.25em 1.5em;
  text-align: left;
  color: #333;
}
.mfp-nav .menu > li > ul > li > a:hover {
  color: var(--color-main);
}
.mfp-nav .menu > li > ul > li > a::before {
  content: "";
  display: block;
  width: 0.5em;
  height: 0.5em;
  border-radius: 50px;
  background-color: var(--color-main);
  opacity: 0.6;
  position: absolute;
  top: 0.95em;
  left: 0.45em;
}
@media (max-width: 767px) {
  .mfp-nav .menu {
    height: auto !important;
  }
  .mfp-nav .menu > li {
    width: 100%;
    position: relative !important;
    -webkit-transform: none !important;
        -ms-transform: none !important;
            transform: none !important;
    top: auto !important;
    left: auto !important;
    height: auto !important;
  }
}

.sitemap-close {
  cursor: pointer !important;
  z-index: 18;
  -webkit-box-shadow: none;
          box-shadow: none;
  right: var(--gap);
  top: var(--gap);
  width: var(--h-btn);
  height: var(--h-btn);
  line-height: var(--h-btn);
  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;
  opacity: 1;
  margin: 0;
  position: fixed;
  border-radius: 0;
  border: none;
  font-size: calc(var(--h-btn) * 0.7) !important;
  padding: 0;
  white-space: nowrap;
  color: #fff;
  background-color: var(--color-main);
  text-align: center;
  -webkit-transform: translate(0);
      -ms-transform: translate(0);
          transform: translate(0);
  -webkit-transition: background-color 0.2s;
  transition: background-color 0.2s;
}
.sitemap-close svg {
  width: 70%;
}
.sitemap-close:hover {
  background-color: var(--color-main2);
}

/* 
 * 架構其他共用部分
 */
.sticky {
  position: sticky;
  top: var(--h-header);
}

.text-center {
  text-align: center;
}

@media (max-width: 767px) {
  .is-show-pc {
    display: none !important;
  }
}
@media (min-width: 768px) {
  .is-show-mb {
    display: none !important;
  }
}
/**
 * 沒有資料
 */
.nodata-msg {
  text-align: center;
  padding: var(--gap);
  font-size: 1rem;
  font-weight: 450;
}

/* 
 * Pagination
 */
.subhead {
  font-size: var(--fs-subhead);
  font-weight: 600;
  line-height: 1.1;
  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;
  gap: 0 0.5em;
  margin: 0 0 0.5em;
}
.subhead > * {
  white-space: nowrap;
}
.subhead .lg {
  font-size: var(--fs-subhead-lg);
}
.subhead.sm {
  font-size: clamp(20 / 16 * var(--fs-def, 16px), 17.1707317073 / 16 * var(--fs-def, 16px) + 0.487804878vw, 24 / 16 * var(--fs-def, 16px));
  margin: 1em auto 3em;
}
.subhead div, .subhead h1, .subhead h2, .subhead h3, .subhead h4, .subhead h5, .subhead h6 {
  font: inherit;
  margin: 0.1em 0;
}

/* 
 * Button
 */
.btn-wrap {
  margin-top: var(--gap);
}

.more-btn {
  font-family: var(--ff-deco);
  font-size: var(--fs-btn);
  cursor: pointer;
  color: #000;
  white-space: nowrap;
  display: inline-block;
}
.more-btn:hover {
  color: var(--color-main);
}

.download-btn {
  height: 43px;
  border-radius: 50px;
  border: 1px solid var(--color-orange);
  color: var(--color-orange);
  text-align: center;
  padding: 0 1em;
  font-weight: 400;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0 0.5em;
}
.download-btn svg {
  width: 1.25em;
}
.download-btn:hover {
  background-color: var(--color-orange);
  color: #fff;
}

.form-btn {
  font-family: var(--ff-deco);
  font-size: var(--fs-btn);
  line-height: var(--h-btn);
  height: var(--h-btn);
  width: 100%;
  max-width: 450px;
  cursor: pointer;
  color: #fff;
  white-space: nowrap;
  border: none;
  display: block;
  border-radius: 5px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  background-color: var(--color-orange);
}
.form-btn:hover {
  color: #fff;
  background-color: var(--color-yellow);
}
.form-btn.bg-gray {
  background-color: #5C5D5D;
  color: #fff;
}
.form-btn.bg-gray:hover {
  background-color: #333;
  color: #fff;
}
.form-btn.lg {
  line-height: calc(var(--h-btn) * 1.25);
  height: calc(var(--h-btn) * 1.25);
}

/* 
 * Form
 */
.form-wrap {
  padding: var(--gap) var(--gap) max(9.5vw, 90px) var(--gap);
  border: max(0.25rem, 5px) solid var(--color-main);
  margin: max(4em, 50px) auto var(--gap) auto;
  max-width: 550px;
}
.form-wrap::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
  width: max(13vw, 120px);
  aspect-ratio: 255/164;
  background: url(../images/form_bg.png) no-repeat 0 0/contain;
}
.form-wrap:not(.sm) {
  max-width: none;
  padding: max(4vw, var(--gap));
}
.form-wrap:not(.sm)::after {
  display: none;
}
.form-wrap .form-title {
  position: absolute;
  left: calc(max(0.25rem, 5px) * -1);
  top: calc(max(0.25rem, 5px) * -1);
  -webkit-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
          transform: translateY(-100%);
  margin-left: 1px;
  margin-top: 1px;
}
.form-wrap .half-wrap {
  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;
  margin: max(2vw, var(--gap)) auto;
  padding-top: max(4vw, var(--gap));
  border-top: 1px solid #ccc;
  gap: 0 max(5vw, 35px);
}
.form-wrap .half-wrap .col {
  all: unset;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 50%;
          flex: 1 1 50%;
}
.form-wrap .half-wrap .col legend {
  all: unset;
  margin: 0 0 var(--gap);
  padding: 0;
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
  font-weight: 500;
}
.form-wrap .half-wrap .col + .col::before {
  content: "";
  display: block;
  position: absolute;
  top: -3em;
  bottom: var(--gap);
  left: calc(max(5vw, 35px) * -0.5);
  background-color: #ccc;
  width: 1px;
}
@media (max-width: 499px) {
  .form-wrap .half-wrap {
    display: block;
  }
  .form-wrap .half-wrap .col {
    padding-bottom: var(--gap);
    margin-bottom: var(--gap);
    border-bottom: 1px solid #ccc;
  }
  .form-wrap .half-wrap .col + .col::before {
    display: none;
  }
  .form-wrap .half-wrap .col:last-child {
    border-bottom: none;
  }
}

.form-radio {
  cursor: pointer;
}
.form-radio span {
  display: inline-block;
  padding-left: 1.75rem;
  line-height: 1.2;
  font-size: var(--fs-listname-sm);
}
.form-radio span::before {
  content: "";
  display: block;
  width: 1.25rem;
  height: 1.25rem;
  border: 1px solid rgba(0, 0, 0, 0.5);
  position: absolute;
  top: 0.05em;
  left: 0;
}
.form-radio input {
  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;
}
.form-radio input:checked + span::before {
  border-color: var(--color-orange);
  background-color: var(--color-orange);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M12.416 3.376a.75.75 0 0 1 .208 1.04l-5 7.5a.75.75 0 0 1-1.154.114l-3-3a.75.75 0 0 1 1.06-1.06l2.353 2.353l4.493-6.74a.75.75 0 0 1 1.04-.207' clip-rule='evenodd'/%3E%3C/svg%3E");
  background-size: contain;
  background-position: center center;
}

.form-note {
  display: block;
  margin: 0 0 var(--gap);
  padding: 0;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: #666;
}
.form-note.color-orange {
  color: var(--color-orange);
}

@media (min-width: 992px) {
  .form-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 0 1em;
  }
  .form-group .form-box {
    -webkit-box-flex: 1;
        -ms-flex: 1 0 calc(33.3333333333% - 1em);
            flex: 1 0 calc(33.3333333333% - 1em);
  }
  .form-group + .form-note {
    margin-top: calc(var(--gap) * -0.5);
  }
}

.form-title {
  display: inline-block;
  background-color: var(--color-main);
  color: #fff;
  white-space: nowrap;
  font-weight: 500;
  padding: 0.25em 1em;
}

.form-box {
  margin-bottom: var(--gap);
}
.form-box + .form-note {
  margin-top: calc(var(--gap) * -0.5);
}

.form-input {
  display: block;
  width: 100%;
  padding: 0 12px;
  height: var(--h-input);
  border: 1px solid rgba(0, 0, 0, 0.5);
}

.form-select {
  width: 100%;
  height: var(--h-input);
  line-height: var(--h-input);
  padding: 0 12px;
  border: 1px solid rgba(0, 0, 0, 0.5);
  background: #fff 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'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='m19.5 8.25-7.5 7.5-7.5-7.5' /%3E%3C/svg%3E") no-repeat calc(100% - 10px) center/22px auto;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.form-label {
  display: block;
  margin-bottom: 5px;
  line-height: 1.5;
  font-size: var(--fs-listname-sm);
}
.form-label abbr {
  color: var(--color-orange);
  text-decoration: none;
  font-style: normal;
}

.form-func {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: var(--gap) auto;
  gap: 0 2em;
  font-size: clamp(17 / 16 * var(--fs-def, 16px), 14.8780487805 / 16 * var(--fs-def, 16px) + 0.3658536585vw, 20 / 16 * var(--fs-def, 16px));
}
.form-func > li {
  display: inline-block;
}
.form-func > li::before {
  content: "";
  display: block;
  position: absolute;
  width: 1px;
  height: 1em;
  background-color: #ccc;
  left: -1em;
  top: 0.25em;
}
.form-func > li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #333;
  white-space: nowrap;
}
.form-func > li a:hover {
  color: var(--color-orange);
}
.form-func > li a:hover .icon {
  color: #fff;
  background-color: var(--color-orange);
}
.form-func > li:first-child::before {
  display: none;
}
.form-func > li .icon {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-right: 0.25em;
  width: 1.5em;
  height: 1.5em;
  aspect-ratio: 1;
  border-radius: 50px;
  background-color: var(--color-yellow);
  color: #fff;
}
.form-func > li svg {
  max-width: 60%;
}
@media (max-width: 379px) {
  .form-func {
    display: block;
  }
  .form-func > li {
    display: block;
    margin-bottom: 15px;
  }
  .form-func > li::before {
    display: none;
  }
  .form-func > li > a {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

.form-inline-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 50%;
          flex: 1 1 50%;
  gap: 0 0.5em;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.form-inline-box > .form-label {
  white-space: nowrap;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
@media (max-width: 479px) {
  .form-inline-box {
    display: block;
  }
}

.form-regulation-search {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0 0.5em;
  margin-bottom: max(4vw, var(--gap));
}
.form-regulation-search > .form-btn {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 120px;
          flex: 0 0 120px;
}
@media (max-width: 991px) {
  .form-regulation-search {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .form-regulation-search > * {
    margin-bottom: 10px;
  }
  .form-regulation-search > .form-btn {
    -ms-flex-item-align: end;
        align-self: flex-end;
    width: 120px;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    margin: 0;
    height: var(--h-input);
    line-height: var(--h-input);
  }
}

/* 
 * Pagination
 */
.pagination {
  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;
  gap: 0 10px;
  font-size: 1.125rem;
  font-weight: 450;
  line-height: 30px;
  margin: 60px auto 0;
  text-align: center;
}
.pagination .num {
  display: inline-block;
  border-radius: 5px;
  border: 1px solid #000;
  background-color: #fff;
  color: #000;
  white-space: nowrap;
  min-width: 30px;
  height: 30px;
  padding: 0 0.2em;
}
.pagination .num.current {
  background-color: var(--color-main);
  color: #Fff;
  border-color: var(--color-main);
}
.pagination .num:not(.current):hover {
  background-color: rgba(62, 186, 186, 0.15);
  border-color: var(--color-main);
  color: var(--color-main);
}
.pagination .prev, .pagination .next {
  display: inline-block;
  white-space: nowrap;
  height: 30px;
  padding: 0 0.5em;
  color: #000;
}
.pagination .prev:hover, .pagination .next:hover {
  color: var(--color-main);
}
.pagination .goto {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin-left: var(--gap);
  gap: 0 10px;
}
.pagination .goto span {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  white-space: nowrap;
}
.pagination .goto-send {
  height: 30px;
  line-height: 30px;
  min-width: 40px;
  background-color: #000;
  color: #fff;
  font-size: 1.125rem;
  border-radius: 5px;
  padding: 0 0.2em;
}
.pagination .goto-send:hover {
  background-color: var(--color-main);
  border-color: var(--color-main);
  color: #fff;
}
.pagination .goto-input {
  height: 30px;
  border: 1px solid #000;
  max-width: 50px;
  padding: 0 0.5em;
  width: auto;
  display: inline-block;
  border-radius: 5px;
}
.pagination .goto-input:focus {
  border-color: var(--color-main);
}
@media (max-width: 991px) {
  .pagination .num:not(.current) {
    display: none;
  }
}
@media (max-width: 439px) {
  .pagination {
    display: block;
  }
  .pagination .num {
    margin: 0 10px;
  }
  .pagination .goto {
    margin-top: 20px;
    gap: 0 5px;
    margin-left: auto;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    min-width: 180px;
  }
  .pagination .goto-input {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    max-width: 80px;
  }
}

/* 
 * Tab切換
 */
.tabs-nav__list > ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  gap: 5px 15px;
}
.tabs-nav__list > ul > li {
  display: inline-block;
  vertical-align: top;
  -webkit-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -ms-flex-preferred-size: max(20%, 120px);
      flex-basis: max(20%, 120px);
}
.tabs-nav__list > ul > li.current button {
  border-color: var(--color-main);
  background: var(--color-main);
  color: #fff;
}
.tabs-nav__list > ul > li:not(.current):hover > button {
  color: #000;
  background-color: rgba(235, 95, 33, 0.05);
}
.tabs-nav__list > ul button {
  cursor: pointer;
  width: 100%;
  display: block;
  line-height: calc(var(--h-input) * 1.25);
  height: calc(var(--h-input) * 1.25);
  text-align: center;
  white-space: nowrap;
  border-radius: 10px;
  border: 1px solid var(--color-orange);
  background: #fff;
  color: #000;
  font-size: var(--fs-listname);
}
@media (max-width: 991px) {
  .tabs-nav__list > ul button {
    font-size: var(--fs-h6);
    line-height: calc(var(--h-input) * 0.8);
    height: var(--h-input);
    border-radius: 5px;
  }
}

.tabs-nav__content {
  position: relative;
  margin-top: 0.6em;
}

.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;
  }
}
/*
 * 類別溢出下拉 (.anchor-mode是錨點的模式)
 */
.tabs-dropdown {
  position: relative;
  z-index: 40;
  margin: min(4vh, var(--gap)) auto;
  padding: 0 0 min(4vh, var(--gap)) 0;
  font-size: var(--fs-listname);
  border-bottom: 3px solid #aaa;
}
.tabs-dropdown .tab-dropdown__switch {
  display: none;
  position: relative;
  z-index: 1;
}
.tabs-dropdown .tab-dropdown__list {
  position: relative;
  z-index: 1;
}
.tabs-dropdown .tab-dropdown__list > ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  gap: 5px 15px;
}
.tabs-dropdown .tab-dropdown__list > ul > li {
  display: inline-block;
  vertical-align: top;
  -webkit-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -ms-flex-preferred-size: max(19%, 120px);
      flex-basis: max(19%, 120px);
}
.tabs-dropdown .tab-dropdown__list > ul > li > a {
  cursor: pointer;
  width: 100%;
  display: block;
  line-height: calc(var(--h-input) * 1.25);
  height: calc(var(--h-input) * 1.25);
  text-align: center;
  white-space: nowrap;
  border-radius: 10px;
  border: 1px solid var(--color-orange);
  background: #fff;
  color: #000;
  padding: 0;
  font-size: var(--fs-listname);
}
.tabs-dropdown .tab-dropdown__list > ul > li.current > a {
  border-color: var(--color-main);
  background: var(--color-main);
  color: #fff;
}
.tabs-dropdown .tab-dropdown__list > ul > li:not(.current):hover > a {
  color: #000;
  background-color: rgba(235, 95, 33, 0.05);
}

@media (min-width: 768px) {
  .tabs-dropdown:not(.is-dropdown-active) .tab-dropdown__list {
    display: block !important;
  }
  .tabs-dropdown:not(.is-dropdown-active) .tab-dropdown__list > ul {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .tabs-dropdown:not(.is-dropdown-active) .tab-dropdown__list > ul > li > a {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }
  .pc .tabs-dropdown:not(.is-dropdown-active) .tab-dropdown__list > ul > li:not(.current):hover > a {
    color: #000;
    background-color: rgba(235, 95, 33, 0.05);
  }
}
@media (max-width: 767px) {
  .tabs-dropdown .tab-dropdown__switch {
    z-index: 5;
    cursor: pointer;
    width: auto;
    display: block;
    padding: 8px 40px 8px 10px;
    line-height: 1.5;
    min-height: var(--h-btn);
    text-align: center;
    border-radius: 10px;
    border: 1px solid var(--color-orange);
    background: #fff 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'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='m19.5 8.25-7.5 7.5-7.5-7.5' /%3E%3C/svg%3E") no-repeat calc(100% - 10px) center/22px auto;
    color: #000;
    font-size: var(--fs-listname);
  }
  .tabs-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: 12px;
    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;
  }
  .tabs-dropdown .tab-dropdown__list > ul {
    display: block !important;
    padding: 0 10px;
  }
  .tabs-dropdown .tab-dropdown__list > ul > li {
    display: block;
    min-width: auto;
    padding: 0;
    margin: 0;
    border-top: 1px solid #ddd;
  }
  .tabs-dropdown .tab-dropdown__list > ul > li:first-child {
    border-top: none;
  }
  .tabs-dropdown .tab-dropdown__list > ul > li > a {
    -webkit-box-shadow: none;
            box-shadow: none;
    background: none;
    background-color: transparent;
    border: none;
    display: block;
    padding: 0.5rem;
    margin: 0;
    color: #333;
    height: auto;
    line-height: 1.5;
    text-align: center;
    min-width: auto;
    white-space: normal;
  }
  .tabs-dropdown .tab-dropdown__list > ul > li.current > a {
    color: var(--color-main);
    font-weight: 500;
    background: none;
    background-color: transparent;
  }
  .tabs-dropdown .tab-dropdown__list > ul > li:not(.current):hover > a {
    color: #111;
    background-color: rgba(235, 95, 33, 0.05);
  }
  .tabs-dropdown.is-open .tab-dropdown__list {
    display: block !important;
  }
  .tabs-dropdown.is-open .tab-dropdown__list > ul > li:not(.current) > a:hover {
    color: #000;
    background-color: rgba(235, 95, 33, 0.05);
  }
  .tabs-dropdown.is-open .tab-dropdown__switch {
    margin: 5px;
    top: 5px;
    color: #fff;
    background: var(--color-main) 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'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='m19.5 8.25-7.5 7.5-7.5-7.5' /%3E%3C/svg%3E") no-repeat calc(100% - 10px) center/22px auto;
  }
  .tabs-dropdown.is-open .tab-dropdown__switch:hover {
    color: #fff;
    background-color: var(--color-main2);
  }
}
/* 
 * Breadcrumb
 */
.breadcrumb {
  font-size: clamp(16 / 16 * var(--fs-def, 16px), 14.5853658537 / 16 * var(--fs-def, 16px) + 0.243902439vw, 18 / 16 * var(--fs-def, 16px));
  padding: 0.5em var(--gap);
  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;
  margin-top: -1em;
  margin-left: auto;
  margin-right: auto;
  max-width: var(--w-container-md);
}
.breadcrumb > ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 0 1.5em;
}
.breadcrumb > ul > li {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
.breadcrumb > ul > li::after {
  content: "";
  display: block;
  width: 1px;
  height: 1em;
  position: absolute;
  left: -0.8em;
  top: 0.4em;
  background-color: #ccc;
}
.breadcrumb > ul > li:first-child::before {
  content: "";
  margin-top: -0.1em;
  margin-right: 0.5em;
  display: inline-block;
  vertical-align: middle;
  border-radius: 50px;
  background-color: var(--color-main);
  width: 0.8em;
  height: 0.8em;
}
.breadcrumb > ul > li:first-child::after {
  display: none;
}
.breadcrumb > ul > li > a {
  color: #000;
}
.breadcrumb > ul > li > a:hover {
  color: var(--color-main);
}
@media (max-width: 499px) {
  .breadcrumb {
    font-size: clamp(14 / 16 * var(--fs-def, 16px), 13.2926829268 / 16 * var(--fs-def, 16px) + 0.1219512195vw, 15 / 16 * var(--fs-def, 16px));
    color: #555;
    margin-top: 0;
    margin-bottom: 1em;
  }
  .breadcrumb > ul {
    gap: 0 1em;
  }
  .breadcrumb > ul > li::after {
    left: -0.5em;
  }
  .breadcrumb > ul > li > a {
    color: #555;
  }
  .breadcrumb > ul > li > a:hover {
    color: var(--color-main);
  }
}

/* 
 * 編輯器
 */
/* 
 * 預設通用樣式
 */
.cke_editable *, .cke_editable *::after, .cke_editable *::before {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.cke_editable img {
  height: auto !important;
  max-width: 100%;
}

.cke_widget_inline {
  vertical-align: top;
}

.editor-wrap, .cke_editable {
  font-family: var(--ff-def);
  color: #444;
  background-color: #fff;
  line-height: 2;
  font-weight: 420;
  text-wrap: pretty;
}
.editor-wrap img, .cke_editable img {
  line-height: 0;
  display: inline-block;
}
.editor-wrap p, .cke_editable p {
  margin: 0 0 max(var(--gap), 2.5rem, 6vh);
  padding: 0;
}
.editor-wrap ol, .editor-wrap ul, .cke_editable ol, .cke_editable ul {
  margin-top: 0;
  margin-bottom: 1.25rem;
}
.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;
  line-height: 1.5;
}
.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, .editor-wrap .h1, .cke_editable h1, .cke_editable .h1 {
  font-size: var(--fs-h1);
}
.editor-wrap h2, .editor-wrap .h2, .cke_editable h2, .cke_editable .h2 {
  font-size: var(--fs-h2);
}
.editor-wrap h3, .editor-wrap .h3, .cke_editable h3, .cke_editable .h3 {
  font-size: var(--fs-h3);
}
.editor-wrap h4, .editor-wrap .h4, .cke_editable h4, .cke_editable .h4 {
  font-size: var(--fs-h4);
}
.editor-wrap h5, .editor-wrap .h5, .cke_editable h5, .cke_editable .h5 {
  font-size: var(--fs-h5);
}
.editor-wrap h6, .editor-wrap .h6, .cke_editable h6, .cke_editable .h6 {
  font-size: var(--fs-h6);
}
.editor-wrap strong, .cke_editable strong {
  font-weight: var(--fw-bold);
}
.editor-wrap hr, .cke_editable hr {
  border: none;
  border-bottom: 1px solid #ddd;
  margin: 50px auto;
}
.editor-wrap video, .editor-wrap embed, .editor-wrap iframe, .cke_editable video, .cke_editable embed, .cke_editable iframe {
  width: 100%;
  max-width: 100% !important;
}
.editor-wrap video, .editor-wrap embed, .editor-wrap iframe[src*=youtube], .cke_editable video, .cke_editable embed, .cke_editable iframe[src*=youtube] {
  aspect-ratio: 16/9 !important;
}
.editor-wrap a, .cke_editable a {
  color: var(--color-main);
  text-decoration: underline;
}
.editor-wrap a:hover, .cke_editable a:hover {
  color: var(--color-light);
  text-decoration: none;
}
.editor-wrap table, .cke_editable table {
  width: 100%;
  border-collapse: collapse;
  border-top: 1px solid;
}
.editor-wrap table tr, .cke_editable table tr {
  border-bottom: 1px solid #ddd;
}
.editor-wrap table th, .editor-wrap table td, .cke_editable table th, .cke_editable table td {
  width: 16.6667%;
  min-width: 110px;
  padding: 12px 20px;
  text-align: center;
}
.editor-wrap table a, .cke_editable table a {
  color: #486171;
  text-decoration: none;
}
.editor-wrap table a:hover, .cke_editable table a:hover {
  color: var(--color-main);
  text-decoration: underline;
}
.editor-wrap table th, .cke_editable table th {
  max-width: 250px;
  min-width: 110px;
  color: var(--color-main);
}
.editor-wrap table thead, .cke_editable table thead {
  border-top: 2px solid var(--color-main);
  border-bottom: 2px solid var(--color-main);
}
.editor-wrap table thead tr, .cke_editable table thead tr {
  border: none;
}
.editor-wrap table thead td, .editor-wrap table thead th, .cke_editable table thead td, .cke_editable table thead th {
  font-weight: var(--fw-bold);
  color: var(--color-main);
  padding-top: 15px;
  padding-bottom: 15px;
}
.editor-wrap ul, .cke_editable ul {
  margin: 0 0 1em 0.25em;
  padding: 0;
  list-style: none;
}
.editor-wrap ul > li, .cke_editable ul > li {
  position: relative;
  margin: 10px 0;
  padding-left: 20px;
}
.editor-wrap ul > li::before, .cke_editable ul > li::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 14px;
  display: block;
  width: 5px;
  height: 5px;
  background-color: #436a88;
  border-radius: 50px;
}
.editor-wrap ol, .cke_editable ol {
  list-style-image: url(data:0);
  list-style: decimal;
  margin: 0 0 1em 0.4rem;
  padding: 0 0 0 1.8em;
  counter-reset: newcounter;
}
.editor-wrap ol + *, .cke_editable ol + * {
  margin-top: 2rem;
}
.editor-wrap ol > li, .cke_editable ol > li {
  position: relative;
  padding: 0 0 0 0.2em;
  margin: 0.25em 0 0.35em -0.8em;
  display: list-item;
  list-style-position: outside;
}
.editor-wrap ol > li > ol, .cke_editable ol > li > ol {
  margin: 0 0 1em 0.9em;
  padding: 0 0 0 1em;
}
.editor-wrap ol > li > ol > li, .cke_editable ol > li > ol > li {
  position: relative;
  padding: 0;
  margin: 5px 0 5px;
  display: block;
}
.editor-wrap ol > li > ol > li:first-of-type, .cke_editable ol > li > ol > li:first-of-type {
  counter-reset: newcounter;
}
.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) ")";
}
.editor-wrap ol + .editor-title, .editor-wrap ul + .editor-title, .editor-wrap p + .editor-title, .cke_editable ol + .editor-title, .cke_editable ul + .editor-title, .cke_editable p + .editor-title {
  margin-top: 2em;
}

.editor-table {
  display: block;
  width: 100%;
  position: relative;
  overflow-y: hidden;
  overflow-x: auto;
  margin-bottom: 20px;
}
.editor-table::after {
  position: absolute;
  content: url("data:image/svg+xml,%3Csvg  xmlns='http://www.w3.org/2000/svg'  width='24'  height='24'  viewBox='0 0 24 24'  fill='none'  stroke='%23333'  stroke-width='2'  stroke-linecap='round'  stroke-linejoin='round'  class='icon icon-tabler icons-tabler-outline icon-tabler-caret-left-right'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M14 18l6 -6l-6 -6v12' /%3E%3Cpath d='M10 18l-6 -6l6 -6v12' /%3E%3C/svg%3E");
  width: 25px;
  height: 25px;
  pointer-events: none;
  line-height: 1;
  z-index: 20;
  display: block;
  top: 8px;
  right: 20px;
  opacity: 0;
  -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;
}
.editor-table.need-scroll::after {
  opacity: 0.9;
}

.editor-title {
  font-weight: var(--fw-semibold);
  font-size: var(--fs-listname);
  line-height: 1.4;
  margin: 15px 0;
  padding: 0;
  display: block;
  color: #000;
}
.editor-title h1, .editor-title h2, .editor-title h3, .editor-title h4, .editor-title h5, .editor-title h6 {
  font: inherit;
  margin: 0;
  padding: 0;
}

h1.editor-title, h2.editor-title, h3.editor-title, h4.editor-title, h5.editor-title, h6.editor-title {
  font-weight: var(--fw-semibold);
  font-size: var(--fs-listname);
  line-height: 1.4;
  margin: 15px 0;
  padding: 0;
  display: block;
  color: #000;
}

@-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%);
  }
}
.editor-columns {
  position: relative;
  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;
  width: auto;
  gap: 10px;
}
.editor-columns > * {
  display: inline-block;
  vertical-align: top;
  height: auto !important;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -ms-flex-preferred-size: calc(33.333333% - 20px);
      flex-basis: calc(33.333333% - 20px);
}
.editor-columns img {
  display: inline-block;
  text-align: center;
  margin-bottom: 0.5rem;
}
.editor-columns .editor-title {
  font-size: var(--fs-h5);
}
@media (max-width: 579px) {
  .editor-columns {
    display: block;
  }
  .editor-columns > * {
    display: block;
    width: 100%;
  }
}

/* 
 * Index
 */
.i-news {
  padding-bottom: var(--gap-sec);
}
.i-news .container {
  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;
  gap: 0 var(--gap-sec);
}
.i-news__heading {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 max(26%, 200px);
          flex: 0 0 max(26%, 200px);
  padding-top: calc(var(--gap-sec) * 0.8);
  padding-bottom: calc(var(--gap-sec) * 0.6);
}
.i-news__heading::before {
  content: "";
  background-color: rgba(64, 176, 176, 0.15);
  position: absolute;
  left: calc(var(--gap-leave) * -1);
  top: 0;
  right: max(var(--gap), 2.6vw);
  bottom: 0;
}
.i-news__heading .bg {
  position: sticky;
  top: var(--h-header);
  aspect-ratio: 400/580;
  background: url(../images/i_news_bg.jpg) no-repeat center center;
  background-size: cover;
  padding: calc(var(--gap-sec) * 0.6) 0;
  -webkit-box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.25);
          box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.25);
}
.i-news__heading .subhead {
  display: block;
  text-align: center;
  color: #fff;
}
.i-news__heading .subhead > * {
  display: block;
}
.i-news__heading .subhead .lg {
  line-height: 1.2;
  font-size: calc(var(--fs-subhead-lg) * 1.16);
}
.i-news__body {
  padding-top: var(--gap-sec);
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
.i-news__body .btn-wrap {
  position: absolute;
  bottom: 0;
  -webkit-transform: translateY(100%);
      -ms-transform: translateY(100%);
          transform: translateY(100%);
  right: 0;
}
.i-news .tabs-nav__content {
  margin-top: 1em;
  border-top: 1px solid #000;
}
@media (max-width: 991px) {
  .i-news .container {
    display: block;
  }
  .i-news .i-news__heading {
    display: block;
    padding: var(--gap) 0 0;
    margin: 0;
  }
  .i-news .i-news__heading::before {
    display: none;
  }
  .i-news .i-news__heading .subhead {
    color: #000;
    text-align: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 0.5em;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
  }
  .i-news .i-news__heading .bg {
    padding: 0;
    -webkit-box-shadow: none;
            box-shadow: none;
    background: none;
    aspect-ratio: auto;
  }
  .i-news .i-news__body {
    padding-top: 0;
  }
}

.news-list .item {
  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;
  padding: 0.5em 0;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  gap: 0 1em;
  border-bottom: 1px solid #ccc;
  font-size: var(--fs-listname-sm);
  line-height: 1.5;
}
.news-list .link {
  position: absolute;
  inset: 0;
  z-index: 10;
  font-size: 0;
}
.pc .news-list .link:hover ~ .text .title {
  color: var(--color-main2);
}

.news-list .img {
  z-index: 0;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 max(12.5rem, 100px);
          flex: 0 0 max(12.5rem, 100px);
}
.news-list .text {
  z-index: 0;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  padding: 0.5em 1em;
}
.news-list .cate {
  font-style: normal;
  display: inline-block;
  color: var(--color-main);
  white-space: nowrap;
  padding: 0.1em 0.7em;
  border-radius: 50px;
  margin-right: 1em;
  border: 1px solid var(--color-main);
}
.news-list .date {
  display: inline-block;
  white-space: nowrap;
  font-style: normal;
  color: var(--color-main);
}
.news-list .title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden;
  margin: 0.5em 0 0 0;
  padding: 0 0.1em;
  font-weight: 500;
  font: inherit;
}
.news-list .brief {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: var(--fs-brief);
  color: #333;
  line-height: 1.5;
  margin-top: 5px;
}
@media (max-width: 579px) {
  .news-list .item {
    gap: 0 10px;
  }
  .news-list .text {
    padding-right: 0;
    padding-left: 0;
  }
}

.i-links {
  padding: var(--gap-sec) 0 calc(var(--gap-sec) * 2);
  background: url(../images/i_links_bg.png) no-repeat center top;
  background-size: cover;
}
.i-links__list {
  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;
  gap: max(3.2vw, 50px);
}
.i-links__link {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(33.3333333333% - max(3.2vw, 50px));
          flex: 0 0 calc(33.3333333333% - max(3.2vw, 50px));
  display: block;
  color: #000;
  line-height: 1.5;
  font-size: var(--fs-listname-lg);
}
.i-links__link .text > * {
  display: block;
}
.i-links__link .circle {
  width: 100%;
  max-width: calc(var(--fs-def) * 21);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
  border-radius: 100%;
  aspect-ratio: 1;
  border: max(0.25rem, 5px) solid var(--color-main);
  margin: 0 auto;
}
.i-links__link::before {
  content: "";
  display: block;
  position: absolute;
  width: max(3.2vw, 50px);
  height: max(0.25rem, 5px);
  top: 50%;
  left: calc(max(3.2vw, 50px) * -0.75);
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background-color: var(--color-main);
}
.i-links__link:hover {
  color: var(--color-main2);
}
.i-links__link:hover .icon {
  -webkit-filter: invert(55%) sepia(78%) saturate(320%) hue-rotate(131deg) brightness(95%) contrast(89%);
          filter: invert(55%) sepia(78%) saturate(320%) hue-rotate(131deg) brightness(95%) contrast(89%);
}
.i-links__link:nth-child(1)::before {
  display: none;
}
.i-links__link:nth-child(2) .circle {
  border-color: var(--color-orange);
}
.i-links__link:nth-child(2)::before {
  background-color: var(--color-orange);
}
.i-links__link:nth-child(2):hover {
  color: var(--color-orange);
}
.i-links__link:nth-child(2):hover .icon {
  -webkit-filter: invert(35%) sepia(47%) saturate(2611%) hue-rotate(354deg) brightness(111%) contrast(84%);
          filter: invert(35%) sepia(47%) saturate(2611%) hue-rotate(354deg) brightness(111%) contrast(84%);
}
.i-links__link:nth-child(3) .circle {
  border-color: var(--color-yellow);
}
.i-links__link:nth-child(3)::before {
  background-color: var(--color-yellow);
}
.i-links__link:nth-child(3):hover {
  color: var(--color-yellow);
}
.i-links__link:nth-child(3):hover .icon {
  -webkit-filter: invert(72%) sepia(48%) saturate(501%) hue-rotate(2deg) brightness(95%) contrast(96%);
          filter: invert(72%) sepia(48%) saturate(501%) hue-rotate(2deg) brightness(95%) contrast(96%);
}
.i-links .icon {
  width: 45%;
  margin-bottom: 0.5em;
}
.i-links .icon img {
  aspect-ratio: 160/110;
}
.i-links .zh {
  font-size: 1.06em;
  font-weight: 600;
}

@media (max-width: 1023px) {
  .i-links__list {
    display: block;
    gap: 0;
  }
  .i-links__link {
    width: 100%;
    margin-bottom: var(--gap);
  }
  .i-links__link .circle {
    aspect-ratio: auto;
    padding: 0.5em 1em;
    border-radius: 120px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    max-width: none;
    gap: 0 1em;
  }
  .i-links__link .icon {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100px;
            flex: 0 0 100px;
  }
  .i-links__link .text {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    text-align: left;
  }
  .i-links__link::before {
    display: none;
  }
}
@media (max-width: 767px) {
  .i-links__link .text span {
    display: block;
  }
}
@media (max-width: 379px) {
  .i-links__link .circle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 0;
  }
  .i-links__link .text {
    text-align: center;
  }
  .i-links__link .icon {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    max-width: 80px;
    margin-bottom: 0;
  }
}
#news-list .news-list {
  margin-bottom: var(--gap);
}
#news-list .news-list .item {
  font-size: var(--fs-listname);
}
#news-list .news-list .text {
  padding-left: 160px;
  padding-top: 0;
  padding-bottom: 0;
}
#news-list .news-list .date {
  position: absolute;
  top: 0.5em;
  left: 0;
  width: 160px;
}
@media (max-width: 579px) {
  #news-list .news-list .text {
    padding-left: 0;
  }
  #news-list .news-list .date {
    position: relative;
    top: auto;
    font-size: 1rem;
  }
  #news-list .news-list .title {
    margin-top: 0;
  }
}

.article__heading {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 0 max(5vw, 40px);
  border-bottom: 3px solid #aaa;
  padding-bottom: 0.6em;
  margin-top: var(--gap);
  margin-bottom: 0.8em;
  line-height: 1.4;
  font-size: var(--fs-listname);
}
.article__heading.color-mark {
  color: #3FA7A7;
}
.article__heading .title {
  margin: 0;
  font-size: var(--fs-listname-lg);
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
.article__heading .date {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  margin-top: 0.1em;
  font-weight: 500;
  left: 0;
  display: inline-block;
  white-space: nowrap;
  font-style: normal;
  color: var(--color-main);
}
.article__body {
  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;
  gap: 0 max(4vw, 30px);
}
.article__body ol {
  counter-reset: ol-counter;
  padding: 0 0 0 3.5rem;
  margin: 1em 0;
  list-style: none;
}
.article__body ol > li {
  counter-increment: ol-counter;
  line-height: 1.6;
  margin: 0.5em 0;
  padding-left: 0.5em;
}
.article__body ol > li::marker {
  letter-spacing: 0.1em;
  content: "(" counter(ol-counter, cjk-ideographic) ")";
}
.article__body ol.num {
  counter-reset: num;
}
.article__body ol.num > li {
  counter-increment: num;
}
.article__body ol.num > li::marker {
  content: counter(num) ". ";
  letter-spacing: 0.1em;
}
.article__body ol.cn {
  counter-reset: cn;
}
.article__body ol.cn > li {
  counter-increment: cn;
}
.article__body ol.cn > li::marker {
  content: counter(cn, cjk-ideographic) "、";
  letter-spacing: 0.1em;
}
.article__imgs {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 max(18vw, 300px);
          flex: 0 0 max(18vw, 300px);
}
.article__imgs img {
  margin-bottom: 15px;
  display: block;
}
.article__cont {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
.article__list {
  line-height: 1.5;
  margin-top: max(4vw, 35px);
  margin-bottom: max(4vw, 35px);
}
.article__list .title {
  display: inline-block;
  height: var(--h-btn);
  line-height: var(--h-btn);
  color: #fff;
  min-width: max(110px, 6.25vw);
  border-radius: 10px;
  font-weight: 500;
  text-align: center;
  white-space: nowrap;
  background-color: var(--color-main);
}
.article__list .title.bg-orange {
  background-color: var(--color-orange);
}
.article__list ul {
  display: block;
}
.article__list ul > li {
  display: block;
  padding: 0.4em 0;
  border-bottom: 1px solid #ccc;
}
.article__list ul > li a {
  display: inline-block;
  padding-left: 1.25em;
  color: #000;
}
.article__list ul > li a:hover {
  color: var(--color-main);
}
.article__list ul > li a::before {
  content: "";
  width: 0.4em;
  height: 0.4em;
  border-radius: 50px;
  background-color: rgba(0, 0, 0, 0.8);
  position: absolute;
  top: 0.5em;
  left: 0.4em;
}

@media (max-width: 767px) {
  .article__heading {
    display: block;
  }
  .article__heading .date {
    margin-bottom: 0.5em;
    font-size: 1rem;
  }
  .article__body {
    display: block;
  }
  .article__imgs .sticky {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 15px;
    margin-right: -15px;
  }
  .article__imgs img {
    width: calc(50% - 15px);
    display: inline-block;
  }
}
.func__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: max(3.2vw, 50px);
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: var(--gap-sec) auto;
}
.func__list .item {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(33.3333333333% - max(3.2vw, 50px));
          flex: 0 0 calc(33.3333333333% - max(3.2vw, 50px));
  line-height: 1.5;
  font-size: var(--fs-listname-lg);
  max-width: calc(var(--fs-def) * 21);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
  aspect-ratio: 1;
  border: max(0.25rem, 5px) solid #207CC1;
  color: #207CC1;
  margin: 0;
  padding: var(--gap);
}
.func__list .item .title {
  color: #000;
  display: block;
  margin: 1em auto 0;
  padding: 0;
  font-weight: 500;
  line-height: 1.5;
}
.func__list .item svg {
  max-width: max(6.84rem, 80px);
}
.func__list .item.color-pink {
  border: max(0.25rem, 5px) solid #E95A87;
  color: #E95A87;
}
@media (max-width: 767px) {
  .func__list {
    display: block;
    margin: var(--gap) auto;
  }
  .func__list .item {
    width: 100%;
    max-width: none;
    margin: 0 0 var(--gap);
    aspect-ratio: unset;
  }
}

.apply-wrap {
  margin-top: var(--gap-sec);
}
.apply-wrap .subhead {
  margin-bottom: var(--gap-sec);
}

.download-subhead {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 0 max(5vw, 40px);
  color: #000;
  border-bottom: 3px solid #000;
  padding: 0 0 0.7em;
  margin: 0;
  line-height: 1.4;
  font-size: var(--fs-listname);
}

.download-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;
  gap: 0 1em;
  padding: 0.6em 0;
  border-bottom: 1px solid #ccc;
}
.download-list .download-btn {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
.download-list .title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden;
  line-height: 1.5;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  font-weight: 400;
  margin: 10px 0;
  padding: 0;
  font-size: clamp(17 / 16 * var(--fs-def, 16px), 13.4634146341 / 16 * var(--fs-def, 16px) + 0.6097560976vw, 22 / 16 * var(--fs-def, 16px));
}

.about-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 0 max(2vw, 20px);
  margin-right: calc(max(2vw, 20px) * -1);
}
.about-list + .pagination {
  margin-top: 20px;
}
.about-list .item {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(25% - max(2vw, 20px));
          flex: 0 0 calc(25% - max(2vw, 20px));
  margin-bottom: var(--gap);
}
.about-list .title {
  z-index: 0;
  display: block;
  line-height: 1.5;
  color: #000;
  margin: 0.5em auto;
  font-weight: 400;
  padding: 0;
  font-size: clamp(18 / 16 * var(--fs-def, 16px), 16.5853658537 / 16 * var(--fs-def, 16px) + 0.243902439vw, 20 / 16 * var(--fs-def, 16px));
  text-align: center;
}
.about-list .img {
  z-index: 0;
  margin: 0 auto 10px;
}
.about-list .img img {
  width: 100%;
  aspect-ratio: 285/210;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
}
.about-list .link {
  z-index: 10;
  position: absolute;
  inset: 0;
  font-size: 0;
}
.about-list .link:hover ~ .title {
  color: var(--color-main);
}
@media (max-width: 767px) {
  .about-list .item {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(33.3333333333% - max(2vw, 20px));
            flex: 0 0 calc(33.3333333333% - max(2vw, 20px));
  }
}
@media (max-width: 579px) {
  .about-list {
    gap: 0 14px;
    margin-right: -14px;
  }
  .about-list .item {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(50% - 14px);
            flex: 0 0 calc(50% - 14px);
  }
}

.sticky {
  position: sticky;
  top: var(--h-header);
}

.col-half {
  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;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  gap: 0 2.5rem;
}
.col-half.row-ltr {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}
@media (max-width: 639px) {
  .col-half {
    display: block;
  }
  .col-half .col-content {
    margin-bottom: var(--gap);
  }
}

.col-content {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

.col-aside {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 max(11.5vw, 170px);
          flex: 0 0 max(11.5vw, 170px);
}

.sub-link-list {
  padding-top: 1.25em;
  max-height: calc(90vh - var(--h-header));
  overflow-y: auto;
}
.sub-link-list > li {
  display: block;
  margin-bottom: 0.5em;
}
.sub-link-list > li > a {
  display: block;
  line-height: 1.5;
  padding: 0.6em 2rem 0.6em 0.6em;
  font-size: clamp(17 / 16 * var(--fs-def, 16px), 14.8780487805 / 16 * var(--fs-def, 16px) + 0.3658536585vw, 20 / 16 * var(--fs-def, 16px));
  border-radius: 5px;
  background-color: #fff;
  color: #000;
  text-decoration: none;
  border: 1px solid rgba(0, 0, 0, 0.4);
}
.sub-link-list > li > a::after {
  content: "";
  display: block;
  position: absolute;
  right: 0.6em;
  top: 50%;
  margin-top: -0.75rem;
  width: 1.5rem;
  height: 1.5rem;
  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='%23000' d='M3 19h18v2H3zm10-5.828L19.071 7.1l1.414 1.414L12 17L3.515 8.515L4.929 7.1L11 13.173V2h2z'/%3E%3C/svg%3E") no-repeat 0 0/contain;
}
.pc .sub-link-list > li > a:hover {
  background-color: var(--color-main);
  color: #fff;
  border: 1px solid var(--color-main);
}
.pc .sub-link-list > li > a:hover::after {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}

@media (max-width: 639px) {
  .sub-link-list {
    max-height: none;
  }
}

.regular-wrap {
  margin-top: 2em;
}
.regular-wrap .col-aside {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 max(15vw, 220px);
          flex: 0 0 max(15vw, 220px);
}
.regular-wrap .col-aside ul {
  background-color: #f5f5f5;
  padding: 0.8em;
}
.regular-wrap .col-aside ul > li {
  display: block;
  border-top: 1px solid #dedede;
  margin: 0;
  padding: 0;
}
.regular-wrap .col-aside ul > li:first-child {
  border-top: none;
}
.regular-wrap .col-aside ul > li > a {
  display: block;
  border: none;
  background-color: transparent;
  padding: 0.82em 0.5em 0.8em 1.5em;
  min-height: 2.5em;
  color: #333;
  line-height: 1.5;
}
.regular-wrap .col-aside ul > li > a::before {
  content: "";
  line-height: 1.5;
  display: block;
  width: 0.4em;
  aspect-ratio: 1;
  border-style: solid;
  border-width: 0 1px 1px 0;
  border-color: #333;
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
  position: absolute;
  top: 1.4em;
  left: 0.4em;
}
.regular-wrap .col-aside ul > li > a::after {
  display: none;
}
.pc .regular-wrap .col-aside ul > li > a:hover {
  color: var(--color-orange);
  font-weight: 500;
}
.pc .regular-wrap .col-aside ul > li > a:hover::before {
  border-color: var(--color-orange);
}

.regular-wrap .col-aside ul > li.current > a {
  background-color: var(--color-orange);
  color: #fff;
}
.regular-wrap .col-aside ul > li.current > a::before {
  border-color: #fff;
}
.regular-wrap .col-aside ul > li.current:hover > a {
  background-color: var(--color-orange);
  color: #fff;
}
.regular-wrap .col-aside ul > li.current:hover > a::before {
  border-color: #fff;
}
@media (min-width: 768px) {
  .regular-wrap .col-aside .sticky {
    overflow-y: auto;
    overflow-x: hidden;
    max-height: calc(92vh - var(--h-header));
    scrollbar-color: #ccc #eee;
    /* Chrome, Edge, and Safari */
    /*網頁捲軸【寬度】*/
    /*網頁捲軸【背景】顏色*/
    /*網頁捲軸【把手】顏色*/
    /*網頁捲軸【滑過時】把手的顏色*/
  }
  .regular-wrap .col-aside .sticky * {
    scrollbar-width: thin;
  }
  .regular-wrap .col-aside .sticky ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }
  .regular-wrap .col-aside .sticky ::-webkit-scrollbar-track {
    background: #eee;
    border-radius: 10px;
  }
  .regular-wrap .col-aside .sticky ::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 10px;
  }
  .regular-wrap .col-aside .sticky ::-webkit-scrollbar-thumb:hover {
    background: #999;
  }
  .regular-wrap .tabs-dropdown .tab-dropdown__list > ul > li > a {
    border-color: var(--color-main);
  }
  .pc .regular-wrap .tabs-dropdown .tab-dropdown__list > ul > li:not(.current):hover > a {
    background-color: rgba(62, 186, 186, 0.06);
  }
  .regular-wrap .tabs-dropdown .tab-dropdown__list > ul > li > ul {
    display: none !important;
  }
}
@media (max-width: 767px) {
  .regular-wrap .col-half {
    display: block;
  }
  .regular-wrap .col-aside {
    display: none !important;
  }
  .regular-wrap .tabs-dropdown .tab-dropdown__switch {
    -moz-text-align-last: left;
         text-align-last: left;
  }
  .regular-wrap .tabs-dropdown .tab-dropdown__list > ul {
    text-align: left;
  }
  .regular-wrap .tabs-dropdown .tab-dropdown__list > ul > li > a {
    text-align: left;
  }
  .regular-wrap .tabs-dropdown.is-open .tab-dropdown__list > ul > li:not(.current):hover > a {
    color: #000;
    background-color: transparent;
  }
  .regular-wrap .tab-dropdown__switch {
    border-color: var(--color-main);
  }
  .regular-wrap .tab-dropdown__list > ul > li {
    display: block;
    margin: 0;
    padding: 0.5em 0;
    border-top: 2px solid #ccc;
  }
  .regular-wrap .tab-dropdown__list > ul > li > a {
    display: block;
    border: none;
    background-color: transparent;
    padding: 0.47em 0;
    color: #333;
    border-radius: 0;
    line-height: 1.5;
  }
  .pc .regular-wrap .tab-dropdown__list > ul > li > a:hover {
    color: #000;
    background-color: transparent;
    font-weight: 500;
  }
  .regular-wrap .tab-dropdown__list > ul > li.current > a {
    background-color: transparent;
    color: var(--color-orange);
  }
  .regular-wrap .tab-dropdown__list > ul > li.current:hover > a {
    background-color: transparent;
    color: var(--color-orange);
  }
  .regular-wrap .tab-dropdown__list > ul > li > ul {
    padding: 0;
  }
  .regular-wrap .tab-dropdown__list > ul > li > ul > li {
    display: block;
    border-top: 1px solid #dedede;
    margin: 0;
    padding: 0;
  }
  .regular-wrap .tab-dropdown__list > ul > li > ul > li:first-child {
    border-top: none;
  }
  .regular-wrap .tab-dropdown__list > ul > li > ul > li > a {
    display: block;
    border: none;
    background-color: transparent;
    padding: 0.5em 0.2em 0.5em 1.3em;
    color: #666;
    line-height: 1.5;
    font-size: 0.9375em;
  }
  .regular-wrap .tab-dropdown__list > ul > li > ul > li > a::before {
    content: "";
    line-height: 1.5;
    display: block;
    width: 0.4em;
    aspect-ratio: 1;
    border-style: solid;
    border-width: 0 1px 1px 0;
    border-color: #888;
    -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
            transform: rotate(-45deg);
    position: absolute;
    top: 1.03em;
    left: 0.35em;
  }
  .regular-wrap .tab-dropdown__list > ul > li > ul > li > a::after {
    display: none;
  }
  .pc .regular-wrap .tab-dropdown__list > ul > li > ul > li > a:hover {
    color: var(--color-orange);
    font-weight: 500;
  }
  .pc .regular-wrap .tab-dropdown__list > ul > li > ul > li > a:hover::before {
    border-color: var(--color-orange);
  }
  .regular-wrap .tab-dropdown__list > ul > li > ul > li.current > a {
    background-color: var(--color-orange);
    color: #fff;
  }
  .regular-wrap .tab-dropdown__list > ul > li > ul > li.current > a::before {
    border-color: #fff;
  }
  .regular-wrap .tab-dropdown__list > ul > li > ul > li.current:hover > a {
    background-color: var(--color-orange);
    color: #fff;
  }
  .regular-wrap .tab-dropdown__list > ul > li > ul > li.current:hover > a::before {
    border-color: #fff;
  }
}