@charset "UTF-8";
@import url(https://fonts.googleapis.com/earlyaccess/cwtexyen.css);
@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);
@import url(https://fonts.googleapis.com/earlyaccess/cwtexming.css);
@import url(https://fonts.googleapis.com/earlyaccess/cwtexfangsong.css);
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/**/
/*cwTeXYen*/
/*Noto Sans TC*/
/*cwTeXMing*/
/*cwTeXFangSong*/
/**/
* {
  text-decoration: none;
}

html, body {
  height: 100%;
  word-wrap: break-word;
  word-break: break-all;
}

input[type=text], input[type=password], input[type=number] {
  height: 39px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 1px solid #DDD;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1) inset;
  outline: none;
  padding-left: 12px;
  font-family: "Noto Sans TC";
  font-weight: 400;
  font-size: 1rem;
  letter-spacing: 2px;
  box-sizing: border-box;
  margin: 10px 5px 10px 0;
  border-radius: 3px;
  color: #323232;
}
@media (max-width: 768px) {
  input[type=text], input[type=password], input[type=number] {
    width: 100%;
    margin: 10px 0;
  }
}

input[readonly=readonly] {
  background: rgba(73, 73, 73, 0.4);
  color: #fff;
  font-weight: 200;
}

input[type=submit] {
  height: 39px;
  border: 0px;
  font-size: 1.125rem;
  color: #fff;
  background: #4CB9CE;
  padding: 10px 20px;
  display: block;
  width: 100%;
  border-radius: 5px;
  cursor: pointer;
  transition: all 0.25s ease-out;
  margin: 60px 0 0;
}
input[type=submit]:hover {
  background: #494949;
}

select {
  border: 1px solid #DDD;
  font-family: "Noto Sans TC", sans-serif, Arial;
  font-weight: 400;
  font-size: 1rem;
  letter-spacing: 2px;
  padding-left: 8px;
  height: 39px;
  outline: none;
  box-sizing: border-box;
  border-radius: 3px;
  color: #323232;
}

textarea {
  border: 1px solid #DDD;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1) inset;
  outline: none;
  padding: 8px;
  font-family: "Noto Sans TC", sans-serif, Arial;
  font-weight: 400;
  font-size: 1rem;
  letter-spacing: 2px;
  box-sizing: border-box;
  width: 100%;
  resize: none;
  height: 145px;
  border-radius: 3px;
  color: #323232;
  margin: 10px 5px 10px 0;
}
@media (max-width: 768px) {
  textarea {
    height: 80px;
  }
}

.btn {
  padding: 10px 20px;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #4CB9CE;
  margin: 0 5px;
  color: #fff;
  cursor: pointer;
  transition: all 0.25s ease-out;
}
.btn:hover {
  background: #494949;
}

.btn_download {
  margin: 10px 0 0 55px;
  padding: 5px 10px;
  background: #4CB9CE;
  color: #fff;
  border-radius: 3px;
  text-decoration: unset;
  transition: all 0.25s ease-out;
  font-size: 1rem;
}
.btn_download:hover {
  background: #494949;
}
.btn_download:after {
  content: "";
  background: url(../Images/download-14.png);
  background-size: cover;
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-left: 5px;
}

body {
  font-family: "Noto Sans TC", sans-serif, Arial;
  font-weight: 400;
  font-size: 1rem;
  letter-spacing: 2px;
  background: url(../Images/bg_faq.png);
  line-height: 1.3;
  color: #494949;
}

/*--------------------ally setting--------------------*/
a:focus, .a11y_focus:focus, .tab-label:focus, .tab-content:focus, .btn:focus,
input:focus, button:focus, .eye:focus,
select:focus, textarea:focus,
#send:focus {
  outline: 3px dashed #c82b23;
}

.gotoContent {
  font-size: 0rem;
  font-weight: 500;
  color: #fff;
  background: #c9420d;
  padding: 0;
  outline: 0px;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 889;
}

.gotoContent:focus {
  font-size: 0.875rem;
  padding: 6px 12px;
}

#AC {
  margin: 20px 10px;
}

@media (max-width: 768px) {
  #AC {
    margin: 20px 3%;
  }
}
/*--------------------font setting--------------------*/
h2 {
  font-family: "Noto Sans TC", sans-serif, Arial;
  font-size: 1.875rem;
  font-weight: 600;
  letter-spacing: 5px;
  line-height: 1;
  color: #4CB9CE;
  margin-bottom: 10px;
  text-align: center;
  position: relative;
  /*@media (max-width: $wXXXS) {
      font-size: $f25;
      letter-spacing: 2px;
      text-align: center;
  }*/
}
h2 > span {
  display: inline-block;
  width: 100%;
  text-align: center;
  font-size: 1rem;
  color: #494949;
  font-weight: 400;
  letter-spacing: 1px;
}
h2:after {
  content: "";
  background: url(../Images/tittle_deco.png) no-repeat;
  background-size: cover;
  display: block;
  width: 46px;
  height: 14px;
  position: absolute;
  bottom: -56px;
  left: 50%;
  transform: translateX(-50%);
}
@media (max-width: 768px) {
  h2:after {
    bottom: -30px;
  }
}

h3 {
  font-family: "Noto Sans TC", sans-serif, Arial;
  font-size: 1.5625rem;
  font-weight: 600;
  letter-spacing: 2px;
  line-height: 1.5;
  color: #4CB9CE;
  margin: 0 0 24px;
}
@media (max-width: 375px) {
  h3 {
    font-size: 1.3125rem;
    line-height: 1.3;
    margin: 0 0 20px;
  }
}

h4 {
  font-family: "Noto Sans TC", sans-serif, Arial;
  font-size: 1.25rem;
  font-weight: 600;
  letter-spacing: 0px;
  line-height: 1.5;
  color: #4CB9CE;
}

p, li, .tab-content article {
  color: #494949;
  font-size: 1.125rem;
  line-height: 1.8;
  font-weight: 400;
  text-align: justify;
}
@media (max-width: 375px) {
  p, li, .tab-content article {
    line-height: 1.5;
  }
}

/*text list*/
.content_text li {
  font-size: 1.125rem;
  letter-spacing: 1.5px;
  text-indent: -26px;
}
@media (max-width: 480px) {
  .content_text li {
    font-size: 1.125rem;
    text-indent: 0;
  }
}
.content_text > li {
  text-indent: 0;
}
.content_text > li > ol {
  margin-left: 26px;
}
@media (max-width: 480px) {
  .content_text > li > ol {
    margin-left: 0;
  }
}
.content_text > li:nth-child(2) ol li {
  text-indent: 0px;
  margin: 0 0 16px -26px;
}
@media (max-width: 480px) {
  .content_text > li:nth-child(2) ol li {
    margin: 0 0 16px 0;
  }
}
.content_text .tittle_a {
  text-align: center;
  position: relative;
  padding: 5px 10px;
  margin: 24px auto 24px;
  display: inline-block;
  border: 1px solid #4CB9CE;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 3px;
  line-height: 1.3;
}
.content_text .tittle_a ~ p {
  text-align: center;
  margin: 12px 0 0 0;
}
@media (max-width: 768px) {
  .content_text .tittle_a ~ p {
    text-align: justify;
  }
}
.content_text .tittle_a:before {
  content: "";
  background: url(../Images/about_tittle_deco.png) no-repeat;
  background-size: cover;
  display: block;
  width: 24px;
  height: 14px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -18px;
}
.content_text h4 {
  color: #494949;
  font-weight: 400;
  display: inline;
  font-size: 1.125rem;
}
.content_text h4 ~ p {
  text-indent: 0px;
  margin: 12px 0 0 0;
}
.content_text ul {
  margin-left: -36px;
}
@media (max-width: 1024px) {
  .content_text ul {
    margin-left: 0;
  }
}
.content_text ul li {
  text-indent: 0;
}
.content_text ul li:before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50px;
  margin-right: 10px;
  background: #4CB9CE;
  top: -2px;
  position: relative;
}
.content_text .text_list li {
  margin: 12px 0 0 36px;
}
@media (max-width: 1024px) {
  .content_text .text_list li {
    margin: 12px 0 0 0;
  }
}
.content_text .text_list li i {
  font-size: 1rem;
  color: #13ae67;
}
.content_text .text_list li img {
  display: block;
  margin: 24px auto 34px;
  width: 50%;
}
@media (max-width: 768px) {
  .content_text .text_list li img {
    width: 100%;
  }
}
.content_text a {
  color: #4CB9CE;
  text-decoration: underline;
}

.focus {
  font-weight: 600;
}

.focus2 {
  color: #d43131;
  font-weight: 600;
}

.focus3 {
  color: #4CB9CE;
  font-weight: 600;
  font-size: 1.5625rem;
  margin: 5px;
}
@media (max-width: 768px) {
  .focus3 {
    font-size: 1.3125rem;
  }
}

.focus4 {
  color: #fff;
  font-weight: 600;
  font-size: 1.5625rem;
  background: #4CB9CE;
  padding: 2px 35px;
  border-radius: 3px;
  margin: 5px;
}
@media (max-width: 768px) {
  .focus4 {
    font-size: 1.3125rem;
  }
}

/*---------------------- layout/ layout/ layout/ ----------------------*/
.layout header {
  position: relative;
  width: 100%;
  z-index: 5;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 0px;
  background: #F6B74C;
}
@media (max-width: 768px) {
  .layout header {
    justify-content: space-between;
    height: 0px;
    background: #F6B74C;
  }
}
.layout header ul {
  display: flex;
  flex-flow: row;
  justify-content: center;
  position: relative;
  background: #F6B74C;
  width: 100%;
  padding: 12px 0 0;
  border-top: 1px solid #fff;
}
@media (max-width: 1024px) {
  .layout header ul {
    padding: 12px 0 24px;
  }
}
@media (max-width: 768px) {
  .layout header ul {
    flex-wrap: wrap;
    padding: 6px 0;
  }
}
.layout header ul li {
  color: #fff;
  position: relative;
}
.layout header ul li.logo {
  display: block;
  width: 208px;
}
.layout header ul li.logo img {
  width: 100%;
}
.layout header ul li:last-child:before {
  display: none;
}
.layout header ul li:before {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 17px;
  background: #fff;
  opacity: 0.5;
  /*@media (max-width: $wS) {
      display: none;
  }*/
}
.layout header ul li > a, .layout header ul li > p {
  display: flex;
  height: 52px;
  padding: 0 25px;
  margin: 0 15px;
  border-radius: 5px;
  box-sizing: border-box;
  align-items: center;
  color: #494949;
  transition: all 0.25s ease-out;
  font-size: 1.1875rem;
}
@media (max-width: 1400px) {
  .layout header ul li > a, .layout header ul li > p {
    padding: 0;
  }
}
@media (max-width: 768px) {
  .layout header ul li > a, .layout header ul li > p {
    font-size: 1rem;
    padding: 3px 6px;
    margin: 0;
    height: unset;
  }
}
.layout header ul li > a:hover, .layout header ul li > p:hover {
  color: #fff;
}
@media (max-width: 1024px) {
  .layout header ul li > a:hover, .layout header ul li > p:hover {
    animation-name: none;
  }
}
.layout header ul li > a:hover:after, .layout header ul li > p:hover:after {
  animation-name: shadow_move;
  animation-duration: 0.35s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
@keyframes shadow_move {
  100% {
    transform: translateY(5px) scale(1.15);
    opacity: 0.08;
  }
}
.layout header ul li div {
  position: absolute;
  width: 100%;
  transition: opacity 0.3s ease-out;
  visibility: hidden;
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity 0.6s cubic-bezier(0.215, 0.61, 0.355, 1), transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1), visibility 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
  background: #4CB9CE;
  border-radius: 5px;
  box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.16);
  overflow: hidden;
}
@media (max-width: 768px) {
  .layout header ul li div {
    position: absolute;
    width: 136%;
    left: -12px;
  }
}
.layout header ul li div a {
  display: block;
  color: #fff;
  padding: 12px 0;
  text-align: center;
  font-size: 1.0625rem;
  transition: color 0.15s ease-out;
}
@media (max-width: 768px) {
  .layout header ul li div a {
    font-size: 0.875rem;
  }
}
.layout header ul li div a:hover {
  color: #4CB9CE;
  background: #fff;
}
@media (max-width: 1024px) {
  .layout header ul li div a:hover {
    color: #323232;
  }
}
.layout header ul li div a:last-child {
  border: none;
}
.layout header ul li.active div {
  visibility: visible;
  transform: translateY(10px);
  opacity: 1;
}
.layout header ul li:hover div {
  visibility: visible;
  transform: translateY(0);
  opacity: 1;
}
.layout header .nav_btn {
  position: absolute;
  width: 100px;
  right: 12%;
  top: 50%;
  transform: translateY(-50%);
}
@media (max-width: 1600px) {
  .layout header .nav_btn {
    right: 6%;
  }
}
@media (max-width: 1400px) {
  .layout header .nav_btn {
    right: 1%;
  }
}
@media (max-width: 1024px) {
  .layout header .nav_btn {
    position: relative;
    right: unset;
    left: 50%;
    top: unset;
    transform: translateX(-50%);
  }
}
.layout header .nav_btn a.btn {
  background: #4CB9CE;
  transition: all 0.25s ease-out;
}
.layout header .nav_btn a.btn:hover {
  background: #494949;
}
.layout header .nav_btn a img {
  width: 23px;
}
@media (max-width: 768px) {
  .layout header .nav_btn a {
    font-size: 0.875rem;
    background: #F6B74C;
    padding: 5px 10px;
  }
}
@media (max-width: 768px) {
  .layout header .nav_btn a {
    font-size: 0.75rem;
    background: #F6B74C;
    padding: 5px 10px;
  }
}
.layout header #Menu {
  position: absolute;
  width: 100%;
  top: 454px;
}
.layout header #Menu:before {
  content: "";
  display: block;
  width: 100%;
  height: 110px;
  background: url(../Images/2025/deco2.svg) center center no-repeat;
  background-size: cover;
  position: absolute;
  bottom: -34px;
  left: 0;
  z-index: -1;
  animation-name: jump3;
  animation-duration: 1.3s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
@media (max-width: 1024px) {
  .layout header #Menu:before {
    background-size: contain;
    bottom: -38px;
  }
}
@media (max-width: 768px) {
  .layout header #Menu:before {
    bottom: -45px;
    animation-name: unset;
  }
}
@media (max-width: 480px) {
  .layout header #Menu:before {
    bottom: -50px;
  }
}
@media (max-width: 768px) {
  .layout header #Menu {
    top: 316px;
  }
}
@media (max-width: 480px) {
  .layout header #Menu {
    top: 260px;
  }
}
.layout header #Menu.active {
  position: fixed;
  top: 0;
}

.layout .banner_box {
  height: 454px;
  background: url(../Images/2025/banner_bg_layout.png) no-repeat center center;
  background-color: #F6B74C;
  background-size: cover;
  position: relative;
}
@media (max-width: 768px) {
  .layout .banner_box {
    height: 321px;
  }
}
@media (max-width: 480px) {
  .layout .banner_box {
    height: 265px;
  }
}
.layout .banner_box .logo_box {
  position: relative;
  z-index: 10;
}
.layout .banner_box .logo_box img {
  width: 290px;
  margin: 0 auto;
  display: block;
  padding: 60px 0 0;
}
@media (max-width: 768px) {
  .layout .banner_box .logo_box img {
    width: 40%;
    padding: 40px 0 0;
  }
}
@media (max-width: 480px) {
  .layout .banner_box .logo_box img {
    width: 56%;
    padding: 30px 0 0;
  }
}
.layout .banner_box h1 {
  opacity: 0;
  visibility: hidden;
  height: 0;
}
.layout .banner_box > div {
  max-width: 755px;
  height: 221px;
  margin: 96px auto 36px;
  position: relative;
  z-index: 2;
}
@media (max-width: 768px) {
  .layout .banner_box > div {
    max-width: 450px;
    margin: 64px auto 36px;
  }
}
@media (max-width: 480px) {
  .layout .banner_box > div {
    max-width: 95%;
    margin: 64px auto 36px;
  }
}
.layout .banner_box > div img {
  max-width: 722px;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.layout .banner_box > div:before {
  content: "";
  display: block;
  background: url(../Images/2025/slo2.svg) no-repeat;
  background-size: contain;
  width: 430px;
  height: 77px;
  position: absolute;
  top: -20px;
  left: -10px;
  animation-name: jump2;
  animation-duration: 0.35s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
@media (max-width: 768px) {
  .layout .banner_box > div:before {
    width: 300px;
  }
}
@media (max-width: 480px) {
  .layout .banner_box > div:before {
    width: 250px;
  }
}

footer {
  background: #F6B74C;
  position: relative;
  margin: 40px 0 0;
}
footer:before {
  content: "";
  background: url(../Images/footer_deco.png) no-repeat;
  background-size: cover;
  width: 100%;
  height: 25px;
  position: absolute;
  top: -25px;
  left: 50%;
  transform: translateX(-50%);
}
footer .wrap {
  max-width: 100%;
  padding: 25px 50px;
}
footer .wrap .footer_logo {
  display: grid;
  grid-template-columns: 20% 24.5% 45.5%;
  grid-column-gap: 48px;
  justify-content: space-around;
}
footer .wrap .footer_logo li {
  display: flex;
  justify-content: start;
  align-items: center;
  font-size: 1.125rem;
  color: #111;
}
footer .wrap .footer_logo li span {
  padding: 0 16px 0 0;
  margin: 0 16px 0 0;
  border-right: 1px solid #111;
  word-break: keep-all;
}
footer .wrap .footer_logo li:last-child {
  display: flex;
  justify-content: start;
}
footer .wrap .footer_logo li:last-child a {
  margin: 0 32px 0 0;
}
footer .wrap .footer_logo li a {
  word-break: keep-all;
}
footer .wrap .footer_logo li a img {
  transform: translateY(0);
  transition: all 0.25s ease-out;
}
footer .wrap .footer_logo li a:hover img {
  transform: translateY(10px);
}
@media (max-width: 1600px) {
  footer .wrap {
    max-width: 100%;
    padding: 25px 3%;
  }
  footer .wrap .footer_logo {
    display: grid;
    grid-template-columns: 18% 21.5% 42.5%;
    grid-column-gap: 24px;
    justify-content: space-around;
    box-sizing: content-box;
  }
  footer .wrap .footer_logo a img, footer .wrap .footer_logo img {
    object-fit: contain;
    width: 100%;
  }
  footer .wrap .footer_logo img {
    width: 48%;
  }
}
@media (max-width: 768px) {
  footer .wrap .footer_logo {
    grid-template-columns: 1fr 1fr;
  }
  footer .wrap .footer_logo li:last-child {
    grid-column: 1/3;
  }
}
@media (max-width: 480px) {
  footer .wrap .footer_logo {
    grid-template-columns: 1fr;
    grid-row-gap: 24px;
  }
  footer .wrap .footer_logo li:last-child {
    flex-wrap: wrap;
    grid-column: unset;
  }
  footer .wrap .footer_logo li:last-child > a {
    width: 50%;
  }
  footer .wrap .footer_logo li:last-child > img {
    width: 60%;
    left: 114px;
    position: relative;
    margin: 24px 0 0;
  }
}
footer .btn {
  display: inline-block;
  position: relative;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  background: #f39939;
  border-radius: 20px 20px 0 0;
  font-size: 12px;
}

/*--------------------Components: breadcrumb--------------------*/
.breadcrumb {
  display: flex;
  margin: 0 0 24px 12px;
  flex-wrap: wrap;
}
@media (max-width: 375px) {
  .breadcrumb {
    margin-bottom: 24px;
  }
}
.breadcrumb li, .breadcrumb li a {
  color: #494949;
  margin-right: 4px;
  transition: all 0.25s ease-out;
  font-size: 1rem;
}
.breadcrumb li a:hover {
  color: #4CB9CE;
}

/*--------------------Components: card--------------------*/
.content_text .card-list {
  display: block;
  margin: 10px auto 30px;
}
.content_text .card-list .card-item {
  text-indent: 0;
}
.content_text .card-list .card-item .img_box {
  display: block;
  width: 76%;
  max-width: 680px;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  animation-name: jump;
  animation-duration: 0.35s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
.content_text .card-list .card-item .img_box.p_3 {
  width: 32%;
}
.content_text .card-list .card-item .img_box.p_4 {
  width: 100%;
}
.content_text .card-list .card-item .img_box img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.content_text .card-list .card-item p {
  text-align: center;
  font-weight: 600;
  font-size: 1.3125rem;
}
.content_text .card-list .card-item span {
  display: inline-block;
  left: 50%;
  position: relative;
  transform: translateX(-50%);
  padding: 2px 45px;
  color: #fff;
  background: #4CB9CE;
  border-radius: 100px;
}

.card_box {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 45px;
  margin: 120px 0 0;
}
@media (max-width: 1024px) {
  .card_box {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 768px) {
  .card_box {
    margin: 90px 0 0;
    grid-template-columns: 1fr;
  }
}
.card_box .card {
  padding: 25px;
  background: #fff;
  border: 2px solid #494949;
  border-radius: 10px;
  position: relative;
  box-shadow: 5px 5px 0 rgba(73, 73, 73, 0.5);
}
.card_box .card:before {
  content: "";
  background: url(../Images/about_tittle_deco.png) no-repeat;
  background-size: cover;
  display: block;
  width: 24px;
  height: 14px;
  position: absolute;
  transform: rotate(45deg);
  top: 16px;
  right: 10px;
}
.card_box .card:after {
  content: "";
  display: inline-block;
  position: absolute;
  background: #000;
  width: 20px;
  height: 20px;
  transform: rotate(45deg);
  left: -6px;
  top: 219px;
  z-index: -1;
}
.card_box .img_box {
  max-width: 345px;
  height: 200px;
  border-radius: 0 30px 30px 0;
  border: 2px solid #494949;
  overflow: hidden;
  margin: 0 0 20px -35px;
}
@media (max-width: 768px) {
  .card_box .img_box {
    max-width: 116%;
  }
}
.card_box .img_box img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.card_box .card_info {
  margin: 20px 0 40px;
}
@media (max-width: 768px) {
  .card_box .card_info {
    margin: 10px 0 20px;
  }
}
.card_box .card_info p {
  font-size: 1rem;
}
.card_box .card_info p span {
  font-size: 0.8125rem;
  color: #fff;
  background: #494949;
  border-radius: 5px;
  margin: 0 10px 0 0;
  padding: 2px 10px;
}
.card_box .links_box span {
  font-size: 1rem;
  margin: 0 0 40px 0;
}
.card_box .links_box ul {
  display: block;
}
.card_box .links_box ul a {
  background: #4CB9CE;
  font-size: 1rem;
  color: #fff;
  padding: 5px 10px;
  border-radius: 5px;
  line-height: 1.8;
  font-weight: 400;
  display: block;
  transition: all 0.25s ease-out;
  letter-spacing: 1px;
}
.card_box .links_box ul a:hover {
  filter: brightness(1.1);
}
.card_box .links_box ul li:nth-child(2n) a {
  background: #13ae67;
  margin: 10px 0;
}

/*--------------------Components: tickets--------------------*/
.tickets_box {
  display: grid;
  grid-template-columns: 60% 40%;
  grid-gap: 0;
  margin: 32px auto 20px;
  max-width: 520px;
  position: relative;
}
.tickets_box:before {
  content: "";
  display: inline-block;
  width: 30px;
  height: 30px;
  background: #f9f9f9;
  position: absolute;
  left: 57.5%;
  top: -15px;
  border-radius: 50px;
}
.tickets_box:after {
  content: "";
  display: inline-block;
  width: 30px;
  height: 30px;
  background: #f9f9f9;
  position: absolute;
  left: 57.5%;
  bottom: -15px;
  border-radius: 50px;
}
@media (max-width: 768px) {
  .tickets_box {
    max-width: 100%;
  }
}
@media (max-width: 480px) {
  .tickets_box:before, .tickets_box:after {
    left: 56.5%;
  }
}
.tickets_box div {
  padding: 8px 0 8px 8px;
  background: rgba(76, 185, 206, 0.5);
  border-radius: 5px 0 0 5px;
}
.tickets_box div p {
  padding: 15px 30px;
  color: #fff;
  background: #4CB9CE;
  font-size: 1.3125rem;
  font-weight: 600;
  border-radius: 18px 0 0 18px;
  text-align: center;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  border-left: 1px solid #fff;
}
@media (max-width: 768px) {
  .tickets_box div p {
    padding: 10px;
    font-size: 1rem;
    letter-spacing: 1px;
  }
}
.tickets_box div:last-child {
  background: rgba(73, 73, 73, 0.5);
  border-left: 2px dashed #fff;
  border-radius: 0 5px 5px 0;
  padding: 8px 8px 8px 0;
}
.tickets_box div:last-child p {
  background: #494949;
  border-radius: 0 18px 18px 0;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  border-right: 1px solid #fff;
  border-left: unset;
}
@media (max-width: 768px) {
  .tickets_box div:last-child p br:last-child {
    display: none;
  }
}

/*--------------------Components: table--------------------*/
table {
  width: 92%;
  margin: 20px auto;
  border-radius: 5px;
  overflow: hidden;
}
@media (max-width: 768px) {
  table {
    width: 100%;
    margin: 24px 0 24px;
  }
}
@media (max-width: 480px) {
  table {
    letter-spacing: 0;
    font-size: 16px;
  }
}
table th {
  background: #4CB9CE;
  color: #fff;
  font-weight: 600;
  text-align: center;
  padding: 8px 0;
  border-right: 1px solid #fff;
}
table tr {
  background: rgba(76, 185, 206, 0.2);
  border-bottom: 1px solid #fff;
  /* > td:first-child {
      background: rgba($c_m_blue, 0.2);
      text-align: center;
      font-weight: 600;
      vertical-align: middle;
  }*/
}
table tr td {
  background: rgba(255, 255, 255, 0.3);
  padding: 12px 24px;
  border-right: 1px solid #fff;
}
@media (max-width: 1024px) {
  table tr td {
    padding: 8px 12px;
  }
}

.content_text .text_list table ul li {
  margin: 5px 0 5px 62px;
  text-indent: -26px;
}
@media (max-width: 1024px) {
  .content_text .text_list table ul li {
    margin: 5px 0 5px 24px;
  }
}
.content_text .text_list table ul .btn_download {
  color: #fff;
  text-decoration: unset;
  font-size: 1rem;
}
@media (max-width: 1024px) {
  .content_text .text_list table ul .btn_download {
    margin: 10px 0 0 18px;
    font-size: 0.875rem;
    padding: 5px;
  }
}

/*--------------------Components: pager--------------------*/
.pager {
  display: flex;
  justify-content: center;
  width: 330px;
  margin: 0 auto;
}

.pager li {
  margin: 0 10px;
}

.pager li a {
  color: #646464;
  font-size: 1rem;
  background: #EEEEEE;
  border-radius: 10px;
  padding: 4px 10px;
  text-align: center;
  transition: 0.3s ease-in-out;
}

.pager li a:hover,
.pager li .active {
  color: white;
  background: #c9420d;
}

/*pager2*/
.pager_box {
  display: flex;
  justify-content: end;
  align-items: center;
}
@media (max-width: 480px) {
  .pager_box {
    flex-wrap: wrap;
  }
}
.pager_box .pagers {
  display: flex;
  align-items: center;
  border-radius: 3px;
  overflow: hidden;
  /*  margin-right: 20px;*/
}
@media (max-width: 480px) {
  .pager_box .pagers {
    width: 100%;
    justify-content: end;
    margin-right: 0px;
    margin-bottom: 10px;
  }
}
.pager_box .pagers select {
  margin: 0 10px;
  width: 65px;
  height: 30px;
  font-size: 0.875rem;
  text-align: center;
  padding-left: 0;
}
.pager_box .pagers a {
  color: #949494;
  transition: all 0.25s ease-out;
  padding: 2px 5px;
  border: 1px solid #949494;
  background: #fff;
  box-sizing: border-box;
  transition: all 0.25s ease-out;
}
.pager_box .pagers a:hover {
  color: #fff;
  background: #4CB9CE;
}
.pager_box .pagers a.active {
  background: #4CB9CE;
  color: #fff;
  cursor: auto;
}
.pager_box .pagers a.active:hover, .pager_box .pagers a.active:checked {
  color: #fff;
}
@media (max-width: 480px) {
  .pager_box .pagers a {
    font-size: 0.875rem;
  }
}
.pager_box .pager_all {
  display: flex;
  align-items: center;
  white-space: nowrap;
}
@media (max-width: 480px) {
  .pager_box .pager_all {
    width: 100%;
    justify-content: end;
    font-size: 0.875rem;
  }
}
.pager_box .pager_all input[type=text] {
  width: 65px;
  margin: 0 10px;
  height: 30px;
  font-size: 0.875rem;
  text-align: center;
  padding-left: 0;
}

/*--------------------Components: gotop--------------------*/
#gotop {
  position: fixed;
  z-index: 90;
  right: 6%;
  bottom: 18%;
  display: none;
  /*color: #646464;
  padding: 20px;
  transition: all 0.5s;
  text-align: center;*/
  /*&:before {
      content: "";
      background: url(../Images/icons/top.svg) no-repeat center center;
      background-size: contain;
      display: inline-block;
      width: 18px;
      height: 16px;
  }*/
  /*    &:hover {
      color: #c9420d;
  }*/
}
@media (max-width: 1200px) {
  #gotop {
    /* color: #fff;
    bottom: 29.5%;
    background: #3E3E3E;
    opacity: 0.8;
    padding: 4px 8px;
    border-radius: 5px;*/
  }
}

/*--------------------Components: pages--------------------*/
.main_box {
  margin: 120px 0;
}
@media (max-width: 1024px) {
  .main_box {
    margin: 145px 0 90px;
  }
}
@media (max-width: 480px) {
  .main_box {
    margin: 125px 0 90px;
  }
}
.main_box .width_box {
  max-width: 1600px;
  width: 100%;
  margin: 0 auto;
}
@media (max-width: 1600px) {
  .main_box .width_box {
    max-width: 94%;
  }
}
.main_box .width_box.middle {
  max-width: 1400px;
}
@media (max-width: 1024px) {
  .main_box .width_box.middle {
    max-width: 94%;
  }
}
.main_box .width_box.small {
  max-width: 1000px;
}
@media (max-width: 1024px) {
  .main_box .width_box.small {
    max-width: 94%;
  }
}

.content_box {
  background: rgba(255, 255, 255, 0.6);
  border-radius: 10px;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.08);
  padding: 4% 12% 8%;
}
@media (max-width: 1024px) {
  .content_box {
    padding: 4% 8% 8%;
  }
}
@media (max-width: 480px) {
  .content_box {
    padding: 8%;
  }
}

/*--------------------Components: form--------------------*/
.form_group {
  width: 100%;
  margin: 120px 0 0;
  position: relative;
}
@media (max-width: 768px) {
  .form_group {
    margin: 90px 0 0;
  }
}
.form_group label, .form_group .label {
  display: grid;
  grid-template-columns: 24% 68%;
  grid-gap: 60px;
  align-items: center;
  margin: 0 0 24px;
}
@media (max-width: 768px) {
  .form_group label, .form_group .label {
    display: block;
  }
}
.form_group label > span i, .form_group .label > span i {
  font-size: 0.8125rem;
  color: #d43131;
  letter-spacing: 0;
}
.form_group label p, .form_group .label p {
  display: block;
  width: 100%;
}
.form_group label p input, .form_group .label p input {
  width: 100%;
}

/*密碼顯示*/
.password {
  position: relative;
}
.password .eye {
  background-color: transparent;
  border: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 15px;
  cursor: pointer;
}
.password .eye .show {
  display: block;
}
.password .eye .hide {
  display: none;
}
.password .eye.active .show {
  display: none;
}
.password .eye.active .hide {
  display: block;
}

.rePswd .eye {
  transform: translateY(0);
  top: 25px;
}

/*radio group*/
.form_group .label .radio_group {
  display: flex;
  margin: 10px 0 24px;
}
.form_group .label .radio_group label {
  position: relative;
  display: flex;
  margin: 0 36px 10px 0;
  justify-content: start;
  grid-gap: 6px;
}
.form_group .label .radio_group label input[type=radio] {
  position: absolute;
  visibility: hidden;
}
.form_group .label .radio_group label input[type=radio]:checked ~ b:after {
  opacity: 1;
}
.form_group .label .radio_group label input[type=checkbox] {
  position: absolute;
  visibility: hidden;
}
.form_group .label .radio_group label input[type=checkbox]:checked ~ b:after {
  opacity: 1;
}
.form_group .label .radio_group label b {
  width: 23px;
  height: 23px;
  border-radius: 3px;
  display: flex;
  border: 2px solid #CCC;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  margin: 5px 5px 0 0;
  cursor: pointer;
}
.form_group .label .radio_group label b:after {
  background: #4CB9CE;
  content: "";
  width: 17px;
  height: 17px;
  border-radius: 3px;
  opacity: 0;
  transition: opacity 0.3s ease-out;
  display: block;
}

/*提醒*/
.field-validation-error {
  display: inline-flex;
  flex-direction: column;
  padding: 10px;
  border: 1px solid #494949;
  align-items: center;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  margin: 40px auto 10px;
  animation-name: jump;
  animation-duration: 0.35s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  border-radius: 3px;
}
.field-validation-error:before {
  content: "";
  display: block;
  width: 15px;
  height: 15px;
  background: #fff;
  border-left: 1px solid #494949;
  border-top: 1px solid #494949;
  position: absolute;
  left: 50%;
  transform: rotate(45deg) translateX(-50%);
  top: -3px;
}
.field-validation-error span {
  font-size: 0.9375rem;
  color: #d43131;
  display: unset;
  text-align: center;
}

@keyframes jump {
  100% {
    transform: translate(-50%, -5px);
  }
}
/*檔案上傳*/
.form_group .upload {
  margin: 0 0 34px;
}
.form_group .upload .btn_download {
  margin: 0;
  font-size: 0.8125rem;
  background: #494949;
  letter-spacing: 0;
}
.form_group .upload .btn_download:hover {
  background: #3f3f3f;
}
.form_group .upload > span {
  line-height: 1.8;
}
.form_group .upload p {
  margin: 0 0 10px;
}
.form_group .upload label {
  display: inline-block;
  background: #4CB9CE;
  font-size: 0.9375rem;
  color: #fff;
  padding: 10px;
  width: 70px;
  cursor: pointer;
  margin: 10px 0;
  border-radius: 5px;
}
.form_group .upload label input[type=file] {
  display: none;
}
.form_group .upload .file_group p {
  letter-spacing: 1px;
  text-align: left;
  grid-column: 1/4;
  font-size: 0.9375rem;
  color: #4CB9CE;
}

/*圖片上傳*/
.form_group .file_img .img {
  display: inline-block;
  background: #ddd;
  font-size: 0.9375rem;
  color: #494949;
  padding: 10px;
  border: medium dashed #ccc;
  width: 70px;
  border-radius: 5px;
  text-align: center;
}
.form_group .file_img .img:before {
  content: "+";
  font-size: 2.5rem;
  font-weight: 600;
  display: block;
  line-height: 1;
  margin-bottom: 5px;
}

.form_group .file_group {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-column-gap: 30px;
  grid-row-gap: 15px;
  width: 100%;
  max-width: 100%;
  margin: 0;
}
@media (max-width: 480px) {
  .form_group .file_group {
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 15px;
  }
}
.form_group .file_group .img_box {
  width: 100%;
  border-radius: 10px;
  overflow: hidden;
  margin: 0;
}
.form_group .file_group img {
  width: 100%;
  object-fit: cover;
}
.form_group .file_group.current {
  padding: 20px;
  background: #ddd;
  border-radius: 5px;
  margin: 0 0 34px;
  position: relative;
}
@media (max-width: 768px) {
  .form_group .file_group.current {
    width: 86%;
  }
}
.form_group .file_group.current:before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  background: #ddd;
  position: absolute;
  left: 35px;
  transform: rotate(-45deg);
  top: -9px;
}
.form_group .file_group.current > span {
  grid-column: 1/4;
  color: #494949;
}
@media (max-width: 480px) {
  .form_group .file_group.current > span {
    grid-column: 1/3;
  }
}
.form_group .file_group.current p {
  position: relative;
}
.form_group .file_group.current p .btn_delete {
  position: absolute;
  top: -5px;
  right: -5px;
}
.form_group .file_group.current p .btn_delete:before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 50px;
  background: #d43131;
}
.form_group .file_group.current p .btn_delete:after {
  content: "✕";
  font-family: Poppins;
  font-size: 0.875rem;
  color: #fff;
  position: absolute;
  top: -2.5px;
  right: 2.5px;
  font-weight: 600;
}
.form_group .file_group.current div {
  display: flex;
  justify-content: center;
  align-items: center;
  color: #d43131;
}
.form_group .file_group.current a {
  font-size: 1rem;
  color: #494949;
  word-break: normal;
}
.form_group .file_group.current a i:before {
  content: "";
  background: url(../Images/file.png) no-repeat;
  background-size: cover;
  display: block;
  margin: 0 auto 6px;
  width: 41px;
  height: 52px;
}

/*--------------------Components: text--------------------*/
.content_text {
  width: 100%;
  margin: 120px 0 0;
  position: relative;
}
@media (max-width: 768px) {
  .content_text {
    margin: 90px 0 0;
  }
}
.content_text li {
  margin: 0 0 16px;
}

/*--------------------Components: scrollBar--------------------*/
#scrollBar::-webkit-scrollbar-track {
  background-color: #d9d9d9;
}

#scrollBar::-webkit-scrollbar {
  width: 5px;
  background-color: #d9d9d9;
}

#scrollBar::-webkit-scrollbar-thumb {
  background-color: #F6B74C;
}

/*--------------------Components: 社群登入--------------------*/
.form_group .social-login {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.form_group .social-login a {
  display: block;
  padding: 8px;
  border-radius: 5px;
  color: #fff;
  font-weight: 400;
  width: 64%;
  text-align: center;
  margin: 10px 0;
  cursor: pointer;
}
@media (max-width: 768px) {
  .form_group .social-login a {
    width: 74%;
  }
}
.form_group .social-login .fb {
  background: #fff;
  border: 1px solid #0171C5;
  color: #0171C5;
}
.form_group .social-login .fb:hover {
  background: #0171C5;
  border: 1px solid #0171C5;
  color: #fff;
}
.form_group .social-login .google {
  background: #fff;
  border: 1px solid #3E3E3E;
  color: #3E3E3E;
}
.form_group .social-login .google:hover {
  background: #3E3E3E;
  border: 1px solid #3E3E3E;
  color: #fff;
}
.form_group .social-login .line {
  background: #fff;
  border: 1px solid #1b834c;
  color: #1b834c;
}
.form_group .social-login .line:hover {
  background: #1b834c;
  border: 1px solid #1b834c;
  color: #fff;
}

/*--------------------首頁--------------------*/
.index {
  height: 100vh;
}

.index header {
  position: relative;
  width: 100%;
  border-bottom: 1px solid #fff;
  z-index: 5;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 65px;
  background: #F6B74C;
}
@media (max-width: 1024px) {
  .index header {
    justify-content: center;
    height: unset;
    flex-wrap: wrap;
  }
}
.index header ul {
  display: flex;
  flex-flow: row;
  justify-content: center;
  position: relative;
}
@media (max-width: 1024px) {
  .index header ul {
    padding: 10px 0;
    flex-wrap: wrap;
  }
}
.index header ul li {
  position: relative;
}
.index header ul li.logo {
  display: block;
  width: 208px;
}
.index header ul li.logo img {
  width: 100%;
}
.index header ul li:last-child:before {
  display: none;
}
.index header ul li:before {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 17px;
  background: #fff;
  /*opacity: 0.5;*/
}
@media (max-width: 768px) {
  .index header ul li:before {
    background: #fff;
  }
}
.index header ul li > a, .index header ul li > p {
  display: flex;
  height: 60px;
  padding: 0 25px;
  box-sizing: border-box;
  align-items: center;
  color: #494949;
  transition: color 0.15s ease-out;
  font-size: 1.1875rem;
}
@media (max-width: 1400px) {
  .index header ul li > a, .index header ul li > p {
    padding: 0 18px;
  }
}
@media (max-width: 768px) {
  .index header ul li > a, .index header ul li > p {
    font-size: 1rem;
    padding: 5px;
    height: unset;
  }
}
.index header ul li > a:hover, .index header ul li > p:hover {
  animation-name: text_move;
  animation-duration: 0.35s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  color: #fff;
}
@media (max-width: 1024px) {
  .index header ul li > a:hover, .index header ul li > p:hover {
    animation-name: none;
  }
}
.index header ul li > a:hover:after, .index header ul li > p:hover:after {
  animation-name: shadow_move;
  animation-duration: 0.35s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
@keyframes text_move {
  100% {
    transform: translateY(-5px);
  }
}
@keyframes shadow_move {
  100% {
    transform: translateY(5px) scale(1.15);
    opacity: 0.08;
  }
}
.index header ul li div {
  position: absolute;
  width: 100%;
  transition: opacity 0.3s ease-out;
  visibility: hidden;
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity 0.6s cubic-bezier(0.215, 0.61, 0.355, 1), transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1), visibility 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
  background: #fdfdfd;
  box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.16);
  border-radius: 5px;
}
@media (max-width: 1024px) {
  .index header ul li div {
    background: #4CB9CE;
    width: 136%;
    left: -12px;
    box-shadow: 0px 0px 0px;
  }
}
.index header ul li div a {
  display: block;
  color: #494949;
  padding: 12px 0;
  text-align: center;
  font-size: 1.0625rem;
  transition: color 0.15s ease-out;
}
@media (max-width: 1024px) {
  .index header ul li div a {
    font-size: 0.875rem;
    color: #fff;
  }
  .index header ul li div a:hover {
    background: #fff;
    color: #4CB9CE;
  }
}
.index header ul li div a:hover {
  color: #4CB9CE;
}
.index header ul li div a:last-child {
  border: none;
}
.index header ul li.active div {
  visibility: visible;
  transform: translateY(0);
  opacity: 1;
}
.index header ul li:hover div {
  visibility: visible;
  transform: translateY(0);
  opacity: 1;
}

.index .nav_btn {
  display: flex;
  padding-left: 2%;
}
.index .nav_btn a img {
  width: 23px;
}
@media (max-width: 768px) {
  .index .nav_btn a {
    padding-left: unset;
    font-size: 0.9375rem;
    padding: 5px 10px;
    margin: 0 0 15px;
  }
}

.index main {
  position: relative;
}
.index main .banner {
  height: 280px;
  background: url(../Images/2025/banner_bg.png) no-repeat center center;
  background-color: #F6B74C;
  background-size: cover;
  position: relative;
}
@media (max-width: 768px) {
  .index main .banner {
    height: 345px;
  }
}
@media (max-width: 480px) {
  .index main .banner {
    height: 232px;
  }
}
.index main .banner:before {
  content: "";
  display: block;
  width: 100%;
  height: 84px;
  background: url(../Images/2025/deco1.svg) center center no-repeat;
  background-size: cover;
  position: absolute;
  bottom: -82px;
  left: 0;
  z-index: 1;
  animation-name: jump3;
  animation-duration: 1.3s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
@media (max-width: 768px) {
  .index main .banner:before {
    background-size: contain;
    bottom: -52px;
    animation-name: unset;
  }
}
@media (max-width: 480px) {
  .index main .banner:before {
    bottom: -50px;
  }
}
@keyframes jump3 {
  100% {
    transform: translate(0, -15px);
  }
}
.index main .banner .logo_box {
  position: relative;
  z-index: 10;
}
.index main .banner .logo_box img {
  width: 290px;
  margin: 0 auto;
  display: block;
  padding: 60px 0 0;
}
@media (max-width: 768px) {
  .index main .banner .logo_box img {
    width: 40%;
    padding: 40px 0 0;
  }
}
@media (max-width: 480px) {
  .index main .banner .logo_box img {
    width: 56%;
  }
}
.index main .banner h1 {
  opacity: 0;
  visibility: hidden;
  height: 0;
}
.index main .banner > div {
  max-width: 755px;
  height: 221px;
  margin: 80px auto 36px;
  position: relative;
  z-index: 2;
}
@media (max-width: 768px) {
  .index main .banner > div {
    max-width: 94%;
  }
}
.index main .banner > div img {
  max-width: 722px;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.index main .banner > div:before {
  content: "";
  display: block;
  background: url(../Images/2025/slo2.svg) no-repeat;
  background-size: contain;
  width: 430px;
  height: 77px;
  position: absolute;
  top: -20px;
  left: -10px;
  animation-name: jump2;
  animation-duration: 0.35s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
@media (max-width: 768px) {
  .index main .banner > div:before {
    width: 300px;
  }
}
@media (max-width: 480px) {
  .index main .banner > div:before {
    width: 250px;
  }
}
@keyframes jump2 {
  100% {
    transform: translate(0, -5px) scale(1.02);
  }
}
.index main .cta_btn {
  margin: 180px 0 0;
  z-index: 2;
}
@media (max-width: 768px) {
  .index main .cta_btn {
    margin: 110px 0 0;
  }
}
.index main .cta_btn p {
  text-align: center;
  font-size: 1.25rem;
  margin: 0 0 80px;
  font-weight: 600;
}
@media (max-width: 768px) {
  .index main .cta_btn p {
    margin: 0 0 40px;
  }
}
.index main .cta_btn .btn.cta {
  font-size: 2.1875rem;
  font-weight: 600;
  padding: 15px 70px;
  border: 0px;
  border-radius: 200px;
  background: #F6B74C;
  box-shadow: 0px 6px 0px rgba(0, 0, 0, 0.45);
  transform: translateY(0);
  transition: all 0.25s ease-out;
  transform: translate(-50%, -10px);
  left: 50%;
  position: relative;
  margin: 0 0 35px;
  animation-name: big;
  animation-duration: 0.35s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
@media (max-width: 768px) {
  .index main .cta_btn .btn.cta {
    font-size: 1.5625rem;
  }
}
.index main .cta_btn .btn.cta:hover {
  background: #494949;
  transform: translate(-50%, 0);
}
@keyframes big {
  100% {
    transform: translate(-50%, -10px) scale(1.02);
  }
}
.index main .gift_box {
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid #898989;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  background: #fff;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
@media (max-width: 480px) {
  .index main .gift_box {
    margin: 0 3%;
    left: unset;
    transform: unset;
  }
}
.index main .gift_box p {
  font-size: 1.5625rem;
  letter-spacing: 2px;
  font-weight: 400;
  padding: 10px 30px;
  border-right: 1px solid #898989;
  background: #dbf2e8;
}
.index main .gift_box p:before {
  content: "";
  display: inline-block;
  background: url(../Images/2025/icon_from.svg) no-repeat;
  background-size: contain;
  width: 60px;
  height: 60px;
  margin-right: 10px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
@media (max-width: 768px) {
  .index main .gift_box p:before {
    width: 45px;
    height: 45px;
  }
}
.index main .gift_box p i {
  font-weight: 600;
  margin-left: 70px;
}
@media (max-width: 768px) {
  .index main .gift_box p i {
    margin-left: 55px;
  }
}
.index main .gift_box p span {
  display: block;
  font-size: 1rem;
  margin-left: 70px;
}
@media (max-width: 768px) {
  .index main .gift_box p span {
    margin-left: 55px;
  }
}
@media (max-width: 768px) {
  .index main .gift_box p {
    font-size: 1.25rem;
    letter-spacing: 1px;
    padding: 5px 15px;
  }
  .index main .gift_box p span {
    font-size: 0.875rem;
  }
}
.index main .gift_box a {
  color: #fff;
  background: #2ca34c;
  border-radius: 5px;
  font-size: 1.25rem;
  padding: 10px 20px;
  margin: 0 30px;
  transition: all 0.25s ease-out;
  word-break: keep-all;
}
@media (max-width: 768px) {
  .index main .gift_box a {
    font-size: 1.125rem;
    margin: 0 15px;
  }
}
@media (max-width: 768px) {
  .index main .gift_box a {
    padding: 6px 12px;
  }
}
.index main .gift_box a:hover {
  background: #494949;
}

.index footer {
  background: unset;
  /* .wrap {
       margin: 0 auto;
   }*/
}
.index footer:before {
  display: none;
}

/*--------- 登入頁/註冊頁/忘記密碼 ---------*/
.small .form_group > label {
  grid-template-columns: 18% 74%;
}

.help {
  display: flex;
  width: 100%;
  justify-content: end;
  align-items: center;
}
.help a {
  margin-left: 6px;
  font-size: 1rem;
  text-decoration: underline;
  color: #494949;
}
.help a:last-child {
  color: #4CB9CE;
}

/*--------- 發票列表頁 ---------*/
.info_list {
  display: flex;
  justify-content: center;
  align-items: center;
  /*flex-wrap: wrap;*/
}
.info_list li {
  margin-bottom: 36px;
  position: relative;
  margin: 40px;
}
@media (max-width: 768px) {
  .info_list li {
    margin: 40px 10px;
  }
}
.info_list li span {
  font-size: 0.8125rem;
  padding: 5px 10px;
  background: #fff;
  border: 1px solid #DDD;
  animation-name: jump;
  animation-duration: 0.35s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  position: absolute;
  top: -54px;
  left: 50%;
  transform: translate(-50%, 0);
  word-break: keep-all;
  border-radius: 3px;
}
.info_list li span:before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  background: #fff;
  border-left: 1px solid #DDD;
  border-bottom: 1px solid #DDD;
  position: absolute;
  left: 50%;
  transform: rotate(-45deg) translateX(-85%);
  bottom: 1px;
}
.info_list li span.error {
  color: #d43131;
}
.info_list li span.final {
  color: #13ae67;
}
.info_list li a {
  color: #494949;
  font-size: 1.1875rem;
  display: flex;
  justify-content: center;
  align-items: center;
  transform: translateY(-6px);
  transition: all 0.25s ease-out;
  word-break: keep-all;
  color: #fff;
  padding: 10px 40px;
  border-radius: 100px;
  background: #4CB9CE;
}
@media (max-width: 768px) {
  .info_list li a {
    padding: 10px 15px;
  }
}
.info_list li a:hover {
  transform: translateY(0);
  background: #494949;
}
.info_list li:last-child a {
  background: #F6B74C;
}
.info_list li:last-child a:hover {
  background: #494949;
}

.info.main_box {
  margin: 120px 0 90px;
}
@media (max-width: 768px) {
  .info.main_box {
    margin: 100px 0 90px;
  }
}
.info label, .info .label {
  display: block;
}
@media (max-width: 768px) {
  .info .form_group {
    margin: 60px 0 0;
  }
}
@media (max-width: 768px) {
  .info .heder_1st {
    text-align: center;
  }
}
.info .heder_2nd {
  text-align: right;
  margin: 10px 0;
}
@media (max-width: 768px) {
  .info .heder_2nd {
    margin: 20px 0 10px;
  }
  .info .heder_2nd:after {
    content: "";
    display: inline-block;
    background: url(../Images/tittle_deco2.png) no-repeat;
    background-size: contain;
    width: 18px;
    height: 18px;
    margin-left: 6px;
    top: 1px;
    position: relative;
  }
}
.info .heder_2nd:before {
  content: "";
  display: inline-block;
  background: url(../Images/tittle_deco2.png) no-repeat;
  background-size: contain;
  width: 23px;
  height: 23px;
  margin-right: 6px;
  top: 4px;
  position: relative;
}
@media (max-width: 768px) {
  .info .heder_2nd:before {
    width: 18px;
    height: 18px;
    top: 1px;
  }
}
@media (max-width: 768px) {
  .info .heder_2nd {
    text-align: center;
  }
}
.info table {
  width: 100%;
}
@media (max-width: 768px) {
  .info table tr th.type {
    display: none;
  }
}
.info table tr > td {
  background: rgba(255, 255, 255, 0.3);
}
.info table tr > td:first-child {
  padding: 12px 5px;
}
.info table tr > td:first-child span {
  font-weight: 400;
  font-size: 0.875rem;
  padding: 4px 15%;
  border-radius: 3px;
  background: #fff;
  white-space: pre;
}
.info table tr > td:first-child span.type1 {
  border: 1px solid #4CB9CE;
  color: #4CB9CE;
}
.info table tr > td:first-child span.type2 {
  border: 1px solid #13ae67;
  color: #13ae67;
}
.info table tr > td:first-child span.type3 {
  border: 1px solid #F6B74C;
  color: #F6B74C;
}
.info table tr > td:first-child span.type4 {
  border: 1px solid #494949;
  color: #494949;
}
.info table tr > td:first-child span.type5 {
  border: 1px solid #d43131;
  color: #d43131;
}
@media (max-width: 768px) {
  .info table tr > td {
    font-size: 0.875rem;
    font-weight: 400;
    padding: 8px 5px;
  }
}
.info table tr td {
  text-align: center;
  vertical-align: middle;
}
@media (max-width: 768px) {
  .info table tr td.type {
    display: none;
  }
}
@media (max-width: 768px) {
  .info table tr td {
    padding: 8px 2px;
  }
}
.info table tr td.price {
  font-family: "Arial";
}
.info table tr td.price:before {
  content: "$";
  font-weight: 600;
  margin-right: 2px;
}
.info table tr td:last-child {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
}
.info table tr td:last-child a {
  font-size: 0px;
  width: 30px;
  height: 30px;
  background: #fff;
  margin: 0 5px;
  border-radius: 3px;
  border: 1px solid #4CB9CE;
  box-sizing: border-box;
  position: relative;
  transform: translateY(-5px);
  transition: all 0.25s ease-out;
  top: 4px;
}
@media (max-width: 768px) {
  .info table tr td:last-child a {
    width: 25px;
    height: 25px;
    margin: 0 2px;
  }
}
.info table tr td:last-child a.edit:before {
  content: "";
  display: inline-flex;
  background: url(../Images/btn_edit.png) no-repeat;
  background-size: contain;
  justify-content: center;
  align-items: center;
  width: 21px;
  height: 21px;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
@media (max-width: 768px) {
  .info table tr td:last-child a.edit:before {
    width: 18px;
    height: 18px;
  }
}
.info table tr td:last-child a.delet {
  background: #494949;
  border: 0px solid #4CB9CE;
}
.info table tr td:last-child a.delet:before {
  content: "";
  display: inline-flex;
  background: url(../Images/btn_delet.png) no-repeat;
  background-size: contain;
  justify-content: center;
  align-items: center;
  width: 17px;
  height: 19px;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
@media (max-width: 768px) {
  .info table tr td:last-child a.delet:before {
    width: 14px;
    height: 16px;
  }
}
.info table tr td:last-child a:hover {
  transform: translateY(0);
}

.final_prompt {
  font-size: 1.125rem;
  text-align: center;
  width: 66%;
  margin: 0 auto;
  padding: 20px;
  border-radius: 5px;
  border: 1px solid #494949;
  background: #fff;
  animation-name: jump_final;
  animation-duration: 0.35s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  position: relative;
  transform: translate(0, 0);
}
@media (max-width: 768px) {
  .final_prompt {
    width: 85%;
  }
  .final_prompt br {
    display: none;
  }
}
.final_prompt img {
  display: block;
  margin: 0 auto 12px;
}
.final_prompt:after {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  background: #fff;
  border-left: 1px solid #494949;
  border-bottom: 1px solid #494949;
  position: absolute;
  left: 50%;
  transform: rotate(-45deg) translateX(-80%);
  bottom: 1px;
}
.final_prompt b {
  font-size: 1.875rem;
  font-weight: 600;
  display: block;
  width: 100%;
  color: #13ae67;
}
.final_prompt span {
  font-size: 0.9375rem;
  padding: 5px 15px;
  background: #13ae67;
  color: #fff;
  border-radius: 50px;
  letter-spacing: 1px;
  width: 88%;
  display: block;
}

@keyframes jump_final {
  100% {
    transform: translate(0, -5px);
  }
}
/*--------- 登錄發票頁 ---------*/
.info .label.type .radio_group {
  justify-content: center;
  margin-bottom: 90px;
}
@media (max-width: 768px) {
  .info .label.type .radio_group {
    flex-wrap: wrap;
    margin-left: 18px;
  }
}
.info .label.type .radio_group label b, .info .label.type .radio_group label b:after {
  border-radius: 100px;
}
.info .upload_box {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: start;
}
@media (max-width: 768px) {
  .info .upload_box {
    grid-template-columns: 1fr;
    grid-row-gap: 60px;
  }
}
.info .upload_box .upload .file_img .img {
  width: 90%;
  margin: 0 auto;
  background: #4CB9CE;
  border-radius: 100px;
  color: #fff;
  font-size: 1.4375rem;
  font-weight: 600;
  border: 0px;
}
.info .upload_box .upload .file_img .img:before {
  display: none;
}
.info .upload_box .upload .file_img .img:after {
  content: "";
}
.info .upload_box .upload p {
  text-align: center;
}
.info .upload_box .upload_img {
  width: 90%;
  margin: 0 auto;
}
.info .upload_box .upload_img .img_box {
  width: 100%;
  margin: 0 auto;
  display: block;
  position: relative;
}
.info .upload_box .upload_img .img_box span {
  color: #cbcbcb;
  font-size: 2.8125rem;
  text-align: center;
  display: block;
  margin-top: 120px;
}
@media (max-width: 768px) {
  .info .upload_box .upload_img .img_box span {
    font-size: 2.1875rem;
    margin-top: 40px;
  }
}
.info .upload_box .upload_img .img_box img {
  object-fit: cover;
  width: 70%;
  display: block;
  margin: 0 auto;
}
.info .upload_info label a {
  color: #4CB9CE;
  font-size: 1rem;
  transition: all 0.25s ease-out;
}
.info .upload_info label a:hover {
  color: #494949;
}
.info .upload_info ul {
  padding: 20px 30px;
  background: #949494;
  border-radius: 3px;
}
.info .upload_info ul li {
  color: #fff;
  font-size: 1rem;
}
.info .send {
  display: flex;
  justify-content: center;
  align-items: center;
}
.info .send input[type=submit] {
  font-size: 1.4375rem;
  width: auto;
  height: auto;
  margin: 50px 10px 0;
  border-radius: 100px;
  padding: 10px 50px;
  font-weight: 600;
  background: #13ae67;
}
@media (max-width: 480px) {
  .info .send input[type=submit] {
    margin: 30px 10px 0;
  }
}
.info .send input[type=submit]#save {
  background: #fff;
  border: 1px solid #4CB9CE;
  color: #4CB9CE;
}
.info .send input[type=submit]#delet {
  background: #494949;
}

/*--------- 活動辦法頁 ---------*/
.content_box.about {
  padding: 4% 8% 8%;
  letter-spacing: 0;
}
@media (max-width: 1024px) {
  .content_box.about {
    padding: 8%;
  }
}

.about .connect_box {
  text-align: center;
  display: block;
  background: #13ae67;
  color: #fff;
  margin: 48px 0 0;
  border-radius: 5px;
  padding: 12px;
}
.about .connect_box a {
  color: #fff;
}
.about .connect_box a:first-child {
  display: block;
}

/*--------- 皇冠禮票選頁 ---------*/
.main_box .content_box.vote {
  padding: 4% 4% 6%;
}
@media (max-width: 480px) {
  .main_box .content_box.vote {
    padding: 8% 4%;
  }
}

.content_top {
  margin: 120px auto 0;
  width: 100%;
  margin-bottom: 48px;
  padding: 36px 12%;
  border: 1px solid rgba(73, 73, 73, 0.3);
  border-radius: 10px;
  box-sizing: border-box;
}
@media (max-width: 1024px) {
  .content_top {
    padding: 36px 8%;
  }
}
@media (max-width: 768px) {
  .content_top {
    margin: 90px auto 36px;
  }
}
@media (max-width: 480px) {
  .content_top {
    padding: 24px 8%;
  }
}
.content_top ul {
  margin-left: 0;
  display: none;
}
.content_top ul li {
  text-indent: -20px;
  margin-left: 20px;
}
.content_top ul li:before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50px;
  margin-right: 10px;
  background: #4CB9CE;
  top: -2px;
  position: relative;
}
.content_top .tittle_a ~ p {
  margin: 0;
  letter-spacing: 0;
}
.content_top .more_btn {
  padding: 24px 0 0;
  cursor: pointer;
  position: relative;
}
@media (max-width: 1024px) {
  .content_top .more_btn {
    padding: 12px 0 0;
  }
}
.content_top .more_btn:before, .content_top .more_btn:after {
  content: "";
  display: inline-block;
  width: 40%;
  height: 1px;
  border-top: 1px dashed #c1c1c1;
  position: absolute;
  top: 66%;
}
@media (max-width: 1400px) {
  .content_top .more_btn:before, .content_top .more_btn:after {
    width: 30%;
  }
}
@media (max-width: 768px) {
  .content_top .more_btn:before, .content_top .more_btn:after {
    width: 18%;
  }
}
@media (max-width: 480px) {
  .content_top .more_btn:before, .content_top .more_btn:after {
    display: none;
  }
}
.content_top .more_btn:after {
  right: 0;
}
.content_top .more_btn span {
  display: block;
  text-align: center;
  color: #c1c1c1;
  font-size: 1.25rem;
  padding: 0 20px;
}
@media (max-width: 375px) {
  .content_top .more_btn span {
    font-size: 1rem;
  }
}
.content_top .more_btn span.open {
  display: block;
}
.content_top .more_btn span.close {
  display: none;
}
.content_top .more_btn.active span.open {
  display: none;
}
.content_top .more_btn.active span.close {
  display: block;
}
.content_top .more_text {
  margin-top: 24px;
}

.content_main {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
}

/*tabs*/
.tabs {
  width: 100%;
  position: relative;
  display: flex;
  justify-content: start;
  align-items: center;
  border-bottom: 1px solid #13ae67;
  margin-bottom: 72px;
  position: relative;
}
@media (max-width: 1024px) {
  .tabs {
    grid-column: 1/3;
    width: 93%;
  }
}
@media (max-width: 768px) {
  .tabs {
    justify-content: space-between;
    width: 100%;
    margin-bottom: 36px;
  }
}
.tabs:after {
  content: "";
  background: url(../Images/tittle_deco.png) no-repeat;
  background-size: cover;
  width: 46px;
  height: 14px;
  position: absolute;
  right: 0;
  bottom: 0;
  right: -55px;
  bottom: -7px;
}
@media (max-width: 768px) {
  .tabs:after {
    display: none;
  }
}
.tabs .tab-label {
  width: 22%;
  border: 1px solid #13ae67;
  border-radius: 5px 5px 0 0;
  color: #13ae67;
  font-size: 1.875rem;
  font-weight: 600;
  padding: 12px 20px;
  margin-right: 10px;
  text-align: center;
  cursor: pointer;
  line-height: 1;
  position: relative;
  left: 20px;
}
@media (max-width: 1400px) {
  .tabs .tab-label {
    width: 30%;
  }
}
@media (max-width: 768px) {
  .tabs .tab-label {
    font-size: 1.3125rem;
    left: 0;
    width: 50%;
  }
  .tabs .tab-label:last-child {
    margin-right: 0;
  }
}
.tabs .tab-label.active, .tabs .tab-label:hover {
  background: #13ae67;
  color: #fff;
}
.tabs .more {
  position: absolute;
  bottom: -48px;
}
.tabs .more p {
  margin-left: 20px;
}
@media (max-width: 768px) {
  .tabs .more p {
    margin-bottom: 12px;
    margin-left: 10px;
  }
}

/*search*/
.vote .content_main form {
  position: relative;
  margin-bottom: 72px;
}
@media (max-width: 1024px) {
  .vote .content_main form {
    grid-column: 1/3;
  }
}
@media (max-width: 768px) {
  .vote .content_main form {
    margin-top: 36px;
  }
}
.vote .content_main form .btn.all {
  border-radius: 5px;
  padding: 5px 15px;
  border: 0px;
  background: #c1c1c1;
  color: #fff;
  font-size: 1rem;
  position: absolute;
  right: 0;
  margin: 0;
  bottom: -48px;
  position: absolute;
  transition: all 0.25s ease-out;
}
.vote .content_main form .btn.all:hover {
  background: #494949;
}

.search_bar {
  display: flex;
  justify-content: end;
  align-items: center;
  /* margin-bottom: 24px;*/
}
@media (max-width: 1024px) {
  .search_bar {
    justify-content: center;
  }
}
@media (max-width: 768px) {
  .search_bar {
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 12px;
  }
}
.search_bar span {
  font-size: 1.4375rem;
  color: #545454;
  font-weight: 600;
}
@media (max-width: 768px) {
  .search_bar span {
    display: block;
    width: 100%;
    font-size: 1.125rem;
    margin: 0 0 10px 10px;
  }
}
.search_bar input {
  height: 60px;
  border-radius: 50px;
  margin: 0 8px;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.16);
  border: 0px;
  width: 40%;
  padding-left: 24px;
  font-size: 1.4375rem;
  color: #494949;
}
@media (max-width: 1024px) {
  .search_bar input {
    width: 68%;
  }
}
@media (max-width: 768px) {
  .search_bar input {
    width: 82%;
    height: 39px;
    font-size: 1.125rem;
    margin-left: 0px;
  }
}
.search_bar .search {
  width: 60px;
  height: 60px;
  border: 0px;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.16);
  background: #F6B74C;
  position: relative;
  transition: all 0.25s ease-out;
}
.search_bar .search:hover {
  background: #494949;
}
@media (max-width: 768px) {
  .search_bar .search {
    width: 39px;
    height: 39px;
  }
}
.search_bar .search:before {
  content: "";
  background: url(../Images/search.png) no-repeat;
  background-size: cover;
  display: block;
  width: 31px;
  height: 31px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media (max-width: 768px) {
  .search_bar .search:before {
    width: 25px;
    height: 25px;
  }
}

.card-group {
  width: 100%;
  display: grid;
  grid-column: 1/3;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-column-gap: 20px;
  grid-row-gap: 40px;
  list-style: none;
  position: relative;
}
@media (max-width: 1400px) {
  .card-group {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media (max-width: 1024px) {
  .card-group {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 768px) {
  .card-group {
    grid-template-columns: 1fr;
  }
}
.card-group .card {
  padding: 20px;
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
  border-radius: 5px;
  width: 89%;
}
.card-group .card .swiper-wrapper {
  height: auto;
}
.card-group .card .swiper-horizontal > .swiper-pagination-bullets,
.card-group .card .swiper-pagination-bullets.swiper-pagination-horizontal {
  top: 200px;
  z-index: -1;
}
@media (max-width: 768px) {
  .card-group .card .swiper-horizontal > .swiper-pagination-bullets,
  .card-group .card .swiper-pagination-bullets.swiper-pagination-horizontal {
    top: 320px;
  }
}
@media (max-width: 480px) {
  .card-group .card .swiper-horizontal > .swiper-pagination-bullets,
  .card-group .card .swiper-pagination-bullets.swiper-pagination-horizontal {
    top: 200px;
  }
}
.card-group .card .swiper-pagination-bullet-active {
  background: #4CB9CE;
}
.card-group .card .card-img {
  display: block;
  width: 100%;
  height: 180px;
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 40px;
}
@media (max-width: 768px) {
  .card-group .card .card-img {
    height: 297px;
  }
}
@media (max-width: 480px) {
  .card-group .card .card-img {
    height: 180px;
  }
}
.card-group .card .card-img.swiper-slide {
  height: 180px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-right: 0;
}
@media (max-width: 768px) {
  .card-group .card .card-img.swiper-slide {
    height: 297px;
  }
}
@media (max-width: 480px) {
  .card-group .card .card-img.swiper-slide {
    height: 180px;
  }
}
.card-group .card .card-img img {
  object-fit: contain;
  width: 100%;
  height: 100%;
  margin: 0 auto;
}
.card-group .card h3 {
  color: #353535;
  text-align: left;
  margin: 10px 0;
  font-size: 1.4375rem;
  font-weight: 600;
  letter-spacing: 3px;
  /*height: 69px;*/
  /*@media (max-width: $wXS) {
      height: auto;
  }*/
}
@media (max-width: 480px) {
  .card-group .card h3 {
    font-size: 1.3125rem;
    /*height: 52px;*/
  }
}
.card-group .card h3 button {
  font-size: 1rem;
  color: #F6B74C;
  font-weight: 600;
  padding: 0px 6px;
  border: 1px solid #F6B74C;
  border-radius: 50px;
  background: #fff;
  cursor: pointer;
}
.card-group .card h3 button:before {
  content: "";
  background: url(../Images/share.png) no-repeat;
  background-size: contain;
  display: inline-block;
  width: 17px;
  height: 15px;
  margin-right: 4px;
}
.card-group .card .item {
  display: block;
  text-align: left;
  font-size: 1.125rem;
  color: #13ae67;
  font-weight: 600;
  letter-spacing: 3px;
}
.card-group .card .card_text {
  color: #494949;
  font-size: 1.125rem;
  line-height: 1.5;
  letter-spacing: 1px;
  overflow-y: auto;
  height: 200px;
  padding-right: 8px;
  margin-bottom: 10px;
}
@media (max-width: 768px) {
  .card-group .card .card_text {
    height: 160px;
  }
}
.card-group .card .address {
  color: #c1c1c1;
  font-size: 1rem;
  letter-spacing: 0;
  margin-bottom: 20px;
  line-height: 1.5;
}
.card-group .card .address:before {
  content: "";
  background: url(../Images/location.png) no-repeat;
  background-size: contain;
  display: inline-block;
  width: 16px;
  height: 20px;
  margin-right: 4px;
}
.card-group .card .card-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.card-group .card .card-bottom .cardBottom-info {
  display: flex;
  margin-right: 5px;
  align-items: center;
}
@media (max-width: 1600px) {
  .card-group .card .card-bottom .cardBottom-info {
    flex-direction: column;
    align-items: start;
    line-height: 1;
  }
}
.card-group .card .card-bottom .cardBottom-info p {
  color: #F6B74C;
  font-size: 1.4375rem;
  font-weight: 600;
}
.card-group .card .card-bottom .cardBottom-info span {
  color: #494949;
  font-size: 1.125rem;
  font-weight: 400;
}
.card-group .card .card-bottom .cardBottom-btn {
  color: #fff;
  font-weight: 600;
  font-size: 1.4375rem;
  border-radius: 10px;
  box-shadow: 0px 3px 0px #0b6875;
  border: 0px;
}
.card-group .card .card-bottom .cardBottom-btn:hover {
  box-shadow: 0px 3px 0px #111;
}
.card-group .card.fullscreen {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 65vw;
  height: auto;
  z-index: 9999;
  transform: translate(-50%, -50%);
  background-color: white;
  /* &:before {
      content: "";
      width: 100vw;
      height: 100vh;
      display: block;
      background: rgba($c_m_gray, 0.7);
  }*/
}
.card-group .card.fullscreen .card-img {
  height: 420px;
}
.card-group .card.fullscreen .card_text {
  height: 100px;
}
.card-group .card.fullscreen h3 {
  height: auto;
}
.card-group .card.fullscreen .swiper-horizontal > .swiper-pagination-bullets,
.card-group .card.fullscreen .swiper-pagination-bullets.swiper-pagination-horizontal {
  bottom: var(--swiper-pagination-bottom, 280px);
}
.card-group .card.fullscreen .card-bottom .cardBottom-info {
  flex-direction: row;
  align-items: center;
}

/*--------- FbDelete頁 ---------*/
.content_box.other ul li:before {
  display: none;
}
.content_box.other ul li p {
  text-align: center;
  padding: 20px;
  border: 1px solid #494949;
  border-radius: 5px;
}
.content_box.other ul li ol {
  margin-left: 36px;
}
@media (max-width: 768px) {
  .content_box.other ul li ol {
    margin-left: 0;
  }
}

/*--------- 得獎名單頁 ---------*/
.content_box.result {
  padding: 4% 8% 8%;
}
@media (max-width: 1024px) {
  .content_box.result h2 > span {
    line-height: 1.3;
    margin: 10px 0 0;
  }
}
@media (max-width: 768px) {
  .content_box.result {
    padding: 8%;
  }
}
.content_box.result table {
  width: 100%;
}
@media (max-width: 768px) {
  .content_box.result table {
    margin: 0 auto;
  }
}
.content_box.result table th:first-child {
  width: 6%;
}
.content_box.result table th:last-child {
  width: 18%;
}
.content_box.result table td {
  text-align: center;
  vertical-align: middle;
  line-height: 1.5;
  letter-spacing: 1px;
}
@media (max-width: 768px) {
  .content_box.result table td {
    padding: 4px 12px;
  }
}
@media (max-width: 1024px) {
  .content_box.result table td {
    line-height: 1.5;
  }
}
.content_box.result table td:last-child {
  /* &:after {
      content: "票";
      font-size: $f14;
      margin-left: 3px;
  }*/
}
@media (max-width: 768px) {
  .content_box.result table td:last-child {
    font-size: 0.875rem;
  }
}
.content_box.result table td:first-child {
  font-weight: 400;
  word-break: keep-all;
}
@media (max-width: 768px) {
  .content_box.result table td:first-child {
    font-size: 0.875rem;
  }
}
.content_box.result .result_final {
  margin: 120px auto 20px;
}
@media (max-width: 480px) {
  .content_box.result .result_final {
    margin: 60px auto 20px;
  }
}
.content_box.result .result_final h3 {
  text-align: center;
  position: relative;
  padding: 5px 10px;
  display: inline-block;
  border: 1px solid #4CB9CE;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 3px;
  line-height: 1.3;
  margin: 60px auto 20px;
}
@media (max-width: 768px) {
  .content_box.result .result_final h3 {
    margin: 30px auto 10px;
  }
}
.content_box.result .result_final h3:before {
  content: "";
  background: url(../Images/about_tittle_deco.png) no-repeat;
  background-size: cover;
  display: block;
  width: 24px;
  height: 14px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -18px;
}
.content_box.result .result_final span {
  text-align: center;
  display: block;
  margin-bottom: 10px;
}
.content_box.result .result_final h4 {
  font-size: 1.3125rem;
  color: #4CB9CE;
  font-weight: 600;
  margin-bottom: 10px;
}
.content_box.result .result_final h4 span {
  font-size: 0.875rem;
  color: #fff;
  background: #4CB9CE;
  padding: 0px 5px;
  border-radius: 3px;
  margin-bottom: 0;
  margin-right: 5px;
  display: inline-block;
}
@media (max-width: 480px) {
  .content_box.result .result_final h4 span {
    display: table;
  }
}
.content_box.result .result_final .content_text {
  margin: 30px 0 0;
}
.content_box.result .result_final .text_list {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 60px;
}
.content_box.result .result_final .text_list:last-child {
  margin-bottom: 0;
}
.content_box.result .result_final .text_list li {
  margin-right: 30px;
  letter-spacing: 0;
}
@media (max-width: 480px) {
  .content_box.result .result_final .text_list li {
    margin-right: 0px;
  }
}
.content_box.result .card-group {
  width: 100%;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 30px;
}
@media (max-width: 1200px) {
  .content_box.result .card-group {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 768px) {
  .content_box.result .card-group {
    grid-template-columns: 1fr;
  }
}
.content_box.result .card-group .card {
  width: 100%;
  box-sizing: border-box;
  position: relative;
  /*  .swiper {
      max-width: 388px;
  }*/
}
.content_box.result .card-group .card .card-img {
  display: block;
  width: 100%;
  height: 261px;
  border-radius: 3px;
  overflow: hidden;
}
@media (max-width: 1400px) {
  .content_box.result .card-group .card .card-img {
    height: 115px;
  }
}
@media (max-width: 1200px) {
  .content_box.result .card-group .card .card-img {
    height: 245px;
  }
}
@media (max-width: 768px) {
  .content_box.result .card-group .card .card-img {
    height: 280px;
  }
}
.content_box.result .card-group .card .card-img.swiper-slide {
  height: 261px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  /* margin-right: 0;*/
}
@media (max-width: 1400px) {
  .content_box.result .card-group .card .card-img.swiper-slide {
    height: 115px;
  }
}
@media (max-width: 1200px) {
  .content_box.result .card-group .card .card-img.swiper-slide {
    height: 245px;
  }
}
@media (max-width: 768px) {
  .content_box.result .card-group .card .card-img.swiper-slide {
    height: 280px;
  }
}
.content_box.result .card-group .card .card-img img {
  object-fit: cover;
  object-position: center center;
  transform: scale(1);
  transition: all 0.25s ease-out;
}
.content_box.result .card-group .card h4 {
  color: #494949;
  text-align: center;
  position: relative;
}
.content_box.result .card-group .card h4:before {
  content: "";
  background: url(../Images/about_tittle_deco.png) no-repeat;
  background-size: cover;
  display: block;
  width: 24px;
  height: 14px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -18px;
}
.content_box.result .card-group .card h4 span {
  display: block;
  font-size: 0.875rem;
  color: #4CB9CE;
  padding: 2px 5px;
  border-radius: 3px;
  border: 1px solid #4CB9CE;
  width: 60.5%;
  margin: 0 auto 2px;
  transition: all 0.25s ease-out;
}
@media (max-width: 1200px) {
  .content_box.result .card-group .card h4 span {
    width: 64%;
  }
}
.content_box.result .card-group .card p {
  text-align: center;
}
.content_box.result .card-group a:hover h4 {
  color: #4CB9CE;
}
.content_box.result .card-group a:hover h4 span {
  background: #4CB9CE;
  color: #ffffff;
}
.content_box.result .card-group a:hover .card-img img {
  transform: scale(1.2);
}
.content_box.result .card-group.center {
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (max-width: 768px) {
  .content_box.result .card-group.center {
    flex-wrap: wrap;
  }
}
.content_box.result .card-group.center .card {
  max-width: 31.85%;
  margin: 0;
}
@media (max-width: 1200px) {
  .content_box.result .card-group.center .card {
    max-width: 50%;
  }
}
@media (max-width: 768px) {
  .content_box.result .card-group.center .card {
    max-width: 100%;
  }
}
/*--------- PrivacyPolicy頁 ---------*/
.content_box.privacy ul li p {
  text-align: justify;
  padding: 0px;
  border: 0px solid #494949;
  border-radius: 0px;
}
.content_box.privacy ul li h4 {
  font-weight: 600;
}
.content_box.privacy ul li ul {
  margin: 16px 0 0 36px;
}
.content_box.privacy ul li ul li {
  text-indent: -18px;
}
@media (max-width: 768px) {
  .content_box.privacy ul li ul li {
    text-indent: 0px;
  }
}
@media (max-width: 768px) {
  .content_box.privacy ul li ul {
    margin-left: 0;
  }
}
.content_box.privacy ul li ul li::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50px;
  margin-right: 10px;
  background: #4CB9CE;
  top: -2px;
  position: relative;
}
.content_box.privacy ul li ul ul li ol {
  margin-left: 18px;
}
.content_box.privacy ul li .text-indent {
  text-indent: -36px;
}
@media (max-width: 768px) {
  .content_box.privacy ul li .text-indent {
    text-indent: 0px;
  }
}

/*--------- 中獎頁 ---------*/
.content_box.winners {
  padding: 8% 10% 8%;
}
@media (max-width: 480px) {
  .content_box.winners {
    padding: 8%;
  }
}
.content_box.winners .result_final table.winners {
  width: 60%;
}
@media (max-width: 768px) {
  .content_box.winners .result_final table.winners {
    width: 100%;
    margin: 12px auto;
  }
}

/*--------- 得獎者回覆專區頁 ---------*/
.reply .banner_box {
  margin-bottom: 0;
}
@media (max-width: 768px) {
  .reply .banner_box {
    margin-bottom: 80px;
  }
}
@media (max-width: 480px) {
  .reply .banner_box {
    margin-bottom: 40px;
  }
}
.reply h3 {
  letter-spacing: 1px;
}
.reply .info .upload_box {
  grid-template-columns: 1fr;
}
@media (max-width: 768px) {
  .reply .info .upload_box {
    grid-row-gap: 30px;
  }
}
.reply .info .upload_box .upload_img {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.reply .info .upload_box .upload_img .img_box span {
  margin: 60px 0;
}
@media (max-width: 768px) {
  .reply .info .upload_box .upload_img {
    grid-template-columns: 1fr;
  }
  .reply .info .upload_box .upload_img .img_box span {
    margin: 40px 0;
  }
}
.reply .info .upload_box > ul li {
  font-size: 1.4375rem;
  color: #d43131;
  text-align: center;
}
.reply .address {
  display: grid;
  grid-template-columns: 25% 25% 48.5%;
  align-items: center;
  justify-content: space-between;
}
@media (max-width: 768px) {
  .reply .address {
    grid-template-columns: 49.5% 49.5%;
  }
  .reply .address select {
    margin-top: 10px;
  }
  .reply .address input {
    grid-column: 1/3;
  }
}

/*--------- 特約店家頁 ---------*/
@media (max-width: 480px) {
  .content_box.store {
    padding: 8% 4% 8%;
  }
}
.content_box.store .tabs {
  margin-bottom: 0px;
  margin-top: 120px;
  border: 0px;
  flex-wrap: wrap;
  justify-content: center;
}
.content_box.store .tabs:after {
  display: none;
}
.content_box.store .tabs .tab-label {
  font-size: 1.125rem;
  padding: 5px 15px;
  left: 0;
  margin: 0 10px 10px 0;
  border-radius: 5px;
  width: auto;
  font-weight: 400;
  color: #4CB9CE;
  border: 1px solid #4CB9CE;
}
.content_box.store .tabs .tab-label.active, .content_box.store .tabs .tab-label:hover {
  background: #4CB9CE;
  color: #fff;
}
.content_box.store table {
  margin: 30px auto;
  width: 75%;
  /* td {
       &:last-child {
           width: 65%;
           text-align: left;

           @media (max-width: $wXXS) {
               width: 70%;
           }
       }
   }*/
}
@media (max-width: 768px) {
  .content_box.store table {
    width: 100%;
  }
}
.content_box.store table .number:before {
  content: "統一編號";
  font-size: 0.8125rem;
  color: #fff;
  background: #4CB9CE;
  border-radius: 3px;
  padding: 1px 6px;
  display: inline-block;
  margin-right: 5px;
}
@media (max-width: 480px) {
  .content_box.store table .number:before {
    font-size: 0.75rem;
    padding: 0 4px;
  }
}
.content_box.store .btn {
  display: inline-block;
  left: 50%;
  position: relative;
  transform: translateX(-50%);
}

/*月月抽小禮*/
.active_box {
  margin: 40px auto 90px;
}
@media (max-width: 768px) {
  .active_box {
    margin: 40px auto 60px;
  }
}
.active_box h2 {
  font-size: 2.1875rem;
  letter-spacing: 2px;
  color: #13ae67;
}
@media (max-width: 768px) {
  .active_box h2 {
    font-size: 1.75rem;
  }
}
.active_box p {
  max-width: 680px;
  margin: 90px auto 40px;
  text-align: center;
}
@media (max-width: 768px) {
  .active_box p {
    max-width: 96%;
    margin: 60px auto 20px;
  }
}
.active_box a {
  max-width: 282px;
  display: block;
  margin: 0 auto;
  animation-name: jump2;
  animation-duration: 0.35s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
@media (max-width: 768px) {
  .active_box a {
    max-width: 65%;
  }
}
.active_box a img {
  max-width: 100%;
}
.active_box a h3 {
  color: #13ae67;
  display: block;
  text-align: center;
  font-size: 1.5625rem;
}
.active_box > h3 {
  text-align: center;
  color: #13ae67;
  margin: 160px 0 24px;
}
@media (max-width: 768px) {
  .active_box > h3 {
    margin: 90px 0 24px;
  }
}
.active_box > h3:before {
  content: "";
  background: url(../Images/tittle_deco.png) no-repeat;
  background-size: cover;
  display: block;
  width: 46px;
  height: 14px;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  top: -48px;
}
@media (max-width: 768px) {
  .active_box > h3:before {
    top: -24px;
  }
}
.active_box > table {
  width: 100%;
}
.active_box > table th {
  background: rgba(44, 163, 76, 0.8);
}
.active_box > table tr td {
  background: rgba(44, 163, 76, 0.01);
}
.active_box + .content_box h2 {
  font-size: 1.5625rem;
}
.active_box + .content_box h3 {
  font-size: 1.3125rem;
}
.active_box + .content_box .card-list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.active_box + .content_box .card-list .card-item {
  width: 30.33%;
  padding: 10px;
  position: relative;
  animation-name: jump2;
  animation-duration: 0.45s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
@media (max-width: 1024px) {
  .active_box + .content_box .card-list .card-item {
    width: 46%;
  }
}
@media (max-width: 768px) {
  .active_box + .content_box .card-list .card-item {
    width: 78%;
  }
}
.active_box + .content_box .card-list .card-item span {
  padding: 2px 15px;
  font-size: 0.9375rem;
  text-align: center;
  top: 15px;
  z-index: 1;
  word-break: keep-all;
  line-height: 1.5;
  border: 2px solid #fff;
}
.active_box + .content_box .card-list .card-item .img_box {
  animation-name: unset;
  width: 96%;
}
.active_box + .content_box .card-list .card-item .img_box + span {
  text-align: center;
  background: #F6B74C;
  border-radius: 5px;
  top: 6px;
  word-break: keep-all;
  height: 52px;
  vertical-align: middle;
  border: 0px solid #fff;
  display: inline-flex;
  align-items: center;
  position: relative;
}
.active_box + .content_box .card-list .card-item .img_box + span:before {
  content: "";
  background: url(../Images/2025/gift_deco.png) no-repeat;
  background-size: contain;
  width: 18px;
  height: 56px;
  display: inline-block;
  position: absolute;
  top: -5px;
  left: -24px;
}
.active_box + .content_box .card-list .card-item .img_box + span:after {
  content: "";
  background: url(../Images/2025/gift_deco.png) no-repeat;
  background-size: contain;
  width: 18px;
  height: 56px;
  display: inline-block;
  position: absolute;
  transform: rotate(180deg);
  top: -5px;
  right: -24px;
}
.active_box + .content_box .card-list .card-item p {
  font-size: 1rem;
  text-align: center;
  margin: 20px 0;
  line-height: 1.5;
}
.active_box + .content_box .card-list .card-item:last-child .img_box, .active_box + .content_box .card-list .card-item:last-child p {
  top: 20px;
  position: relative;
}