@charset "UTF-8";
/**bootstrap5 grid setting**/
/**bootstrap5 grid setting end**/
body {
  font-family: "Microsoft JhengHei", "Arial", sans-serif;
  width: 100%;
  height: 100%;
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1.5;
  color: #000;
  background: #F7F5F2;
}
body.modal-open {
  position: fixed;
}
body.scroll-lock {
  overflow: hidden;
}

h1, h2, h3, h4, h5, h6 {
  color: #000;
}

/*設置網站反白顏色*/
::-moz-selection {
  background: rgba(119, 199, 224, 0.7);
}

::selection {
  background: rgba(119, 199, 224, 0.7);
}

a {
  color: #4F77E1;
}

.lazyload,
.lazyloading {
  opacity: 0;
}

.lazyloaded {
  opacity: 1;
  transition: opacity 300ms;
}

.alert-text {
  color: #E48D8D;
}

.import-text {
  color: #EE8A19;
}

.body-wrapper {
  position: relative;
  overflow-x: hidden;
}
.body-wrapper.home {
  overflow: hidden;
}

.container {
  padding-left: 1rem;
  padding-right: 1rem;
}
@media screen and (min-width: 992px) {
  .container.more-pd {
    padding-left: 4rem;
    padding-right: 4rem;
  }
}
@media screen and (min-width: 1200px) {
  .container.more-pd {
    padding-left: 4.8rem;
    padding-right: 4.8rem;
  }
}
@media screen and (min-width: 1400px) {
  .container.more-pd {
    padding-left: 5.55rem;
    padding-right: 5.55rem;
  }
}

#map {
  opacity: 0;
}

.video-paly-btn:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 3.8rem;
  height: 3.8rem;
  border-radius: 50%;
  background-color: #00BED6;
  background-image: url("../img/home/video_play_btn_01.svg");
  transition: all 0.3s ease-in-out;
}
.video-paly-btn:hover:after {
  background-color: #007DB2;
  transition: all 0.3s ease-in-out;
}

.video-close-btn:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 3.8rem;
  height: 3.8rem;
  border-radius: 50%;
  background-color: #00BED6;
  background-image: url("../img/home/video_close_btn_01.svg");
  transition: all 0.3s ease-in-out;
}
.video-close-btn:hover:after {
  background-color: #007DB2;
  transition: all 0.3s ease-in-out;
}

.title-tag-01 {
  display: inline-flex;
  position: relative;
  padding: 1.15rem 1.6rem 1.05rem;
  justify-content: center;
  align-items: center;
  border-radius: 50rem;
  background: #D78D89;
  color: #FFF;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  margin-bottom: 1.75rem;
  z-index: 3;
}
.title-tag-01:before {
  content: "";
  display: block;
  position: absolute;
  left: 1rem;
  bottom: -1.6rem;
  width: 2.8rem;
  height: 2.8rem;
  background: url("../img/list/content_tag_bg_01.svg") 0% 0% no-repeat;
  background-size: 100%;
  z-index: -1;
}
@media screen and (min-width: 992px) {
  .title-tag-01 {
    padding: 1.45rem 2rem 1.35rem;
    justify-content: center;
    align-items: center;
    border-radius: 50rem;
    background: #D78D89;
    color: #FFF;
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1;
    min-width: 10rem;
    margin-bottom: 1.6rem;
  }
  .title-tag-01:before {
    content: "";
    display: block;
    position: absolute;
    left: 1rem;
    bottom: -1.6rem;
    width: 2.8rem;
    height: 2.8rem;
    background: url("../img/list/content_tag_bg_01.svg") 0% 0% no-repeat;
    background-size: 100%;
    z-index: -1;
  }
}

.btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.95rem;
  line-height: normal;
  font-weight: 700;
  max-width: 100%;
  border-radius: 50rem;
  transition: all 0.2s;
  padding: 1rem 2rem 1rem;
  color: #FFF;
}
.btn.type-title-label {
  background: #fff;
  color: #00BED6;
  line-height: normal;
  padding: 0.4rem 1rem;
  font-size: 1.9rem;
  border-radius: 1rem;
  cursor: unset;
}
.btn.type-title-label:hover, .btn.type-title-label.active {
  transform: translateY(0);
  box-shadow: none;
}
@media screen and (min-width: 992px) {
  .btn.type-title-label {
    padding: 0.5rem 1.5rem;
    font-size: 2.4rem;
  }
}
.btn.middle {
  padding: 0.75rem 1.1rem;
}
.btn.small {
  padding: 0.6rem 1.1rem;
  font-size: 0.8rem;
}
.btn.tiny {
  padding: 0.2rem 0.45rem;
  font-size: 0.7rem;
}
.btn.type1 {
  background: #DB0032;
  border: none;
}
.btn.type1:after {
  content: "";
  display: block;
  position: absolute;
  top: 0.25rem;
  left: 0.25rem;
  border-radius: 50rem;
  border: 2px dashed rgba(255, 255, 255, 0.8);
  width: calc(100% - 0.5rem);
  height: calc(100% - 0.5rem);
  transition: all 0.3s ease-in-out;
  opacity: 1;
}
.btn.type1:before {
  content: "";
  display: block;
  position: absolute;
  top: 0.25rem;
  left: 0.25rem;
  border-radius: 50rem;
  border: 2px solid #DB0032;
  width: calc(100% - 0.5rem);
  height: calc(100% - 0.5rem);
  transition: all 0.3s ease-in-out;
}
.btn.type1:hover, .btn.type1.active {
  transform: translateY(0);
  box-shadow: none;
}
.btn.type1:hover:after, .btn.type1.active:after {
  border-color: #DB0032;
  transition: all 0.3s ease-in-out;
  opacity: 0;
}
.btn.type1:hover:before, .btn.type1.active:before {
  border-color: #fff;
  transition: all 0.3s ease-in-out;
}
.btn.type1.bg-2 {
  background: #fff;
  color: #00BED6;
}
.btn.type1.bg-2:after {
  border: 2px dashed #00BED6;
}
.btn.type1.bg-2:before {
  border: 2px solid #fff;
}
.btn.type1.bg-2:hover:after, .btn.type1.bg-2.active:after {
  border-color: #fff;
}
.btn.type1.bg-2:hover:before, .btn.type1.bg-2.active:before {
  border-color: #00BED6;
}
.btn.type1.bg-3 {
  background: #fff;
  color: #D78D89;
}
.btn.type1.bg-3:after {
  border: 2px dashed #D78D89;
}
.btn.type1.bg-3:before {
  border: 2px solid #fff;
}
.btn.type1.bg-3:hover:after, .btn.type1.bg-3.active:after {
  border-color: #fff;
}
.btn.type1.bg-3:hover:before, .btn.type1.bg-3.active:before {
  border-color: #D78D89;
}
.btn.type1.bg-4 {
  background: #fff;
  color: #AEA588;
}
.btn.type1.bg-4:after {
  border: 2px dashed #AEA588;
}
.btn.type1.bg-4:before {
  border: 2px solid #fff;
}
.btn.type1.bg-4:hover:after, .btn.type1.bg-4.active:after {
  border-color: #fff;
}
.btn.type1.bg-4:hover:before, .btn.type1.bg-4.active:before {
  border-color: #AEA588;
}
.btn.type1.bg-5 {
  background: #fff;
  color: #CEA007;
}
.btn.type1.bg-5:after {
  border: 2px dashed #CEA007;
}
.btn.type1.bg-5:before {
  border: 2px solid #fff;
}
.btn.type1.bg-5:hover:after, .btn.type1.bg-5.active:after {
  border-color: #fff;
}
.btn.type1.bg-5:hover:before, .btn.type1.bg-5.active:before {
  border-color: #CEA007;
}
.btn.type2 {
  border-radius: 50rem;
  border: 0.05rem solid #00BED6;
  background: #FFF;
  color: #00BED6;
}
.btn.type2.bg-2 {
  background: #E4F2F3;
}
.btn.type2.contact {
  width: 100%;
  margin-bottom: 0.5rem;
}
@media screen and (min-width: 992px) {
  .btn.type2.contact {
    width: auto;
    margin-bottom: 0;
  }
}
.btn.type2:hover, .btn.type2.active {
  background: #00BED6;
  transform: translateY(0);
  box-shadow: none;
  color: #fff;
}
.btn.type3 {
  border-radius: 50rem;
  border: 0.05rem solid #00BED6;
  background: #E4F2F3;
  color: #000000;
  border-radius: 0.4rem;
  align-items: start;
  justify-content: start;
}
.btn.type3:after {
  color: #00BED6;
}
.btn.type3:hover, .btn.type3.active {
  background: #00BED6;
  transform: translateY(0);
  box-shadow: none;
  color: #fff;
}
.btn.type3:hover:after, .btn.type3.active:after {
  color: #fff;
}
.btn.type4 {
  border-radius: 50rem;
  border: 0.05rem solid #00B900;
  background: #FFF;
  color: #00B900;
}
.btn.type4:hover, .btn.type4.active {
  background: #00B900;
  transform: translateY(0);
  box-shadow: none;
  color: #fff;
}

.text-default {
  color: var(--bs-body-color);
}

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

.main-area .search-box {
  background: #FAF1D6;
}
.main-area.is-search-detail {
  background: linear-gradient(180deg, #FAF1D6 17.6rem, transparent 0%), transparent;
  position: relative;
}
@media screen and (min-width: 992px) {
  .main-area.is-search-detail {
    background: linear-gradient(180deg, #FAF1D6 21.25rem, transparent 0%), transparent;
  }
  .main-area.is-search-detail > .container-xl {
    position: relative;
  }
}
@media screen and (min-width: 1200px) {
  .main-area.is-search-detail {
    background: linear-gradient(180deg, #FAF1D6 21.25rem, transparent 0%), transparent;
  }
  .main-area.is-search-detail > .container-md {
    position: relative;
  }
}
@media screen and (min-width: 1400px) {
  .main-area.is-search-detail {
    background: linear-gradient(180deg, #FAF1D6 21.25rem, transparent 0%), transparent;
  }
  .main-area.is-search-detail > .container-md {
    position: relative;
  }
}
.main-area.is-detail {
  background: linear-gradient(180deg, #FAF1D6 17.6rem, transparent 0%), transparent;
  position: relative;
}
@media screen and (min-width: 992px) {
  .main-area.is-detail {
    background: linear-gradient(180deg, #FAF1D6 21.25rem, transparent 0%), transparent;
  }
  .main-area.is-detail > .container-xl {
    position: relative;
  }
  .main-area.is-detail > .container-xl:before {
    content: "";
    display: block;
    position: absolute;
    top: 1rem;
    left: 80%;
    width: 19.25rem;
    height: 17rem;
    background: url("../img/home/content_top_bg_01.svg") 0% 0% no-repeat;
    background-size: 100%;
  }
}
@media screen and (min-width: 1200px) {
  .main-area.is-detail {
    background: linear-gradient(180deg, #FAF1D6 21.25rem, transparent 0%), transparent;
  }
  .main-area.is-detail > .container-md {
    position: relative;
  }
  .main-area.is-detail > .container-md:before {
    content: "";
    display: block;
    position: absolute;
    top: 1rem;
    left: 80%;
    width: 19.25rem;
    height: 17rem;
    background: url("../img/home/content_top_bg_01.svg") 0% 0% no-repeat;
    background-size: 100%;
  }
}
@media screen and (min-width: 1400px) {
  .main-area.is-detail {
    background: linear-gradient(180deg, #FAF1D6 21.25rem, transparent 0%), transparent;
  }
  .main-area.is-detail > .container-md {
    position: relative;
  }
  .main-area.is-detail > .container-md:before {
    content: "";
    display: block;
    position: absolute;
    top: 1rem;
    left: 80%;
    width: 19.25rem;
    height: 17rem;
    background: url("../img/home/content_top_bg_01.svg") 0% 0% no-repeat;
    background-size: 100%;
  }
}

body.stop-transitions * {
  transition: none !important;
}

.col-xs-margin-bottom {
  margin-bottom: 10px;
}
@media screen and (min-width: 576px) {
  .col-xs-margin-bottom {
    margin-bottom: 0px;
  }
}

.col-md-margin-bottom {
  margin-bottom: 10px;
}
@media screen and (min-width: 768px) {
  .col-md-margin-bottom {
    margin-bottom: 0px;
  }
}

.noselect {
  -webkit-touch-callout: none;
  /* iOS Safari */
  -webkit-user-select: none;
  /* Safari */
  /* Konqueror HTML */
  -moz-user-select: none;
  /* Firefox */
  /* Internet Explorer/Edge */
  user-select: none;
  /* Non-prefixed version, currently
     supported by Chrome and Opera */
}

.g-recaptcha-response {
  display: block !important;
  visibility: hidden;
  position: absolute;
  left: 0;
  top: 0;
}

.article-extra-info .extra-info-box:after, .detail-wrapper .article-content-area:after, .editor-content:after, .post-content:after, #tinymce:after {
  content: "";
  display: block;
  clear: both;
}

.article-extra-info .extra-info-box iframe, .detail-wrapper .article-content-area iframe, .editor-content iframe, .post-content iframe, #tinymce iframe {
  max-width: 100%;
  border: 0;
}
.article-extra-info .extra-info-box img, .detail-wrapper .article-content-area img, .editor-content img, .post-content img, #tinymce img {
  height: auto;
  max-width: 100%;
}
.article-extra-info .extra-info-box h3, .detail-wrapper .article-content-area h3, .editor-content h3, .post-content h3, #tinymce h3 {
  color: #DB0032;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 0.75rem;
}
.article-extra-info .extra-info-box h4, .detail-wrapper .article-content-area h4, .editor-content h4, .post-content h4, #tinymce h4 {
  color: #00BED6;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 0.75rem;
}
.article-extra-info .extra-info-box h5, .detail-wrapper .article-content-area h5, .editor-content h5, .post-content h5, #tinymce h5 {
  color: #000;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
  margin-bottom: 0.75rem;
}
.article-extra-info .extra-info-box h6, .detail-wrapper .article-content-area h6, .editor-content h6, .post-content h6, #tinymce h6 {
  color: #589D7B;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
  margin-bottom: 0.75rem;
}
.article-extra-info .extra-info-box a, .detail-wrapper .article-content-area a, .editor-content a, .post-content a, #tinymce a {
  color: #00BED6;
  text-decoration: underline;
}
.article-extra-info .extra-info-box a:hover, .detail-wrapper .article-content-area a:hover, .editor-content a:hover, .post-content a:hover, #tinymce a:hover {
  color: #007DB2;
  text-decoration: underline;
}
.article-extra-info .extra-info-box p, .detail-wrapper .article-content-area p, .editor-content p, .post-content p, #tinymce p {
  margin-bottom: 1.5rem;
}
.article-extra-info .extra-info-box table, .detail-wrapper .article-content-area table, .editor-content table, .post-content table, #tinymce table {
  max-width: 100%;
  border-collapse: collapse;
  margin-bottom: 1.5rem;
}
.article-extra-info .extra-info-box table thead th, .detail-wrapper .article-content-area table thead th, .editor-content table thead th, .post-content table thead th, #tinymce table thead th, .article-extra-info .extra-info-box table thead td, .detail-wrapper .article-content-area table thead td, .editor-content table thead td, .post-content table thead td, #tinymce table thead td {
  background-color: #F4E29F;
}
.article-extra-info .extra-info-box table th, .detail-wrapper .article-content-area table th, .editor-content table th, .post-content table th, #tinymce table th, .article-extra-info .extra-info-box table td, .detail-wrapper .article-content-area table td, .editor-content table td, .post-content table td, #tinymce table td {
  padding: 0.75rem;
  border: #F4E29F solid 0.1rem;
}
.article-extra-info .extra-info-box table th, .detail-wrapper .article-content-area table th, .editor-content table th, .post-content table th, #tinymce table th {
  background-color: #F4E29F;
  font-weight: normal;
}
.article-extra-info .extra-info-box ul, .detail-wrapper .article-content-area ul, .editor-content ul, .post-content ul, #tinymce ul {
  padding: 0;
  list-style: none !important;
  margin-bottom: 0rem;
}
.article-extra-info .extra-info-box ul > li, .detail-wrapper .article-content-area ul > li, .editor-content ul > li, .post-content ul > li, #tinymce ul > li {
  padding-left: 1.1rem;
  position: relative;
}
.article-extra-info .extra-info-box ul > li:before, .detail-wrapper .article-content-area ul > li:before, .editor-content ul > li:before, .post-content ul > li:before, #tinymce ul > li:before {
  content: "";
  display: block;
  position: absolute;
  left: 0.15rem;
  top: 0.4rem;
  width: 0.4rem;
  height: 0.4rem;
  background-color: #00BED6;
  border-radius: 50%;
}
.article-extra-info .extra-info-box ul > li + li, .detail-wrapper .article-content-area ul > li + li, .editor-content ul > li + li, .post-content ul > li + li, #tinymce ul > li + li {
  margin-top: 0.3rem;
}
.article-extra-info .extra-info-box ol, .detail-wrapper .article-content-area ol, .editor-content ol, .post-content ol, #tinymce ol {
  padding: 0;
  list-style: none !important;
  counter-reset: ol-item;
  margin-bottom: 0rem;
}
.article-extra-info .extra-info-box ol > li, .detail-wrapper .article-content-area ol > li, .editor-content ol > li, .post-content ol > li, #tinymce ol > li {
  display: block;
  padding-left: 1.1rem;
  position: relative;
}
.article-extra-info .extra-info-box ol > li:before, .detail-wrapper .article-content-area ol > li:before, .editor-content ol > li:before, .post-content ol > li:before, #tinymce ol > li:before {
  position: absolute;
  left: 0.05rem;
  top: 0.1rem;
  font-family: "Baloo Tamma 2";
  content: counter(ol-item) ".";
  counter-increment: ol-item;
  font-size: 0.85rem;
  line-height: 1.5;
  font-weight: 700;
  color: #00BED6;
  display: inline-block;
  min-width: 0.8rem;
}
.article-extra-info .extra-info-box ol > li + li, .detail-wrapper .article-content-area ol > li + li, .editor-content ol > li + li, .post-content ol > li + li, #tinymce ol > li + li {
  margin-top: 0.3rem;
}

.padding-wrapper {
  padding: 1rem;
  border-radius: 1.5rem;
  background-color: #FFF;
}
@media screen and (min-width: 768px) {
  .padding-wrapper {
    padding: 3.25rem;
  }
}

.page-content-area {
  position: relative;
}
.video-wrapper {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
}
.video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.video-wrapper.not-load {
  padding-bottom: 0;
}

.modal-dialog .video-content {
  width: 100%;
}
.modal-dialog .modal-content {
  padding: 2rem;
}
@media screen and (min-width: 992px) {
  .modal-dialog {
    max-width: 27rem;
  }
}
.modal-dialog .modal-header {
  padding: 0;
}
.modal-dialog .modal-header .modal-title {
  color: #000;
}
.modal-dialog .modal-body {
  padding: 0;
}
.modal-dialog .modal-footer {
  padding: 0;
  margin-top: 1.25rem;
}
.modal-dialog .modal-footer > * {
  margin: 0;
}

body.modal-open {
  position: relative !important;
}

.info-modal .modal-content {
  border-radius: 1.5rem;
}
.info-modal .modal-header {
  margin-bottom: 1rem;
}
.info-modal .modal-header .btn-close {
  top: -1.25rem;
  right: 0;
  width: 2.5rem;
  height: 2.5rem;
  background: url("../img/button/button_close.png") no-repeat;
  background-size: 100% auto;
  margin: 0;
  padding: 0;
}
.info-modal .modal-header .btn-close:before {
  content: none;
}
.info-modal .modal-header .btn-close:hover {
  background: url("../img/button/button_close_hover.png") no-repeat;
  background-size: 100% auto;
}
.info-modal .modal-header .modal-title {
  font-size: 1rem;
  line-height: 1;
  font-weight: 700;
  color: #51B5D4;
}
.info-modal .modal-body {
  display: flex;
  justify-content: center;
}
.info-modal .modal-body address {
  margin-bottom: 0.3rem;
}

.contact-modal .modal-dialog {
  max-width: 35rem;
  pointer-events: auto;
}
@media screen and (min-width: 992px) {
  .contact-modal .modal-dialog {
    width: 35rem;
  }
}
.contact-modal .modal-dialog .modal-content {
  padding: 1rem;
}
@media screen and (min-width: 576px) {
  .contact-modal .modal-dialog .modal-content {
    padding: 1.8rem 2.5rem 2.5rem 2.2rem;
  }
}
.contact-modal .modal-dialog .modal-content .modal-title {
  color: #00BED6;
  text-align: center;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 1.5rem;
}
.contact-modal .modal-dialog .modal-content .modal-body {
  font-size: 1rem;
}
.contact-modal .close-btn {
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 3.8rem;
  height: 3.8rem;
  border-radius: 50%;
  background-color: #00BED6;
  background-image: url("../img/home/video_close_btn_01.svg");
  transition: all 0.3s ease-in-out;
  z-index: 99;
  box-shadow: none;
  border: 0;
}
.contact-modal .close-btn:hover {
  background-color: #007DB2;
  transition: all 0.3s ease-in-out;
}

.video-modal .modal-dialog {
  max-width: 49.9rem;
  pointer-events: auto;
}
@media screen and (min-width: 576px) {
  .video-modal .modal-dialog {
    padding: 1rem;
  }
}
.video-modal .close-btn {
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 3.8rem;
  height: 3.8rem;
  border-radius: 50%;
  background-color: #00BED6;
  background-image: url("../img/home/video_close_btn_01.svg");
  transition: all 0.3s ease-in-out;
  z-index: 99;
  box-shadow: none;
  border: 0;
}
.video-modal .close-btn:hover {
  background-color: #007DB2;
  transition: all 0.3s ease-in-out;
}
.video-modal .video-content {
  position: relative;
  padding: 1.5rem 1rem;
  background: #FFF;
  border-radius: 1.5rem;
}
.video-modal .video-content .video-wrapper {
  border-radius: 0.75rem;
}
@media screen and (min-width: 768px) {
  .video-modal .video-content {
    padding: 2rem;
  }
}

.side-toolbar {
  position: fixed;
  right: 0.5rem;
  bottom: 0.5rem;
  z-index: 99;
}
.side-toolbar.bot {
  position: absolute;
}
.side-toolbar.hidden {
  opacity: 0;
  overflow: hidden;
  visibility: hidden;
  transition: all 0.5s;
}
.side-toolbar.shown {
  opacity: 1;
  visibility: visible;
}
@media screen and (min-width: 992px) {
  .side-toolbar {
    right: 0.75rem;
    bottom: 0.75rem;
  }
  .side-toolbar.bot {
    top: auto;
  }
}
@media screen and (min-width: 1400px) {
  .side-toolbar {
    right: unset;
    left: 50%;
    margin-left: 600px;
    bottom: 0.75rem;
  }
  .side-toolbar.bot {
    top: auto;
  }
}

@media (hover: none) {
  .dropdown .dropdown-menu > li > a {
    transition: none;
  }
}

/* sweet alert btn color customize */
.swal2-popup .swal2-styled.swal2-confirm {
  background-color: #F3A9A9 !important;
}

.swal2-popup .swal2-styled:focus {
  background-color: #F3A9A9 !important;
}

.swal2-popup .swal2-actions:not(.swal2-loading) .swal2-styled:hover {
  background-color: #F3A9A9 !important;
}

.fade-in {
  opacity: 0;
  animation-duration: 0.75s;
  -webkit-animation-duration: 0.75s;
  animation-timing-function: ease-in-out;
  -webkit-animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
  animation-delay: 400ms;
}
.fade-in.motion {
  animation-name: fadeIn;
  -webkit-animation-name: fadeIn;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fade-in-up {
  opacity: 0;
  animation-duration: 0.75s;
  -webkit-animation-duration: 0.75s;
  animation-timing-function: ease-in-out;
  -webkit-animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
  animation-delay: 400ms;
}
.fade-in-up.motion {
  animation-name: fadeInUp;
  -webkit-animation-name: fadeInUp;
}

.fade-in-left {
  opacity: 0;
  animation-duration: 0.75s;
  -webkit-animation-duration: 0.75s;
  animation-timing-function: ease-in-out;
  -webkit-animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
  animation-delay: 400ms;
}
.fade-in-left.motion {
  animation-name: fadeInLeft;
  -webkit-animation-name: fadeInLeft;
}
@keyframes fadeInLeft {
  0% {
    transform: translateX(100%);
    opacity: 0;
  }
  100% {
    transform: translateX(0%);
    opacity: 1;
  }
}
.fade-in-right {
  opacity: 0;
  animation-duration: 0.75s;
  -webkit-animation-duration: 0.75s;
  animation-timing-function: ease-in-out;
  -webkit-animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
  animation-delay: 400ms;
}
.fade-in-right.motion {
  animation-name: fadeInRight;
  -webkit-animation-name: fadeInRight;
}
@keyframes fadeInRight {
  0% {
    transform: translateX(-100%);
    opacity: 0;
  }
  100% {
    transform: translateX(0%);
    opacity: 1;
  }
}
.fade-in-up {
  opacity: 0;
  animation-duration: 0.75s;
  -webkit-animation-duration: 0.75s;
  animation-timing-function: ease-in-out;
  -webkit-animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
  animation-delay: 400ms;
}
.fade-in-up.motion {
  animation-name: fadeInUp;
  -webkit-animation-name: fadeInUp;
}
@keyframes fadeInUp {
  0% {
    transform: translateY(100%);
    opacity: 0;
  }
  100% {
    transform: translateY(0%);
    opacity: 1;
  }
}
/*
=================================================================
(#m02-1hds) HEADER
=================================================================
*/
header .header-top {
  position: relative;
  z-index: 1020;
}
.nav-toolbar {
  list-style: none;
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 0;
  padding-left: 0.5rem;
  margin-left: auto;
}
.nav-toolbar > li {
  display: flex;
}
.nav-toolbar > li a {
  height: 1.6rem;
  line-height: 1;
}

.navbar-expand-lg {
  background: #FAF1D6;
  box-shadow: unset !important;
}
.navbar-expand-lg.navbar-clone {
  background: #ffffff;
  box-shadow: 0 0.1rem 0.1rem 0rem rgba(0, 0, 0, 0.15) !important;
}
.navbar-expand-lg .hamburger {
  color: #00BED6;
  margin-left: 0.75rem;
}
.navbar-expand-lg .hamburger span, .navbar-expand-lg .hamburger:before, .navbar-expand-lg .hamburger:after {
  width: 1rem;
  border-radius: 0;
}
.navbar-expand-lg .donate-link {
  font-size: 0.8rem;
  color: #FFF;
  font-weight: 700;
  background-color: #F3A9A9;
  padding: 0.48rem 0.5rem 0.3rem 0.5rem;
  border-radius: 1.45rem;
  margin-left: auto;
}
@media (max-width: 991.98px) {
  .navbar-expand-lg .navbar-brand {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }
}
@media screen and (min-width: 992px) {
  .navbar-expand-lg {
    padding-top: 1rem;
    padding-bottom: 1rem;
    box-shadow: unset !important;
  }
  .navbar-expand-lg.navbar-clone {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }
  .navbar-expand-lg .navbar-brand {
    margin-top: -0.2rem;
  }
  .navbar-expand-lg .navbar-nav {
    gap: 1.5rem 1.5rem;
    align-items: center;
  }
  .navbar-expand-lg .navbar-nav > .nav-item .nav-link {
    height: 100%;
    padding-left: 0rem;
    padding-right: 0rem;
  }
  .navbar-expand-lg .navbar-nav > .nav-item .nav-link .nav-title {
    font-size: 0.85rem;
    font-weight: 700;
    line-height: 1;
    margin-left: 0.3rem;
    padding-top: 0.2rem;
    transition: color 0.2s ease-in-out;
  }
  .navbar-expand-lg .navbar-nav > .nav-item .nav-link:hover .nav-title, .navbar-expand-lg .navbar-nav > .nav-item .nav-link.active .nav-title {
    color: #DB0032;
  }
  .navbar-expand-lg .navbar-nav > .nav-item.donate {
    position: relative;
  }
  .navbar-expand-lg .navbar-nav > .nav-item.donate .nav-link {
    padding-left: 0.5rem;
    padding-right: 0;
  }
  .navbar-expand-lg .navbar-nav > .nav-item.donate .nav-link .header-icon {
    position: relative;
    z-index: 2;
  }
  .navbar-expand-lg .navbar-nav > .nav-item.donate .nav-link .nav-title {
    color: #FFF;
    background-color: #F3A9A9;
    padding: 0.6rem 0.6rem 0.4rem 1.5rem;
    border-radius: 1.625rem;
    margin-left: -1.3rem;
    transition: background-color 0.2s ease-in-out;
  }
  .navbar-expand-lg .navbar-nav > .nav-item.donate .nav-link:hover .nav-title, .navbar-expand-lg .navbar-nav > .nav-item.donate .nav-link.active .nav-title {
    background-color: #DB0032;
  }
}

@media (max-width: 991.98px) {
  .navbar-collapse.offcanvas {
    background-color: #fff;
  }
  .navbar-collapse.offcanvas .offcanvas-header {
    padding: 0.5rem 0.75rem;
    min-height: 2.2rem;
    justify-content: flex-start;
  }
  .navbar-collapse.offcanvas .offcanvas-header .btn-close {
    position: relative;
    width: 1.2rem;
    height: 1.2rem;
    color: #00BED6;
    margin-right: 0;
    margin-left: 0.5rem;
  }
  .navbar-collapse.offcanvas .offcanvas-header .btn-close:before, .navbar-collapse.offcanvas .offcanvas-header .btn-close:after {
    content: "";
    position: absolute;
    top: 0.55rem;
    left: 0.05rem;
    width: 100%;
    height: 0.15rem;
    background: currentColor;
    border-radius: 0;
  }
  .navbar-collapse.offcanvas .offcanvas-header .btn-close:before {
    transform: rotate(42deg);
  }
  .navbar-collapse.offcanvas .offcanvas-header .btn-close:after {
    transform: rotate(-42deg);
  }
  .navbar-collapse.offcanvas .offcanvas-body {
    padding: 2rem 0;
  }
  .navbar-collapse.offcanvas .offcanvas-body .navbar-nav .nav-link.active {
    color: #48547B !important;
  }
  .navbar-collapse.offcanvas .offcanvas-body .navbar-nav > li > a {
    position: relative;
    padding: 1rem;
  }
  .navbar-collapse.offcanvas .offcanvas-body .navbar-nav > li > a img {
    max-width: 3.25rem;
    width: 100%;
  }
  .navbar-collapse.offcanvas .offcanvas-body .navbar-nav > li > a .nav-title {
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1;
    color: #000 !important;
    margin-left: 1rem;
    padding: 0.4rem 0.5rem 0.3rem;
  }
  .navbar-collapse.offcanvas .offcanvas-body .navbar-nav > li > a:after {
    content: "" !important;
  }
  .navbar-collapse.offcanvas .offcanvas-body .navbar-nav > li > a:hover .nav-title, .navbar-collapse.offcanvas .offcanvas-body .navbar-nav > li > a.active .nav-title {
    color: #DB0032 !important;
  }
}
/*
=================================================================
(#m02-2fts) FOOTER
=================================================================
*/
footer {
  background: linear-gradient(0deg, #91C3AA calc(100% - 3.65rem), transparent 3.65rem);
  margin-top: 6rem;
}
footer .footer-wrapper {
  position: relative;
  background: transparent;
  background-repeat: no-repeat;
}
footer .footer-wrapper > .container-xxl {
  position: relative;
  background: url("../img/footer/foot_bg_02.svg") 100% 0% no-repeat;
  padding-top: 5.85rem;
  padding-bottom: 2rem;
}
footer .footer-wrapper .social-link {
  border-radius: 50%;
  background: #ffffff;
}
footer .footer-wrapper .social-link:hover {
  background: rgba(255, 255, 255, 0.5);
}
footer .footer-wrapper .footer-info-box {
  line-height: 1.8;
}
footer .footer-wrapper a {
  color: #000;
}
footer .footer-wrapper a:hover {
  text-decoration: underline;
}
footer .footer-wrapper .copyright-area {
  color: rgba(0, 0, 0, 0.5);
  font-size: 0.7rem;
}
footer .footer-wrapper .copyright-area a {
  color: rgba(0, 0, 0, 0.5);
}
footer .footer-wrapper .copyright-area a:hover {
  text-decoration: underline;
}
footer.no-margin-top {
  margin-top: 0rem;
}
footer.no-top-spec {
  background: linear-gradient(0deg, #91C3AA calc(100% - 3.65rem), #FAF1D6 3.65rem);
}
footer.no-top-spec .footer-wrapper > .container-xxl {
  background: url("../img/footer/foot_bg_02-2.svg") 100% 0% no-repeat #91C3AA;
}
@media screen and (min-width: 768px) {
  footer {
    background: linear-gradient(0deg, #F8DF8D calc(100% - 2.3rem), transparent 2.3rem);
  }
  footer .footer-wrapper {
    background: linear-gradient(90deg, #91C3AA 50%, transparent 50%);
  }
  footer .footer-wrapper > .container-xxl {
    background: url("../img/footer/foot_bg_01.svg") 100% 0% no-repeat #91C3AA;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    padding-right: 11.5rem;
  }
  footer.no-top-spec {
    background: linear-gradient(0deg, #F8DF8D calc(100% - 2.3rem), #FAF1D6 2.3rem);
  }
  footer.no-top-spec .footer-wrapper > .container-xxl {
    background: url("../img/footer/foot_bg_01-2.svg") 100% 0% no-repeat #91C3AA;
  }
}

/*
=================================================================
(#m03mcs) MAIN CONTENT
=================================================================
*/
.loading-page {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  color: #FFF;
  z-index: 1050;
  background: #FFF;
}
.loading-page .wrapper {
  width: 10rem;
  height: 3rem;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) translate(0px, -120px);
  text-align: center;
}
.loading-page .wrapper span {
  font-family: "AndesRounded", "Arial";
  font-size: 1rem;
  letter-spacing: 12px;
  color: #90644c;
  display: block;
  text-align: center;
  margin-top: 30px;
}

.lds-ellipsis {
  display: inline-block;
  position: relative;
  width: 4rem;
  height: 4rem;
}

.lds-ellipsis div {
  position: absolute;
  top: 1rem;
  width: 0.65rem;
  height: 0.65rem;
  border-radius: 50%;
  background: #00BED6;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis div:nth-child(1) {
  left: 0.4rem;
  animation: lds-ellipsis1 0.6s infinite;
}

.lds-ellipsis div:nth-child(2) {
  left: 0.4rem;
  animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(3) {
  left: 1.6rem;
  animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(4) {
  left: 2.8rem;
  animation: lds-ellipsis3 0.6s infinite;
}

@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(24px, 0);
  }
}
.page-banner-wrapper {
  background: #FAF1D6;
  overflow: hidden;
}
.page-banner-wrapper .banner-container {
  position: relative;
}
.page-banner-wrapper.is-spec-detail {
  height: 10rem;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: unset;
}
.page-banner-wrapper.is-spec-detail > .container-md {
  position: relative;
}
.page-banner-wrapper.is-spec-detail > .container-md:before {
  content: "";
  display: block;
  position: absolute;
  top: -3rem;
  left: 80%;
  width: 19.25rem;
  height: 17rem;
  background: url("../img/home/content_top_bg_01.svg") 0% 0% no-repeat;
  background-size: 100%;
}
@media screen and (min-width: 500px) {
  .page-banner-wrapper .banner-container {
    position: relative;
  }
}
.page-banner-wrapper .banner-box {
  position: relative;
  z-index: 5;
}
.page-banner-wrapper .banner-box .banner-img {
  margin-top: 0.8rem;
  position: relative;
}
.page-banner-wrapper .title-box {
  color: #000;
  font-family: "Noto Sans TC";
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 1rem;
}
.page-banner-wrapper .desc-box {
  color: #000;
  font-size: 0.8rem;
  line-height: 1.6;
}
.page-banner-wrapper .banner-intro-box {
  padding: 1.5rem 1rem;
  position: relative;
  z-index: 5;
}
@media screen and (min-width: 768px) {
  .page-banner-wrapper {
    background: linear-gradient(180deg, #FAF1D6 calc(100% - 1rem), transparent 1rem);
  }
  .page-banner-wrapper .banner-container:before {
    content: unset;
  }
  .page-banner-wrapper .banner-box {
    position: relative;
    padding-bottom: 41%;
  }
  .page-banner-wrapper .banner-box .banner-img {
    position: absolute;
    top: 0;
    bottom: 1%;
    left: 39.5%;
    margin: 0;
    padding: 0rem 0 0rem;
  }
  .page-banner-wrapper .banner-box .banner-img picture {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  .page-banner-wrapper .banner-box .banner-img picture img {
    width: unset;
    height: 100%;
    max-height: 100%;
    max-width: unset;
    margin-left: auto;
    margin-right: auto;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .page-banner-wrapper .title-box {
    color: #000;
    font-family: "Noto Sans TC";
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 1rem;
  }
  .page-banner-wrapper .desc-box {
    width: 14rem;
    color: #000;
    font-size: 0.8rem;
    line-height: 1.6;
  }
  .page-banner-wrapper .banner-intro-box {
    padding: 0rem;
    width: 20rem;
    position: absolute;
    top: 50%;
    left: 6%;
    transform: translateY(-50%);
    z-index: 5;
  }
}
@media screen and (min-width: 992px) {
  .page-banner-wrapper .banner-box {
    padding-bottom: calc((450 / 1200) * 100%);
  }
  .page-banner-wrapper .banner-box .banner-img {
    left: 31%;
    bottom: 0%;
  }
  .page-banner-wrapper .banner-box .banner-img picture {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  .page-banner-wrapper .banner-box .banner-img picture img {
    width: unset;
    height: 100%;
    max-height: 100%;
    max-width: unset;
    margin-left: auto;
    margin-right: auto;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .page-banner-wrapper .title-box {
    color: #000;
    font-family: "Noto Sans TC";
    font-size: 2rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 1rem;
  }
  .page-banner-wrapper .desc-box {
    width: 14rem;
    color: #000;
    font-size: 0.8rem;
    line-height: 1.6;
  }
  .page-banner-wrapper .banner-intro-box {
    width: 20rem;
    position: absolute;
    top: 50%;
    left: 8%;
    transform: translateY(-50%);
    z-index: 5;
  }
}
@media screen and (min-width: 1200px) {
  .page-banner-wrapper .banner-intro-box {
    width: 20rem;
    position: absolute;
    top: 50%;
    left: 10%;
    transform: translateY(-50%);
    z-index: 5;
  }
  .page-banner-wrapper .banner-intro-box .title-box {
    color: #000;
    font-family: "Noto Sans TC";
    font-size: 2rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 1rem;
  }
  .page-banner-wrapper .banner-intro-box .desc-box {
    width: 14rem;
    color: #000;
    font-size: 0.8rem;
    line-height: 1.6;
  }
  .page-banner-wrapper .banner-box {
    width: 100%;
    height: 22.3rem;
    padding-bottom: 0;
    position: relative;
  }
  .page-banner-wrapper .banner-box .banner-img {
    left: 34%;
    text-align: center;
  }
}
@media screen and (min-width: 1400px) {
  .page-banner-wrapper .banner-container {
    position: relative;
    max-width: 1320px;
    padding-right: var(--bs-gutter-x, 0.75rem);
    padding-left: var(--bs-gutter-x, 0.75rem);
    margin-right: auto;
    margin-left: auto;
  }
  .page-banner-wrapper .banner-box .banner-img {
    left: 35%;
  }
}

.detail-banner-info .info-meta {
  margin-bottom: 0.6rem;
}
.detail-banner-info .detail-title {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 0;
}
@media screen and (min-width: 992px) {
  .detail-banner-info {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

.breadcrumbs {
  position: relative;
  font-size: 0.7rem;
  font-weight: 400;
  line-height: 1.3;
  color: #000;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.breadcrumbs span.active {
  color: #DB0032;
}
.breadcrumbs .home-icon {
  padding-bottom: 0.15rem;
  margin-right: 0.3rem;
}
.breadcrumbs a {
  color: #000;
}
.breadcrumbs a:hover {
  color: #000;
}
.breadcrumbs i {
  font-size: 0.7rem;
  margin-left: 0.3rem;
  margin-right: 0.3rem;
}
.breadcrumbs span.path-arrow {
  background: url(../img/breadcrumb/path_arrow@2x.png) no-repeat center;
  background-size: 100% auto;
  width: 0.3rem;
  height: 0.4rem;
  margin-left: 0.4rem;
  margin-right: 0.4rem;
}
@media screen and (min-width: 1200px) {
  .breadcrumbs.is-detail, .breadcrumbs.is-search-detail {
    padding-left: 3.75rem;
    padding-right: 3.75rem;
  }
}
@media screen and (min-width: 1400px) {
  .breadcrumbs.is-detail, .breadcrumbs.is-search-detail {
    padding-left: 7.65rem;
    padding-right: 7.65rem;
  }
}

.share-box {
  position: relative;
  min-width: 5.9rem;
}
.share-box:before {
  content: "";
  width: 1.25rem;
  height: 1.4rem;
  background: url("../img/share/icon_share@2x.png") center no-repeat;
  background-size: 100% auto;
  margin-right: 0.75rem;
}
.share-box .share-btn {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  text-indent: -100rem;
  overflow: hidden;
}
.share-box .share-btn + .share-btn {
  margin-left: 0.4rem;
}
.share-box .share-btn.share-fb {
  background: url(../img/share/button_share_fb@2x.png) no-repeat center;
  background-size: 100% auto;
}
.share-box .share-btn.share-fb:hover {
  background: url(../img/share/button_share_fb_hover@2x.png) no-repeat center;
  background-size: 100% auto;
}
.share-box .share-btn.share-line {
  background: url(../img/share/button_share_line@2x.png) no-repeat center;
  background-size: 100% auto;
}
.share-box .share-btn.share-line:hover {
  background: url(../img/share/button_share_line_hover@2x.png) no-repeat center;
  background-size: 100% auto;
}

.swiper-controls {
  position: absolute !important;
  pointer-events: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.swiper-controls .swiper-navigation {
  pointer-events: all;
}
.swiper-controls .swiper-navigation .swiper-button {
  background: #00BED6;
  color: #fff;
  border: 0;
  box-shadow: unset;
  width: 2.5rem;
  height: 2.5rem;
  line-height: inherit;
  border-radius: 0.85rem;
  text-shadow: none;
}
.swiper-controls .swiper-navigation .swiper-button:hover {
  background: #007DB2;
}
.swiper-controls .swiper-navigation .swiper-button:focus {
  outline: 0;
}
.swiper-controls .swiper-navigation .swiper-button:after {
  font-size: 1.4rem;
}
.swiper-controls .swiper-navigation .swiper-button.swiper-button-prev {
  left: -1.25rem;
}
.swiper-controls .swiper-navigation .swiper-button.swiper-button-next {
  right: -1.25rem;
}
.swiper-controls .swiper-navigation .swiper-button.swiper-button-disabled {
  background: #00BED6;
}

.post-content {
  margin-bottom: 2.25rem;
}
@media screen and (min-width: 768px) {
  .post-content {
    margin-bottom: 3.25rem;
  }
}

.post-content, #tinymce {
  overflow: visible;
}

.info-meta {
  list-style: none;
  padding: 0;
  margin: 0;
}

.detail-wrapper {
  position: relative;
}
.detail-wrapper .att-area {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: start;
  align-items: center;
  margin-bottom: 0.5rem;
}
.detail-wrapper .att-area .label-box {
  padding: 0.5rem 0.85rem 0.3rem;
  align-items: center;
  color: #00BED6;
  border-radius: 0.5rem;
  background: #fff;
  font-size: 1rem;
  font-weight: 700;
}
.detail-wrapper .att-area .date-box {
  font-family: "Baloo Tamma 2";
  font-size: 1rem;
  color: #00BED6;
  padding-top: 0.5rem;
}
.detail-wrapper h1.article-title {
  color: #000;
  font-size: 32px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 0.5rem;
}
.detail-wrapper .article-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: left;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
  color: #959595;
  font-size: 0.7rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}
.detail-wrapper .article-meta .info-member {
  position: relative;
  padding-left: 1rem;
}
.detail-wrapper .article-meta .info-member:before {
  content: "";
  display: block;
  position: absolute;
  left: 0rem;
  top: 0.08rem;
  width: 0.75rem;
  height: 0.75rem;
  background: url("../img/list/icon_member_01.svg") 0% 0% no-repeat;
  background-size: 100%;
}
.detail-wrapper .article-meta .info-cat {
  position: relative;
  padding-left: 0.8rem;
}
.detail-wrapper .article-meta .info-cat:before {
  content: "";
  display: block;
  position: absolute;
  left: 0rem;
  top: 0.08rem;
  width: 0.75rem;
  height: 0.75rem;
  background: url("../img/list/icon_cat_01.svg") 0% 0% no-repeat;
  background-size: 100%;
}
.detail-wrapper .article-meta .info-date {
  position: relative;
  padding-left: 0.8rem;
}
.detail-wrapper .article-meta .info-date:before {
  content: "";
  display: block;
  position: absolute;
  left: 0rem;
  top: 0.08rem;
  width: 0.75rem;
  height: 0.75rem;
  background: url("../img/list/icon_calender_02.svg") 0% 0% no-repeat;
  background-size: 100%;
}
.detail-wrapper .label-title-box {
  margin-bottom: 0.75rem;
}
.detail-wrapper .label-title-box .label-title {
  position: relative;
  height: 2rem;
  padding: 0.5rem 0.2rem 0.5rem 0.5rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  color: #FFF;
  background-color: #F3CB18;
  margin-bottom: 0;
  margin-right: 1rem;
}
.detail-wrapper .label-title-box .label-title:after {
  content: "";
  position: absolute;
  top: 0;
  right: -1rem;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 1rem 0 1rem 1rem;
  border-color: transparent transparent transparent #F3CB18;
}
.detail-wrapper .article-img-area {
  margin-bottom: 2rem;
}
.detail-wrapper .article-img-area img {
  border-radius: 1.5rem;
}
.detail-wrapper .article-content-area {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.detail-wrapper .article-content-area img {
  border-radius: 1.5rem;
}
.detail-wrapper .article-content-area .subject-title {
  font-size: 1.6rem;
  padding-left: 1rem;
  position: relative;
}
.detail-wrapper .article-content-area .subject-title:before {
  content: "";
  display: block;
  position: absolute;
  top: 0rem;
  left: 0;
  width: 0.25rem;
  height: 100%;
  background: #DB0032;
  border-radius: 0.6rem;
}
.detail-wrapper .article-content-area .articles-video .media-desc, .detail-wrapper .article-content-area .articles-img .media-desc {
  position: relative;
  padding-left: 1.25rem;
}
.detail-wrapper .article-content-area .articles-video .media-desc:before, .detail-wrapper .article-content-area .articles-img .media-desc:before {
  content: "";
  display: block;
  position: absolute;
  left: 0.15rem;
  top: 0.4rem;
  width: 0.4rem;
  height: 0.4rem;
  background-color: #00BED6;
  border-radius: 50%;
}
.detail-wrapper .article-content-area .swiper-controls .swiper-navigation .swiper-button.swiper-button-prev {
  left: 0rem;
  top: calc(100% - 0.25rem);
}
.detail-wrapper .article-content-area .swiper-controls .swiper-navigation .swiper-button.swiper-button-next {
  right: unset;
  left: 3rem;
  top: calc(100% - 0.25rem);
}
@media screen and (min-width: 576px) {
  .detail-wrapper .article-content-area .swiper-controls .swiper-navigation .swiper-button.swiper-button-prev {
    left: 3rem;
    top: calc(100% - 0.25rem);
  }
  .detail-wrapper .article-content-area .swiper-controls .swiper-navigation .swiper-button.swiper-button-next {
    right: unset;
    left: 6rem;
    top: calc(100% - 0.25rem);
  }
}
@media screen and (min-width: 768px) {
  .detail-wrapper .article-content-area .swiper-controls .swiper-navigation .swiper-button.swiper-button-prev {
    top: calc(100% - 0.25rem);
    left: 1.5rem;
  }
  .detail-wrapper .article-content-area .swiper-controls .swiper-navigation .swiper-button.swiper-button-next {
    top: calc(100% - 0.25rem);
    left: 4.5rem;
  }
}
@media screen and (min-width: 992px) {
  .detail-wrapper .article-content-area .swiper-controls .swiper-navigation .swiper-button.swiper-button-prev {
    top: calc(100% - 0.25rem);
    left: 1.5rem;
  }
  .detail-wrapper .article-content-area .swiper-controls .swiper-navigation .swiper-button.swiper-button-next {
    top: calc(100% - 0.25rem);
    left: 4.5rem;
  }
}
@media screen and (min-width: 1200px) {
  .detail-wrapper .article-content-area .swiper-controls .swiper-navigation .swiper-button.swiper-button-prev {
    top: calc(100% - 0.25rem);
    left: 1.5rem;
  }
  .detail-wrapper .article-content-area .swiper-controls .swiper-navigation .swiper-button.swiper-button-next {
    top: calc(100% - 0.25rem);
    left: 4.5rem;
  }
}
.detail-wrapper .article-content-area .banner-img-area img, .detail-wrapper .article-content-area .media-content img, .detail-wrapper .article-content-area .articles-img img {
  border-radius: 1.5rem;
}
.detail-wrapper .article-content-area.bg-01 {
  background: url("../img/about/about_bg_01.svg") 50% 100% no-repeat;
  background-size: 240%;
}
.detail-wrapper .article-content-area.bg-01:after {
  content: unset;
}
@media screen and (min-width: 375px) {
  .detail-wrapper .article-content-area.bg-01 {
    background: url("../img/about/about_bg_01.svg") 50% 100% no-repeat;
    background-size: 190%;
  }
}
@media screen and (min-width: 480px) {
  .detail-wrapper .article-content-area.bg-01 {
    background: url("../img/about/about_bg_01.svg") 50% 100% no-repeat;
    background-size: 150%;
  }
}
@media screen and (min-width: 576px) {
  .detail-wrapper .article-content-area.bg-01 {
    background: url("../img/about/about_bg_01.svg") 50% 100% no-repeat;
    background-size: 38rem;
  }
}
@media screen and (min-width: 768px) {
  .detail-wrapper .article-content-area.bg-01 {
    background: url("../img/about/about_bg_01.svg") 50% 100% no-repeat;
    background-size: 40rem;
  }
}
@media screen and (min-width: 992px) {
  .detail-wrapper .article-content-area.bg-01 {
    background: unset;
  }
}
.detail-wrapper .article-content-area.bg-02 {
  background: url("../img/about/about_bg_02.svg") left -4.5rem top 100% no-repeat;
  background-size: auto 95%;
}
.detail-wrapper .article-content-area.bg-02:after {
  content: unset;
}
@media screen and (min-width: 375px) {
  .detail-wrapper .article-content-area.bg-02 {
    background: url("../img/about/about_bg_02.svg") left -4.5rem top 100% no-repeat;
    background-size: auto 95%;
  }
}
@media screen and (min-width: 480px) {
  .detail-wrapper .article-content-area.bg-02 {
    background: url("../img/about/about_bg_02.svg") left -4.5rem top 100% no-repeat;
    background-size: auto 95%;
  }
}
@media screen and (min-width: 576px) {
  .detail-wrapper .article-content-area.bg-02 {
    background: url("../img/about/about_bg_02.svg") left -4.8rem top 100% no-repeat;
    background-size: auto 90%;
  }
}
@media screen and (min-width: 768px) {
  .detail-wrapper .article-content-area.bg-02 {
    background: url("../img/about/about_bg_02.svg") left -5.5rem top 100% no-repeat;
    background-size: auto 90%;
  }
}
@media screen and (min-width: 992px) {
  .detail-wrapper .article-content-area.bg-02 {
    background: unset;
  }
}
.detail-wrapper .article-content-area.bg-03 {
  background: url("../img/about/about_bg_03.svg") 50% 100% no-repeat;
  background-size: 150%;
}
.detail-wrapper .article-content-area.bg-03:after {
  content: unset;
}
@media screen and (min-width: 375px) {
  .detail-wrapper .article-content-area.bg-03 {
    background: url("../img/about/about_bg_03.svg") 50% 100% no-repeat;
    background-size: 140%;
  }
}
@media screen and (min-width: 480px) {
  .detail-wrapper .article-content-area.bg-03 {
    background: url("../img/about/about_bg_03.svg") 50% 100% no-repeat;
    background-size: 120%;
  }
}
@media screen and (min-width: 576px) {
  .detail-wrapper .article-content-area.bg-03 {
    background: url("../img/about/about_bg_03.svg") 50% 100% no-repeat;
    background-size: 38rem;
  }
}
@media screen and (min-width: 768px) {
  .detail-wrapper .article-content-area.bg-03 {
    background: url("../img/about/about_bg_03.svg") 50% 100% no-repeat;
    background-size: 40rem;
  }
}
@media screen and (min-width: 992px) {
  .detail-wrapper .article-content-area.bg-03 {
    background: unset;
  }
}
.detail-wrapper .article-content-area .media-content {
  display: flex;
  justify-content: start;
  align-items: center;
}
.detail-wrapper .article-content-area .media-content p {
  margin-bottom: 0;
}
.detail-wrapper .article-content-area .media-content.bg-01 h3 {
  font-size: 1.2rem;
  color: #000;
}
.detail-wrapper .article-content-area .media-content.bg-01 a {
  color: #00BED6;
  text-decoration: none;
}
.detail-wrapper .article-content-area .media-content.bg-01 a:hover {
  color: #00BED6;
  text-decoration: none;
}
@media screen and (min-width: 992px) {
  .detail-wrapper .article-content-area .media-content.bg-01 {
    min-height: 20rem;
    background: url("../img/about/about_bg_01.svg") 100% 50% no-repeat;
    background-size: contain;
  }
  .detail-wrapper .article-content-area .media-content.bg-01 .content-row {
    display: flex;
    flex-direction: row;
    gap: 1.2rem;
  }
  .detail-wrapper .article-content-area .media-content.bg-01 .content-row .img-box {
    width: 100%;
    max-width: 4.5rem;
  }
}
@media screen and (min-width: 1200px) {
  .detail-wrapper .article-content-area .media-content.bg-01 {
    min-height: 24rem;
  }
}
@media screen and (min-width: 1400px) {
  .detail-wrapper .article-content-area .media-content.bg-01 {
    min-height: 26rem;
  }
}
.detail-wrapper .article-content-area .media-content.bg-02 h3 {
  font-size: 1.2rem;
  color: #000;
}
.detail-wrapper .article-content-area .media-content.bg-02 a {
  color: #CEA007;
  text-decoration: none;
}
.detail-wrapper .article-content-area .media-content.bg-02 a:hover {
  color: #CEA007;
  text-decoration: none;
}
@media screen and (min-width: 992px) {
  .detail-wrapper .article-content-area .media-content.bg-02 {
    min-height: 35rem;
    background: url("../img/about/about_bg_02.svg") 10% 50% no-repeat;
    background-size: contain;
  }
  .detail-wrapper .article-content-area .media-content.bg-02 .content-row {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
  }
  .detail-wrapper .article-content-area .media-content.bg-02 .content-row .img-box {
    width: 100%;
    max-width: 5.5rem;
  }
}
@media screen and (min-width: 1200px) {
  .detail-wrapper .article-content-area .media-content.bg-02 {
    background: url("../img/about/about_bg_02.svg") 12% 50% no-repeat;
    background-size: contain;
    min-height: 35rem;
  }
}
.detail-wrapper .article-content-area .media-content.bg-03 h3 {
  font-size: 1.2rem;
  color: #000;
}
.detail-wrapper .article-content-area .media-content.bg-03 a {
  color: #AEA588;
  text-decoration: none;
}
.detail-wrapper .article-content-area .media-content.bg-03 a:hover {
  color: #AEA588;
  text-decoration: none;
}
@media screen and (min-width: 992px) {
  .detail-wrapper .article-content-area .media-content.bg-03 {
    min-height: 25rem;
    background: url("../img/about/about_bg_03.svg") 100% 50% no-repeat;
    background-size: contain;
  }
  .detail-wrapper .article-content-area .media-content.bg-03 .content-row {
    display: flex;
    flex-direction: row;
    gap: 1.2rem;
  }
  .detail-wrapper .article-content-area .media-content.bg-03 .content-row .img-box {
    width: 100%;
    max-width: 4.5rem;
  }
}
@media screen and (min-width: 1200px) {
  .detail-wrapper .article-content-area .media-content.bg-03 {
    min-height: 25rem;
    background: url("../img/about/about_bg_03.svg") 88% 50% no-repeat;
    background-size: contain;
  }
}
@media screen and (min-width: 1400px) {
  .detail-wrapper .article-content-area .media-content.bg-03 {
    min-height: 27rem;
  }
}
.detail-wrapper .article-content-area .media-box img {
  border-radius: 1.5rem;
}
.detail-wrapper .detail-header {
  margin-bottom: 1.5rem;
}
.detail-wrapper .detail-header img {
  border-radius: 1.5rem;
}
.detail-wrapper .post-footer {
  position: relative;
  text-align: center;
}
.detail-wrapper .post-footer .btn {
  margin-top: 2.25rem;
}
@media screen and (min-width: 768px) {
  .detail-wrapper .post-footer .share-box {
    position: absolute;
    top: calc(50% - 0.875rem);
    left: 0;
    margin-bottom: 0;
  }
  .detail-wrapper .post-footer .btn {
    margin-top: 0;
  }
}
@media screen and (min-width: 1200px) {
  .detail-wrapper .container-md {
    padding-left: 4.5rem;
    padding-right: 4.5rem;
  }
  .detail-wrapper.type2 .container-md {
    padding-left: 4.5rem;
    padding-right: 4.5rem;
  }
}
@media screen and (min-width: 1400px) {
  .detail-wrapper .container-md {
    padding-left: 8.5rem;
    padding-right: 8.5rem;
  }
  .detail-wrapper.type2 .container-md {
    padding-left: 7.5rem;
    padding-right: 7.5rem;
  }
}

.article-extra-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
.article-extra-info .extra-info-box {
  background: #fff;
  border-radius: 1rem;
  width: 100%;
  padding: 1.2rem 1.6rem 1.1rem;
}
.article-extra-info .extra-info-box ul {
  margin: 0;
}
.article-extra-info .join-line-box {
  background: #00BED6;
  border-radius: 10rem 20rem 20rem 20rem;
  padding: 1.9rem 2.1rem 1.9rem 2.1rem;
  color: #fff;
  font-size: 0.85rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
  max-width: 21rem;
  z-index: 1;
}
.article-extra-info .join-line-box.ps-rb {
  margin-top: -3rem;
}
.article-extra-info .join-line-box .content-row {
  display: flex;
  gap: 1.2rem;
}
.article-extra-info .join-line-box .content-row .img-box {
  width: 100%;
  max-width: 3.5rem;
}
.article-extra-info .join-line-box .content-row .img-box img {
  width: 100%;
}
.article-extra-info .join-class-box {
  background: #D78D89;
  border-radius: 20rem 20rem 20rem 10rem;
  padding: 1.9rem 2.1rem 1.9rem 2.1rem;
  color: #fff;
  font-size: 0.85rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
  max-width: 21rem;
  z-index: 1;
}
.article-extra-info .join-class-box .content-row {
  display: flex;
  gap: 1.2rem;
}
.article-extra-info .join-class-box .content-row .img-box {
  width: 100%;
  max-width: 3.5rem;
}
.article-extra-info .join-class-box .content-row .img-box img {
  width: 100%;
}
.article-extra-info .view-intro-box {
  background: #D1CCBD;
  border-radius: 20rem 20rem 10rem 20rem;
  padding: 1.9rem 2.1rem 1.9rem 2.1rem;
  color: #fff;
  font-size: 0.85rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
  max-width: 21rem;
  z-index: 1;
}
.article-extra-info .view-intro-box .content-row {
  display: flex;
  gap: 1.2rem;
}
.article-extra-info .view-intro-box .content-row .img-box {
  width: 100%;
  max-width: 5rem;
}
.article-extra-info .view-intro-box .content-row .img-box img {
  width: 100%;
}
@media screen and (min-width: 768px) {
  .article-extra-info .join-line-box.ps-rb {
    position: absolute;
    right: 0;
    bottom: 0;
  }
}
@media screen and (min-width: 992px) {
  .article-extra-info {
    flex-direction: row;
    gap: 2rem;
  }
  .article-extra-info.gap-0 {
    gap: 0;
  }
  .article-extra-info.more-pd {
    padding-left: 3rem;
    padding-right: 3rem;
  }
  .article-extra-info .join-line-box, .article-extra-info .join-class-box, .article-extra-info .view-intro-box {
    padding: 2.9rem 3.1rem 2.9rem 4.5rem;
    color: #fff;
    font-size: 0.85rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5;
    max-width: 23rem;
    z-index: 1;
  }
  .article-extra-info .join-line-box .content-row, .article-extra-info .join-class-box .content-row, .article-extra-info .view-intro-box .content-row {
    display: flex;
    gap: 1.2rem;
  }
  .article-extra-info .join-line-box .content-row .img-box, .article-extra-info .join-class-box .content-row .img-box, .article-extra-info .view-intro-box .content-row .img-box {
    width: 100%;
    max-width: 4.5rem;
  }
  .article-extra-info .join-line-box .content-row .img-box img, .article-extra-info .join-class-box .content-row .img-box img, .article-extra-info .view-intro-box .content-row .img-box img {
    width: 100%;
  }
  .article-extra-info .join-class-box {
    padding: 3.5rem 4.4rem;
  }
  .article-extra-info .view-intro-box {
    padding: 3.5rem 3.6rem;
  }
  .article-extra-info .view-intro-box .content-row .img-box {
    max-width: 6.25rem;
  }
  .article-extra-info .extra-info-box {
    border-radius: 2rem;
    padding: 1.75rem 2.5rem;
    width: auto;
  }
}
@media screen and (min-width: 1200px) {
  .article-extra-info.more-pd {
    padding-left: 4rem;
    padding-right: 4rem;
  }
}

.extra-media-box {
  position: relative;
  margin-bottom: 0.9rem;
  width: 100%;
}
.extra-media-box.mask-media figure {
  position: relative;
  padding-bottom: 74%;
  width: 100%;
  /*mask image*/
  mask-image: url("../img/list/list_bg_mask_01.svg");
  -webkit-mask-image: url("../img/list/list_bg_mask_01.svg");
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: cover;
  -webkit-mask-size: cover;
  overflow: hidden;
}
.extra-media-box.mask-media figure img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: 100% !important;
  -o-object-fit: cover;
     object-fit: cover;
}
.extra-media-box.map-media {
  border-top: 1rem solid #FFF;
  border-bottom: 1rem solid #FFF;
}
.extra-media-box.map-media iframe {
  width: 100%;
  height: 18.75rem;
}
@media screen and (min-width: 768px) {
  .extra-media-box.map-media {
    border-radius: 1rem;
    border: 1rem solid #FFF;
  }
  .extra-media-box.map-media iframe {
    width: 100%;
    height: 25rem;
  }
}
.extra-media-box.sm-full-area {
  margin-left: -0.75rem;
  margin-right: -0.75rem;
  width: calc(100% + 1.5rem);
}
.extra-media-box.sm-full-area figure {
  mask-image: unset;
  -webkit-mask-image: unset;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .extra-media-box.sm-full-area.mask-media figure {
    position: relative;
    padding-bottom: 74%;
    width: 100%;
    /*mask image*/
    mask-image: url("../img/list/list_bg_mask_01.svg");
    -webkit-mask-image: url("../img/list/list_bg_mask_01.svg");
    mask-position: center;
    -webkit-mask-position: center;
    mask-size: cover;
    -webkit-mask-size: cover;
    overflow: hidden;
  }
  .extra-media-box.sm-full-area.mask-media figure img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100% !important;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .extra-media-box.sm-full-area.mask-media.map-media figure img {
    border-radius: 20px;
    border: 20px solid #FFF;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100% !important;
    -o-object-fit: cover;
       object-fit: cover;
  }
}

.article-class-calendar {
  position: relative;
}
.article-class-calendar:before {
  content: "";
  display: block;
  position: absolute;
  top: 1.8rem;
  right: -10%;
  width: 120%;
  height: calc(100% - 1.8rem);
  background: #F8DF8D;
  border-radius: 14rem;
  z-index: -1;
}
@media screen and (min-width: 768px) {
  .article-class-calendar:before {
    content: "";
    display: block;
    position: absolute;
    top: 1.8rem;
    right: -10%;
    width: 120%;
    height: calc(100% - 1.8rem);
    background: #F8DF8D;
    border-radius: 15rem;
  }
}
@media screen and (min-width: 992px) {
  .article-class-calendar:before {
    content: "";
    display: block;
    position: absolute;
    top: 1.5rem;
    right: 30%;
    width: 86%;
    height: calc(100% - 1.5rem);
    background: #F8DF8D;
    border-radius: 15rem;
  }
}
@media screen and (min-width: 1200px) {
  .article-class-calendar:before {
    content: "";
    display: block;
    position: absolute;
    top: 2.5rem;
    right: 30%;
    width: 82%;
    height: calc(100% - 2.5rem);
    background: #F8DF8D;
    border-radius: 15rem;
  }
}
@media screen and (min-width: 1400px) {
  .article-class-calendar:before {
    content: "";
    display: block;
    position: absolute;
    top: 2.5rem;
    right: 30%;
    width: 75%;
    height: calc(100% - 2.5rem);
    background: #F8DF8D;
    border-radius: 15rem;
  }
}

.class-area {
  display: flex;
  gap: 0.5rem;
  flex-direction: column;
}
.class-area .action-date-box {
  display: flex;
  gap: 0.5rem;
  flex-direction: column;
}
.class-area .date-title {
  font-family: "Baloo Tamma 2";
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 400;
}
.class-area a .class-title {
  color: #000 !important;
}
.class-area a:hover .class-title {
  color: #db0032 !important;
}
.class-area .class-box {
  background: #FAF1D6;
  padding: 0.7rem;
  font-size: 0.7rem;
  border-radius: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  color: #000 !important;
}
.class-area .class-box .class-date {
  font-size: 0.7rem;
  line-height: 1;
  color: #00BED6;
  position: relative;
  padding-left: 1rem;
}
.class-area .class-box .class-date:before {
  content: "";
  display: block;
  position: absolute;
  left: 0rem;
  top: -0.05rem;
  width: 0.75rem;
  height: 0.75rem;
  background: url("../img/list/icon_calender_01.svg") 0% 0% no-repeat;
  background-size: 100%;
}
@media screen and (min-width: 992px) {
  .class-area .class-box {
    font-size: 0.85rem;
  }
}
.class-area .no-open-box {
  background: #E2DFD7;
  padding: 0.7rem;
  font-size: 0.7rem;
  border-radius: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.class-area .no-open-box .class-date {
  font-size: 0.7rem;
  line-height: 1;
  color: #6B6B6B;
  position: relative;
  padding-left: 1rem;
}
.class-area .no-open-box .class-date:before {
  content: "";
  display: block;
  position: absolute;
  left: 0rem;
  top: -0.05rem;
  width: 0.75rem;
  height: 0.75rem;
  background: url("../img/list/icon_calender_02.svg") 0% 0% no-repeat;
  background-size: 100%;
}
@media screen and (min-width: 992px) {
  .class-area .no-open-box {
    font-size: 0.85rem;
  }
}

.page-search-wrapper {
  position: relative;
}
.page-search-wrapper .page-cat-box {
  display: flex;
  flex-wrap: wrap;
  margin-left: -0.5rem;
  margin-right: -0.5rem;
  margin-top: -0.5rem;
}
.page-search-wrapper .page-cat-box .cat-item {
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1;
  color: #000;
  border-radius: 0.75rem;
  border: 0.05rem solid #F3CB18;
  background: #F8E9B4;
  padding: 0.45rem 0.55rem;
  margin-left: 0.5rem;
  margin-right: 0.5rem;
  margin-top: 0.5rem;
  cursor: pointer;
  transition: all 0.2s ease;
  flex: 0 0 auto;
  width: auto;
}
.page-search-wrapper .page-cat-box .cat-item input {
  display: none;
}
.page-search-wrapper .page-cat-box .cat-item:hover, .page-search-wrapper .page-cat-box .cat-item.active {
  background-color: #F3CB18;
}
.page-search-wrapper .select-item {
  width: 100%;
}
.page-search-wrapper .select-item + .select-item {
  margin-top: 0.75rem;
}
@media screen and (min-width: 992px) {
  .page-search-wrapper .select-item {
    width: 11.25rem;
  }
  .page-search-wrapper .select-item + .select-item {
    margin-top: 0;
  }
}

.jump-page-wrapper.page404 {
  padding-top: 10rem;
}
@media screen and (min-width: 768px) {
  .jump-page-wrapper.page404 {
    padding-top: 11rem;
  }
}

.home-banner-wrapper {
  background: linear-gradient(180deg, #FAF1D6 calc(100% - 1rem), transparent 1rem);
  overflow: hidden;
}
.home-banner-wrapper .banner-container {
  position: relative;
}
.home-banner-wrapper .banner-container:before {
  content: "";
  display: block;
  position: absolute;
  top: 58%;
  left: -22%;
  width: 7.5rem;
  height: 11rem;
  background: url("../img/home/home_banner_bg_01.svg") 0% 0% no-repeat;
  background-size: 100%;
  transform: scaleX(-1);
}
@media screen and (min-width: 500px) {
  .home-banner-wrapper .banner-container {
    position: relative;
  }
  .home-banner-wrapper .banner-container:before {
    content: "";
    display: block;
    position: absolute;
    top: 58%;
    left: -15%;
    width: 35vw;
    height: 36.05vw;
    background: url("../img/home/home_banner_bg_01.svg") 0% 0% no-repeat;
    background-size: 100%;
    transform: scaleX(-1);
  }
}
.home-banner-wrapper .banner-box {
  position: relative;
  width: 100%;
  right: 0;
  height: 79.696969697%;
  padding-left: 14.0625%;
  z-index: 5;
}
.home-banner-wrapper .banner-box .banner-img {
  margin-top: 0.8rem;
  padding: 0rem 0 79.7%;
  position: relative;
}
.home-banner-wrapper .banner-box .banner-img:before {
  content: "";
  display: block;
  position: absolute;
  bottom: -1rem;
  left: 2%;
  width: 43vw;
  height: 19.35vw;
  background: url("../img/home/home_banner_icon_01.svg") 0% 0% no-repeat;
  background-size: 100%;
}
.home-banner-wrapper .banner-box .banner-img:after {
  content: "";
  display: block;
  position: absolute;
  top: 8%;
  left: -10%;
  width: 22vw;
  height: 6.2766vw;
  background: url("../img/home/home_banner_icon_02.svg") 0% 0% no-repeat;
  background-size: 100%;
}
.home-banner-wrapper .banner-box .banner-img .pic-area {
  display: block;
  position: absolute;
  height: 100%;
  top: 0;
  left: 0;
  width: 100%;
  mask-image: url("../img/home/home_banner_bg_xs.svg");
  -webkit-mask-image: url("../img/home/home_banner_bg_xs.svg");
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: cover;
  -webkit-mask-size: cover;
  overflow: hidden;
}
.home-banner-wrapper .banner-box .banner-img .pic-area img {
  width: 100%;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  -o-object-fit: cover;
     object-fit: cover;
}
.home-banner-wrapper .banner-intro-box {
  padding: 1.5rem 1rem;
  position: relative;
  z-index: 5;
}
.home-banner-wrapper .banner-intro-box .title-box {
  color: #000;
  font-family: "Noto Sans TC";
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 1rem;
}
.home-banner-wrapper .banner-intro-box .desc-box {
  color: #000;
  font-size: 0.8rem;
  line-height: 1.6;
}
@media screen and (min-width: 768px) {
  .home-banner-wrapper .banner-container:before {
    content: unset;
  }
  .home-banner-wrapper .banner-box {
    position: relative;
    padding-bottom: 48%;
    height: auto;
    padding-left: 0;
  }
  .home-banner-wrapper .banner-box:before {
    content: "";
    display: block;
    position: absolute;
    top: 15%;
    left: -10%;
    width: 27vw;
    height: 27.81vw;
    background: url("../img/home/home_banner_bg_01.svg") 0% 0% no-repeat;
    background-size: 100%;
  }
  .home-banner-wrapper .banner-box .banner-img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 41.5%;
    margin: 0;
    padding: 0.75rem 0 1rem;
  }
  .home-banner-wrapper .banner-box .banner-img:before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0px;
    left: -8.5%;
    width: 20vw;
    height: 9vw;
    background: url("../img/home/home_banner_icon_01.svg") 0% 0% no-repeat;
    background-size: 100%;
  }
  .home-banner-wrapper .banner-box .banner-img:after {
    content: "";
    display: block;
    position: absolute;
    top: 8%;
    left: 8%;
    width: 10.8vw;
    height: 5.706vw;
    background: url("../img/home/home_banner_icon_02.svg") 0% 0% no-repeat;
    background-size: 100%;
  }
  .home-banner-wrapper .banner-box .banner-img .pic-area {
    display: block;
    position: relative;
    width: 69vw;
    height: 100%;
    mask-image: url("../img/home/home_banner_bg.svg");
    -webkit-mask-image: url("../img/home/home_banner_bg.svg");
    mask-position: center;
    -webkit-mask-position: center;
    mask-size: cover;
    -webkit-mask-size: cover;
    overflow: hidden;
  }
  .home-banner-wrapper .banner-box .banner-img .pic-area img {
    width: unset;
    height: 100%;
    max-height: 100%;
    max-width: unset;
    margin-left: auto;
    margin-right: auto;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .home-banner-wrapper .banner-intro-box {
    padding: 0rem;
    width: 20rem;
    position: absolute;
    top: 50%;
    left: 6%;
    transform: translateY(-50%);
    z-index: 5;
  }
  .home-banner-wrapper .banner-intro-box .title-box {
    color: #000;
    font-family: "Noto Sans TC";
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 1rem;
  }
  .home-banner-wrapper .banner-intro-box .desc-box {
    width: 14rem;
    color: #000;
    font-size: 0.8rem;
    line-height: 1.6;
  }
}
@media screen and (min-width: 992px) {
  .home-banner-wrapper .banner-box {
    padding-bottom: calc((480 / 1200) * 100%);
  }
  .home-banner-wrapper .banner-box .banner-img .pic-area {
    display: block;
    position: relative;
    width: 57vw;
    height: 100%;
    mask-image: url("../img/home/home_banner_bg.svg");
    -webkit-mask-image: url("../img/home/home_banner_bg.svg");
    mask-position: center;
    -webkit-mask-position: center;
    mask-size: cover;
    -webkit-mask-size: cover;
    overflow: hidden;
  }
  .home-banner-wrapper .banner-box .banner-img .pic-area img {
    width: unset;
    height: 100%;
    max-height: 100%;
    max-width: unset;
    margin-left: auto;
    margin-right: auto;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .home-banner-wrapper .banner-intro-box {
    width: 20rem;
    position: absolute;
    top: 50%;
    left: 8%;
    transform: translateY(-50%);
    z-index: 5;
  }
  .home-banner-wrapper .banner-intro-box .title-box {
    color: #000;
    font-family: "Noto Sans TC";
    font-size: 2rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 1rem;
  }
  .home-banner-wrapper .banner-intro-box .desc-box {
    width: 14rem;
    color: #000;
    font-size: 0.8rem;
    line-height: 1.6;
  }
}
@media screen and (min-width: 1200px) {
  .home-banner-wrapper .banner-intro-box {
    width: 20rem;
    position: absolute;
    top: 50%;
    left: 10%;
    transform: translateY(-50%);
    z-index: 5;
  }
  .home-banner-wrapper .banner-intro-box .title-box {
    color: #000;
    font-family: "Noto Sans TC";
    font-size: 2rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 1rem;
  }
  .home-banner-wrapper .banner-intro-box .desc-box {
    width: 14rem;
    color: #000;
    font-size: 0.8rem;
    line-height: 1.6;
  }
  .home-banner-wrapper .banner-box {
    width: 100%;
    height: 27rem;
    padding-bottom: 0;
    position: relative;
  }
  .home-banner-wrapper .banner-box:before {
    content: "";
    display: block;
    position: absolute;
    top: 15%;
    left: -10%;
    width: 16.25rem;
    height: 16.55rem;
    background: url("../img/home/home_banner_bg_01.svg") 0% 0% no-repeat;
    background-size: 100%;
  }
  .home-banner-wrapper .banner-box .banner-img {
    left: 41.2%;
    text-align: center;
  }
  .home-banner-wrapper .banner-box .banner-img .pic-area {
    display: block;
    position: relative;
    width: 39.4rem;
    height: 100%;
    mask-image: url("../img/home/home_banner_bg.svg");
    -webkit-mask-image: url("../img/home/home_banner_bg.svg");
    mask-position: center;
    -webkit-mask-position: center;
    mask-size: cover;
    -webkit-mask-size: cover;
    overflow: hidden;
  }
  .home-banner-wrapper .banner-box .banner-img .pic-area img {
    width: unset;
    height: 100%;
    max-height: 100%;
    max-width: unset;
    margin-left: auto;
    margin-right: auto;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .home-banner-wrapper .banner-box .banner-img:before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0px;
    left: -10%;
    width: 15rem;
    height: 6.75rem;
    background: url("../img/home/home_banner_icon_01.svg") 0% 0% no-repeat;
    background-size: 100%;
  }
  .home-banner-wrapper .banner-box .banner-img:after {
    content: "";
    display: block;
    position: absolute;
    top: 8%;
    left: 5%;
    width: 8.15rem;
    height: 2.325rem;
    background: url("../img/home/home_banner_icon_02.svg") 0% 0% no-repeat;
    background-size: 100%;
  }
  .home-banner-wrapper .banner-box .banner-img img {
    width: auto;
  }
}
@media screen and (min-width: 1400px) {
  .home-banner-wrapper .banner-container {
    position: relative;
    max-width: 1320px;
    padding-right: var(--bs-gutter-x, 0.75rem);
    padding-left: var(--bs-gutter-x, 0.75rem);
    margin-right: auto;
    margin-left: auto;
  }
  .home-banner-wrapper .banner-box .banner-img {
    left: 39%;
  }
}

.home-quick-link-wrapper .quick-link {
  display: flex;
  align-items: flex-start;
  text-align: center;
}
.home-quick-link-wrapper .quick-link + .quick-link {
  margin-left: 4rem;
}
.home-quick-link-wrapper .quick-link .quick-link-title {
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1;
  color: #715640;
  margin-top: 0.25rem;
  transition: color 0.2s, background-color 0.2s ease;
}
.home-quick-link-wrapper .quick-link.donate .quick-link-title {
  color: #FFF;
  background-color: #F3A9A9;
  border-radius: 1.7rem;
  padding: 1.1rem 1.1rem 0.9rem;
  margin-top: -0.7rem;
}
.home-quick-link-wrapper .quick-link:hover .quick-link-title {
  color: #E48D8D;
}
.home-quick-link-wrapper .quick-link:hover.donate .quick-link-title {
  color: #FFF;
  background-color: #E48D8D;
}

.home-about-wrapper {
  position: relative;
  margin-bottom: 0rem;
}
.home-about-wrapper .about-intro-box .editor-content {
  text-align: justify;
  max-width: 26.7rem;
}
.home-about-wrapper .role-img {
  padding: 1.75rem 1rem 2.07rem 1rem;
}
@media screen and (min-width: 768px) {
  .home-about-wrapper {
    padding-bottom: 10.72rem;
  }
  .home-about-wrapper .role-img {
    position: absolute;
    bottom: 1.77rem;
    right: calc(50% + 4.95rem);
    width: 8.4rem;
    height: 7.2rem;
    padding: 0;
  }
}
@media screen and (min-width: 992px) {
  .home-about-wrapper {
    padding-bottom: 4.65rem;
  }
  .home-about-wrapper .role-img {
    bottom: 1.9rem;
    right: calc(50% + 14.3rem);
    width: auto;
    height: auto;
  }
}

.home-video-wrapper {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
@media screen and (min-width: 992px) {
  .home-video-wrapper {
    flex-direction: row;
  }
}
.home-video-wrapper .media-wrapper {
  position: relative;
  cursor: pointer;
  padding-left: 1rem;
  padding-right: 1rem;
  max-width: 16rem;
  width: 100%;
  z-index: 2;
}
.home-video-wrapper .media-wrapper picture {
  display: block;
  position: relative;
  padding-bottom: 100%;
  max-width: 14rem;
  width: 100%;
  /*mask image*/
  mask-image: url("../img/home/index_video_frame.svg");
  -webkit-mask-image: url("../img/home/index_video_frame.svg");
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: cover;
  -webkit-mask-size: cover;
  overflow: hidden;
}
.home-video-wrapper .media-wrapper picture img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: 100% !important;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.35s ease-in-out;
}
.home-video-wrapper .media-wrapper picture:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 3rem;
  height: 3rem;
  background: url("../img/button/button_play_xs.png") no-repeat;
  background-size: 100% auto;
  transition: background 0.35s ease-in-out;
}
.home-video-wrapper .media-wrapper:hover picture:after {
  background: url("../img/button/button_play_xs_hover.png") no-repeat;
  background-size: 100% auto;
}
.home-video-wrapper .media-wrapper:hover picture img {
  transform: scale(1.1) translate3d(0, 0, 0.5rem);
  -webkit-transform: scale(1.1) translate3d(0, 0, 0.5rem);
}
@media screen and (min-width: 992px) {
  .home-video-wrapper .media-wrapper {
    position: absolute;
    top: 0;
    left: calc(50% - 25rem);
    max-width: 29.5rem;
  }
  .home-video-wrapper .media-wrapper picture {
    max-width: 27.5rem;
  }
  .home-video-wrapper .media-wrapper picture:after {
    width: 3.9rem;
    height: 3.9rem;
    background: url("../img/button/button_play_lg.png") no-repeat;
    background-size: 100% auto;
  }
  .home-video-wrapper .media-wrapper:hover picture:after {
    background: url("../img/button/button_play_lg_hover.png") no-repeat;
    background-size: 100% auto;
  }
}
.home-video-wrapper .intro-wrapper {
  position: relative;
  padding: 3.5rem 0 3.49rem 0;
  margin-top: -1.95rem;
}
.home-video-wrapper .intro-wrapper .scrollbar-inner {
  max-height: 100%;
}
.home-video-wrapper .intro-wrapper .intro-content {
  text-align: justify;
  max-height: 100%;
  overflow: auto;
  background: #FFF;
  padding-left: 1rem;
  padding-right: 1rem;
}
.home-video-wrapper .intro-wrapper:before, .home-video-wrapper .intro-wrapper:after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 3.5rem;
}
.home-video-wrapper .intro-wrapper:before {
  top: 0;
  background: url("../img/home/index_video_bg01_xs.png") 50% 0 no-repeat;
  background-size: 38.4rem 3.5rem;
}
.home-video-wrapper .intro-wrapper:after {
  bottom: 0;
  background: url("../img/home/index_video_bg02_xs.png") 50% 0 no-repeat;
  background-size: 38.4rem 3.5rem;
}
@media screen and (min-width: 576px) {
  .home-video-wrapper .intro-wrapper {
    background: url("../img/home/home_video_intro_bg.svg") no-repeat;
    background-size: 100% auto;
    width: 25.4rem;
    min-width: 25.4rem;
    height: 20.85rem;
    padding: 5.05rem 4.5rem 5rem 4.55rem;
    margin-top: -3.45rem;
  }
  .home-video-wrapper .intro-wrapper .intro-content {
    padding-left: 0;
  }
  .home-video-wrapper .intro-wrapper:before, .home-video-wrapper .intro-wrapper:after {
    content: none;
  }
}
@media screen and (min-width: 992px) {
  .home-video-wrapper .intro-wrapper {
    width: 28rem;
    min-width: 28rem;
    height: 23rem;
    padding: 6.2rem 4.5rem 6rem 7.15rem;
    margin-left: 24.9rem;
    margin-top: 7.85rem;
  }
}

.home-kv-bg {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translateX(-50%) rotate(-40deg);
  transform-origin: center;
  width: 500%;
  height: 13.8rem;
  background: url("../img/home/index_bg01.png") center repeat-x;
  background-size: auto 100%;
  z-index: -1;
}
@media screen and (min-width: 576px) {
  .home-kv-bg {
    top: 45.5%;
    left: 50%;
  }
}
@media screen and (min-width: 768px) {
  .home-kv-bg {
    top: 35.8%;
    left: 50%;
  }
}
@media screen and (min-width: 992px) {
  .home-kv-bg {
    top: 44.9%;
    left: 50%;
    transform: translateX(-50%) rotate(-20deg);
    transform-origin: center;
    width: 200%;
    height: 23rem;
    background-size: auto 100%;
  }
}

.hover-scale:hover figure img {
  transform: scale(1.1) translate3d(0, 0, 0.5rem);
  -webkit-transform: scale(1.1) translate3d(0, 0, 0.5rem);
}
.hover-scale:hover .list-header .list-title {
  color: #DB0032;
}

.nav-tabs-calender {
  width: 100%;
  border-bottom: 0;
}
.nav-tabs-calender .nav-link {
  border: 0;
}
.nav-tabs-calender .nav-link {
  background: #00BED6;
  color: #fff;
  font-size: 1.5rem;
  font-family: "Baloo Tamma 2";
  font-weight: 400;
  line-height: 1;
  text-align: center;
  padding-top: 0.9rem;
  padding-bottom: 0.6rem;
}
.nav-tabs-calender .nav-link.active {
  background: #fff;
  color: #00BED6;
}

.class-calendar-box {
  background-color: #fff;
  border-radius: 0.8rem;
}
.class-calendar-box.no-top-radius {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.class-calendar-box .nav.top-bg-01 {
  background-color: #F8DF8D;
  border-radius: 0.4rem;
}
.class-calendar-box .calendar-header {
  color: #00BED6;
  font-size: 1.5rem;
  text-align: center;
  padding: 0.4rem 0 0.35rem;
}
.class-calendar-box .calendar-table {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
  font-family: "Baloo Tamma 2";
  font-size: 1rem;
  color: #6B6B6B;
  width: calc(100% - 1rem);
  text-align: center;
  font-weight: 400 !important;
}
.class-calendar-box .calendar-table thead tr {
  border-top: 0 solid #C1C1C1;
}
.class-calendar-box .calendar-table thead tr th {
  padding: 1rem 0 0.6rem 0;
}
.class-calendar-box .calendar-table tr {
  border-top: 0.05rem solid #C1C1C1;
}
.class-calendar-box .calendar-table tr td {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.class-calendar-box .calendar-table tr td .day-num {
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.75rem;
  height: 1.75rem;
  line-height: 1;
  padding-top: 0.4rem;
  border-radius: 50%;
  background: transparent;
  font-size: 0.9rem;
}
.class-calendar-box .calendar-table tr td .day-num.disabled {
  opacity: 0.5;
}
.class-calendar-box .calendar-table tr td .day-num.have-class {
  background: #FAF1D6;
  cursor: pointer;
}
.class-calendar-box .calendar-table tr td .day-num.today {
  border: 0.1rem solid #00BED6;
}
.class-calendar-box .calendar-table tr td .day-num.active {
  border: 0.1rem solid #db0032;
}
.class-calendar-box .calendar-table tr td .day-num.no-open-all {
  background: #E2DFD7;
  cursor: pointer;
}
.class-calendar-box .calendar-table tr td .day-num.no-open-half {
  background: linear-gradient(-45deg, #FAF1D6 50%, #E2DFD7 50%);
  cursor: pointer;
}
@media screen and (min-width: 576px) {
  .class-calendar-box .calendar-table tr td .day-num {
    width: 2.25rem;
    height: 2.25rem;
    font-size: 1rem;
  }
}

.class-desc-box {
  margin-top: 0.5rem;
  height: 1rem;
  font-size: 0.8rem;
  display: flex;
  flex-wrap: nowrap;
  gap: 0.5rem;
}
.class-desc-box .no-open-desc, .class-desc-box .have-class-desc {
  padding-left: 1.2rem;
  position: relative;
}
.class-desc-box .no-open-desc:before {
  content: "";
  display: block;
  position: absolute;
  top: 0.05rem;
  left: 0;
  width: 1rem;
  height: 1rem;
  border: 0.05rem solid #6B6B6B;
  background: #E2DFD7;
  border-radius: 50%;
}
.class-desc-box .have-class-desc:before {
  content: "";
  display: block;
  position: absolute;
  top: 0.05rem;
  left: 0;
  width: 1rem;
  height: 1rem;
  border: 0.05rem solid #6B6B6B;
  background: #FAF1D6;
  border-radius: 50%;
}

.info-meta {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: left;
  margin-top: 0.5rem;
  border-top: 0.05rem dashed #959595;
  padding-top: 0.5rem;
  margin-left: -0.25rem;
  margin-right: -0.25rem;
  color: #959595;
  font-size: 0.7rem;
  font-weight: 700;
}
.info-meta > li {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
  margin-top: 0.25rem;
}
.info-meta .info-member {
  position: relative;
  padding-left: 1rem;
}
.info-meta .info-member:before {
  content: "";
  display: block;
  position: absolute;
  left: 0rem;
  top: 0.08rem;
  width: 0.75rem;
  height: 0.75rem;
  background: url("../img/list/icon_member_01.svg") 0% 0% no-repeat;
  background-size: 100%;
}
.info-meta .info-cat {
  position: relative;
  padding-left: 1rem;
}
.info-meta .info-cat:before {
  content: "";
  display: block;
  position: absolute;
  left: 0rem;
  top: 0.15rem;
  width: 0.75rem;
  height: 0.75rem;
  background: url("../img/list/icon_cat_01.svg") 0% 0% no-repeat;
  background-size: 100%;
}
.info-meta .info-date {
  position: relative;
  padding-left: 1rem;
  line-height: 1.6;
}
.info-meta .info-date:before {
  content: "";
  display: block;
  position: absolute;
  left: 0rem;
  top: 0.15rem;
  width: 0.75rem;
  height: 0.75rem;
  background: url("../img/list/icon_calender_02.svg") 0% 0% no-repeat;
  background-size: 100%;
}

.media-list-wrapper .list-item > a {
  color: #000;
}
.media-list-wrapper .list-media {
  position: relative;
  margin-bottom: 0.9rem;
}
.media-list-wrapper .list-media figure {
  position: relative;
  padding-bottom: 74%;
  width: 100%;
  /*mask image*/
  mask-image: url("../img/list/list_bg_mask_01.svg");
  -webkit-mask-image: url("../img/list/list_bg_mask_01.svg");
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: cover;
  -webkit-mask-size: cover;
  overflow: hidden;
}
.media-list-wrapper .list-media figure img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: 100% !important;
  -o-object-fit: cover;
     object-fit: cover;
}
.media-list-wrapper .list-media .label-box {
  position: absolute;
  bottom: 0;
  left: 0;
  display: flex;
  letter-spacing: 0.04rem;
  padding: 0.5rem 0.75rem 0.3rem;
  justify-content: center;
  border-radius: 0.5rem;
  align-items: center;
  background: #fff;
  color: #00BED6;
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
}
.media-list-wrapper .list-media .label-box .list-label {
  display: flex;
  width: 2.5rem;
  height: 2.1rem;
}
.media-list-wrapper .list-media .label-box .list-label.top {
  background: url("../img/list/icon_top@2x.png") center no-repeat;
  background-size: 2.5rem 2.1rem;
}
.media-list-wrapper .list-media .label-box .list-label.hot {
  background: url("../img/list/icon_hot@2x.png") center no-repeat;
  background-size: 2.5rem 2.1rem;
}
.media-list-wrapper .list-media .label-box .list-label + .list-label {
  margin-left: 0.3rem;
}
.media-list-wrapper .list-header {
  margin-bottom: 0.5rem;
}
.media-list-wrapper .list-header .list-title {
  color: #000;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.3;
  transition: color 0.35s ease-in-out;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.media-list-wrapper .list-intro {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 0.8rem;
}

.pagination-wrapper {
  margin-top: 2rem;
}
@media screen and (min-width: 768px) {
  .pagination-wrapper {
    margin-top: 3.25rem;
  }
}

.pagination {
  font-family: "Baloo Tamma 2";
}
.pagination > li + li {
  margin-left: 0.5rem;
}
.pagination > li > a {
  border: none;
}
.pagination > li > span {
  border: none;
}
.pagination > li .page-link {
  display: flex;
  width: 1.25rem;
  height: 1.4rem;
  font-size: 1rem;
  line-height: normal;
  color: #00BED6;
  background-color: transparent;
  padding: 0.35rem 0.7rem 0.25rem;
  border-radius: 0.775rem !important;
}
.pagination > li .page-link i {
  font-size: 1.5rem;
  font-weight: 100;
}
.pagination > li .page-link.arrow-link {
  padding: 0;
}
.pagination > li .page-link.arrow-link picture {
  display: flex;
}
.pagination > li .page-link.arrow-link .pagination-arrow {
  height: 0.8rem;
}
.pagination > li .page-link.arrow-link .pagination-arrow.left {
  transform: rotate(-180deg);
}
.pagination > li.prev-page, .pagination > li.next-page {
  width: 1.25rem;
  height: 1.4rem;
}
.pagination > li.prev-page {
  margin-right: 0.5rem;
}
.pagination > li.next-page {
  margin-left: 1rem;
}
.pagination > li.active .page-link, .pagination > li:hover .page-link {
  color: #FFF;
  background-color: #00BED6;
  background-image: none;
}
.pagination > li.active.prev-page .page-link, .pagination > li.active.next-page .page-link, .pagination > li:hover.prev-page .page-link, .pagination > li:hover.next-page .page-link {
  background-color: transparent;
}

.page-cat-wrapper {
  margin-bottom: 2rem;
}
.page-cat-wrapper .cat-btn-box {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-left: -0.25rem;
  margin-right: -0.25rem;
  margin-top: -0.25rem;
}
.page-cat-wrapper .cat-btn-box .cat-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 1.4rem;
  font-weight: 700;
  color: #00BED6;
  background: #FFF;
  border: 2px solid #00BED6;
  padding: 0.7rem 1.4rem 0.5rem;
  margin-left: 0.25rem;
  margin-right: 0.25rem;
  margin-top: 0.25rem;
  line-height: 1;
}
.page-cat-wrapper .cat-btn-box .cat-btn:hover, .page-cat-wrapper .cat-btn-box .cat-btn.active {
  background: #00BED6;
  color: #FFF;
}

.cat-dropdown button.dropdown-toggle:after {
  content: "\e92d";
  font-family: Unicons;
  font-size: 0.8rem;
  position: absolute;
  right: 0.8rem;
  top: 0.7rem;
}
.cat-dropdown ul {
  padding: 0.25rem 0.5rem;
  margin-top: 0.25rem !important;
  border: 0.05rem solid #00BED6;
  box-shadow: none;
}
.cat-dropdown ul > li + li {
  margin-top: 5px;
}
.cat-dropdown ul > li a {
  display: block;
  color: #00BED6;
  border-radius: 0.5rem;
  text-align: center;
  font-weight: bold;
  line-height: 1;
  padding: 0.6rem 0.5rem 0.6rem;
}
.cat-dropdown ul > li a:hover, .cat-dropdown ul > li a:focus, .cat-dropdown ul > li a.active {
  color: #FFF;
  background-color: #00BED6;
}

.donate-list-wrapper .list-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.donate-list-wrapper .list-item + .list-item {
  border-top: 0.1rem solid;
  -o-border-image: url("../img/list/list_line.svg");
     border-image: url("../img/list/list_line.svg");
  border-image-slice: 12;
  border-image-repeat: repeat;
  padding-top: 1.5rem;
  margin-top: 1.5rem;
}
.donate-list-wrapper .list-item .list-media {
  max-width: 9rem;
  margin-bottom: 1rem;
}
.donate-list-wrapper .list-item .list-media img {
  max-width: 100%;
}
.donate-list-wrapper .list-item .list-content {
  color: #000;
  margin-bottom: 1rem;
}
.donate-list-wrapper .list-item .list-content .list-title {
  font-size: 1.2rem;
  line-height: 1.3;
  font-weight: 700;
  color: #51B5D4;
}
.donate-list-wrapper .list-item .list-content .list-intro {
  margin-top: 0.25rem;
}
.donate-list-wrapper .list-item .donate-box {
  display: flex;
  max-width: 15.25rem;
}
.donate-list-wrapper .list-item .donate-box .donate-amount {
  text-align: center;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1;
  color: #DB0032;
  width: 50%;
  height: 2.7rem;
  padding: 0.85rem 1rem 0.65rem;
  background-color: #FDF9EC;
  border: 0.1rem solid #EDE4C3;
  border-radius: 0.4rem;
  outline: none;
  transition: border-color 0.2s ease;
  /*remove number arrow*/
  -moz-appearance: textfield;
}
.donate-list-wrapper .list-item .donate-box .donate-amount::-webkit-outer-spin-button, .donate-list-wrapper .list-item .donate-box .donate-amount::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.donate-list-wrapper .list-item .donate-box .donate-amount:hover, .donate-list-wrapper .list-item .donate-box .donate-amount:focus {
  border-color: #E48D8D;
}
.donate-list-wrapper .list-item .donate-box .btn {
  width: 50%;
  height: 2.7rem;
  font-size: 1.1rem;
  padding: 0.9rem 1.15rem 0.7rem;
  border-radius: 0.4rem;
  margin-left: 0.75rem;
}
@media screen and (min-width: 992px) {
  .donate-list-wrapper .list-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    text-align: left;
  }
  .donate-list-wrapper .list-item + .list-item {
    padding-top: 1rem;
    margin-top: 1rem;
  }
  .donate-list-wrapper .list-item .list-media {
    margin-bottom: 0;
  }
  .donate-list-wrapper .list-item .list-content {
    padding-left: 1.5rem;
    margin-bottom: 0;
  }
  .donate-list-wrapper .list-item .donate-box {
    margin-left: auto;
    padding-left: 1rem;
    max-width: none;
  }
  .donate-list-wrapper .list-item .donate-box .donate-amount {
    width: 6.7rem;
  }
  .donate-list-wrapper .list-item .donate-box .btn {
    width: 6.7rem;
  }
}
.donate-list-wrapper .page-cat-wrapper .cat-btn-box {
  flex-wrap: nowrap;
  margin-left: -0.375rem;
  margin-right: -0.375rem;
}
.donate-list-wrapper .page-cat-wrapper .cat-btn-box .cat-btn {
  width: calc(50% - 0.75rem);
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1;
  padding: 0.8rem 0 0.6rem;
  border-radius: 1.5rem;
  margin-left: 0.375rem;
  margin-right: 0.375rem;
}
@media screen and (min-width: 375px) {
  .donate-list-wrapper .page-cat-wrapper .cat-btn-box .cat-btn {
    width: auto;
    padding: 0.8rem 1.2rem 0.6rem;
  }
}
@media screen and (min-width: 992px) {
  .donate-list-wrapper .page-cat-wrapper .cat-btn-box .cat-btn {
    width: auto;
    font-size: 1.4rem;
    padding: 0.8rem 1.4rem 0.6rem;
  }
}

.form-control {
  padding: 0.75rem 0.65rem 0.65rem !important;
  border-radius: 0.4rem;
  font-size: 0.8rem;
  line-height: 1;
  box-shadow: none;
  color: #000;
  border-radius: 0.4rem;
  border: 1px solid #959595;
  background: #FFF;
}
.form-control:not(textarea) {
  height: 2.3rem;
}
.form-control::-webkit-input-placeholder {
  color: #9F9C99;
}
.form-control:-moz-placeholder {
  color: #9F9C99;
}
.form-control::-moz-placeholder {
  color: #9F9C99;
}
.form-control:-ms-input-placeholder {
  color: #9F9C99;
}
.form-control:focus {
  border-color: #00BED6;
  color: #000;
}

.form-group label .required {
  color: var(--bs-danger);
  margin-left: 0.25rem;
}

#offcanvas-search .search-form .form-control {
  font-size: 0.8rem;
  border: 0;
  background: 0 0;
  box-shadow: none;
  padding-left: 1.75rem !important;
  padding-right: 0.75rem !important;
}

.form-select {
  position: relative;
  line-height: 1;
  padding: 0.75rem 1rem 0.65rem !important;
  background: url("../img/button/button_select.png") #FDF9EC no-repeat !important;
  background-size: 0.65rem 0.4rem !important;
  background-position: right 1rem center !important;
}
.form-select:disabled {
  background-color: #eeeeef;
}

.vcode-group .input-vcode {
  width: 100%;
}
.vcode-group img {
  width: 7.3rem;
  height: 2.3rem;
  border-radius: 0.4rem;
  margin-top: 1rem;
}
@media screen and (min-width: 768px) {
  .vcode-group .input-vcode {
    max-width: calc(100% - 8.3rem);
  }
  .vcode-group img {
    margin-left: 1rem;
    margin-top: 0;
  }
}

.select2-container.select2-container--default .select2-selection--single {
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1;
  box-shadow: none;
  padding: 0;
  height: 2.2rem;
  border: 0;
  background: transparent;
  text-align: center;
}
.select2-container.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #FFF;
  line-height: 1;
  padding: 0.5rem 0.6rem 0.5rem;
  border: 0.1rem solid #00BED6;
  border-radius: 1.4rem;
  background-color: #00BED6;
}
.select2-container.select2-container--default .select2-selection--single .select2-selection__rendered .select2-selection__placeholder {
  color: #000;
}
.select2-container.select2-container--default .select2-selection--single .select2-selection__arrow {
  top: 0.9rem;
  right: 0.6rem;
  width: 0.65rem;
  height: 0.4rem;
  background: url("../img/button/button_list_arrow.png") no-repeat;
  background-size: 0.65rem 0.4rem;
}
.select2-container.select2-container--default .select2-selection--single .select2-selection__arrow b {
  opacity: 0;
}
.select2-container.select2-container--default .select2-selection--single:focus {
  box-shadow: none;
  outline: none;
}
.select2-container.select2-container--default .select2-selection--single:focus .select2-selection__rendered {
  border-color: #00BED6;
}
.select2-container.select2-container--default .select2-dropdown {
  border: 0.1rem solid #00BED6;
  position: relative;
  z-index: 9999;
  border-radius: 0.4rem;
  font-size: 0.8rem;
  color: #000;
  font-weight: 700;
  margin-top: 0.25rem;
}
.select2-container.select2-container--default .select2-dropdown .select2-results .select2-results__options {
  margin: 0.25rem 0.25rem 0.25rem 0.5rem;
  padding-right: 0.25rem;
}
.select2-container.select2-container--default .select2-dropdown li.select2-results__option {
  padding: 0.6rem 0.5rem 0.6rem;
  border-radius: 0.5rem;
  line-height: 1;
}
.select2-container.select2-container--default .select2-dropdown li.select2-results__option.select2-results__option--highlighted {
  background-color: #DEEBE1;
  color: #000;
}
.select2-container.select2-container--default .select2-dropdown li.select2-results__option + li.select2-results__option {
  margin-top: 0.25rem;
}
.select2-container.select2-container--default .select2-dropdown .select2-results__option--selected {
  background-color: transparent;
}
.select2-container.select2-container--default .select2-dropdown.news {
  border: 0.05rem solid #00BED6;
}
.select2-container.select2-container--default .select2-dropdown.news li.select2-results__option.select2-results__option--highlighted {
  background-color: #00BED6;
  color: #FFF;
}

.search-rule-wrapper {
  background: #FAF1D6;
}
.search-rule-wrapper .search-svg {
  padding: 0;
  background: transparent;
  border: 0;
}
.search-rule-wrapper .search-svg:hover rect {
  fill: #007DB2;
}
.search-rule-wrapper a.type1 {
  color: #00BED6;
  text-decoration: underline;
  font-weight: 700;
}

.search-hot-keyword a.type1 {
  color: #00BED6;
  text-decoration: underline;
  font-weight: 700;
}

.search-result-wrapper.related-wrapper {
  background: #FAF1D6;
}
.search-result-wrapper.related-wrapper .related-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1.8rem;
}
.search-result-wrapper.related-wrapper .related-title h3 {
  margin: 0 auto;
  padding: 0;
}
@media screen and (min-width: 640px) {
  .search-result-wrapper.related-wrapper .related-title {
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 0rem;
  }
  .search-result-wrapper.related-wrapper .related-title h3 {
    padding-left: 6.5rem;
    margin: 0 0 1rem 0;
  }
}
@media screen and (min-width: 992px) {
  .search-result-wrapper.related-wrapper .related-title h3 {
    padding-left: 5rem;
  }
}
.search-result-wrapper.related-wrapper .cat-btn-box {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0.2rem auto 0;
}
@media screen and (min-width: 640px) {
  .search-result-wrapper.related-wrapper .cat-btn-box {
    margin: 0;
  }
}
.search-result-wrapper .container-md {
  position: relative;
  z-index: 2;
}
.search-result-wrapper .search-result-box {
  position: relative;
  min-height: 12.7rem;
  padding-top: 1.2rem;
}
.search-result-wrapper .search-result-box + .search-result-box {
  margin-top: 3rem;
}
.search-result-wrapper .search-result-box:before {
  content: "";
  position: absolute;
  left: -0.4rem;
  top: 0;
  width: 23.331rem;
  height: 9.779rem;
  background: url("../img/header/search_list_title_01.svg") no-repeat;
  background-size: 100% auto;
  z-index: -1;
}
.search-result-wrapper .search-result-box.type1:before {
  background: url("../img/header/search_list_title_01.svg") no-repeat;
  background-size: 100% auto;
}
.search-result-wrapper .search-result-box.type2:before {
  background: url("../img/header/search_list_title_02.svg") no-repeat;
  background-size: 100% auto;
}
.search-result-wrapper .search-result-box.type3:before {
  background: url("../img/header/search_list_title_03.svg") no-repeat;
  background-size: 100% auto;
}
.search-result-wrapper .search-result-box.type4:before {
  background: url("../img/header/search_list_title_04.svg") no-repeat;
  background-size: 100% auto;
}
.search-result-wrapper .search-result-box h3 {
  padding-left: 6.5rem;
  margin-bottom: 1rem;
  color: #000;
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
  z-index: 2;
  position: relative;
}
@media screen and (min-width: 992px) {
  .search-result-wrapper .search-result-box {
    min-height: 12.7rem;
    padding-top: 1.5rem;
  }
  .search-result-wrapper .search-result-box:before {
    left: -4.5rem;
    top: 0;
    width: 30.3rem;
    height: 12.7rem;
  }
  .search-result-wrapper .search-result-box h3 {
    font-size: 1.6rem;
    padding-left: 5rem;
    margin-bottom: 1rem;
  }
}

.about-ncare-wrapper .about-intro-wrapper {
  position: relative;
  margin-bottom: 5rem;
}
.about-ncare-wrapper .about-intro-wrapper .role-img {
  position: relative;
  padding-bottom: 1rem;
}
.about-ncare-wrapper .about-intro-wrapper .role-img picture {
  display: block;
}
.about-ncare-wrapper .about-intro-wrapper .role-img .dialog-img {
  position: absolute;
  top: -3rem;
  right: -1.75rem;
}
@media screen and (min-width: 768px) {
  .about-ncare-wrapper .about-intro-wrapper .role-img .dialog-img {
    top: -2rem;
    right: 1rem;
  }
}
@media screen and (min-width: 992px) {
  .about-ncare-wrapper .about-intro-wrapper .role-img {
    padding-top: 2.75rem;
    padding-bottom: 0.85rem;
  }
  .about-ncare-wrapper .about-intro-wrapper .role-img .dialog-img {
    top: 0;
    right: calc(50% + 11.4rem);
  }
}
.about-ncare-wrapper .about-intro-wrapper .intro-content-group .intro-title {
  text-align: center;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.3;
  color: #FFF;
  margin-bottom: 0.5rem;
  border-radius: 0.4rem;
  background: #E5C341;
  padding: 0.4rem 0.5rem;
}
.about-ncare-wrapper .about-intro-wrapper .intro-content-group .intro-content {
  text-align: justify;
}
.about-ncare-wrapper .about-intro-wrapper .intro-content-group + .intro-content-group {
  margin-top: 2rem;
}
@media screen and (min-width: 992px) {
  .about-ncare-wrapper .about-intro-wrapper .intro-content-group {
    position: absolute;
    width: 10rem;
  }
  .about-ncare-wrapper .about-intro-wrapper .intro-content-group + .intro-content-group {
    margin-top: 0;
  }
  .about-ncare-wrapper .about-intro-wrapper .intro-content-group.right-top {
    top: 0;
    left: calc(50% + 9.25rem);
  }
  .about-ncare-wrapper .about-intro-wrapper .intro-content-group.right-bottom {
    bottom: 0;
    left: calc(50% + 11.4rem);
  }
  .about-ncare-wrapper .about-intro-wrapper .intro-content-group.left-bottom {
    bottom: 0;
    right: calc(50% + 11.4rem);
  }
}

.ncare-home-wrapper .form-intro {
  position: relative;
  border-bottom: 0.1rem solid;
  -o-border-image: url("../img/list/list_line.svg");
     border-image: url("../img/list/list_line.svg");
  border-image-slice: 12;
  border-image-repeat: repeat;
  padding-bottom: 2.5rem;
  margin-bottom: 2.5rem;
}
.ncare-home-wrapper .form-intro:before {
  content: "";
  position: absolute;
  bottom: -1.9rem;
  right: 0;
  width: 4.6rem;
  height: 4.2rem;
  background: url("../img/ncare_home/map_icon_wish@2x.png") no-repeat;
  background-size: 100% auto;
  transform: rotate(-14.1deg);
}
@media screen and (min-width: 992px) {
  .ncare-home-wrapper .form-intro:before {
    bottom: -3.6rem;
    left: calc(50% + 11.8rem);
    right: auto;
    width: 9.2rem;
    height: 8.4rem;
  }
}
.ncare-home-wrapper .form-control {
  border-radius: 0.4rem;
  border: 0.1rem solid #EDE4C3;
  background: #FDF9EC;
}
.ncare-home-wrapper .wish-form-wrapper {
  display: flex;
  justify-content: center;
}
.ncare-home-wrapper .wish-form-wrapper > form {
  max-width: 20.5rem;
  width: 100%;
}

.wish-map-wrapper .wish-cnt-wrapper {
  border-bottom: 0.1rem solid;
  -o-border-image: url("../img/list/list_line.svg");
     border-image: url("../img/list/list_line.svg");
  border-image-slice: 12;
  border-image-repeat: repeat;
  padding-bottom: 2.5rem;
  margin-bottom: 2.5rem;
}
.wish-map-wrapper .wish-cnt-wrapper .cnt-item {
  display: flex;
  align-items: center;
}
.wish-map-wrapper .wish-cnt-wrapper .cnt-item picture {
  display: block;
  position: relative;
  margin-right: -0.75rem;
  z-index: 2;
}
.wish-map-wrapper .wish-cnt-wrapper .cnt-item .item-content {
  flex: 1 1 auto;
  line-height: 1;
  font-weight: 700;
  color: #715640;
  font-size: 0.8rem;
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  border: 0.05rem solid #EED36F;
  background-color: #FDF9EC;
  text-align: center;
  min-width: 8.85rem;
}
.wish-map-wrapper .wish-cnt-wrapper .cnt-item .item-content .item-title {
  font-size: 1.1rem;
  margin-bottom: 0.5rem;
}
.wish-map-wrapper .wish-cnt-wrapper .cnt-item .item-content .total-cnt {
  font-size: 1.5rem;
  color: #E48D8D;
}
.wish-map-wrapper .wish-cnt-wrapper .cnt-item .item-content .item-unit {
  margin-left: 0.25rem;
}
.wish-map-wrapper .wish-title {
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.3;
  color: #51B5D4;
  margin-bottom: 2.5rem;
}

/*育兒+地圖*/
.service-point-wrapper {
  position: relative;
}
.service-point-wrapper .share-box {
  margin-top: 2.75rem;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .share-box {
    position: absolute;
    bottom: 0;
    left: 0;
    margin-top: 0;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map {
  position: relative;
}
.service-point-wrapper .map-wrapper .taiwan-map .map-point {
  position: absolute;
  display: flex;
  font-size: 0.85rem;
  line-height: 1;
  font-weight: 700;
  align-items: center;
  justify-content: center;
  width: 15%;
  transition: color 0.2s ease;
}
.service-point-wrapper .map-wrapper .taiwan-map .map-point.top, .service-point-wrapper .map-wrapper .taiwan-map .map-point.bottom {
  flex-direction: column;
}
.service-point-wrapper .map-wrapper .taiwan-map .map-point.left, .service-point-wrapper .map-wrapper .taiwan-map .map-point.right {
  flex-direction: row;
}
.service-point-wrapper .map-wrapper .taiwan-map .map-point.left .point-title, .service-point-wrapper .map-wrapper .taiwan-map .map-point.right .point-title {
  padding-top: 0.2rem;
}
.service-point-wrapper .map-wrapper .taiwan-map .map-point.top:after, .service-point-wrapper .map-wrapper .taiwan-map .map-point.left:after {
  content: "";
  background: url("../img/map/map_icon_state03.png") no-repeat;
  background-size: 100% auto;
  width: 100%;
  padding-bottom: 91.3043478261%;
}
.service-point-wrapper .map-wrapper .taiwan-map .map-point.bottom:before, .service-point-wrapper .map-wrapper .taiwan-map .map-point.right:before {
  content: "";
  background: url("../img/map/map_icon_state03.png") no-repeat;
  background-size: 100% auto;
  width: 100%;
  padding-bottom: 91.3043478261%;
}
.service-point-wrapper .map-wrapper .taiwan-map .map-point.building01:before, .service-point-wrapper .map-wrapper .taiwan-map .map-point.building01:after {
  background: url("../img/map/map_icon_state01.png") no-repeat;
  background-size: 100% auto;
}
.service-point-wrapper .map-wrapper .taiwan-map .map-point.building02:before, .service-point-wrapper .map-wrapper .taiwan-map .map-point.building02:after {
  background: url("../img/map/map_icon_state02.png") no-repeat;
  background-size: 100% auto;
}
.service-point-wrapper .map-wrapper .taiwan-map .map-point:hover {
  color: #DB0032;
}
.service-point-wrapper .map-wrapper .taiwan-map .map-point.disable {
  color: #9F9C99 !important;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .map-point {
    width: auto;
    cursor: pointer;
  }
  .service-point-wrapper .map-wrapper .taiwan-map .map-point.top:before, .service-point-wrapper .map-wrapper .taiwan-map .map-point.top:after, .service-point-wrapper .map-wrapper .taiwan-map .map-point.left:before, .service-point-wrapper .map-wrapper .taiwan-map .map-point.left:after, .service-point-wrapper .map-wrapper .taiwan-map .map-point.bottom:before, .service-point-wrapper .map-wrapper .taiwan-map .map-point.bottom:after, .service-point-wrapper .map-wrapper .taiwan-map .map-point.right:before, .service-point-wrapper .map-wrapper .taiwan-map .map-point.right:after {
    width: 2.3rem !important;
    height: 2.1rem;
    padding-bottom: 0 !important;
  }
  .service-point-wrapper .map-wrapper .taiwan-map .map-point.disable {
    cursor: auto;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.5rem;
  height: 1.5rem;
  font-size: 0.6rem;
  line-height: 1;
  font-weight: 700;
  color: #51B5D4;
  border: 0.1rem solid currentcolor;
  border-radius: 50%;
  background-color: #FFF;
  overflow: hidden;
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.current {
  color: #E48D8D;
  border-color: #F3A9A9;
}
@media screen and (min-width: 375px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt {
    width: 1.8rem;
    height: 1.8rem;
    font-size: 0.7rem;
  }
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt {
    width: 2.25rem;
    height: 2.25rem;
    font-size: 0.8rem;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-01 {
  top: 4.3%;
  left: 89%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-01 {
    top: 4%;
    left: 92%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-02 {
  top: 8.5%;
  left: 77.5%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-02 {
    top: 10%;
    left: 87%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-03 {
  top: 0%;
  left: 70%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-03 {
    top: 0%;
    left: 77%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-04 {
  top: 3%;
  left: 55%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-04 {
    top: 5.5%;
    left: 66.5%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-05 {
  top: 12.8%;
  left: 59%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-05 {
    top: 17.9%;
    left: 68%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-06 {
  top: 7.5%;
  left: 42%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-06 {
    top: 11%;
    left: 57%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-07 {
  top: 17.5%;
  left: 45%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-07 {
    top: 24%;
    left: 59%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-08 {
  top: 20%;
  left: 26%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-08 {
    top: 28%;
    left: 45%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-09 {
  top: 25.5%;
  left: 20%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-09 {
    top: 36.5%;
    left: 41%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-10 {
  top: 26%;
  left: 51.5%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-10 {
    top: 37%;
    left: 65%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-11 {
  top: 30.7%;
  left: 31%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-11 {
    top: 44%;
    left: 48%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-12 {
  top: 37.5%;
  left: 8.5%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-12 {
    top: 53%;
    left: 32%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-13 {
  top: 37.9%;
  left: 30%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-13 {
    top: 54%;
    left: 47%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-14 {
  top: 45.2%;
  left: 10.5%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-14 {
    top: 63.5%;
    left: 34.5%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-15 {
  top: 53.5%;
  left: 16%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-15 {
    top: 75%;
    left: 38%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-16 {
  top: 61%;
  left: 30%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-16 {
    top: 86.5%;
    left: 49.5%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-17 {
  top: 15%;
  left: 85%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-17 {
    top: 21%;
    left: 87.5%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-18 {
  top: 33%;
  left: 66.5%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-18 {
    top: 45%;
    left: 75%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-19 {
  top: 54.5%;
  left: 46.5%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-19 {
    top: 77.5%;
    left: 61%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-20 {
  top: 80.6%;
  left: 27.5%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-20 {
    top: 6%;
    left: 17%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-21 {
  top: 92.8%;
  left: 30%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-21 {
    top: 21%;
    left: 18%;
  }
}
.service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-22 {
  top: 85.3%;
  left: 80%;
}
@media screen and (min-width: 992px) {
  .service-point-wrapper .map-wrapper .taiwan-map .wish-cnt.city-22 {
    top: 54.5%;
    left: 12%;
  }
}
.service-point-wrapper .map-info-list {
  margin-top: 2.25rem;
}
.service-point-wrapper .map-info-list .list-item .list-title {
  font-size: 1rem;
  line-height: 1;
  font-weight: 700;
  color: #51B5D4;
  margin-bottom: 0.5rem;
}
.service-point-wrapper .map-info-list .list-item .list-content .info-group {
  display: flex;
}
.service-point-wrapper .map-info-list .list-item .list-content .info-group .info-key {
  flex: 0 0 2.4rem;
}
.service-point-wrapper .map-info-list .list-item .list-content .info-group .info-key.long {
  flex: 0 0 4rem;
}
.service-point-wrapper .map-info-list .list-item .list-content .info-group .info-value {
  flex: 1 1 auto;
}
.service-point-wrapper .map-info-list .list-item .list-content .info-group + .info-group {
  margin-top: 0.3rem;
}
.service-point-wrapper .map-info-list .list-item .btn {
  margin-top: 0.5rem;
}
.service-point-wrapper .map-info-list .list-item + .list-item {
  margin-top: 2rem;
}

/*
=================================================================
(#m04idb) INDEX BANNER
=================================================================
*/
/*# sourceMappingURL=base.css.map */