@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@500;700;900&family=Noto+Sans+TC:wght@300;500;700;900&display=swap");
.w50 {
  width: 50px;
}

.w100 {
  width: 100px;
}

.w150 {
  width: 150px;
}

.w200 {
  width: 200px;
}

.w250 {
  width: 250px;
}

.w300 {
  width: 300px;
}

.w350 {
  width: 350px;
}

.w400 {
  width: 400px;
}

.w450 {
  width: 450px;
}

.w500 {
  width: 500px;
}

.w50-min {
  min-width: 50px;
}

.w100-min {
  min-width: 100px;
}

.w150-min {
  min-width: 150px;
}

.w200-min {
  min-width: 200px;
}

.w250-min {
  min-width: 250px;
}

.w300-min {
  min-width: 300px;
}

.w350-min {
  min-width: 350px;
}

.w400-min {
  min-width: 400px;
}

.w450-min {
  min-width: 450px;
}

.w500-min {
  min-width: 500px;
}

.w50-max {
  max-width: 50px;
}

.w100-max {
  max-width: 100px;
}

.w150-max {
  max-width: 150px;
}

.w200-max {
  max-width: 200px;
}

.w250-max {
  max-width: 250px;
}

.w300-max {
  max-width: 300px;
}

.w350-max {
  max-width: 350px;
}

.w400-max {
  max-width: 400px;
}

.w450-max {
  max-width: 450px;
}

.w500-max {
  max-width: 500px;
}

.w100-p {
  width: 100%;
}

.flex-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

:root {
  --color-white: #ffffff;
  --color-text: #39414D;
  --height-top-header: 60px;
  --color-main-01: #684737;
  --color-main-02: #825d4a;
  --color-main-03: #a2755d;
  --color-main-04: #b7a692;
  --color-main-01-t: #68473711;
  --color-main-02-t: #825d4a11;
  --color-main-03-t: #a2755d11;
  --color-accent-01: #f7a234;
}

.block-top {
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  height: var(--height-top-header);
  background: var(--color-main-02);
  -webkit-transition: 0.5s;
  transition: 0.5s;
  -webkit-animation: fade-in 1.5s;
          animation: fade-in 1.5s;
}
.block-top::after {
  content: "";
  width: 100%;
  background: var(--color-main-03);
  height: 8px;
  bottom: 0;
  left: 0;
  position: absolute;
}
.block-top .container {
  position: relative;
  height: 100%;
  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;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  opacity: 1;
}
.block-top .logo-box {
  position: relative;
  height: 100%;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 8px;
  padding-bottom: 16px;
  z-index: 1;
}
.block-top .logo-box img {
  height: 100%;
}
.block-top .logo-box .logo-text {
  padding-left: 14px;
  white-space: nowrap;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
.block-top .logo-box .logo-text h1 {
  color: #fff;
  padding: 0;
  margin: 0;
  font-size: 2.5rem;
  font-weight: 700;
  letter-spacing: 3px;
}
.block-top .logo-box .logo-text h2 {
  color: #fff;
  padding: 0;
  margin: 0;
  font-size: 1.8rem;
  font-weight: 500;
  margin-left: 24px;
  position: relative;
  top: 1px;
}
.block-top .logo-box .logo-text h2::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 90%;
  background: var(--color-main-03);
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  left: -13.5px;
}
@media (max-width: 768px) {
  .block-top .logo-box .logo-text {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    padding-left: 8px;
  }
  .block-top .logo-box .logo-text h1 {
    font-size: 2rem;
  }
  .block-top .logo-box .logo-text h2 {
    font-size: 1.6rem;
    padding: 0;
    margin: 0;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .block-top .logo-box .logo-text h2::before {
    display: none;
  }
}
.block-top .logo-box::before {
  content: " ";
  position: absolute;
  width: 100%;
  height: 0px;
  background: var(--color-main-01);
  bottom: 0;
  left: 0;
  z-index: -1;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.block-top .logo-box::after {
  content: " ";
  position: absolute;
  width: 100%;
  height: 0px;
  background: var(--color-accent-01);
  left: 0;
  bottom: 0;
  z-index: -1;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.block-top .logo-box:hover::before {
  height: 100px;
}
.block-top .logo-box:hover::after {
  height: 8px;
}
.block-top .menu-btn-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100%;
  background: var(--color-main-02);
}
.block-top .menu-btn-box .menu-btn {
  position: relative;
  color: #fff;
  padding: 0;
  margin: 0;
  font-size: 1.8rem;
  font-weight: 700;
  letter-spacing: 3px;
  padding: 0 16px;
  padding-bottom: 8px;
  min-height: var(--height-top-header);
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  cursor: pointer;
  overflow: hidden;
  z-index: 99;
}
.block-top .menu-btn-box .menu-btn::before {
  content: " ";
  position: absolute;
  width: 100%;
  height: 0px;
  background: var(--color-main-01);
  bottom: 0;
  left: 0;
  z-index: -1;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.block-top .menu-btn-box .menu-btn::after {
  content: " ";
  position: absolute;
  width: 100%;
  height: 0px;
  background: var(--color-accent-01);
  left: 0;
  bottom: 0;
  z-index: -1;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.block-top .menu-btn-box .menu-btn:hover::before {
  height: 100px;
}
.block-top .menu-btn-box .menu-btn:hover::after {
  height: 8px;
}
.block-top .burger-btn {
  position: absolute;
  color: #fff;
  height: var(--height-top-header);
  aspect-ratio: 1/1;
  margin: 0;
  font-size: 23px;
  height: 100%;
  cursor: pointer;
  right: 0;
  top: 0;
  display: none;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding-bottom: 8px;
}
.block-top .burger-btn:hover {
  background: var(--color-main-01);
}

@media (min-width: 992px) {
  .block-top {
    top: 0 !important;
  }
  .block-top .menu-btn-box {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .block-top .container {
    opacity: 1 !important;
  }
}
@media (max-width: 991px) {
  .block-top {
    padding: 0;
  }
  .block-top .container {
    max-width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    padding: 0;
    margin: 0;
  }
  .block-top .logo-box {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 var(--height-top-header);
            flex: 0 0 var(--height-top-header);
  }
  .block-top .menu-btn-box {
    top: 0;
    left: 0;
    display: none;
    height: auto;
    background: var(--color-main-03);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 100%;
  }
  .block-top .menu-btn-box .menu-btn {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 20px;
            flex: 0 0 20px;
    width: 100%;
    text-align: center;
    font-size: 20px;
    background: var(--color-main-02);
    border-bottom: 1px solid var(--color-main-03);
    -webkit-box-sizing: content-box;
            box-sizing: content-box;
    position: relative;
  }
  .block-top .menu-btn-box .menu-btn:hover {
    background: var(--color-main-01);
  }
  .block-top .menu-btn-box .menu-btn::before, .block-top .menu-btn-box .menu-btn::after {
    display: none;
  }
  .block-top .menu-btn-box .menu-btn:last-child {
    border-bottom: 4px solid var(--color-main-03);
  }
  .block-top .burger-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
@media (max-width: 350px) {
  .block-top .container {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
}
.block-banner {
  padding: 0;
  margin: 0;
  position: relative;
  margin-top: var(--height-top-header);
  width: 100%;
}
.block-banner .container {
  padding: 0;
}
@media (max-width: 992px) {
  .block-banner .container {
    max-width: 88%;
  }
}
.block-banner .loading-img {
  position: absolute;
  width: 80px;
  height: 80px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  z-index: 10;
}
.block-banner .loading-img svg {
  width: 100%;
  height: 100%;
}
.block-banner .loading-img svg path,
.block-banner .loading-img svg rect {
  fill: var(--color-main-03);
}
.block-banner .swiper-pagination {
  position: relative;
}

.block-news {
  padding-top: 12px !important;
}
.block-news .container {
  background: #fff;
  border-bottom: 8px solid #f5f6f8;
  padding: 4px 0;
}
@media (max-width: 992px) {
  .block-news .container {
    max-width: 90%;
  }
}
.block-news .row {
  --bs-gutter-x: 0;
  --bs-gutter-y: 0;
}
.block-news .block-img {
  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;
  padding: 32px;
  padding-left: 0;
}
@media (max-width: 1200px) {
  .block-news .block-img {
    display: none;
  }
}
.block-news .block-img .img-box {
  width: 100%;
  height: 100%;
  max-height: 320px;
  overflow: hidden;
}
.block-news .block-img .img-box ul.img-list {
  position: relative;
  width: 100%;
  height: 100%;
  list-style: none;
  padding: 0;
  margin: 0;
  top: 0%;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.block-news .block-img .img-box ul.img-list li.item {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: var(--color-main-02);
  background-image: url("data:image/svg+xml;charset=utf-8, %3C!-- Generator: Adobe Illustrator 25.2.3%2C SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E %3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512%3B' xml:space='preserve'%3E %3Cstyle type='text/css'%3E .st0%7Bfill:%23fff%3B%7D %3C/style%3E %3Cpath class='st0' d='M354.7%2C307.1h91.2V367h-91.2V307.1z M512%2C45.5v375c0%2C33.1-26.9%2C60-60%2C60l-347.4%2C1c9.5-12.6%2C15.4-28.1%2C15.4-45 V52.1c0-11.4%2C9.2-20.7%2C20.6-20.7L497%2C30.5C505.3%2C30.5%2C512%2C37.2%2C512%2C45.5z M165%2C157.9c0%2C7.3%2C4%2C11.8%2C10.7%2C11.9c0.1%2C0%2C0.2%2C0%2C0.3%2C0 c2.8%2C0%2C5.1-0.9%2C6.9-2.6c2.1-2.1%2C3.2-5.2%2C3.2-9.3v-35.8c3.5%2C7.1%2C7.4%2C14.9%2C10.9%2C21.7c3.2%2C6.3%2C5.9%2C11.7%2C7.6%2C15.2 c3.5%2C7.2%2C8.5%2C10.7%2C15.3%2C10.7c8.4%2C0%2C13.3-5.4%2C13.3-14.9v-61c0-10.7-7.2-11.9-10.3-11.9c-6.6%2C0-10.6%2C4.4-10.6%2C11.9v36.8 c-2.2-4.3-4.6-9-7-13.7c-4.1-7.9-8.3-16.1-11.3-22.1c-3.7-7.3-7.2-12.9-15.9-12.9c-8%2C0-13%2C5.8-13%2C15.2V157.9z M165%2C296.5 c0%2C5.8%2C4.7%2C10.6%2C10.6%2C10.6h85.6c5.8%2C0%2C10.6-4.7%2C10.6-10.6S267%2C286%2C261.2%2C286h-85.6C169.7%2C286%2C165%2C290.7%2C165%2C296.5z M175.6%2C266.6 h58.9c5.8%2C0%2C10.6-4.7%2C10.6-10.6s-4.7-10.6-10.6-10.6h-58.9c-5.8%2C0-10.6%2C4.7-10.6%2C10.6S169.7%2C266.6%2C175.6%2C266.6z M165%2C377.6 c0%2C5.8%2C4.7%2C10.6%2C10.6%2C10.6h65c5.8%2C0%2C10.6-4.7%2C10.6-10.6v0c0-5.8-4.7-10.6-10.6-10.6h-65C169.7%2C367%2C165%2C371.7%2C165%2C377.6L165%2C377.6z M298.4%2C418.1c0-5.8-4.7-10.6-10.6-10.6H175.6c-5.8%2C0-10.6%2C4.7-10.6%2C10.6s4.7%2C10.6%2C10.6%2C10.6h112.3 C293.7%2C428.7%2C298.4%2C423.9%2C298.4%2C418.1z M298.4%2C337c0-5.8-4.7-10.6-10.6-10.6H175.6c-5.8%2C0-10.6%2C4.7-10.6%2C10.6v0 c0%2C5.8%2C4.7%2C10.6%2C10.6%2C10.6h112.3C293.7%2C347.6%2C298.4%2C342.9%2C298.4%2C337L298.4%2C337z M298.4%2C215.5c0-5.8-4.7-10.6-10.6-10.6H175.6 c-5.8%2C0-10.6%2C4.7-10.6%2C10.6s4.7%2C10.6%2C10.6%2C10.6h112.3C293.7%2C226%2C298.4%2C221.3%2C298.4%2C215.5z M298.4%2C159.1c0-5.6-3.3-9.1-8.6-9.1h-21.3 v-16.4h17.9c5.2%2C0%2C8.6-3.6%2C8.6-9.1c0-5.5-3.4-9.1-8.6-9.1h-17.9v-13.8h20.8c5.3%2C0%2C8.6-3.5%2C8.6-9.1c0-5.6-3.3-9.1-8.6-9.1h-32.9 c-7.1%2C0-11.4%2C4.6-11.4%2C11.9v60.9c0%2C7.5%2C4.3%2C12%2C11.4%2C12h33.4C295.2%2C168.2%2C298.4%2C164.7%2C298.4%2C159.1z M330.2%2C169.9 c8.2%2C0%2C13.4-4.3%2C15.1-12.4c3.4-15.6%2C6.1-27.8%2C7.9-36.7c2.2%2C11.1%2C5.3%2C25.6%2C7.9%2C36.7c1.8%2C7.9%2C7.4%2C12.3%2C15.6%2C12.3 c7.9%2C0%2C12.7-4%2C14.7-12.3c4.2-17.8%2C10-46.5%2C12.6-61.2l0%2C0c1.2-7.4-2.2-12.6-8.9-13.7c-3.6-0.6-6.6-0.1-8.9%2C1.6 c-2.2%2C1.6-3.6%2C4.1-4%2C7.5c-1.8%2C13.1-4.4%2C29.3-6.7%2C41.8c-2.7-12.4-5.9-26.2-9.4-41.5c-1.5-6.5-6.1-10.1-13-10.1 c-6.8%2C0-11.6%2C3.9-12.9%2C10.4c-3%2C15.5-5.7%2C29-8.1%2C41.1c-1.2-6.4-2.4-12.9-3.7-19.7c-1.4-7.2-2.8-14.6-4.1-21.9 c-0.6-3.4-2.3-6.1-4.7-7.7c-2.5-1.6-5.7-2.1-9.3-1.2c-7%2C1.7-10.3%2C7.2-8.6%2C14.5c1.1%2C4.8%2C2.8%2C13.2%2C4.7%2C22.2c2.9%2C14%2C6.2%2C29.8%2C8.2%2C38.1 C316.3%2C165.5%2C322%2C169.9%2C330.2%2C169.9z M453%2C418.1c0-5.8-4.7-10.6-10.6-10.6h-98.3c-5.8%2C0-10.6%2C4.7-10.6%2C10.6s4.7%2C10.6%2C10.6%2C10.6h98.3 C448.3%2C428.7%2C453%2C423.9%2C453%2C418.1z M467%2C296.5c0-5.8-4.7-10.6-10.6-10.6H344.1c-5.8%2C0-10.6%2C4.7-10.6%2C10.6v80.6c0%2C0.1%2C0%2C0.2%2C0%2C0.2 c0%2C0.1%2C0%2C0.2%2C0%2C0.2v0c0%2C5.8%2C4.7%2C10.6%2C10.6%2C10.6h112.3c5.8%2C0%2C10.6-4.7%2C10.6-10.6v0c0-0.1%2C0-0.2%2C0-0.2c0-0.1%2C0-0.2%2C0-0.2V296.5z M344.1%2C266.6h98.3c5.8%2C0%2C10.6-4.7%2C10.6-10.6s-4.7-10.6-10.6-10.6h-98.3c-5.8%2C0-10.6%2C4.7-10.6%2C10.6S338.3%2C266.6%2C344.1%2C266.6z M467%2C215.5c0-5.8-4.7-10.6-10.6-10.6H344.1c-5.8%2C0-10.6%2C4.7-10.6%2C10.6s4.7%2C10.6%2C10.6%2C10.6h112.3C462.3%2C226%2C467%2C221.3%2C467%2C215.5z M467%2C143.9c0-13.1-8.9-20.6-23.3-28.6c-11.8-6.4-11.8-9.2-11.8-11.5c0-2.8%2C4.5-3.1%2C5.9-3.1c4.7-0.1%2C8.2%2C1.1%2C11.5%2C4 c2.2%2C1.9%2C4.8%2C2.8%2C7.4%2C2.4c2.6-0.4%2C4.8-1.9%2C6.4-4.3c2.7-4.3%2C1.9-9.5-1.9-13.4c-4.5-4.6-13.4-7.4-23.3-7.4c-18.1%2C0-29.8%2C9.1-29.8%2C23.2 c0%2C13.2%2C8.5%2C20.5%2C23.3%2C28.7c11.7%2C6.4%2C11.6%2C9.9%2C11.6%2C12.2c0%2C1.2-0.1%2C5-7.1%2C5c-6%2C0-10-2.9-13.9-6.1l0%2C0c-2-1.6-4.4-2.3-6.8-2 c-2.4%2C0.3-4.5%2C1.7-6%2C3.8c-3%2C4.3-2.5%2C9.8%2C1.2%2C13.7c5.6%2C5.9%2C15.4%2C9.4%2C26.4%2C9.4C455.4%2C169.8%2C467%2C159.9%2C467%2C143.9z M90%2C91.5v345 c0%2C24.9-20.1%2C45-45%2C45s-45-20.1-45-45v-330c0-8.3%2C6.7-15%2C15-15H90z'/%3E %3C/svg%3E ");
  background-repeat: no-repeat;
  background-size: 25%;
  background-position: 50%;
}
.block-news .block-img .img-box ul.img-list li.item:nth-child(2n-1) {
  background: var(--color-main-01);
  background-image: url("data:image/svg+xml;charset=utf-8, %3C!-- Generator: Adobe Illustrator 25.2.3%2C SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E %3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512%3B' xml:space='preserve'%3E %3Cstyle type='text/css'%3E .st0%7Bfill:%23fff%3B%7D %3C/style%3E %3Cpath class='st0' d='M354.7%2C307.1h91.2V367h-91.2V307.1z M512%2C45.5v375c0%2C33.1-26.9%2C60-60%2C60l-347.4%2C1c9.5-12.6%2C15.4-28.1%2C15.4-45 V52.1c0-11.4%2C9.2-20.7%2C20.6-20.7L497%2C30.5C505.3%2C30.5%2C512%2C37.2%2C512%2C45.5z M165%2C157.9c0%2C7.3%2C4%2C11.8%2C10.7%2C11.9c0.1%2C0%2C0.2%2C0%2C0.3%2C0 c2.8%2C0%2C5.1-0.9%2C6.9-2.6c2.1-2.1%2C3.2-5.2%2C3.2-9.3v-35.8c3.5%2C7.1%2C7.4%2C14.9%2C10.9%2C21.7c3.2%2C6.3%2C5.9%2C11.7%2C7.6%2C15.2 c3.5%2C7.2%2C8.5%2C10.7%2C15.3%2C10.7c8.4%2C0%2C13.3-5.4%2C13.3-14.9v-61c0-10.7-7.2-11.9-10.3-11.9c-6.6%2C0-10.6%2C4.4-10.6%2C11.9v36.8 c-2.2-4.3-4.6-9-7-13.7c-4.1-7.9-8.3-16.1-11.3-22.1c-3.7-7.3-7.2-12.9-15.9-12.9c-8%2C0-13%2C5.8-13%2C15.2V157.9z M165%2C296.5 c0%2C5.8%2C4.7%2C10.6%2C10.6%2C10.6h85.6c5.8%2C0%2C10.6-4.7%2C10.6-10.6S267%2C286%2C261.2%2C286h-85.6C169.7%2C286%2C165%2C290.7%2C165%2C296.5z M175.6%2C266.6 h58.9c5.8%2C0%2C10.6-4.7%2C10.6-10.6s-4.7-10.6-10.6-10.6h-58.9c-5.8%2C0-10.6%2C4.7-10.6%2C10.6S169.7%2C266.6%2C175.6%2C266.6z M165%2C377.6 c0%2C5.8%2C4.7%2C10.6%2C10.6%2C10.6h65c5.8%2C0%2C10.6-4.7%2C10.6-10.6v0c0-5.8-4.7-10.6-10.6-10.6h-65C169.7%2C367%2C165%2C371.7%2C165%2C377.6L165%2C377.6z M298.4%2C418.1c0-5.8-4.7-10.6-10.6-10.6H175.6c-5.8%2C0-10.6%2C4.7-10.6%2C10.6s4.7%2C10.6%2C10.6%2C10.6h112.3 C293.7%2C428.7%2C298.4%2C423.9%2C298.4%2C418.1z M298.4%2C337c0-5.8-4.7-10.6-10.6-10.6H175.6c-5.8%2C0-10.6%2C4.7-10.6%2C10.6v0 c0%2C5.8%2C4.7%2C10.6%2C10.6%2C10.6h112.3C293.7%2C347.6%2C298.4%2C342.9%2C298.4%2C337L298.4%2C337z M298.4%2C215.5c0-5.8-4.7-10.6-10.6-10.6H175.6 c-5.8%2C0-10.6%2C4.7-10.6%2C10.6s4.7%2C10.6%2C10.6%2C10.6h112.3C293.7%2C226%2C298.4%2C221.3%2C298.4%2C215.5z M298.4%2C159.1c0-5.6-3.3-9.1-8.6-9.1h-21.3 v-16.4h17.9c5.2%2C0%2C8.6-3.6%2C8.6-9.1c0-5.5-3.4-9.1-8.6-9.1h-17.9v-13.8h20.8c5.3%2C0%2C8.6-3.5%2C8.6-9.1c0-5.6-3.3-9.1-8.6-9.1h-32.9 c-7.1%2C0-11.4%2C4.6-11.4%2C11.9v60.9c0%2C7.5%2C4.3%2C12%2C11.4%2C12h33.4C295.2%2C168.2%2C298.4%2C164.7%2C298.4%2C159.1z M330.2%2C169.9 c8.2%2C0%2C13.4-4.3%2C15.1-12.4c3.4-15.6%2C6.1-27.8%2C7.9-36.7c2.2%2C11.1%2C5.3%2C25.6%2C7.9%2C36.7c1.8%2C7.9%2C7.4%2C12.3%2C15.6%2C12.3 c7.9%2C0%2C12.7-4%2C14.7-12.3c4.2-17.8%2C10-46.5%2C12.6-61.2l0%2C0c1.2-7.4-2.2-12.6-8.9-13.7c-3.6-0.6-6.6-0.1-8.9%2C1.6 c-2.2%2C1.6-3.6%2C4.1-4%2C7.5c-1.8%2C13.1-4.4%2C29.3-6.7%2C41.8c-2.7-12.4-5.9-26.2-9.4-41.5c-1.5-6.5-6.1-10.1-13-10.1 c-6.8%2C0-11.6%2C3.9-12.9%2C10.4c-3%2C15.5-5.7%2C29-8.1%2C41.1c-1.2-6.4-2.4-12.9-3.7-19.7c-1.4-7.2-2.8-14.6-4.1-21.9 c-0.6-3.4-2.3-6.1-4.7-7.7c-2.5-1.6-5.7-2.1-9.3-1.2c-7%2C1.7-10.3%2C7.2-8.6%2C14.5c1.1%2C4.8%2C2.8%2C13.2%2C4.7%2C22.2c2.9%2C14%2C6.2%2C29.8%2C8.2%2C38.1 C316.3%2C165.5%2C322%2C169.9%2C330.2%2C169.9z M453%2C418.1c0-5.8-4.7-10.6-10.6-10.6h-98.3c-5.8%2C0-10.6%2C4.7-10.6%2C10.6s4.7%2C10.6%2C10.6%2C10.6h98.3 C448.3%2C428.7%2C453%2C423.9%2C453%2C418.1z M467%2C296.5c0-5.8-4.7-10.6-10.6-10.6H344.1c-5.8%2C0-10.6%2C4.7-10.6%2C10.6v80.6c0%2C0.1%2C0%2C0.2%2C0%2C0.2 c0%2C0.1%2C0%2C0.2%2C0%2C0.2v0c0%2C5.8%2C4.7%2C10.6%2C10.6%2C10.6h112.3c5.8%2C0%2C10.6-4.7%2C10.6-10.6v0c0-0.1%2C0-0.2%2C0-0.2c0-0.1%2C0-0.2%2C0-0.2V296.5z M344.1%2C266.6h98.3c5.8%2C0%2C10.6-4.7%2C10.6-10.6s-4.7-10.6-10.6-10.6h-98.3c-5.8%2C0-10.6%2C4.7-10.6%2C10.6S338.3%2C266.6%2C344.1%2C266.6z M467%2C215.5c0-5.8-4.7-10.6-10.6-10.6H344.1c-5.8%2C0-10.6%2C4.7-10.6%2C10.6s4.7%2C10.6%2C10.6%2C10.6h112.3C462.3%2C226%2C467%2C221.3%2C467%2C215.5z M467%2C143.9c0-13.1-8.9-20.6-23.3-28.6c-11.8-6.4-11.8-9.2-11.8-11.5c0-2.8%2C4.5-3.1%2C5.9-3.1c4.7-0.1%2C8.2%2C1.1%2C11.5%2C4 c2.2%2C1.9%2C4.8%2C2.8%2C7.4%2C2.4c2.6-0.4%2C4.8-1.9%2C6.4-4.3c2.7-4.3%2C1.9-9.5-1.9-13.4c-4.5-4.6-13.4-7.4-23.3-7.4c-18.1%2C0-29.8%2C9.1-29.8%2C23.2 c0%2C13.2%2C8.5%2C20.5%2C23.3%2C28.7c11.7%2C6.4%2C11.6%2C9.9%2C11.6%2C12.2c0%2C1.2-0.1%2C5-7.1%2C5c-6%2C0-10-2.9-13.9-6.1l0%2C0c-2-1.6-4.4-2.3-6.8-2 c-2.4%2C0.3-4.5%2C1.7-6%2C3.8c-3%2C4.3-2.5%2C9.8%2C1.2%2C13.7c5.6%2C5.9%2C15.4%2C9.4%2C26.4%2C9.4C455.4%2C169.8%2C467%2C159.9%2C467%2C143.9z M90%2C91.5v345 c0%2C24.9-20.1%2C45-45%2C45s-45-20.1-45-45v-330c0-8.3%2C6.7-15%2C15-15H90z'/%3E %3C/svg%3E ");
  background-repeat: no-repeat;
  background-size: 25%;
  background-position: 50%;
}
.block-news .block-img .img-box ul.img-list li.item a {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
}
.block-news .block-img .img-box ul.img-list li.item img {
  height: 100%;
  position: relative;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -o-object-fit: cover;
     object-fit: cover;
}
.block-news .block-img .img-box.loading ul.img-list li.item {
  background-image: linear-gradient(90deg, #eeeeee 0px, #f7f7f7 40px, #eeeeee 80px) !important;
  -webkit-animation: loading-lines 3s infinite linear;
          animation: loading-lines 3s infinite linear;
}
.block-news .block-text ul.news-list {
  list-style: none;
  padding: 0;
  margin: 0;
  padding: 0 32px;
  position: relative;
}
.block-news .block-text ul.news-list li.item {
  padding: 10px;
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-bottom: 0.5px solid #c8cdd4;
}
.block-news .block-text ul.news-list li.item:last-child {
  border-bottom: 0px;
}
.block-news .block-text ul.news-list li.item .item-date p {
  color: var(--color-main-03);
  font-size: 2rem;
  font-weight: 900;
  padding: 4px;
  margin: 0;
  font-family: "Inter", sans-serif;
}
.block-news .block-text ul.news-list li.item .item-news {
  text-decoration: none !important;
  width: 100%;
}
.block-news .block-text ul.news-list li.item .item-news p {
  font-size: 2rem;
  padding: 4px 8px;
  margin: 0;
  color: var(--color-text);
  font-weight: 500;
}
.block-news .block-text ul.news-list li.item:hover {
  background: #f6f6f6;
}
.block-news .block-text ul.news-list.loading li.item {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: horizontal !important;
  -webkit-box-direction: normal !important;
      -ms-flex-direction: row !important;
          flex-direction: row !important;
}
.block-news .block-text ul.news-list.loading li.item:hover {
  background: transparent;
}
.block-news .block-text ul.news-list.loading li.item .item-date p {
  background-image: linear-gradient(90deg, #e9e9e9 0px, #f7f7f7 40px, #e9e9e9 80px) !important;
  -webkit-animation: loading-lines 10s infinite linear;
          animation: loading-lines 10s infinite linear;
  height: 40px;
}
.block-news .block-text ul.news-list.loading li.item .item-news {
  margin-left: 16px;
}
.block-news .block-text ul.news-list.loading li.item .item-news p {
  display: block;
  background-image: linear-gradient(90deg, #e9e9e9 0px, #f7f7f7 40px, #e9e9e9 80px) !important;
  -webkit-animation: loading-lines 10s infinite linear;
          animation: loading-lines 10s infinite linear;
  padding: 0;
  width: 300px;
  height: 30px;
}
.block-news .block-text ul.news-list.loading li.item:nth-child(2) .item-news p {
  width: 250px;
}
.block-news .block-text ul.news-list.loading li.item:nth-child(3) .item-news p {
  width: 320px;
}
.block-news .block-text ul.news-list.loading li.item:nth-child(4) .item-news p {
  width: 400px;
}
@media (max-width: 768px) {
  .block-news .block-text ul.news-list {
    padding: 0 20px;
  }
  .block-news .block-text ul.news-list li.item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .block-news .block-text ul.news-list li.item .item-news p {
    padding-left: 0;
  }
  .block-news .block-text ul.news-list li.item .item-date p {
    width: unset;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100px;
            flex: 0 0 100px;
    padding: 0;
  }
}
.block-news .btn-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.block-news.reverse .row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}

@-webkit-keyframes loading-lines {
  0% {
    background-position-x: -800px;
  }
  100% {
    background-position-x: 800px;
  }
}

@keyframes loading-lines {
  0% {
    background-position-x: -800px;
  }
  100% {
    background-position-x: 800px;
  }
}
.block-slogan {
  padding-top: 40px;
  padding-bottom: 40px;
}
.block-slogan .container {
  background: var(--color-main-02);
  border-bottom: 8px solid var(--color-main-03);
  padding: 0 32px;
}
@media (max-width: 992px) {
  .block-slogan .container {
    max-width: 90%;
  }
}
.block-slogan .slogan-box {
  padding: 60px 100px;
  position: relative;
}
.block-slogan .slogan-box h1 {
  color: var(--color-white);
  font-weight: 900;
  font-size: 4rem;
  padding: 10px 0;
  margin: 0;
}
.block-slogan .slogan-box p {
  color: var(--color-white);
  font-weight: 500px;
  font-size: 2rem;
  padding: 10px 0;
  margin: 0;
}
@media (max-width: 1200px) {
  .block-slogan {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .block-slogan .slogan-box {
    padding: 60px 20px;
  }
  .block-slogan .slogan-box h1 {
    font-size: 3rem;
  }
  .block-slogan .slogan-box p {
    font-size: 1.8rem;
  }
  .block-slogan .slogan-box::before {
    border-width: 40px 40px 0 0;
  }
  .block-slogan .slogan-box::after {
    border-width: 0 0 40px 40px;
  }
}
@media (max-width: 768px) {
  .block-slogan .slogan-box {
    padding: 24px 0px;
  }
}

.block-about {
  position: relative;
}
.block-about .container {
  position: relative;
  background: #fff;
  border-bottom: 8px solid #f5f6f8;
  padding: 0;
}
@media (max-width: 992px) {
  .block-about .container {
    max-width: 90%;
  }
}
.block-about .row {
  --bs-gutter-x: 0;
  --bs-gutter-y: 0;
}
.block-about .row > * {
  position: relative;
  padding: 0 32px;
  padding-bottom: 32px;
}
.block-about .about-info {
  padding-right: 0;
}
@media (max-width: 768px) {
  .block-about .about-info {
    padding: 0 20px;
    padding-bottom: 20px;
  }
}
.block-about .about-photo {
  padding: 0 32px !important;
  height: 600px;
}
@media (max-width: 768px) {
  .block-about .about-photo {
    display: none;
  }
}
.block-about .info-box {
  position: relative;
  border-top: 0.5px solid #c8cdd4;
  border-bottom: 0.5px solid #c8cdd4;
  height: 600px;
  overflow: hidden;
  overflow-y: auto;
}
.block-about .info-box .unfold-btn {
  position: absolute;
  display: none;
  width: 100%;
  padding: 25px;
  padding-left: 24px;
  background: var(--color-main-03);
  color: var(--color-white);
  font-size: 2.5rem;
  bottom: 0;
  cursor: pointer;
  letter-spacing: 5px;
}
.block-about .info-box .unfold-btn:hover {
  background: var(--color-main-02);
}
.block-about .info-box ul.info-list {
  padding: 20px;
  padding-bottom: 100px;
  margin: 0;
  list-style: none;
}
.block-about .info-box ul.info-list li.item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 5px 0;
}
.block-about .info-box ul.info-list li.item .item-name p {
  font-size: 2rem;
  padding: 4px 0px;
  margin: 0;
  color: var(--color-main-02);
  text-align: right;
  font-weight: 700;
  width: 100px;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100px;
          flex: 0 0 100px;
}
.block-about .info-box ul.info-list li.item .item-info p {
  font-size: 2rem;
  padding: 4px 10px;
  padding-left: 20px;
  margin: 0;
  color: var(--color-text);
  font-weight: 500;
}
@media (max-width: 992px) {
  .block-about .info-box ul.info-list li.item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding-bottom: 8px;
  }
  .block-about .info-box ul.info-list li.item .item-name p {
    text-align: left;
  }
  .block-about .info-box ul.info-list li.item .item-info p {
    padding: 4px 0;
  }
}
.block-about .info-box::-webkit-scrollbar {
  height: 10px;
  width: 12px;
  background-color: #e9ebee;
}
.block-about .info-box::-webkit-scrollbar-thumb {
  background-color: var(--color-main-01);
}
.block-about .photo-box {
  width: 100%;
  height: 100%;
  background: #c8cdd4;
}
.block-about .photo-box .photo {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.block-value .container {
  padding: 24px;
}
@media (max-width: 768px) {
  .block-value .container {
    max-width: 90%;
  }
}
.block-value .row {
  margin-bottom: -20px;
}
.block-value .box {
  position: relative;
  height: 140px;
  padding: 20px;
  margin-bottom: 20px;
  background: #fff;
  border-bottom: 8px solid #f5f6f8;
  overflow: hidden;
}
.block-value .box h3.box-name {
  font-family: "Noto Sans TC", sans-serif;
  font-weight: 700;
  font-size: 2rem;
  color: var(--color-main-03);
  position: relative;
  padding: 0;
  margin: 0;
  z-index: 1;
}
.block-value .box p.box-num {
  font-weight: 900;
  color: var(--color-main-02);
  font-size: 7rem;
  line-height: 7rem;
  position: relative;
  padding: 0;
  margin: 0;
  z-index: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.block-value .box .big-number {
  font-family: "Inter", sans-serif;
}

.block-petition {
  padding-top: 20px;
  padding-bottom: 0px;
  position: relative;
}
.block-petition .container {
  position: relative;
  background: #fff;
  padding: 0;
  border-bottom: 8px solid #f5f6f8;
}
@media (max-width: 992px) {
  .block-petition .container {
    max-width: 90%;
  }
}
.block-petition .group-text {
  padding: 10px 40px;
}
@media (max-width: 992px) {
  .block-petition .group-text {
    padding: 0px 24px;
  }
}
.block-petition .info-box p {
  font-size: 2rem;
  padding: 0;
  padding-bottom: 10px;
  margin: 0;
  color: var(--color-main-02);
  font-weight: 500;
}
.block-petition .btn-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 66px;
  margin-top: -10px;
}
.block-petition .btn-box a {
  margin: 2px;
}
.block-petition .btn-box a .btn {
  font-size: 2.2rem;
  padding: 8px 24px;
  margin: 0;
  white-space: nowrap;
}
.block-petition .btn-box::before {
  content: "";
  display: inline-block;
  width: 100%;
  height: 0.5px;
  border-bottom: 0.5px solid #c8cdd4;
  margin-right: 10px;
}
@media (max-width: 768px) {
  .block-petition .btn-box {
    margin-top: 0px;
    height: unset;
  }
  .block-petition .btn-box a {
    margin: 2px;
    width: 100% !important;
  }
  .block-petition .btn-box a .btn {
    padding: 4px 16px;
    width: 100% !important;
    font-size: 2rem;
    letter-spacing: normal;
    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;
    height: 52px;
  }
  .block-petition .btn-box::before {
    display: none;
  }
}
.block-petition .group-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
@media (max-width: 768px) {
  .block-petition .more-btn-area {
    padding-top: 12px;
  }
}

.block-q-and-a {
  padding-top: 40px;
  position: relative;
}
.block-q-and-a .container {
  position: relative;
  background: #fff;
  padding: 0;
  border-bottom: 8px solid #f5f6f8;
}
@media (max-width: 992px) {
  .block-q-and-a .container {
    max-width: 90%;
  }
}
.block-q-and-a .search-box {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 16px 40px;
}
@media (max-width: 992px) {
  .block-q-and-a .search-box {
    padding: 0px 20px;
    margin-bottom: 8px;
  }
}
.block-q-and-a .search-box .search-btn {
  margin: 0;
  margin-left: 10px;
  width: 90px;
  padding: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.block-q-and-a .search-box .search-btn::before {
  position: relative;
  font-size: 30px;
  font-weight: 900;
  content: "\f002";
  font-family: "Font Awesome 5 Free";
}
@media (max-width: 992px) {
  .block-q-and-a .search-box .search-btn {
    margin-left: 4px;
    width: 68px;
  }
  .block-q-and-a .search-box .search-btn::before {
    font-size: 20px;
  }
}
.block-q-and-a .search-box input.search[type=text] {
  width: 100%;
  margin: 0;
  padding: 20px;
  font-size: 2rem;
  border: 0;
  border-radius: 0;
  border: 0.5px solid #c8cdd4;
  background: var(--color-grey-02);
  -webkit-transition: 0.5s;
  transition: 0.5s;
  outline: 5px solid transparent;
}
.block-q-and-a .search-box input.search[type=text]:focus {
  outline: 5px solid rgba(221, 220, 220, 0.6784313725);
}
@media (max-width: 992px) {
  .block-q-and-a .search-box input.search[type=text] {
    padding: 12px;
  }
}
.block-q-and-a .box-question {
  margin-bottom: 16px;
  display: none;
  overflow: hidden;
}
.block-q-and-a .type-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0 40px;
  margin: 0;
  margin-bottom: 12px;
}
.block-q-and-a .type-list > * {
  padding: 0 !important;
}
.block-q-and-a .type-list .box-type {
  margin-bottom: 16px;
  width: -webkit-fit-content !important;
  width: -moz-fit-content !important;
  width: fit-content !important;
  position: relative;
  margin: 0 4px;
  margin-bottom: 4px;
}
.block-q-and-a .type-list .box-type:first-child {
  margin-left: 0px;
}
.block-q-and-a .type-list .box-type:first-child::after {
  display: none;
}
.block-q-and-a .type-list .box-type::after {
  content: "";
  width: 0.5px;
  height: 20px;
  position: absolute;
  left: -4.25px;
  top: calc(50% + 2px);
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background: #c8cdd4;
}
.block-q-and-a .type-list .box-type .type {
  position: relative;
  color: var(--color-text);
  padding: 8px 16px;
  font-size: 2rem;
  font-weight: 500;
  overflow: hidden;
  cursor: pointer;
}
.block-q-and-a .type-list .box-type .type::before {
  content: "";
  width: 100%;
  height: 100%;
  background: var(--color-main-02);
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
.block-q-and-a .type-list .box-type .type:hover {
  color: var(--color-main-02);
}
.block-q-and-a .type-list .box-type .type:hover::before {
  opacity: 0.1;
}
@media (max-width: 992px) {
  .block-q-and-a .type-list .box-type .type {
    padding: 4px 8px;
  }
}
.block-q-and-a .type-list .box-type.select > .type {
  color: var(--color-main-02);
}
.block-q-and-a .type-list .box-type.select > .type::before {
  opacity: 0.1;
}
@media (max-width: 992px) {
  .block-q-and-a .type-list {
    padding: 0px 20px;
    margin-bottom: 4px;
  }
}
.block-q-and-a ul.question-list {
  padding: 0 40px;
  margin: 0;
  list-style: none;
}
.block-q-and-a ul.question-list li.question-item {
  padding: 0;
  margin: 0;
  background: #fff;
  font-size: 2rem;
  font-weight: 500;
  color: var(--color-text);
  cursor: pointer;
  border-bottom: 0.5px solid #c8cdd4;
}
.block-q-and-a ul.question-list li.question-item:first-child {
  border-top: 0.5px solid #c8cdd4;
}
.block-q-and-a ul.question-list li.question-item a {
  padding: 20px;
  color: var(--color-text);
  display: block;
  width: 100%;
  height: 100%;
}
@media (max-width: 992px) {
  .block-q-and-a ul.question-list li.question-item a {
    padding: 8px;
  }
}
.block-q-and-a ul.question-list li.question-item:hover {
  background: #f6f6f6;
}
@media (max-width: 992px) {
  .block-q-and-a ul.question-list {
    padding: 0px 20px;
  }
}
.block-q-and-a .btn-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  padding-bottom: 10px;
}

.block-photologging {
  background: var(--color-grey-02);
  padding-top: 40px;
  padding-bottom: 180px;
  position: relative;
}
.block-photologging .bg {
  display: none;
}
.block-photologging .container {
  position: relative;
  background: #fff;
  padding: 0;
  border-bottom: 8px solid #f5f6f8;
}
@media (max-width: 992px) {
  .block-photologging .container {
    max-width: 90%;
  }
}
.block-photologging .group-photo {
  padding: 18px 40px;
}
.block-photologging .box {
  padding-bottom: 20px;
  cursor: pointer;
}
.block-photologging .box .img-box {
  width: 100%;
  aspect-ratio: 1/1;
  background: #f6f6f6;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: 50% 50%;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.block-photologging .box .img-box:hover {
  background-size: 110%;
}
.block-photologging .box .text-box {
  padding: 10px 0;
}
.block-photologging .box .text-box p.name {
  font-size: 2rem;
  padding: 0;
  margin: 0;
  color: var(--color-main-02);
  font-weight: 700;
}
.block-photologging .box .text-box p.date {
  font-size: 1.6rem;
  padding: 0;
  margin: 0;
  color: var(--color-main-02);
  font-weight: 500;
  opacity: 0.6;
}
.block-photologging .btn-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.block-footer {
  background: var(--color-main-02);
  -webkit-animation: fade-in 2s;
          animation: fade-in 2s;
}
.block-footer .container {
  position: relative;
  padding: 80px 30px;
  padding-bottom: 20px;
}
.block-footer .container iframe {
  position: absolute;
  overflow: hidden;
  bottom: 20px;
  right: 40px;
  border: 10px solid #ffffff;
  -webkit-box-shadow: 20px 20px 0 var(--color-main-01);
          box-shadow: 20px 20px 0 var(--color-main-01);
}
.block-footer .group-title {
  width: 100%;
  max-width: 400px;
  border-bottom: 1px solid #fff;
  margin-bottom: -20px;
}
.block-footer .group-title h1.title {
  font-size: 4rem;
  color: var(--color-white);
  background: none;
  padding: 0;
  padding-bottom: 20px;
}
.block-footer ul.info-list {
  padding: 0;
  margin: 0;
  list-style: none;
}
.block-footer ul.info-list li.item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 5px 0;
}
.block-footer ul.info-list li.item .item-name p {
  font-size: 2rem;
  padding: 5px 0px;
  margin: 0;
  color: var(--color-white);
  font-weight: 900;
  width: 100px;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100px;
          flex: 0 0 100px;
}
.block-footer ul.info-list li.item .item-info p {
  font-size: 2rem;
  padding: 5px 0px;
  padding-left: 20px;
  margin: 0;
  color: var(--color-white);
  font-weight: 500;
  display: inline-block;
}
.block-footer ul.info-list li.item .item-info i {
  font-size: 2rem;
  padding-left: 15px;
  color: var(--color-white);
  display: inline-block;
}
.block-footer .icon-list {
  margin-top: 20px;
  font-size: 2rem;
  color: var(--color-white);
  display: inline-block;
}
.block-footer .icon-list a {
  text-decoration: none;
}
.block-footer .icon-list i {
  color: var(--color-white);
  margin-right: 15px;
  font-size: 4rem;
  cursor: pointer;
}
.block-footer .copyright {
  color: #fff;
  padding-top: 40px;
  padding: 20px;
  text-align: center;
  font-size: 1.6rem;
}
.block-footer .copyright a {
  color: var(--color-main-04);
  cursor: pointer;
}

@media (max-width: 992px) {
  .block-footer .container iframe {
    display: none;
  }
}
@media (max-width: 768px) {
  .block-footer ul.info-list li.item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .block-footer ul.info-list li.item .item-info p {
    padding-left: 0;
  }
}
.block-title-banner {
  margin-top: 72px;
  min-height: 160px;
  overflow: hidden;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.block-title-banner .container {
  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 !important;
}
@media (max-width: 992px) {
  .block-title-banner .container {
    max-width: 88%;
  }
}
.block-title-banner .group-title-banner {
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.block-title-banner .group-title-banner h1.title {
  position: relative;
  font-family: "Noto Sans TC", sans-serif;
  font-weight: 900;
  font-size: 4.5rem;
  color: var(--color-main-02);
  padding: 0;
  margin: 0;
  z-index: 1;
  margin-top: 0px;
}
.block-title-banner .group-title-banner h2.title {
  position: relative;
  font-family: "Inter", sans-serif;
  font-size: 3.5rem;
  font-weight: 900;
  color: var(--color-main-01);
  opacity: 0.2;
  padding: 0;
  margin: 0;
  z-index: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.block-title-banner ul.breadcrumb {
  margin-top: 65px;
  font-size: 1.8rem;
  color: var(--color-main-01);
  background: var(--color-main-01-t);
  font-weight: 700;
}
.block-title-banner ul.breadcrumb li.breadcrumb-item {
  position: relative;
  padding: 0;
  margin: 0;
}
.block-title-banner ul.breadcrumb li.breadcrumb-item a {
  padding: 10px 20px;
  color: var(--color-main-01);
  font-weight: 700;
  width: 100%;
  height: 100%;
  display: block;
}
.block-title-banner ul.breadcrumb li.breadcrumb-item:last-child a {
  background: var(--color-main-02);
  color: #fff !important;
}
.block-title-banner ul.breadcrumb li.breadcrumb-item:nth-child(even) {
  background: var(--color-main-01-t);
}
.block-title-banner .breadcrumb-item + .breadcrumb-item::before {
  content: "" !important;
}

@-webkit-keyframes rotate-animation {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes rotate-animation {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@media (max-width: 768px) {
  .block-title-banner {
    padding: 20px;
  }
  .block-title-banner .container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .block-title-banner ul.breadcrumb {
    margin-top: 10px;
  }
}
.content.page-news {
  margin-bottom: 160px;
}

@media (max-width: 768px) {
  .content.page-news {
    padding: 8px;
  }
}
.content.page-photologging {
  margin-bottom: 250px;
}
.content.page-photologging .row.article-title {
  background: var(--color-main-02);
  border-bottom: 10px solid var(--color-main-04);
  padding: 20px;
  margin-bottom: 10px;
  font-size: 2.4rem;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: relative;
}
.content.page-photologging .row.article-title .title {
  width: calc(100% - 150px);
  height: 100%;
}
.content.page-photologging .row.article-title .date {
  position: relative;
  top: 5px;
  text-align: right;
  width: 150px;
  height: 100%;
  font-size: 2rem;
  font-weight: 700;
}
.content.page-photologging .row.display-mode {
  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-bottom: 10px;
}
.content.page-photologging .row.display-mode .btn {
  width: 80px;
  margin-left: 5px;
  background: var(--color-main-02-t);
  border-radius: 0;
  padding: 5px;
}
.content.page-photologging .row.display-mode .btn p {
  font-size: 1.6rem;
  white-space: nowrap;
  margin: 0;
}
.content.page-photologging .row.display-mode .btn:hover {
  background: var(--color-main-02);
  color: #fff;
}
.content.page-photologging .row.display-mode .btn.set {
  background: var(--color-main-03);
  color: #fff;
}
.content.page-photologging .row.group-album {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 10px 1fr 10px 1fr 10px 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
}
.content.page-photologging .row.group-album .box {
  cursor: pointer;
  width: 100%;
  margin: 0;
  padding: 0;
  -webkit-animation-name: fadeIn;
          animation-name: fadeIn;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-iteration-count: 1;
          animation-iteration-count: 1;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  position: relative;
  overflow: hidden;
}
.content.page-photologging .row.group-album .box .img-box {
  width: 100%;
  height: 200px;
  background: var(--color-main-01-t);
  -webkit-transition: 0.5s;
  transition: 0.5s;
  position: relative;
  overflow: hidden;
}
.content.page-photologging .row.group-album .box .img-box img {
  width: 140%;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  position: relative;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.content.page-photologging .row.group-album .box .img-box:hover img {
  width: 160%;
}
.content.page-photologging .row.group-album .box .img-box::after {
  content: " ";
  width: 30px;
  height: 30px;
  background-image: url(../../../svg/album-icon.svg);
  -webkit-filter: drop-shadow(0px 0px 5px #333);
          filter: drop-shadow(0px 0px 5px #333);
  position: absolute;
  bottom: 10px;
  right: 10px;
}
.content.page-photologging .row.group-album .box .text-box {
  padding: 10px 0;
}
.content.page-photologging .row.group-album .box .text-box p.name {
  font-size: 2rem;
  padding: 0;
  margin: 0;
  color: var(--color-main-02);
  font-weight: 700;
}
.content.page-photologging .row.group-album .box .text-box p.date {
  font-size: 1.6rem;
  padding: 0;
  margin: 0;
  color: var(--color-main-02);
  font-weight: 500;
  opacity: 0.6;
}
.content.page-photologging .row.group-photo {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 10px 1fr 10px 1fr 10px 1fr 10px 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
}
.content.page-photologging .row.group-photo .box {
  cursor: pointer;
  width: 100%;
  height: 200px;
  margin: 0;
  padding: 0;
  -webkit-animation-name: fadeIn;
          animation-name: fadeIn;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-iteration-count: 1;
          animation-iteration-count: 1;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  position: relative;
  overflow: hidden;
}
.content.page-photologging .row.group-photo .box .photo-info {
  display: none;
}
.content.page-photologging .row.group-photo .box .img-box {
  width: 100%;
  height: 100%;
  background: var(--color-main-01-t);
  -webkit-transition: 0.5s;
  transition: 0.5s;
  position: relative;
  overflow: hidden;
}
.content.page-photologging .row.group-photo .box .img-box img {
  width: 140%;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  position: relative;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.content.page-photologging .row.group-photo .box .img-box:hover img {
  width: 160%;
}
.content.page-photologging .row.group-photo .box .img-box::after {
  content: " ";
  width: 30px;
  height: 30px;
  background-image: url(../../../svg/photo-icon.svg);
  -webkit-filter: drop-shadow(0px 0px 5px #333);
          filter: drop-shadow(0px 0px 5px #333);
  position: absolute;
  bottom: 10px;
  right: 10px;
}
.content.page-photologging .row.group-photo.detail {
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
}
.content.page-photologging .row.group-photo.detail .box {
  cursor: pointer;
  width: 100%;
  margin: 0;
  padding: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-animation-name: fadeIn-detail;
          animation-name: fadeIn-detail;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-iteration-count: 1;
          animation-iteration-count: 1;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.content.page-photologging .row.group-photo.detail .box .img-box {
  height: 200px;
  width: 300px;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 300px;
          flex: 0 0 300px;
  background: var(--color-main-01-t);
}
.content.page-photologging .row.group-photo.detail .box .img-box img {
  width: 120%;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  position: relative;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.content.page-photologging .row.group-photo.detail .box:hover {
  background: rgba(0, 0, 0, 0.0470588235);
}
.content.page-photologging .row.group-photo.detail .box:hover .img-box > img {
  width: 160%;
}
.content.page-photologging .row.group-photo.detail .box .photo-info {
  display: block;
}
.content.page-photologging .row.group-photo.detail .box .photo-info {
  padding: 10px 20px;
}
.content.page-photologging .row.group-photo.detail .box .photo-info p {
  padding: 0;
  margin: 0;
}
.content.page-photologging .row.group-photo.detail .box .photo-info p.title {
  font-size: 2.2rem;
  width: 100%;
  color: var(--color-text);
}
.content.page-photologging .row.group-photo.detail .box .photo-info p.date {
  font-size: 1.6rem;
  opacity: 0.6;
}
.content.page-photologging .row.group-photo.detail .box .photo-info ul.tag {
  list-style: none;
  padding: 0;
  margin: 0;
  margin-top: 20px;
  font-size: 1.6rem;
}
.content.page-photologging .row.group-photo.detail .box .photo-info ul.tag li {
  display: inline-block;
  margin-right: 5px;
  margin-bottom: 6px;
  color: var(--color-main-03);
}
.content.page-photologging .top-btn-box .input-box {
  position: relative;
  padding: 0px;
  margin-bottom: 5px;
}
.content.page-photologging .top-btn-box .input-box label {
  width: 100%;
}
.content.page-photologging .top-btn-box .input-box label p {
  font-size: 1.8rem;
}
.content.page-photologging .top-btn-box .input-box label input[type=text] {
  width: 100%;
  border: 0.5px solid #c8cdd4;
}
.content.page-photologging .top-btn-box .input-box input.search[type=text] {
  width: 100%;
  margin: 0;
  padding: 20px;
  font-size: 2rem;
  border: 0;
  border-radius: 0;
  border: 0.5px solid #c8cdd4;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.content.page-photologging .top-btn-box .input-box i.fas.fa-search {
  position: absolute;
  bottom: 0px;
  right: 10px;
  color: var(--color-search-btn);
  width: 100px;
  font-size: 25px;
  width: 30px;
  cursor: pointer;
  width: 80px;
  height: 80px;
  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;
}
.content.page-photologging .top-btn-box .input-box i.fas.fa-search:hover {
  background: rgba(24, 75, 76, 0.0392156863);
  color: rgba(24, 75, 76, 0.8470588235);
}
.content.page-photologging .top-btn-box .popular-keywords {
  padding: 0;
  margin: 0;
  margin-bottom: 20px;
}
.content.page-photologging .top-btn-box .popular-keywords p {
  font-size: 1.6rem;
}
.content.page-photologging .top-btn-box .popular-keywords ul.keywords-list {
  padding: 0;
  margin: 0;
  list-style: none;
}
.content.page-photologging .top-btn-box .popular-keywords ul.keywords-list li {
  font-size: 1.6rem;
  background: #fff;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 5px 5px;
  display: inline-block;
  margin: 1px;
  margin-bottom: 4px;
  cursor: pointer;
}
.content.page-photologging .top-btn-box .popular-keywords ul.keywords-list li a {
  color: var(--color-main-03);
}
.content.page-photologging .group-swiper {
  margin-bottom: 50px;
}
.content.page-photologging .group-swiper .swiper-slide {
  background: var(--color-main-01-t);
  position: relative;
}
.content.page-photologging .group-swiper .swiper-pagination-bullet {
  background: var(--color-main-03-t);
}
.content.page-photologging .group-swiper .swiper-pagination-bullet:hover {
  position: relative;
}
.content.page-photologging .group-swiper .swiper-pagination-bullet:hover::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--color-main-01);
  opacity: 0.2;
}
.content.page-photologging .group-swiper img {
  height: 100% !important;
  position: relative;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  z-index: 1;
}
.content.page-photologging .group-swiper .bg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-filter: blur(8px);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50%;
}
.content.page-photologging .group-swiper .swiper-pagination {
  position: relative;
}
.content.page-photologging .group-swiper .swiper-container {
  height: 340px;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeIn-detail {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn-detail {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@media (max-width: 1200px) {
  .content.page-photologging .row.group-album {
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
  }
  .content.page-photologging .row.group-photo {
    -ms-grid-columns: 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}
@media (max-width: 992px) {
  .content.page-photologging .row.group-album {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .content.page-photologging .row.group-photo {
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media (max-width: 768px) {
  .content.page-photologging .row.group-album {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .content.page-photologging .row.group-photo {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .content.page-photologging .row.group-photo.detail .box .img-box {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 200px;
            flex: 0 0 200px;
  }
  .content.page-photologging .row.group-photo.detail .box .img-box img {
    width: auto;
    height: 140%;
  }
  .content.page-photologging .row.group-photo.detail .box:hover .img-box img {
    width: auto;
    height: 160%;
  }
}
@media (max-width: 576px) {
  .content.page-photologging .row.group-photo {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .content.page-photologging .row.group-photo.detail {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .content.page-photologging .row.group-photo.detail .box {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    height: auto;
  }
  .content.page-photologging .row.group-photo.detail .box .img-box {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 200px;
            flex: 0 0 200px;
    width: 100%;
  }
  .content.page-photologging .row.group-photo.detail .box .photo-info {
    padding: 0;
    padding-top: 10px;
    padding-bottom: 30px;
  }
  .content.page-photologging .row.group-photo.detail .box .photo-info ul.tag {
    margin: 0;
    margin-top: 5px;
  }
}
@media (max-width: 768px) {
  .content.page-photologging {
    padding-left: 20px;
    padding-right: 20px;
  }
  .content.page-photologging .row.article-title {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .content.page-photologging .row.article-title .title {
    width: 100%;
  }
  .content.page-photologging .row.article-title .date {
    width: 100%;
    text-align: left;
  }
}
.content.page-photologging .search-box {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-top: calc(var(--bs-gutter-y) * -1);
  margin-right: calc(var(--bs-gutter-x) * -0.5);
  margin-left: calc(var(--bs-gutter-x) * -0.5);
}
.content.page-photologging .search-box .condition-box {
  width: calc(100% - 80px);
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.content.page-photologging .search-box .condition-box .box-01 {
  width: 100%;
  padding-right: 10px;
}
.content.page-photologging .search-box .button-box {
  position: relative;
  width: 80px;
}
.content.page-photologging .search-box .button-box .btn-box {
  padding-top: 37px;
}
.content.page-photologging .search-box .input-box {
  position: relative;
  margin-bottom: 16px;
}
.content.page-photologging .search-box .input-box label {
  width: 100%;
}
.content.page-photologging .search-box .input-box label p {
  font-size: 1.8rem;
}
.content.page-photologging .search-box .input-box label input[type=text] {
  width: 100%;
}
.content.page-photologging .search-box .input-box input.search[type=text] {
  width: 100%;
  margin: 0;
  padding: 20px;
  font-size: 2rem;
  border: 0;
  border-radius: 0;
  border: 0.5px solid #c8cdd4;
  background: var(--color-grey-02);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  outline: 5px solid transparent;
}
.content.page-photologging .search-box .input-box input.search[type=text]:focus {
  outline: 5px solid rgba(221, 220, 220, 0.6784313725);
}
.content.page-photologging .search-box .btn-box {
  padding: 0;
  margin: 0;
  margin-bottom: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.content.page-photologging .search-box .btn-box .btn {
  font-size: 2rem;
  margin: 0;
  height: 72px;
  width: 50%;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 10px;
  white-space: nowrap;
  letter-spacing: 5px;
}
.content.page-photologging .search-box .btn-box .btn:last-child {
  margin-right: 0;
}
.content.page-photologging .search-box .btn-box .btn:hover {
  background: var(--color-main-02);
  color: #fff;
}
.content.page-photologging .search-box .btn-box .text-search-btn {
  overflow: hidden;
  position: relative;
  width: 90px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: 0s;
  transition: 0s;
}
.content.page-photologging .search-box .btn-box .text-search-btn::after {
  content: "搜尋";
  padding-left: 20px;
  display: none;
}
.content.page-photologging .search-box .btn-box .text-search-btn::before {
  position: relative;
  left: 3px;
  font-size: 30px;
  font-weight: 900;
  content: "\f002";
  font-family: "Font Awesome 5 Free";
}
.content.page-photologging .search-box .keywords-box {
  padding: 0;
  margin: 0;
  margin-bottom: 20px;
  width: 100%;
}
.content.page-photologging .search-box .keywords-box p {
  font-size: 1.6rem;
}
.content.page-photologging .search-box .keywords-box ul.keywords-list {
  padding: 0;
  margin: 0;
  list-style: none;
}
.content.page-photologging .search-box .keywords-box ul.keywords-list li {
  font-size: 1.6rem;
  background: #fff;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 5px 5px;
  display: inline-block;
  margin: 1px;
  margin-bottom: 4px;
  cursor: pointer;
}
.content.page-photologging .search-box .keywords-box ul.keywords-list li a {
  color: var(--color-main-03);
}

@media (max-width: 991px) {
  .content.page-photologging .search-box {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .content.page-photologging .search-box .condition-box {
    width: 100%;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .content.page-photologging .search-box .condition-box .box-01 {
    width: 100%;
    padding: 0;
  }
  .content.page-photologging .search-box .button-box {
    width: 100%;
  }
  .content.page-photologging .search-box .button-box .btn-box {
    padding-top: 0;
  }
  .content.page-photologging .search-box .button-box .btn-box .text-search-btn {
    width: 100%;
  }
  .content.page-photologging .search-box .button-box .btn-box .text-search-btn::after {
    display: block;
  }
}
.content.page-q-and-a {
  margin-bottom: 250px;
}
.content.page-q-and-a .search-box {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-top: calc(var(--bs-gutter-y) * -1);
  margin-right: calc(var(--bs-gutter-x) * -0.5);
  margin-left: calc(var(--bs-gutter-x) * -0.5);
}
.content.page-q-and-a .search-box .condition-box {
  width: calc(100% - 72px);
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.content.page-q-and-a .search-box .condition-box .box-01 {
  width: 50%;
}
.content.page-q-and-a .search-box .condition-box .box-02 {
  width: 25%;
}
.content.page-q-and-a .search-box .condition-box .box-03 {
  width: 25%;
}
.content.page-q-and-a .search-box .button-box {
  position: relative;
  width: 72px;
}
.content.page-q-and-a .search-box .button-box .btn-box {
  padding-top: 37px;
}
.content.page-q-and-a .search-box .input-box {
  position: relative;
  padding: 0px;
  padding-right: 10px;
  margin-bottom: 16px;
}
.content.page-q-and-a .search-box .input-box label {
  width: 100%;
}
.content.page-q-and-a .search-box .input-box label p {
  font-size: 1.8rem;
}
.content.page-q-and-a .search-box .input-box label input[type=text] {
  width: 100%;
  border: 0.5px solid #c8cdd4;
}
.content.page-q-and-a .search-box .input-box input.search[type=text] {
  width: 100%;
  margin: 0;
  padding: 20px;
  font-size: 2rem;
  border: 0;
  border-radius: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  outline: 5px solid transparent;
  border: 0.5px solid #c8cdd4;
}
.content.page-q-and-a .search-box .input-box input.search[type=text]:focus {
  outline: 5px solid rgba(221, 220, 220, 0.6784313725);
}
.content.page-q-and-a .search-box .select-box {
  position: relative;
  padding: 0px;
  margin-bottom: 16px;
  padding-right: 10px;
}
.content.page-q-and-a .search-box .select-box label {
  width: 100%;
}
.content.page-q-and-a .search-box .select-box label p {
  font-size: 1.8rem;
}
.content.page-q-and-a .search-box .select-box label select {
  width: 100%;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0.5px solid #c8cdd4;
}
.content.page-q-and-a .search-box .select-box select {
  width: 100%;
  margin: 0;
  padding: 20px;
  font-size: 2rem;
  border: 0;
  border-radius: 0;
  background: #fff;
  cursor: pointer;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  outline: 5px solid transparent;
}
.content.page-q-and-a .search-box .select-box select:focus {
  outline: 5px solid rgba(221, 220, 220, 0.6784313725);
}
.content.page-q-and-a .search-box .select-box i.fas.fa-chevron-down {
  position: absolute;
  top: 52%;
  right: 20px;
  color: #c8cdd4;
  font-size: 2.5rem;
  width: 30px;
  pointer-events: none;
}
.content.page-q-and-a .search-box .btn-box {
  padding: 0;
  margin: 0;
  margin-bottom: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.content.page-q-and-a .search-box .btn-box .btn {
  font-size: 2rem;
  margin: 0;
  height: 72px;
  width: 50%;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 10px;
  white-space: nowrap;
  letter-spacing: 5px;
}
.content.page-q-and-a .search-box .btn-box .btn:last-child {
  margin-right: 0;
}
.content.page-q-and-a .search-box .btn-box .btn:hover {
  background: var(--color-main-02);
  color: #fff;
}
.content.page-q-and-a .search-box .btn-box .text-search-btn {
  overflow: hidden;
  position: relative;
  width: 90px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: 0s;
  transition: 0s;
}
.content.page-q-and-a .search-box .btn-box .text-search-btn::after {
  content: "搜尋";
  padding-left: 20px;
  display: none;
}
.content.page-q-and-a .search-box .btn-box .text-search-btn::before {
  position: relative;
  left: 3px;
  font-size: 30px;
  font-weight: 900;
  content: "\f002";
  font-family: "Font Awesome 5 Free";
}

@media (max-width: 991px) {
  .content.page-q-and-a .search-box {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .content.page-q-and-a .search-box .condition-box {
    width: 100%;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .content.page-q-and-a .search-box .condition-box .box-01 {
    width: 100%;
    padding: 0;
  }
  .content.page-q-and-a .search-box .condition-box .box-02 {
    width: 50%;
    padding-right: 5px;
  }
  .content.page-q-and-a .search-box .condition-box .box-03 {
    width: 50%;
    padding: 0;
    padding-left: 5px;
  }
  .content.page-q-and-a .search-box .button-box {
    width: 100%;
  }
  .content.page-q-and-a .search-box .button-box .btn-box {
    padding-top: 0;
  }
  .content.page-q-and-a .search-box .button-box .btn-box .text-search-btn {
    width: 100%;
  }
  .content.page-q-and-a .search-box .button-box .btn-box .text-search-btn::after {
    display: block;
  }
}
@media (max-width: 768px) {
  .content.page-q-and-a {
    padding: 15px;
    padding-bottom: 200px;
  }
}
@media (max-width: 576px) {
  .content.page-q-and-a .search-box .condition-box .box-02 {
    width: 100%;
    padding: 0;
  }
  .content.page-q-and-a .search-box .condition-box .box-03 {
    width: 100%;
    padding: 0;
  }
}
.content.page-q-and-a .row.article-title h3.title {
  width: 100%;
}

@media (max-width: 768px) {
  .page-q-and-a {
    padding-left: 20px;
    padding-right: 20px;
  }
  .page-q-and-a .top-btn-box .input-box {
    padding: 0 !important;
  }
}
.content.page-petition {
  padding-bottom: 200px;
  position: relative;
}
.content.page-petition .search-box {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-top: calc(var(--bs-gutter-y) * -1);
  margin-right: calc(var(--bs-gutter-x) * -0.5);
  margin-left: calc(var(--bs-gutter-x) * -0.5);
}
.content.page-petition .search-box .condition-box {
  width: calc(100% - 80px);
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.content.page-petition .search-box .condition-box .box-01 {
  width: 50%;
}
.content.page-petition .search-box .condition-box .box-02 {
  width: 25%;
}
.content.page-petition .search-box .condition-box .box-03 {
  width: 25%;
}
.content.page-petition .search-box .button-box {
  position: relative;
  width: 80px;
}
.content.page-petition .search-box .button-box .btn-box {
  padding-top: 37px;
}
.content.page-petition .search-box .input-box {
  position: relative;
  padding: 0px;
  padding-right: 10px;
  margin-bottom: 16px;
}
.content.page-petition .search-box .input-box label {
  width: 100%;
}
.content.page-petition .search-box .input-box label p {
  font-size: 1.8rem;
}
.content.page-petition .search-box .input-box label input[type=text] {
  width: 100%;
  border: 0.5px solid #c8cdd4;
}
.content.page-petition .search-box .input-box input.search[type=text] {
  width: 100%;
  margin: 0;
  padding: 20px;
  font-size: 2rem;
  border: 0;
  border-radius: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  outline: 5px solid transparent;
  border: 0.5px solid #c8cdd4;
}
.content.page-petition .search-box .input-box input.search[type=text]:focus {
  outline: 5px solid rgba(221, 220, 220, 0.6784313725);
}
.content.page-petition .search-box .select-box {
  position: relative;
  padding: 0px;
  margin-bottom: 16px;
  padding-right: 10px;
}
.content.page-petition .search-box .select-box label {
  width: 100%;
}
.content.page-petition .search-box .select-box label p {
  font-size: 1.8rem;
}
.content.page-petition .search-box .select-box label select {
  width: 100%;
  border: 0.5px solid #c8cdd4;
}
.content.page-petition .search-box .select-box select {
  width: 100%;
  margin: 0;
  padding: 20px;
  font-size: 2rem;
  border: 0;
  border-radius: 0;
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  outline: 5px solid transparent;
}
.content.page-petition .search-box .select-box select:focus {
  outline: 5px solid rgba(221, 220, 220, 0.6784313725);
}
.content.page-petition .search-box .select-box i.fas.fa-chevron-down {
  position: absolute;
  top: 52%;
  right: 20px;
  color: #c8cdd4;
  font-size: 2.5rem;
  width: 30px;
  pointer-events: none;
}
.content.page-petition .search-box .btn-box {
  padding: 0;
  margin: 0;
  margin-bottom: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.content.page-petition .search-box .btn-box .btn {
  font-size: 2rem;
  margin: 0;
  height: 72px;
  width: 50%;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 10px;
  white-space: nowrap;
  letter-spacing: 5px;
}
.content.page-petition .search-box .btn-box .btn:last-child {
  margin-right: 0;
}
.content.page-petition .search-box .btn-box .btn:hover {
  background: var(--color-main-02);
  color: #fff;
}
.content.page-petition .search-box .btn-box .text-search-btn {
  overflow: hidden;
  position: relative;
  width: 90px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: 0s;
  transition: 0s;
}
.content.page-petition .search-box .btn-box .text-search-btn::after {
  content: "搜尋";
  padding-left: 20px;
  display: none;
}
.content.page-petition .search-box .btn-box .text-search-btn::before {
  position: relative;
  left: 3px;
  font-size: 30px;
  font-weight: 900;
  content: "\f002";
  font-family: "Font Awesome 5 Free";
}
.content.page-petition .other-box {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-top: calc(var(--bs-gutter-y) * -1);
  margin-right: calc(var(--bs-gutter-x) * -0.5);
  margin-left: calc(var(--bs-gutter-x) * -0.5);
  margin-bottom: 10px;
}
.content.page-petition .other-box .btn-box {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.content.page-petition .other-box .btn-box .btn {
  font-size: 2rem;
  margin: 0;
  height: 80px;
  width: 50%;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  white-space: nowrap;
  letter-spacing: 5px;
}
.content.page-petition .other-box .btn-box .letter-btn {
  overflow: hidden;
  position: relative;
  width: 50%;
  margin-right: 5px;
  padding-right: 30px;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.content.page-petition .other-box .btn-box .letter-btn::before {
  position: absolute;
  opacity: 0.5;
  font-size: 70px;
  font-weight: 900;
  content: "\f0a1";
  font-family: "Font Awesome 5 Free";
  left: 5px;
  top: -10px;
  -webkit-transform: rotate(-20deg);
          transform: rotate(-20deg);
}
.content.page-petition .other-box .btn-box .letter-btn::after {
  opacity: 0.6;
  font-size: 2rem;
  font-weight: 900;
  padding-left: 10px;
  content: "\f105";
  font-family: "Font Awesome 5 Free";
}
.content.page-petition .other-box .btn-box .search-btn {
  overflow: hidden;
  position: relative;
  margin-left: 5px;
  padding-right: 30px;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.content.page-petition .other-box .btn-box .search-btn::before {
  position: absolute;
  opacity: 0.3;
  font-size: 80px;
  font-weight: 900;
  content: "\f15c";
  font-family: "Font Awesome 5 Free";
  left: 10px;
  top: -15px;
  -webkit-transform: rotate(-20deg);
          transform: rotate(-20deg);
}
.content.page-petition .other-box .btn-box .search-btn::after {
  opacity: 0.6;
  font-size: 2rem;
  font-weight: 900;
  padding-left: 10px;
  content: "\f105";
  font-family: "Font Awesome 5 Free";
}

@media (max-width: 991px) {
  .content.page-petition .search-box {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .content.page-petition .search-box .condition-box {
    width: 100%;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .content.page-petition .search-box .condition-box .box-01 {
    width: 100%;
    padding: 0;
  }
  .content.page-petition .search-box .condition-box .box-02 {
    width: 50%;
    padding-right: 5px;
  }
  .content.page-petition .search-box .condition-box .box-03 {
    width: 50%;
    padding: 0;
    padding-left: 5px;
  }
  .content.page-petition .search-box .button-box {
    width: 100%;
  }
  .content.page-petition .search-box .button-box .btn-box {
    padding-top: 0;
  }
  .content.page-petition .search-box .button-box .btn-box .text-search-btn {
    width: 100%;
  }
  .content.page-petition .search-box .button-box .btn-box .text-search-btn::after {
    display: block;
  }
}
@media (max-width: 576px) {
  .content.page-petition .search-box .condition-box .box-02 {
    width: 100%;
    padding: 0;
  }
  .content.page-petition .search-box .condition-box .box-03 {
    width: 100%;
    padding: 0;
  }
}
.content.page-petition .search-group,
.content.page-petition .forget-group {
  position: relative;
  width: 50%;
  min-height: 485px;
  min-width: 500px;
  background: #f6f6f6;
  top: 50px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 50;
  border-bottom: 8px solid var(--color-main-01);
}
.content.page-petition .search-group .tab-title,
.content.page-petition .forget-group .tab-title {
  position: relative;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0;
  margin: 0;
  border-bottom: 10px solid var(--color-main-04);
}
.content.page-petition .search-group .tab-title .tab,
.content.page-petition .forget-group .tab-title .tab {
  font-size: 1.8rem;
  font-weight: 700;
  width: 50%;
  text-align: center;
  padding: 15px;
  background: #fff;
  color: var(--color-text);
  cursor: pointer;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.content.page-petition .search-group .tab-title .tab:hover,
.content.page-petition .forget-group .tab-title .tab:hover {
  background: var(--color-grey-02);
}
.content.page-petition .search-group .tab-title .tab.none,
.content.page-petition .forget-group .tab-title .tab.none {
  background: #fff !important;
  cursor: default;
}
.content.page-petition .search-group .tab-title .select,
.content.page-petition .forget-group .tab-title .select {
  background: var(--color-main-01) !important;
  color: #fff !important;
}
.content.page-petition .search-group .tab-content,
.content.page-petition .forget-group .tab-content {
  padding: 25px 40px;
  border-top: 8px solid var(--color-main-01);
}
.content.page-petition .search-group .tab-content .input-box,
.content.page-petition .search-group .tab-content .code-box,
.content.page-petition .search-group .tab-content .btn-box,
.content.page-petition .forget-group .tab-content .input-box,
.content.page-petition .forget-group .tab-content .code-box,
.content.page-petition .forget-group .tab-content .btn-box {
  position: relative;
  padding: 0px;
  width: 100%;
  margin-bottom: 16px;
}
.content.page-petition .search-group .tab-content .input-box label,
.content.page-petition .search-group .tab-content .code-box label,
.content.page-petition .search-group .tab-content .btn-box label,
.content.page-petition .forget-group .tab-content .input-box label,
.content.page-petition .forget-group .tab-content .code-box label,
.content.page-petition .forget-group .tab-content .btn-box label {
  font-size: 1.8rem;
  padding-bottom: 10px;
}
.content.page-petition .search-group .tab-content .input-box input[type=text],
.content.page-petition .search-group .tab-content .code-box input[type=text],
.content.page-petition .search-group .tab-content .btn-box input[type=text],
.content.page-petition .forget-group .tab-content .input-box input[type=text],
.content.page-petition .forget-group .tab-content .code-box input[type=text],
.content.page-petition .forget-group .tab-content .btn-box input[type=text] {
  width: 100%;
  margin: 0;
  padding: 20px;
  font-size: 2rem;
  border: 0;
  border-radius: 0;
  border: 0.5px solid #c8cdd4;
  background: #fff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  outline: 5px solid transparent;
}
.content.page-petition .search-group .tab-content .input-box input[type=text]:focus,
.content.page-petition .search-group .tab-content .code-box input[type=text]:focus,
.content.page-petition .search-group .tab-content .btn-box input[type=text]:focus,
.content.page-petition .forget-group .tab-content .input-box input[type=text]:focus,
.content.page-petition .forget-group .tab-content .code-box input[type=text]:focus,
.content.page-petition .forget-group .tab-content .btn-box input[type=text]:focus {
  outline: 5px solid rgba(221, 220, 220, 0.6784313725);
}
.content.page-petition .search-group .tab-content .input-box .star,
.content.page-petition .search-group .tab-content .code-box .star,
.content.page-petition .search-group .tab-content .btn-box .star,
.content.page-petition .forget-group .tab-content .input-box .star,
.content.page-petition .forget-group .tab-content .code-box .star,
.content.page-petition .forget-group .tab-content .btn-box .star {
  position: relative;
}
.content.page-petition .search-group .tab-content .input-box .star::before,
.content.page-petition .search-group .tab-content .code-box .star::before,
.content.page-petition .search-group .tab-content .btn-box .star::before,
.content.page-petition .forget-group .tab-content .input-box .star::before,
.content.page-petition .forget-group .tab-content .code-box .star::before,
.content.page-petition .forget-group .tab-content .btn-box .star::before {
  position: absolute;
  content: "*";
  color: var(--color-accent-01) !important;
  font-size: 3rem;
  top: -1.5rem;
  left: -1.5rem;
}
.content.page-petition .search-group .tab-content .text-box,
.content.page-petition .forget-group .tab-content .text-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 5px;
  padding-bottom: 20px;
  margin-bottom: 15px;
  border-bottom: 2px solid #dddddd;
}
.content.page-petition .search-group .tab-content .text-box i.fas,
.content.page-petition .forget-group .tab-content .text-box i.fas {
  font-size: 55px;
  color: var(--color-main-01);
  opacity: 0.4;
}
.content.page-petition .search-group .tab-content .text-box p,
.content.page-petition .forget-group .tab-content .text-box p {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  padding: 0;
  margin: 0;
  padding-left: 15px;
  font-size: 1.6rem;
  color: var(--color-main-01);
}
.content.page-petition .search-group .tab-content .input-box#phone,
.content.page-petition .forget-group .tab-content .input-box#phone {
  display: none;
}
.content.page-petition .search-group .tab-content .btn-box,
.content.page-petition .forget-group .tab-content .btn-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-top: 50px;
}
.content.page-petition .search-group .tab-content .btn-box .btn,
.content.page-petition .forget-group .tab-content .btn-box .btn {
  margin: 0;
  margin-left: 10px;
  font-size: 2rem;
  padding: 10px 20px;
}
.content.page-petition .forget-group {
  display: none;
}
.content.page-petition .forget-group .tab-content .btn-box {
  margin-top: 86px;
}

.content.page-petition .email-authentication {
  margin-top: 60px;
  background: var(--color-main-03);
  height: 150px;
  padding: 30px 50px;
  position: relative;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.content.page-petition .email-authentication::after {
  content: "email";
  position: absolute;
  font-family: "Dela Gothic One", cursive;
  color: rgba(0, 0, 0, 0);
  -webkit-text-stroke: 1px var(--color-main-04);
  font-size: 25rem;
  right: 0;
  bottom: -70%;
  padding: 0;
  margin: 0;
  z-index: 0;
  opacity: 0.2;
}
.content.page-petition .email-authentication i {
  font-size: 90px;
  top: 0;
  left: 0;
  margin-right: 50px;
  z-index: 1;
  color: #fff;
  -webkit-animation: diving-rotate 1s ease-in-out infinite;
          animation: diving-rotate 1s ease-in-out infinite;
}
.content.page-petition .email-authentication .text {
  z-index: 1;
}
.content.page-petition .email-authentication p {
  font-size: 1.6rem;
  color: #212529;
  color: #fff;
}
.content.page-petition .email-authentication h3 {
  position: relative;
  font-family: "Noto Sans TC", sans-serif;
  font-weight: 700;
  font-size: 3rem;
  color: #fff;
}
@-webkit-keyframes diving-rotate {
  0% {
    -webkit-transform: rotate(-6deg);
            transform: rotate(-6deg);
  }
  50% {
    -webkit-transform: rotate(6deg);
            transform: rotate(6deg);
  }
  100% {
    -webkit-transform: rotate(-6deg);
            transform: rotate(-6deg);
  }
}
@keyframes diving-rotate {
  0% {
    -webkit-transform: rotate(-6deg);
            transform: rotate(-6deg);
  }
  50% {
    -webkit-transform: rotate(6deg);
            transform: rotate(6deg);
  }
  100% {
    -webkit-transform: rotate(-6deg);
            transform: rotate(-6deg);
  }
}

@media (max-width: 768px) {
  .content.page-petition .email-authentication {
    height: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-top: 0;
    padding: 20px;
  }
  .content.page-petition .email-authentication i {
    margin: 0;
    margin-bottom: 20px;
  }
  .content.page-petition .email-authentication .text {
    text-align: center;
  }
  .content.page-petition .email-authentication::after {
    bottom: -20%;
    font-size: 18rem;
  }
}
.content.page-petition .letter-group {
  padding: 40px;
  font-size: 1.8rem;
  font-weight: 400;
  padding-bottom: 50px;
  border-bottom: 10px solid var(--color-main-02);
  border-top: 10px solid var(--color-main-02);
  background: #f6f6f6;
}
.content.page-petition .letter-group hr {
  margin-top: 40px;
  margin-bottom: 40px;
}
.content.page-petition .letter-group .step-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 10px;
  margin-bottom: -10px;
  -webkit-transform: skewY(-5deg);
          transform: skewY(-5deg);
  position: relative;
  top: -100px;
  pointer-events: none;
}
.content.page-petition .letter-group .step-title .step {
  font-family: "Dela Gothic One", cursive;
  color: #fff;
  font-size: 5rem;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  padding: 0 30px 0 40px;
  height: 80px;
  background: var(--color-main-03);
  position: relative;
  left: -70px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  white-space: nowrap;
}
.content.page-petition .letter-group .step-title .step::before {
  content: " ";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 22.5px 22.5px 0;
  border-color: transparent var(--color-main-02) transparent transparent;
  position: absolute;
  left: 0;
  bottom: -22.5px;
}
.content.page-petition .letter-group .step-title .text {
  color: #fff;
  font-weight: 900;
  font-size: 4rem;
  background: var(--color-main-02);
  border-right: 10px solid var(--color-main-03);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: 80px;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  white-space: nowrap;
  padding: 0 50px;
  left: -70px;
}
.content.page-petition .letter-group .item {
  margin-bottom: 30px;
}
.content.page-petition .letter-group .item .item-title p {
  padding: 0;
  margin: 0;
  font-size: 1.8rem;
  padding-bottom: 10px;
}
.content.page-petition .letter-group .item .item-title.star {
  position: relative;
  z-index: 1;
}
.content.page-petition .letter-group .item .item-title.star p:before {
  position: absolute;
  content: "\f621";
  color: var(--color-accent-01) !important;
  top: -5px;
  left: -15px;
  font-size: 1rem;
  font-weight: 900;
  font-family: "Font Awesome 5 Free";
  z-index: -1;
}
.content.page-petition .letter-group .item .item-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.content.page-petition .letter-group .item .item-content p {
  padding: 0;
  margin: 0;
  opacity: 0.8;
  font-size: 1.8rem;
}
.content.page-petition .letter-group .item .item-content .text * {
  display: inline-block;
}
.content.page-petition .letter-group .item .item-content .text a {
  color: var(--color-main-03);
}
.content.page-petition .letter-group .item .item-content .btn {
  padding: 20px 40px;
  margin: 0;
  font-size: 2rem;
  height: 80px;
  white-space: nowrap;
  margin-right: 10px;
}
.content.page-petition .letter-group .item .item-content .btn:last-child {
  margin-right: 0px;
}
.content.page-petition .letter-group .item .item-content input[type=text],
.content.page-petition .letter-group .item .item-content select {
  width: 100%;
  height: 80px;
  margin: 0;
  padding: 20px;
  font-size: 2rem;
  border: 0;
  border-radius: 0;
  border: 0.5px solid #c8cdd4;
  background: #fff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin-right: 10px;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  outline: 5px solid transparent;
}
.content.page-petition .letter-group .item .item-content input[type=text]:focus,
.content.page-petition .letter-group .item .item-content select:focus {
  outline: 5px solid rgba(221, 220, 220, 0.6784313725);
}
.content.page-petition .letter-group .item .item-content input[type=text]:last-child,
.content.page-petition .letter-group .item .item-content select:last-child {
  margin-right: 0px;
}
.content.page-petition .letter-group .item .item-content label.checkbox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 10px 15px;
  background: #fff;
  border-bottom: 10px solid var(--color-main-04);
  cursor: pointer;
}
.content.page-petition .letter-group .item .item-content label.checkbox input[type=checkbox] {
  position: relative;
  padding: 0;
  margin: 0;
  border-radius: 0px;
  margin-right: 10px;
  background: #e6ecf5;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 25px;
          flex: 0 0 25px;
  width: 25px !important;
  height: 25px !important;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  cursor: pointer;
}
.content.page-petition .letter-group .item .item-content label.checkbox input[type=checkbox]:checked:after {
  position: absolute;
  content: "\f00c";
  font-size: 25px;
  font-weight: 900;
  font-family: "Font Awesome 5 Free";
  color: var(--color-main-03);
  -webkit-transform: translate(0px, -5px);
          transform: translate(0px, -5px);
  display: inline-block;
  visibility: visible;
  width: 100%;
  height: 100%;
}
.content.page-petition .letter-group .item .item-content label.select {
  width: 100%;
  margin-right: 10px;
  position: relative;
}
.content.page-petition .letter-group .item .item-content label.select:last-child {
  margin-right: 0px;
}
.content.page-petition .letter-group .item .item-content label.select select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  position: relative;
  cursor: pointer;
}
.content.page-petition .letter-group .item .item-content label.select i.fas {
  position: absolute;
  top: 50%;
  right: 20px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  color: #c8cdd4;
  font-size: 2.5rem;
  width: 30px;
  pointer-events: none;
  z-index: 2;
}
.content.page-petition .letter-group .item .item-notification {
  margin-top: 5px;
  display: none;
}
.content.page-petition .letter-group .item .item-notification i {
  display: inline-block;
  color: var(--color-accent-01);
}
.content.page-petition .letter-group .item .item-notification p {
  display: inline-block;
  padding: 0;
  margin: 0;
  font-size: 1.8rem;
  padding-bottom: 10px;
  color: var(--color-accent-01);
}
.content.page-petition .letter-group .warning .item-title.star {
  color: var(--color-accent-01);
}
.content.page-petition .letter-group .warning .item-title.star p:before {
  color: var(--color-accent-01);
}
.content.page-petition .letter-group .warning .item-content input[type=text],
.content.page-petition .letter-group .warning .item-content select {
  border-color: var(--color-accent-01);
}
.content.page-petition .letter-group .warning .item-content .btn {
  background: var(--color-accent-01);
  border: 2px solid var(--color-accent-01);
}
.content.page-petition .letter-group .warning .item-content label.checkbox {
  border-color: var(--color-accent-01);
}
.content.page-petition .letter-group .warning .item-notification {
  display: block;
}
.content.page-petition .letter-group .select-area #select-area-other {
  display: none;
}
.content.page-petition .row.article-title .title {
  width: 100%;
}
.content.page-petition .row.article-bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  padding-top: 30px;
  padding-bottom: 30px;
}

@media (max-width: 768px) {
  .content.page-petition {
    padding: 15px;
    padding-bottom: 200px;
  }
  .content.page-petition .search-group,
.content.page-petition .forget-group {
    width: 100%;
    min-height: 580px;
    min-width: auto;
  }
}
@media (max-width: 768px) {
  .content.page-petition .letter-group {
    padding: 15px;
  }
  .content.page-petition .letter-group .step-title {
    -webkit-transform: skewY(-3deg);
            transform: skewY(-3deg);
    margin: 0;
    top: -50px;
    left: 34px;
  }
  .content.page-petition .letter-group .step-title .step {
    padding: 10px;
  }
  .content.page-petition .letter-group .step-title .step::before {
    display: none;
  }
  .content.page-petition .letter-group .step-title .text {
    padding: 10px 20px;
  }
  .content.page-petition .letter-group .item .item-content {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .content.page-petition .letter-group .item .item-content input[type=text],
.content.page-petition .letter-group .item .item-content label.select,
.content.page-petition .letter-group .item .item-content .btn {
    margin: 0;
    margin-bottom: 10px;
    width: 100%;
  }
  .content.page-petition .letter-group .item .item-content .code-img {
    margin-bottom: 10px;
    margin-left: 10px;
  }
}
@media (max-width: 768px) {
  .content.page-petition .letter-group .select-area .address-select-01 {
    width: 50% !important;
    padding-right: 5px;
  }
  .content.page-petition .letter-group .select-area .address-select-02 {
    width: 50% !important;
    padding-left: 5px;
  }
}
.row.article-title {
  background: var(--color-main-03);
  border-bottom: 10px solid var(--color-main-04);
  padding: 25px 35px;
  font-size: 2.4rem;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: relative;
}
.row.article-title .title {
  width: calc(100% - 150px);
  height: 100%;
  font-size: 2.4rem;
  font-weight: 700;
  padding: 0;
  margin: 0;
}
.row.article-title .date {
  position: relative;
  text-align: right;
  width: 150px;
  height: 100%;
  font-size: 2rem;
  font-weight: 700;
  padding: 0;
  margin: 0;
}
.row.article-title .info {
  width: 100%;
  opacity: 0.7;
  padding: 0;
  margin: 0;
  margin-top: 5px;
}
.row.article-title .info p {
  font-size: 1.8rem;
  padding: 0;
  margin: 0;
  display: inline-block;
  padding-right: 30px;
}

.row.article-content {
  padding: 25px;
  padding-top: 35px;
  font-size: 1.8rem;
  font-weight: 400;
  border-bottom: 10px solid var(--color-main-03);
  padding-bottom: 50px;
}
.row.article-content::after {
  content: " ";
  background: var(--color-main-02);
  width: 15px;
  height: 15px;
  position: relative;
  left: calc(100% - 25px);
  color: var(--color-main-02);
  bottom: 0;
}
.row.article-content figure.image img {
  width: 100%;
}
.row.article-content img,
.row.article-content svg {
  max-width: 100%;
}
.row.article-content figure.image-style-side img {
  width: 100%;
  padding: 0;
  margin: 0;
}
.row.article-content p {
  width: 100%;
  text-justify: inter-ideograph;
}
.row.article-content .article-source,
.row.article-content .article-type {
  margin-top: 20px;
}
.row.article-content .article-source p.title,
.row.article-content .article-source p.title-g,
.row.article-content .article-source a,
.row.article-content .article-source p,
.row.article-content .article-type p.title,
.row.article-content .article-type p.title-g,
.row.article-content .article-type a,
.row.article-content .article-type p {
  width: auto;
  display: inline-block;
}
.row.article-content .article-source a,
.row.article-content .article-type a {
  color: var(--color-main-03);
}
.row.article-content .article-source p.title,
.row.article-content .article-type p.title {
  background: var(--color-main-03);
  color: #fff;
  padding: 5px 10px;
  margin: 0;
  margin-right: 10px;
}
.row.article-content .article-source p.title-g,
.row.article-content .article-type p.title-g {
  background: #e6ecf5;
  color: #222;
  padding: 5px 10px;
  margin: 0;
  margin-right: 10px;
}
.row.article-content .article-type-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.row.article-content .article-type-box .article-type {
  margin-top: 0;
  margin-bottom: 20px;
  margin-right: 40px;
}
.row.article-content .article-group {
  padding-bottom: 20px;
}
.row.article-content .article-group img {
  max-width: 100%;
}
.row.article-content .article-group .title {
  position: relative;
  font-size: 2.4rem;
  color: var(--color-main-02);
  font-weight: 700;
  margin-bottom: 20px;
  padding: 20px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2745098039);
}
.row.article-content .article-group .date {
  margin-bottom: 5px;
}
.row.article-content .article-group .date p.date-title {
  background: #979797;
  color: #fff;
  padding: 5px 10px;
  margin: 0;
  margin-right: 10px;
  font-size: 1.8rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: inline-block;
}
.row.article-content .article-group .date p {
  display: inline-block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.row.article-content .article-group .result h4 {
  font-size: 2.6rem;
  color: var(--color-main-02);
  font-weight: 700;
  text-align: right;
  padding: 20px 0;
}
.row.article-content .article-group .content {
  min-height: unset;
}
.row.article-content .article-group .content p {
  text-align: justify;
  text-justify: inter-ideograph;
}

.row.article-bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  padding-top: 30px;
  padding-bottom: 30px;
}

@media (max-width: 768px) {
  .row.article-title {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    padding: 20px;
  }
  .row.article-title .title {
    width: 100%;
  }
  .row.article-title .date {
    width: 100%;
    text-align: left;
  }
  .row.article-content {
    padding-left: 0;
    padding-right: 0;
  }
}
.group-title {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.group-title h1.title,
.group-title h2.title {
  font-family: "Noto Sans TC", sans-serif;
  font-weight: 700;
  font-size: 2.4rem;
  color: var(--color-main-02);
  padding: 8px 20px;
  margin: 0;
  z-index: 1;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  text-transform: capitalize;
  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;
}
.group-title h1.title {
  background: var(--color-main-02);
  color: #fff;
  white-space: nowrap;
}
.group-title h2.title {
  background: #dadde2;
  font-family: "Inter", sans-serif;
  line-height: 25px;
}

.row.pagination-bar {
  margin-top: 20px;
  margin-bottom: 20px;
}
.row.pagination-bar ul.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;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  padding: 0;
}
.row.pagination-bar ul.pagination li.page-item {
  width: 50px;
  height: 50px;
  color: var(--color-main-02);
}
.row.pagination-bar ul.pagination li.page-item a {
  padding: 0;
  margin: 0;
  color: var(--color-main-02);
  font-size: 2rem;
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
  line-height: 45px;
  font-weight: 700;
}
.row.pagination-bar ul.pagination li.page-item:hover {
  background: var(--color-main-02-t);
}
.row.pagination-bar ul.pagination li.page-item.active {
  background: var(--color-main-02) !important;
}
.row.pagination-bar ul.pagination li.page-item.active a {
  color: #fff !important;
}
.row.pagination-bar ul.pagination .previous {
  position: relative;
  text-align: center;
  cursor: pointer;
}
.row.pagination-bar ul.pagination .previous::before {
  position: relative;
  top: 10px;
  font-size: 20px;
  content: "\f0d9";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}
.row.pagination-bar ul.pagination .next {
  position: relative;
  text-align: center;
  cursor: pointer;
}
.row.pagination-bar ul.pagination .next::before {
  position: relative;
  top: 10px;
  font-size: 20px;
  content: "\f0da";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}

.row.table-box {
  overflow: hidden;
  overflow-x: auto;
}
.row.table-box::-webkit-scrollbar {
  height: 17px;
  background: var(--color-main-02);
}
.row.table-box::-webkit-scrollbar-thumb {
  border: 5px solid var(--color-main-02);
  background: #fff;
}
.row.table-box table {
  width: 100%;
}
.row.table-box table thead {
  background: var(--color-main-02);
  border-bottom: 10px solid var(--color-main-03);
}
.row.table-box table thead th {
  padding: 20px;
  font-size: 2.4rem;
  color: #fff;
  border-right: 2px solid var(--color-main-03);
  white-space: nowrap;
}
.row.table-box table thead th:last-child {
  border-right: none;
}
.row.table-box table thead th:hover {
  background: var(--color-main-02);
}
.row.table-box table tbody {
  border-bottom: 10px solid var(--color-main-03);
}
.row.table-box table tbody tr:nth-child(even) {
  background: var(--color-main-02-t);
}
.row.table-box table tbody tr:hover {
  background: rgba(255, 224, 85, 0.0941176471);
}
.row.table-box table tbody td {
  padding: 10px 20px;
  font-size: 2rem;
  border-right: 2px solid rgba(221, 220, 220, 0.4588235294);
}
.row.table-box table tbody td:last-child {
  border-right: none;
}
.row.table-box table tbody a {
  color: #212529;
}

@media (max-width: 576px) {
  .row.table-box,
.row.pagination-bar {
    --bs-gutter-x: 5.5rem;
  }
}
body {
  padding-right: 0px !important;
}

.modal {
  padding-right: 0px !important;
}
.modal .modal-header {
  background: var(--color-main-02);
  color: #fff;
}
.modal .modal-header .modal-title {
  font-size: 2.4rem;
  font-weight: 700;
  padding-left: 10px;
}
.modal .modal-header .btn-close {
  color: #fff;
  background: none;
  font-size: 2.5rem;
  padding: 5px;
  margin: 0;
  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;
}
.modal .modal-header .btn-close::before {
  color: #fff;
  content: "\f00d";
  font-size: 2.5rem;
  font-weight: 900;
  font-family: "Font Awesome 5 Free";
}
.modal .modal-body {
  overflow: hidden;
  overflow-y: scroll;
  max-height: 60vh;
  padding: 20px;
}
.modal .modal-body hr {
  margin-top: 30px;
  margin-bottom: 20px;
}
.modal .modal-body h2 {
  font-size: 2.4rem;
  font-weight: 900;
  color: var(--color-main-03);
  margin-bottom: 10px;
}
.modal .modal-body h3 {
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--color-main-01);
  margin-bottom: 10px;
}
.modal .modal-body p {
  font-weight: 500;
  font-size: 1.6rem;
  text-align: justify;
  text-justify: inter-ideograph;
  text-indent: 2em;
  padding-bottom: 10px;
}
.modal .modal-body ol {
  font-size: 1.6rem;
  opacity: 0.9;
  padding-bottom: 10px;
}
.modal .modal-body ol li {
  margin-left: 0.5em;
  padding: 5px;
}
.modal .modal-footer {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.modal .modal-footer .btn {
  font-size: 1.8rem;
  padding: 10px 30px;
  width: 120px;
  margin: 8px;
  margin-bottom: 0;
}

.swiper-container {
  width: 100%;
  height: 20vw;
  min-height: 200px;
}
.swiper-container .swiper-slide {
  position: relative;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  overflow: hidden;
}
.swiper-container .swiper-slide .bg {
  width: 100%;
  height: 100%;
  z-index: 0;
  position: absolute;
  -webkit-filter: blur(5px);
  background-size: 200%;
  background-position: 50%;
  opacity: 0.4;
}
.swiper-container .swiper-slide .img-area {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.swiper-container .swiper-slide .img-area img {
  height: 100%;
  position: relative;
}
.swiper-container .swiper-slide .img-area p {
  position: absolute;
  bottom: 0;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(80%, rgba(0, 0, 0, 0.5019607843)));
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5019607843) 80%);
  padding: 0;
  margin: 0;
  z-index: 10;
  font-size: 2rem;
  color: #fff;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.5803921569);
  width: 100%;
  padding: 30px 40px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.swiper-container .swiper-slide .img-area p::before {
  content: "●";
  color: var(--color-main-04);
  padding-right: 10px;
}
.swiper-container .swiper-slide .img-area:hover p {
  -webkit-transform: translateY(0%);
          transform: translateY(0%);
}
.swiper-container .swiper-button-next,
.swiper-container .swiper-button-prev {
  opacity: 1;
  background-repeat: no-repeat !important;
  background-size: 20px !important;
  background-position: 50% !important;
  height: 100%;
  top: 0;
  margin-top: 0;
  padding: 20px;
  cursor: pointer !important;
}
.swiper-container .swiper-button-next:hover,
.swiper-container .swiper-button-prev:hover {
  background: rgba(0, 0, 0, 0.1764705882);
}
.swiper-container .swiper-button-next {
  right: 0;
  background-image: url(../../../svg/swiper-button-next.svg) !important;
}
.swiper-container .swiper-button-prev {
  left: 0;
  background-image: url(../../../svg/swiper-button-prev.svg) !important;
}

.swiper-pagination {
  width: 100%;
  padding: 10px;
  -webkit-filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.1));
          filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.1));
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.swiper-pagination-bullet {
  width: 80px;
  height: 6px;
  background: #fff;
  border-radius: 0px;
  opacity: 1;
}
.swiper-pagination-bullet:hover {
  background: #f7f7f7;
}

.swiper-pagination-bullet-active {
  background: var(--color-main-02) !important;
}

input.date-picker.hasDatepicker {
  background-image: url(../../../svg/icon-calendar.svg) !important;
  background-repeat: no-repeat !important;
  background-size: 32px !important;
  background-position-y: 50% !important;
  background-position-x: calc(100% - 20px) !important;
}

.ui-widget.ui-widget-content {
  border: 2px solid #cccccc !important;
  padding: 5px;
  border-radius: 10px;
  width: 280px;
  -webkit-box-shadow: 0 0 20px rgba(51, 51, 51, 0.2862745098);
          box-shadow: 0 0 20px rgba(51, 51, 51, 0.2862745098);
}
.ui-widget.ui-widget-content table.ui-datepicker-calendar {
  font-size: 14px;
  font-weight: 900;
  -webkit-text-stroke: 0.4px;
  border: none !important;
  margin-top: 5px;
}
.ui-widget.ui-widget-content table.ui-datepicker-calendar tr {
  background: transparent !important;
  border: none !important;
}
.ui-widget.ui-widget-content table.ui-datepicker-calendar tr th {
  background: var(--color-main-03-t) !important;
  border: none !important;
  color: var(--color-main-03) !important;
  padding: 7px 0 !important;
}
.ui-widget.ui-widget-content table.ui-datepicker-calendar tr th:first-child {
  border-radius: 5px 0 0 5px;
}
.ui-widget.ui-widget-content table.ui-datepicker-calendar tr th:last-child {
  border-radius: 0 5px 5px 0;
}
.ui-widget.ui-widget-content table.ui-datepicker-calendar tr td {
  min-width: unset;
}
.ui-widget.ui-widget-content .ui-state-default {
  text-align: center;
  border: none;
  background: #fff;
  font-weight: 700;
  border-radius: 100%;
  width: 35px;
  height: 35px;
  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;
}
.ui-widget.ui-widget-content .ui-state-default:hover {
  background: var(--color-main-03) !important;
  color: #fff !important;
}
.ui-widget.ui-widget-content .ui-state-default.ui-state-highlight {
  background: var(--color-main-01) !important;
  color: #fff !important;
}
.ui-widget.ui-widget-content .ui-state-default.ui-state-highlight:hover {
  background: var(--color-main-03) !important;
  color: #fff !important;
}
.ui-widget.ui-widget-content .ui-state-default.ui-state-active {
  background: var(--color-main-03) !important;
  color: #fff !important;
}
.ui-widget.ui-widget-content .ui-datepicker-header {
  border: none;
  border-radius: 5px;
  padding: 5px;
}
.ui-widget.ui-widget-content .ui-datepicker-header .ui-datepicker-title {
  font-size: 1.6rem;
  white-space: nowrap;
}
.ui-widget.ui-widget-content .ui-datepicker-header .ui-datepicker-title select {
  padding: 0 4px;
  height: unset;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  text-align: center;
  background: rgba(255, 255, 255, 0.8705882353);
  border: none;
  font-weight: 700;
  width: 60px;
  height: 30px;
  margin: 0 8px;
  border-radius: 5px;
  font-family: "Noto Sans TC", sans-serif;
}
.ui-widget.ui-widget-content .ui-datepicker-header .ui-datepicker-title select:hover {
  background: #fff;
}
.ui-widget.ui-widget-content .ui-datepicker-header .ui-datepicker-prev,
.ui-widget.ui-widget-content .ui-datepicker-header .ui-datepicker-next {
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  padding: 5px;
  border: none !important;
  cursor: pointer;
}
.ui-widget.ui-widget-content .ui-datepicker-prev {
  left: 5px !important;
  width: 30px;
  height: 30px;
  background-image: url(../../../svg/icon-left01.svg) !important;
}
.ui-widget.ui-widget-content .ui-datepicker-prev:hover {
  background: #fff;
}
.ui-widget.ui-widget-content .ui-datepicker-next {
  right: 5px !important;
  width: 30px;
  height: 30px;
  background-image: url(../../../svg/icon-right01.svg) !important;
}
.ui-widget.ui-widget-content .ui-datepicker-next:hover {
  background: #fff;
}
.ui-widget.ui-widget-content .ui-icon {
  display: none;
}
.ui-widget.ui-widget-content .ui-icon:hover {
  background: var(--color-main-01);
}
.ui-widget.ui-widget-content .ui-datepicker-current {
  opacity: 1 !important;
  color: #fff !important;
  background: var(--color-main-01) !important;
}
.ui-widget.ui-widget-content .ui-datepicker-current,
.ui-widget.ui-widget-content .ui-priority-primary {
  width: auto !important;
  font-weight: 700 !important;
  font-family: "Noto Sans TC", sans-serif !important;
}
.ui-widget.ui-widget-content .ui-datepicker-buttonpane button {
  margin: 0;
  margin-top: 5px;
  font-size: 1.6rem;
  border-radius: 5px;
  padding: 5px 10px;
  line-height: 27px;
}

[class*=skin-]:not([class*=skin-02]) {
  display: none;
}

* {
  font-family: "Noto Sans TC", sans-serif;
}

html,
body {
  width: 100%;
  overflow-x: hidden;
  font-size: 10px;
}

body {
  overflow: hidden;
}

.content {
  min-height: 90vh;
}

@media (max-width: 768px) {
  html {
    font-size: 8px;
  }
}
a {
  text-decoration: none !important;
}

.btn-style-01 {
  background: var(--color-main-02);
  border: 2px solid var(--color-main-02);
  border-radius: 0px;
  color: #fff;
  margin-right: 10px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.btn-style-01:hover {
  background: var(--color-main-03);
  border: 2px solid var(--color-main-03);
  color: #fff;
}

.btn-style-02 {
  position: relative;
  border: 2px solid var(--color-main-02);
  border-radius: 0px;
  color: var(--color-main-02);
  background: #fff;
}
.btn-style-02:hover {
  border: 2px solid var(--color-main-02);
  color: var(--color-main-02);
  background: var(--color-main-03-t);
}

.more-btn-area,
.back-btn-area {
  width: 200px;
  padding: 20px 0;
  cursor: pointer;
  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;
}
.more-btn-area .more-btn,
.back-btn-area .more-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.more-btn-area .more-btn::before,
.back-btn-area .more-btn::before {
  content: "查看更多";
  font-size: 2rem;
  color: var(--color-main-02);
  font-weight: 700;
  letter-spacing: 5px;
}
.more-btn-area .more-btn::after,
.back-btn-area .more-btn::after {
  font-size: 2.4rem;
  color: var(--color-main-02);
  font-weight: 900;
  content: "\f105";
  padding-left: 12px;
  position: relative;
  top: 1px;
  left: 0;
  font-family: "Font Awesome 5 Free";
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.more-btn-area .more-btn:hover::after,
.back-btn-area .more-btn:hover::after {
  left: 5px;
}
.more-btn-area .back-btn,
.more-btn-area .send-btn,
.back-btn-area .back-btn,
.back-btn-area .send-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  border: 2px solid var(--color-main-02);
  padding: 20px 48px !important;
  background: #fff;
  width: 100%;
}
.more-btn-area .back-btn::before,
.more-btn-area .send-btn::before,
.back-btn-area .back-btn::before,
.back-btn-area .send-btn::before {
  content: "";
  font-size: 2rem;
  color: var(--color-main-02);
  font-weight: 700;
  letter-spacing: 5px;
}
.more-btn-area .back-btn::after,
.more-btn-area .send-btn::after,
.back-btn-area .back-btn::after,
.back-btn-area .send-btn::after {
  font-size: 2.4rem;
  color: var(--color-main-02);
  font-weight: 900;
  content: "\f105";
  padding-left: 24px;
  position: relative;
  top: 1px;
  left: 0;
  font-family: "Font Awesome 5 Free";
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.more-btn-area .back-btn:hover::after,
.more-btn-area .send-btn:hover::after,
.back-btn-area .back-btn:hover::after,
.back-btn-area .send-btn:hover::after {
  left: 5px;
}
.more-btn-area .back-btn::before,
.back-btn-area .back-btn::before {
  content: "返回";
}
.more-btn-area .send-btn::before,
.back-btn-area .send-btn::before {
  content: "送出";
}

.ck.ck-editor {
  width: 100% !important;
}

.ck.ck-editor__main > .ck-editor__editable {
  min-height: 300px;
}

.btn:focus,
input:focus,
textarea:focus,
select:focus {
  outline: 5px solid rgba(221, 220, 220, 0.6784313725);
}

.page-leave-active {
  -webkit-animation: fade-out 0.5s;
          animation: fade-out 0.5s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}

.fade-in {
  -webkit-animation: fade-in 0.5s 1;
          animation: fade-in 0.5s 1;
}

@-webkit-keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.block-bg {
  background: #f6f6f6;
  position: fixed;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  -webkit-animation: fade-in 1s;
          animation: fade-in 1s;
}
.block-bg .container {
  height: 100%;
  background: #e9ebee;
}
@media (max-width: 992px) {
  .block-bg .container {
    max-width: 90%;
  }
}

.block-footer .copyright a {
  color: #feb876 !important;
}