@charset "UTF-8";
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
  transition: all 0.3s;
}

.container1280 {
  max-width: 1280px;
  margin: 0 auto;
}
@media (max-width: 1024px) {
  .container1280 {
    width: 100%;
    padding: 0 5%;
  }
}

.container900 {
  max-width: 900px;
  margin: 0 auto;
}
@media (max-width: 1024px) {
  .container900 {
    width: 100%;
    padding: 0 5%;
  }
}

.container768 {
  max-width: 768px;
  margin: 0 auto;
}
@media (max-width: 1024px) {
  .container768 {
    width: 100%;
    padding: 0;
  }
}

.container600 {
  max-width: 600px;
  margin: 0 auto;
}
@media (max-width: 1024px) {
  .container600 {
    width: 100%;
    padding: 0;
  }
}

.container500 {
  max-width: 500px;
  margin: 0 auto;
}
@media (max-width: 1024px) {
  .container500 {
    width: 100%;
    padding: 0;
  }
}

.eng {
  font-family: sans-serif;
  text-transform: uppercase;
}

/* 隱藏 Google reCAPTCHA 徽章 */
.grecaptcha-badge {
  visibility: hidden;
}

/* 完全移除 Google reCAPTCHA 徽章 */
.grecaptcha-badge {
  display: none;
}

.pcTopNavBar {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9;
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 10px 20px;
  background: url("../img/bg/header_bg_d.png");
  background-size: 150%;
  background-position: center;
  box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.1);
}
@media (max-width: 1024px) {
  .pcTopNavBar {
    display: none;
  }
}
.pcTopNavBar .leftLogo {
  position: relative;
}
.pcTopNavBar .leftLogo img {
  display: block;
  transition: opacity 0.3s ease;
}
.pcTopNavBar .leftLogo img.hover {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.pcTopNavBar .leftLogo:hover img.default {
  opacity: 0;
}
.pcTopNavBar .leftLogo:hover img.hover {
  opacity: 1;
}
.pcTopNavBar .rightLinksBtn {
  display: flex;
  align-items: center;
}
.pcTopNavBar .rightLinksBtn a {
  margin: 0 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.pcTopNavBar .rightLinksBtn a .linkIcon {
  position: relative;
  margin-bottom: 10px;
}
.pcTopNavBar .rightLinksBtn a .linkIcon img {
  width: 35px;
  display: block;
  transition: opacity 0.3s ease;
}
.pcTopNavBar .rightLinksBtn a .linkIcon img.hover {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.pcTopNavBar .rightLinksBtn a > span {
  font-size: 14px;
  font-family: sans-serif;
  color: #113d5a;
}
.pcTopNavBar .rightLinksBtn a:hover span {
  color: #2c93d6;
}
.pcTopNavBar .rightLinksBtn a:hover img.default {
  opacity: 0;
}
.pcTopNavBar .rightLinksBtn a:hover img.hover {
  opacity: 1;
}

.pcServiceContent {
  position: fixed;
  right: 0;
  top: 90px;
  width: 25%;
  height: calc(100vh - 90px);
  z-index: 10;
  background-color: #dfdfdf;
  padding: 20px;
  box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
}
@media (max-width: 1024px) {
  .pcServiceContent {
    display: none;
  }
}
.pcServiceContent .topContent,
.pcServiceContent .bottomContent {
  background-color: #dff2ff;
  padding: 10px;
  border-radius: 5px;
}
.pcServiceContent .topContent .topContentTitle,
.pcServiceContent .topContent .bottomContentTitle,
.pcServiceContent .bottomContent .topContentTitle,
.pcServiceContent .bottomContent .bottomContentTitle {
  background-color: #113d5a;
  color: #fff;
  text-align: center;
  padding: 10px;
  border-radius: 5px;
  font-family: sans-serif;
}
.pcServiceContent .topContent .topContentTitle span,
.pcServiceContent .topContent .bottomContentTitle span,
.pcServiceContent .bottomContent .topContentTitle span,
.pcServiceContent .bottomContent .bottomContentTitle span {
  font-size: 14px;
  display: block;
}
.pcServiceContent .topContent .topContentTitle span:first-child,
.pcServiceContent .topContent .bottomContentTitle span:first-child,
.pcServiceContent .bottomContent .topContentTitle span:first-child,
.pcServiceContent .bottomContent .bottomContentTitle span:first-child {
  font-size: 26px;
  margin-bottom: 5px;
  letter-spacing: 2px;
}
.pcServiceContent .topContent {
  height: 55.5%;
}
.pcServiceContent .topContent .links {
  padding-top: 10px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.pcServiceContent .topContent .links a {
  background-color: #175f8f;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 34px 0px;
  border-radius: 5px;
  color: #fff;
  font-size: 20px;
}
@media (max-width: 1710px) {
  .pcServiceContent .topContent .links a {
    font-size: 16px;
    padding: 28px 0;
  }
}
@media (max-width: 1550px) {
  .pcServiceContent .topContent .links a {
    font-size: 16px;
    padding: 20px 0px;
  }
}
.pcServiceContent .topContent .links a:nth-child(even) {
  background-color: #5287a9;
}
.pcServiceContent .bottomContent {
  margin-top: 20px;
  height: 42.5%;
}
.pcServiceContent .bottomContent .links {
  padding-top: 10px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
.pcServiceContent .bottomContent .links a {
  background-color: #175f8f;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 34px 0;
  border-radius: 5px;
  color: #fff;
  font-size: 20px;
}
@media (max-width: 1710px) {
  .pcServiceContent .bottomContent .links a {
    font-size: 16px;
    padding: 28px 0;
  }
}
@media (max-width: 1550px) {
  .pcServiceContent .bottomContent .links a {
    font-size: 16px;
    padding: 20px 0;
  }
}

/* 以 slide 為例的過渡效果 */
.slide-enter-active,
.slide-leave-active {
  transition: all 0.3s ease;
}

.slide-enter-from,
.slide-leave-to {
  right: -100%; /* 假設選單初始位置在螢幕外部右側 */
}

.slide-enter-to,
.slide-leave-from {
  right: 0;
}

.mobileTopNavbar {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9;
  width: 100%;
  padding: 10px;
  display: none;
  align-items: center;
  justify-content: space-between;
  box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.1);
  background: url("../img/bg/header_bg_m.png");
  background-position: center;
  background-size: 150%;
  background-repeat: no-repeat;
}
@media (max-width: 1024px) {
  .mobileTopNavbar {
    display: flex;
  }
}
.mobileTopNavbar .leftLogo a img {
  width: 150px;
}
.mobileTopNavbar .rightPhone {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.mobileTopNavbar .rightPhone span {
  font-weight: bold;
  color: #113d5a;
  font-size: 18px;
}
.mobileTopNavbar .rightPhone span:first-child {
  margin-bottom: 5px;
  letter-spacing: 2px;
}
.mobileTopNavbar .rightPhone span:last-child {
  letter-spacing: 2px;
}

.mobileBottomNavbar {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 9;
  padding-top: 3px;
  width: 100%;
  display: none;
  justify-content: space-between;
  align-items: center;
  background-color: #fff;
  box-shadow: 0px -3px 3px rgba(0, 0, 0, 0.1);
}
.mobileBottomNavbar a {
  display: block;
  width: 33.3333333333%;
  background: #e1ecf2;
  text-align: center;
  padding: 5px 10px;
  margin: 0 2.5px;
}
@media (max-width: 1024px) {
  .mobileBottomNavbar {
    display: flex;
  }
}

.mainMenuContent {
  position: fixed;
  width: 100%;
  height: calc(100% - 68.9px - 66px);
  top: 68.9px;
  right: -100%;
  z-index: 9;
  background: #e9e9e9;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 10px;
  transition: all 0.3s;
}
.mainMenuContent a {
  height: calc(25% - 10px);
  display: block;
  background: #113d5a;
  color: #fff;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  border-radius: 10px;
}
.mainMenuContent a .rightText {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.mainMenuContent a .rightText span:first-child {
  font-size: 26px;
  letter-spacing: 2px;
  margin-bottom: 5px;
}

.subMenuContent {
  position: fixed;
  width: 100%;
  height: calc(100% - 68.9px - 66px);
  top: 68.9px;
  right: -100%;
  z-index: 9;
  background-color: #dfdfdf;
  padding: 5px;
  box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
  transition: all 0.3s;
}
.subMenuContent .topContent,
.subMenuContent .bottomContent {
  background-color: #dff2ff;
  padding: 10px;
  border-radius: 5px;
}
.subMenuContent .topContent .topContentTitle,
.subMenuContent .topContent .bottomContentTitle,
.subMenuContent .bottomContent .topContentTitle,
.subMenuContent .bottomContent .bottomContentTitle {
  background-color: #113d5a;
  color: #fff;
  text-align: center;
  padding: 5px;
  border-radius: 5px;
  font-family: sans-serif;
}
.subMenuContent .topContent .topContentTitle span,
.subMenuContent .topContent .bottomContentTitle span,
.subMenuContent .bottomContent .topContentTitle span,
.subMenuContent .bottomContent .bottomContentTitle span {
  font-size: 14px;
  display: block;
}
.subMenuContent .topContent .topContentTitle span:first-child,
.subMenuContent .topContent .bottomContentTitle span:first-child,
.subMenuContent .bottomContent .topContentTitle span:first-child,
.subMenuContent .bottomContent .bottomContentTitle span:first-child {
  font-size: 26px;
  margin-bottom: 5px;
  letter-spacing: 2px;
}
.subMenuContent .topContent {
  height: 55.5%;
}
.subMenuContent .topContent .links {
  padding-top: 10px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5px;
  height: 77%;
}
.subMenuContent .topContent .links a {
  background-color: #175f8f;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  padding: 20px 0px;
  border-radius: 5px;
  color: #fff;
}
.subMenuContent .topContent .links a:nth-child(even) {
  background-color: #5287a9;
}
.subMenuContent .bottomContent {
  margin-top: 10px;
  height: 42.5%;
}
.subMenuContent .bottomContent .links {
  height: 70%;
  padding-top: 10px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 5px;
}
.subMenuContent .bottomContent .links a {
  background-color: #175f8f;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  padding: 20px 0;
  border-radius: 5px;
  color: #fff;
}

.mainMenuContent.active,
.subMenuContent.active {
  right: 0; /* 顯示狀態 */
}

#indexCoverSwiper {
  margin-top: 100px;
  padding: 0px 20px;
}
@media (max-width: 1024px) {
  #indexCoverSwiper {
    padding: 0 10px;
  }
}
#indexCoverSwiper .indexCoverSwiper {
  width: 100%;
  height: 100%;
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide {
  width: 100%;
  position: relative;
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide picture {
  width: 100%;
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide picture img {
  width: 100%;
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText {
  position: absolute;
  bottom: 30px;
  left: 30px;
  color: #fff;
  z-index: 2;
}
@media (max-width: 1024px) {
  #indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText {
    bottom: 50px;
    left: 10px;
  }
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText h3 {
  font-size: 36px;
  letter-spacing: 2px;
}
@media (max-width: 1024px) {
  #indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText h3 {
    font-size: 24px;
  }
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText h3 .bigText {
  font-size: 100px;
}
@media (max-width: 1024px) {
  #indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText h3 .bigText {
    font-size: 38px;
  }
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText h3 .eng {
  margin-left: 4px;
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText p {
  font-size: 30px;
  margin: 10px 0;
  font-weight: bold;
}
@media (max-width: 1024px) {
  #indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText p {
    font-size: 18px;
    text-shadow: 0.3px 0.3px 0.3px rgba(0, 0, 0, 0.3);
  }
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText a {
  display: inline-block;
  color: #000;
  background-color: #fff;
  font-size: 22px;
  letter-spacing: 4px;
  padding: 10px 20px;
  border-radius: 5px;
  font-weight: bold;
}
@media (max-width: 1024px) {
  #indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText a {
    font-size: 18;
    padding: 5px 10px;
  }
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText1 {
  color: #eee796;
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText1 a {
  background-color: #eee796;
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText2 {
  color: #eeb2b2;
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText2 a {
  background-color: #eeb2b2;
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText3 {
  color: #e41211;
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText3 a {
  background-color: #e41211;
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText4 {
  color: #7ab8f5;
}
#indexCoverSwiper .indexCoverSwiper .swiper-slide .slideText4 a {
  background-color: #7ab8f5;
}
#indexCoverSwiper .swiper-pagination .swiper-pagination-bullet {
  background-color: #fff;
}

.indexTopText {
  margin-top: 50px;
  margin-bottom: 50px;
  text-align: center;
}
.indexTopText p {
  margin-bottom: 20px;
}
.indexTopText p:first-child {
  color: #ed0707;
  font-size: 22px;
  font-weight: bold;
}
@media (max-width: 1024px) {
  .indexTopText p:first-child {
    text-align: center;
  }
}
.indexTopText p:last-child span {
  display: block;
  margin-bottom: 5px;
}
@media (max-width: 1024px) {
  .indexTopText p:last-child span {
    display: inline;
  }
}
.indexTopText p:last-child span:last-child {
  color: #ed0707;
  font-weight: bold;
}
@media (max-width: 1024px) {
  .indexTopText p {
    text-align: left;
  }
}

.blueBgArea {
  background-color: #d5effe;
  text-align: center;
  padding: 20px 0;
  box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.3);
}
@media (max-width: 1024px) {
  .blueBgArea {
    padding: 20px;
  }
}
.blueBgArea p {
  font-size: 24px;
  margin: 15px 0;
  font-weight: bold;
  color: #234761;
  letter-spacing: 2px;
}

.blueBgArea.about h5 {
  color: #113d5a;
  font-weight: bold;
  font-size: 26px;
}
.blueBgArea.about p {
  font-size: 22px;
  color: #f00;
  margin-bottom: 10px;
}
.blueBgArea.about a {
  color: #f00;
  font-size: 36px;
  font-weight: bold;
}

.serviceCards {
  width: 100%;
  padding: 100px 30px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  background: url("../img/bg/dot-grid.png");
}
@media (max-width: 1024px) {
  .serviceCards {
    padding: 50px 10px;
    grid-template-columns: repeat(1, 1fr);
    gap: 50px;
  }
}
.serviceCards .serviceCard {
  width: 100%;
  position: relative;
}
.serviceCards .serviceCard img {
  width: 100%;
  margin-bottom: 10px;
}
.serviceCards .serviceCard .cardText {
  margin-bottom: 60px;
  padding: 0 10px;
}
.serviceCards .serviceCard .cardText h2 {
  font-size: 24px;
  margin-bottom: 20px;
  color: #1d5d89;
}
.serviceCards .serviceCard .cardText p {
  margin-bottom: 20px;
}
.serviceCards .serviceCard .moreBtn {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 0 5px;
}
.serviceCards .serviceCard .moreBtn a {
  display: block;
  text-align: center;
  background-color: #113d5a;
  color: #fff;
  border-radius: 5px;
  padding: 10px 0;
  letter-spacing: 4px;
}
.serviceCards .serviceCard .moreBtn a:hover {
  background-color: #195a85;
}

.indexFeature {
  width: 100%;
  background: url("../img/bg/groovepaper.png");
  padding: 100px 0;
}
@media (max-width: 1024px) {
  .indexFeature {
    padding: 50px 0;
  }
}
.indexFeature h1 {
  font-size: 36px;
  text-align: center;
  margin-bottom: 20px;
  color: #16608f;
  text-shadow: 0.3px 0.3px 0.3px rgba(0, 0, 0, 0.1);
}
.indexFeature h1 br {
  display: none;
}
@media (max-width: 1024px) {
  .indexFeature h1 br {
    display: block;
  }
}
.indexFeature > p {
  text-align: center;
  margin-bottom: 20px;
  font-size: 16px;
}
@media (max-width: 1024px) {
  .indexFeature > p {
    padding: 0 20px;
  }
}
.indexFeature h4 {
  text-align: center;
  margin-bottom: 20px;
  color: #16608f;
  font-size: 20px;
}
@media (max-width: 1024px) {
  .indexFeature h4 {
    padding: 0 20px;
  }
}
.indexFeature .featureCards {
  width: 100%;
  padding: 0 30px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
@media (max-width: 1024px) {
  .indexFeature .featureCards {
    padding: 0 10px;
    grid-template-columns: repeat(1, 1fr);
    gap: 50px;
  }
}
.indexFeature .featureCards .featureCard img {
  width: 100%;
}
.indexFeature .featureCards .featureCard .cardText {
  padding: 0 10px;
}
.indexFeature .featureCards .featureCard .cardText h3 {
  font-size: 24px;
  margin-bottom: 20px;
  color: #1d5d89;
}

.indexStatistics {
  padding: 50px 0;
}
.indexStatistics h2 {
  text-align: center;
  margin-bottom: 20px;
  color: #175f8f;
  font-size: 36px;
}
.indexStatistics .statisticsTopText {
  text-align: center;
  margin-bottom: 20px;
}
@media (max-width: 1024px) {
  .indexStatistics .statisticsTopText {
    padding: 0 20px;
    font-size: 18px;
  }
}
.indexStatistics .statisticsCards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  padding: 20px 0;
}
@media (max-width: 1024px) {
  .indexStatistics .statisticsCards {
    margin: 0 20px;
    grid-template-columns: repeat(1, 1fr);
  }
}
.indexStatistics .statisticsCards .statisticsCard {
  padding: 50px 20px;
  background: linear-gradient(to bottom, #e9f6ff, #fff);
  border-radius: 10px;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
  text-align: center;
}
.indexStatistics .statisticsCards .statisticsCard h3 {
  margin-bottom: 10px;
  color: #175f8f;
}
.indexStatistics .statisticsCards .statisticsCard h3 span {
  display: block;
  margin-bottom: 10px;
  font-size: 28px;
}
@media (max-width: 1024px) {
  .indexStatistics .statisticsCards .statisticsCard h3 span {
    font-size: 32px;
  }
}
.indexStatistics .statisticsCards .statisticsCard h3 span:last-child {
  font-size: 36px;
}
@media (max-width: 1024px) {
  .indexStatistics .statisticsCards .statisticsCard h3 span:last-child {
    font-size: 32px;
    margin-bottom: 20px;
  }
}
.indexStatistics .statisticsCards .statisticsCard p {
  font-size: 18px;
  letter-spacing: 2px;
}
.indexStatistics .statisticsBottomText {
  text-align: center;
  margin-top: 20px;
}
@media (max-width: 1024px) {
  .indexStatistics .statisticsBottomText {
    padding: 0 20px;
    text-align: left;
  }
}
.indexStatistics .statisticsBottomText p {
  margin-bottom: 10px;
}
@media (max-width: 1024px) {
  .indexStatistics .statisticsBottomText p {
    font-size: 18px;
  }
}

.indexFAQ {
  padding: 50px 0;
  background: url("../img/bg/brickwall.png");
}
.indexFAQ h2 {
  text-align: center;
  color: #103d5a;
  margin-bottom: 50px;
  font-size: 36px;
}

.FaqGroup .FaqBox .question {
  display: flex;
  align-items: center;
  background-color: #175f8f;
  padding: 10px 20px;
  width: 90%;
  border-radius: 10px;
  margin-bottom: 20px;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
}
@media (max-width: 1024px) {
  .FaqGroup .FaqBox .question {
    width: 100%;
  }
}
.FaqGroup .FaqBox .question .qIcon {
  background-color: #fff;
  color: #175f8f;
  font-size: 30px;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.5);
}
.FaqGroup .FaqBox .question .questionText {
  color: #fff;
  margin-left: 20px;
}
.FaqGroup .FaqBox .answer {
  display: flex;
  align-items: stretch;
  background-color: #f2f9ff;
  padding: 10px;
  width: 90%;
  margin-left: auto;
  border-radius: 10px;
  margin-bottom: 20px;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
}
@media (max-width: 1024px) {
  .FaqGroup .FaqBox .answer {
    width: 100%;
  }
}
.FaqGroup .FaqBox .answer .aIcon {
  background-color: #175f8f;
  color: #fff;
  font-size: 30px;
  padding: 10px;
  border-radius: 10px;
  place-content: center;
}
@media (max-width: 1024px) {
  .FaqGroup .FaqBox .answer .aIcon {
    display: none;
  }
}
.FaqGroup .FaqBox .answer .answerText {
  color: #175f8f;
  margin-left: 20px;
}
@media (max-width: 1024px) {
  .FaqGroup .FaqBox .answer .answerText {
    margin-left: 0;
    padding: 20px;
  }
}
.FaqGroup .FaqBox .answer .answerText p {
  margin-bottom: 20px;
}
@media (max-width: 1024px) {
  .FaqGroup .FaqBox .answer .answerText p {
    font-size: 18px;
    font-weight: bold;
  }
}

.footerMail {
  max-width: 100%;
  background: url("../img/form_D.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  padding-top: 50px;
  padding-bottom: 50px;
}
@media (max-width: 1024px) {
  .footerMail {
    background: url("../img/form_M.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 50px 5%;
  }
}
.footerMail > h2 {
  font-size: 36px;
  text-align: center;
  color: #113d5a;
  text-shadow: 0.3px 0.3px 3px rgba(0, 0, 0, 0.3);
  margin-bottom: 20px;
}
.footerMail .mailTopText {
  color: #113d5a;
  text-align: center;
  margin-bottom: 20px;
  font-size: 20px;
  font-weight: bold;
}
@media (max-width: 1024px) {
  .footerMail .mailTopText {
    font-size: 18px;
  }
}

form#form {
  padding-top: 30px;
  font-size: 20px;
  max-width: 50%;
  margin: 0 auto;
}
@media (max-width: 1024px) {
  form#form {
    max-width: 100%;
  }
}
form#form .form1 {
  display: flex;
  margin-bottom: 30px;
}
@media (max-width: 1024px) {
  form#form .form1 {
    flex-direction: column;
  }
}
form#form .form1 .form-name {
  margin-right: 20px;
}
@media (max-width: 1024px) {
  form#form .form1 .form-name {
    margin-right: 0;
  }
}
form#form .form1 .form-name label {
  color: #153897;
  margin-right: 10px;
  font-weight: bold;
}
form#form .form1 .form-name label::before {
  content: "*";
  color: #f00;
}
form#form .form1 .form-name input {
  background-color: #fbfbfb;
  border: none;
  border-radius: 5px;
  padding: 4px;
  font-size: 20px;
}
form#form .form1 .form-name input:focus {
  outline: none;
}
@media (max-width: 1024px) {
  form#form .form1 .form-name input {
    margin-bottom: 10px;
    max-width: 100%;
  }
}
form#form .form1 .form-sex label {
  color: #153897;
  font-weight: bold;
  margin-right: 15px;
}
form#form .form2 {
  display: flex;
  margin-bottom: 30px;
}
@media (max-width: 1024px) {
  form#form .form2 {
    flex-direction: column;
    margin-bottom: 0;
  }
}
form#form .form2 label {
  font-weight: bold;
  color: #153897;
  margin-right: 1rem;
}
form#form .form2 label::before {
  content: "*";
  color: #f00;
}
form#form .form2 input {
  background-color: #fbfbfb;
  border: none;
  border-radius: 5px;
  padding: 4px;
  font-size: 20px;
}
form#form .form2 input:focus {
  outline: none;
}
@media (max-width: 1024px) {
  form#form .form2 input {
    width: 100%;
    margin-bottom: 30px;
  }
}
form#form .form2 .form-phone {
  margin-right: 25px;
}
@media (max-width: 1024px) {
  form#form .form2 .form-phone {
    margin-right: 0;
  }
}
form#form .form3 {
  margin-bottom: 30px;
}
form#form .form3 label {
  color: #153897;
  font-weight: bold;
  margin-right: 10px;
}
form#form .form3 label::before {
  content: "*";
  color: #f00;
}
@media (max-width: 1024px) {
  form#form .form3 label {
    display: block;
  }
}
form#form .form3 select {
  width: 33%;
  font-size: 20px;
  padding: 5px;
  background-color: #fbfbfb;
  border: none;
  border-radius: 4px;
}
form#form .form3 select:focus {
  outline: none;
}
@media (max-width: 1024px) {
  form#form .form3 select {
    width: 100%;
  }
}
form#form .form-message {
  display: flex;
  flex-direction: column;
  margin-bottom: 30px;
}
form#form .form-message label {
  font-weight: bold;
  color: #153897;
  margin-bottom: 10px;
}
form#form .form-message label::before {
  content: "*";
  color: #f00;
}
form#form .form-message textarea {
  width: 100%;
  height: 150px;
  resize: none;
  background-color: #fbfbfb;
  border: none;
  border-radius: 5px;
  padding: 5px;
  font-size: 20px;
}
form#form .form-message textarea:focus {
  outline: none;
}
form#form .form-btn {
  display: flex;
  justify-content: center;
}
form#form .form-btn button {
  font-size: 20px;
  cursor: pointer;
  background-color: transparent;
  color: #fff;
  background: #153897;
  border-radius: 30px;
  padding: 5px 25px;
  transition: all 0.3s;
  margin: 0 50px;
  border: none;
}
form#form .form-btn button:hover {
  background: #0f276a;
  color: #fff;
}
@media (max-width: 1024px) {
  form#form .form-btn button {
    margin: 0px 20px;
    font-size: 18px;
  }
}

.mail-slogan {
  padding: 0 5%;
  margin: 30px 0;
  text-align: center;
  color: #f00;
  font-size: 24px;
  font-weight: bold;
  letter-spacing: 2px;
}
@media (max-width: 1024px) {
  .mail-slogan {
    font-size: 18px;
    text-align: left;
  }
}

footer {
  background: linear-gradient(to bottom, #f2f9ff, #fff);
  padding-top: 50px;
}
footer > h4 {
  font-weight: bold;
  text-align: center;
  font-size: 30px;
  color: #175f8f;
  margin-bottom: 10px;
}
footer > h5 {
  font-weight: bold;
  text-align: center;
  font-size: 26px;
  color: #175f8f;
}
@media (max-width: 1024px) {
  footer > h5 {
    font-size: 20px;
  }
}
footer .footerText {
  padding-top: 50px;
  text-align: center;
}
@media (max-width: 1024px) {
  footer .footerText {
    padding-top: 20px;
    text-align: left;
    padding-left: 5%;
    padding-right: 5%;
  }
}
footer .footerText p {
  margin-bottom: 20px;
}
footer .footerPhone {
  text-align: center;
  color: #c60001;
  font-weight: bold;
  padding-top: 10px;
  padding-bottom: 20px;
}
footer .footerPhone p {
  font-size: 30px;
  margin-bottom: 10px;
}
footer .footerPhone a {
  color: #c60001;
  font-size: 36px;
  letter-spacing: 2px;
}
footer .copyright {
  padding: 10px;
  background-color: #175f8f;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
@media (max-width: 1024px) {
  footer .copyright {
    flex-direction: column;
    text-align: center;
    padding-top: 10px;
    padding-bottom: 80px;
  }
}
footer .copyright .left {
  font-size: 12px;
  color: #fff;
  display: flex;
  align-items: center;
}
@media (max-width: 1024px) {
  footer .copyright .left {
    margin-bottom: 5px;
  }
}
footer .copyright .left .image-container {
  display: inline-block;
}
footer .copyright .left .image-container:hover img {
  content: url("../img/icon/footer_logo_hover.png");
}
footer .copyright .left .image-container img {
  cursor: pointer;
  transition: filter 0.3s ease;
  margin: 0 2px;
}
footer .copyright .center {
  font-size: 10px;
  color: #fff;
  transform: translateX(-5%);
}
@media (max-width: 1024px) {
  footer .copyright .center {
    transform: translateX(0%);
    margin-bottom: 5px;
  }
}
footer .copyright .center a {
  color: #fff;
}
footer .copyright .right a {
  font-size: 14px;
  color: #fff;
  padding: 0 1px;
  margin: 0 1px;
  border-left: 1px solid #fff;
}
footer .copyright .right a:first-child {
  border-left: none;
}
footer .copyright .right a:hover {
  color: #c60001;
}

.goTopBtn {
  position: fixed;
  bottom: 80px;
  right: 0px;
  z-index: 6;
  cursor: pointer;
  display: inline-block;
}
.goTopBtn img {
  display: block;
  transition: opacity 0.3s ease;
}
.goTopBtn img.hover {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.goTopBtn:hover img.default {
  opacity: 0;
}
.goTopBtn:hover img.hover {
  opacity: 1;
}

.aboutPageBanner {
  margin-top: 100px;
  padding: 0px 20px;
  position: relative;
}
.aboutPageBanner picture {
  width: 100%;
}
.aboutPageBanner picture img {
  width: 100%;
}
.aboutPageBanner .aboutPageBannerText {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  color: #fff;
}

.aboutPageTopText {
  padding: 50px 0;
}
@media (max-width: 1024px) {
  .aboutPageTopText {
    padding: 50px 20px;
  }
}
.aboutPageTopText h2 {
  text-align: center;
  margin-bottom: 20px;
  color: #fe0000;
}
@media (max-width: 1024px) {
  .aboutPageTopText h2 {
    font-size: 28px;
  }
}
.aboutPageTopText p {
  text-align: center;
  margin-bottom: 10px;
}
@media (max-width: 1024px) {
  .aboutPageTopText p {
    font-size: 18px;
    line-height: 1.5;
    letter-spacing: 2px;
    text-align: left;
    font-size: 18px;
  }
}

.aboutPageService {
  padding: 50px 0;
  background: url("../img/bg/dot-grid.png");
}
.aboutPageService h2 {
  text-align: center;
  font-size: 36px;
  color: #175f8f;
}
.aboutPageService .serviceCards.about {
  padding: 20px 30px;
}
.aboutPageService .serviceCards.about h2 {
  text-align: left;
}
@media (max-width: 1024px) {
  .aboutPageService .serviceCards.about {
    padding: 20px 10px;
  }
}
.aboutPageService .aboutPageServiceText {
  margin-top: 20px;
  color: #fe0000;
  text-align: center;
  font-weight: bold;
}
@media (max-width: 1024px) {
  .aboutPageService .aboutPageServiceText {
    padding: 0 20px;
    font-size: 18px;
    line-height: 1.5;
    letter-spacing: 2px;
  }
}
@media (max-width: 1024px) {
  .aboutPageService .aboutPageServiceText br {
    display: none;
  }
}

.philosophyAndCommitment {
  padding: 50px 0;
}
@media (max-width: 1024px) {
  .philosophyAndCommitment {
    padding: 50px 10px;
  }
}
.philosophyAndCommitment h2 {
  text-align: center;
  color: #175f8f;
  font-size: 36px;
  text-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
  margin-bottom: 20px;
}
.philosophyAndCommitment > p {
  text-align: center;
  margin-bottom: 20px;
}
@media (max-width: 1024px) {
  .philosophyAndCommitment > p {
    padding: 0 20px;
  }
}
.philosophyAndCommitment h5 {
  text-align: center;
  margin-bottom: 20px;
  color: #175f8f;
  font-size: 18px;
}
.philosophyAndCommitment .philosophyAndCommitmentCards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
@media (max-width: 1024px) {
  .philosophyAndCommitment .philosophyAndCommitmentCards {
    grid-template-columns: repeat(1, 1fr);
  }
}
.philosophyAndCommitment .philosophyAndCommitmentCards .philosophyAndCommitmentCard .cardImage {
  position: relative;
}
.philosophyAndCommitment .philosophyAndCommitmentCards .philosophyAndCommitmentCard .cardImage img {
  width: 100%;
}
.philosophyAndCommitment .philosophyAndCommitmentCards .philosophyAndCommitmentCard .cardImage h3 {
  text-align: center;
  width: 100%;
  color: #fff;
  font-size: 22px;
  letter-spacing: 2px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
}
.philosophyAndCommitment .philosophyAndCommitmentCards .philosophyAndCommitmentCard .cardText {
  padding: 10px;
}

.supportTeam {
  width: 100%;
  padding: 50px 20px;
  background: url("../img/bg/groovepaper.png");
}
@media (max-width: 1024px) {
  .supportTeam {
    padding: 50px 10px;
  }
}
.supportTeam h2 {
  text-align: center;
  color: #175f8f;
  font-size: 36px;
  text-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
  margin-bottom: 20px;
}
.supportTeam > p {
  text-align: center;
  margin-bottom: 20px;
}
.supportTeam .supportTeamCards {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
@media (max-width: 1024px) {
  .supportTeam .supportTeamCards {
    grid-template-columns: repeat(1, 1fr);
  }
}
.supportTeam .supportTeamCards .supportTeamCard img.cardImage {
  width: 100%;
}
.supportTeam .supportTeamCards .supportTeamCard h3.cardTitle {
  padding: 5px 0;
  color: #175f8f;
  font-size: 24px;
  margin: 10px 0;
}
@media (max-width: 1024px) {
  .supportTeam .supportTeamCards .supportTeamCard h3.cardTitle {
    margin: 0;
    padding: 0px 10px;
  }
}
.supportTeam .supportTeamCards .supportTeamCard p.cardText {
  margin: 10px 0;
}
@media (max-width: 1024px) {
  .supportTeam .supportTeamCards .supportTeamCard p.cardText {
    padding: 10px;
  }
}

.whyChooseUs {
  padding: 50px 30px;
}
@media (max-width: 1024px) {
  .whyChooseUs {
    padding: 50px 10px;
  }
}
.whyChooseUs h2 {
  text-align: center;
  color: #175f8f;
  font-size: 36px;
  text-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
  margin-bottom: 20px;
}
.whyChooseUs .whyChooseUsCards {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
@media (max-width: 1024px) {
  .whyChooseUs .whyChooseUsCards {
    grid-template-columns: repeat(1, 1fr);
  }
}
@media (max-width: 1024px) {
  .whyChooseUs .whyChooseUsCards .whyChooseUsCard {
    border-bottom: 1px solid #666;
    padding: 10px 0;
  }
}
.whyChooseUs .whyChooseUsCards .whyChooseUsCard .cardImage {
  position: relative;
}
.whyChooseUs .whyChooseUsCards .whyChooseUsCard .cardImage img {
  width: 100%;
}
.whyChooseUs .whyChooseUsCards .whyChooseUsCard .cardImage h3 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  color: #fff;
  width: 100%;
  text-align: center;
  font-size: 26px;
  letter-spacing: 2px;
}
.whyChooseUs .whyChooseUsCards .whyChooseUsCard .cardText {
  padding: 10px 5px;
}

.blueBgArea.aboutPageFooter h3 {
  font-size: 24px;
  color: #fe0000;
}
.blueBgArea.aboutPageFooter p {
  text-align: center;
  font-size: 22px;
}
.blueBgArea.aboutPageFooter p a {
  color: #fe0000;
}

.servicePage {
  background: linear-gradient(to bottom, #f2f9ff, #fff);
  margin-top: 60px;
  padding: 50px 0;
}
.servicePage .serviceTitle {
  padding: 50px 0;
  text-align: center;
  color: #f00;
}
.servicePage .serviceTopText {
  margin-bottom: 50px;
}
.servicePage .serviceTopText h2 {
  color: #175f8f;
  font-size: 28px;
  text-align: center;
  margin-bottom: 20px;
}
@media (max-width: 1024px) {
  .servicePage .serviceTopText h2 {
    font-size: 22px;
    padding: 0 5%;
  }
}
.servicePage .serviceTopText p {
  text-align: center;
  margin-bottom: 20px;
}
@media (max-width: 1024px) {
  .servicePage .serviceTopText p {
    text-align: left;
    font-size: 18px;
    padding: 0 5%;
  }
}
.servicePage .serviceDetails h2 {
  color: #9a673a;
  font-size: 36px;
  text-align: center;
  margin-bottom: 20px;
}
.servicePage .serviceDetails > p {
  text-align: center;
  font-weight: bold;
  margin-bottom: 20px;
}
@media (max-width: 1024px) {
  .servicePage .serviceDetails > p {
    font-size: 18px;
    text-align: left;
    padding: 0 5%;
  }
}
.servicePage .serviceDetails .serviceDetailsList .detailsListBox {
  background: #fff9ed;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
  padding: 20px;
  margin-bottom: 20px;
  border-radius: 10px;
}
@media (max-width: 1024px) {
  .servicePage .serviceDetails .serviceDetailsList .detailsListBox {
    border-radius: 0;
  }
}
.servicePage .serviceDetails .serviceDetailsList .detailsListBox h3 {
  color: #9a673a;
  margin-bottom: 10px;
}
.servicePage .serviceDetails .serviceDetailsList .detailsListBox ul {
  margin-left: 40px;
}
@media (max-width: 1024px) {
  .servicePage .serviceDetails .serviceDetailsList .detailsListBox ul {
    margin-left: 20px;
  }
}
.servicePage .serviceDetails .serviceDetailsList .detailsListBox ul li {
  margin-bottom: 10px;
}
.servicePage .servicePageWhyChooseUs h2 {
  color: #175f8f;
  font-size: 36px;
  text-align: center;
  margin-bottom: 20px;
  padding-top: 20px;
}
.servicePage .servicePageWhyChooseUs .whyChooseUsList .whyChooseUsListBox {
  background: #ebf2f8;
  padding: 20px;
  margin-bottom: 20px;
  border-radius: 10px;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
}
@media (max-width: 1024px) {
  .servicePage .servicePageWhyChooseUs .whyChooseUsList .whyChooseUsListBox {
    border-radius: 0;
  }
}
.servicePage .servicePageWhyChooseUs .whyChooseUsList .whyChooseUsListBox:nth-child(even) {
  background: #e4ebf1;
}
.servicePage .servicePageWhyChooseUs .whyChooseUsList .whyChooseUsListBox h3 {
  color: #175f8f;
  margin-bottom: 10px;
}
.servicePage .applicableScenarios h2 {
  text-align: center;
  font-size: 36px;
  color: #cb9360;
  margin-bottom: 20px;
  padding-top: 20px;
}
.servicePage .applicableScenarios ul {
  list-style: none;
}
.servicePage .applicableScenarios ul li {
  background: #fff8eb;
  color: #9a673a;
  padding: 20px;
  margin-bottom: 10px;
  border-radius: 10px;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
  font-weight: bold;
  font-size: 20px;
}
.servicePage .applicableScenarios ul li:nth-child(even) {
  background: #ffebc8;
}
@media (max-width: 1024px) {
  .servicePage .applicableScenarios ul li {
    border-radius: 0;
  }
}
.servicePage .ourCommitment h2 {
  text-align: center;
  font-size: 36px;
  color: #c78382;
  margin-bottom: 20px;
  padding-top: 20px;
}
.servicePage .ourCommitment .ourCommitmentBox {
  background: #fcf6f6;
  margin-bottom: 5px;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
  margin-bottom: 20px;
}
@media (max-width: 1024px) {
  .servicePage .ourCommitment .ourCommitmentBox {
    border-radius: 0;
  }
}
.servicePage .ourCommitment .ourCommitmentBox:nth-child(odd) {
  background: #f8eae9;
}
.servicePage .ourCommitment .ourCommitmentBox h3 {
  text-align: center;
  color: #c78382;
  margin-bottom: 10px;
}
.servicePage .ourCommitment .ourCommitmentBox p {
  text-align: center;
}

.debtPublicPage {
  padding: 50px 0;
  max-width: 768px;
  margin: 0 auto;
}
.debtPublicPage .topText h1 {
  color: red;
  text-align: center;
  font-size: 38px;
  margin-bottom: 20px;
}
@media (max-width: 1024px) {
  .debtPublicPage .topText h1 {
    padding: 0 5%;
    font-size: 28px;
    line-height: 1.5;
    letter-spacing: 2px;
  }
}
.debtPublicPage .topText p {
  margin-bottom: 20px;
  text-align: center;
  line-height: 1.5;
  font-size: 18px;
}
.debtPublicPage .topText p span {
  color: red;
  font-weight: bold;
}
@media (max-width: 1024px) {
  .debtPublicPage .topText p {
    padding: 0 5%;
    font-size: 18px;
    line-height: 1.5;
    letter-spacing: 2px;
  }
}

.solutionSection {
  margin-top: 100px;
}
.solutionSection .solutionIntroduction h2,
.solutionSection .solutionIntroduction h3 {
  text-align: center;
  color: #cb8384;
  margin-bottom: 20px;
}
.solutionSection .solutionIntroduction h2 {
  font-size: 36px;
}
.solutionSection .solutionIntroduction h3 {
  font-size: 24px;
}
.solutionSection .solutionIntroduction p {
  text-align: center;
  margin-bottom: 20px;
  line-height: 1.5;
  letter-spacing: 2px;
}
.solutionSection .solutionIntroduction p span {
  color: red;
  font-weight: bold;
}
@media (max-width: 1024px) {
  .solutionSection .solutionIntroduction p {
    padding: 0 5%;
    font-size: 18px;
    line-height: 1.5;
    letter-spacing: 2px;
  }
}
.solutionSection .solutionList .solutionListBox {
  background: #f4e0df;
  display: flex;
  padding: 20px;
  position: relative;
  margin-bottom: 10px;
  border-radius: 5px;
}
.solutionSection .solutionList .solutionListBox:nth-child(odd) {
  background: #fcf2f1;
}
.solutionSection .solutionList .solutionListBox .leftText h4 {
  color: #cb8384;
  font-size: 24px;
  margin-bottom: 10px;
}
.solutionSection .solutionList .solutionListBox .leftText p {
  color: #000;
  font-size: 18px;
}
@media (max-width: 1024px) {
  .solutionSection .solutionList .solutionListBox .leftText p {
    margin-right: 30px;
  }
}
.solutionSection .solutionList .solutionListBox .rightIcon {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  font-size: 36px;
  color: #cb8384;
}

.solutionSection.emotion2 .solutionIntroduction h2,
.solutionSection.emotion2 .solutionIntroduction h3 {
  color: #cc9260;
}
.solutionSection.emotion2 .solutionList .solutionListBox {
  background: #ffeddf;
}
.solutionSection.emotion2 .solutionList .solutionListBox:nth-child(odd) {
  background: #fffaf6;
}
.solutionSection.emotion2 .solutionList .solutionListBox .leftText h4 {
  color: #cc9260;
}
.solutionSection.emotion2 .solutionList .solutionListBox .rightIcon {
  color: #cc9260;
}

.solutionSection.emotion3 .solutionIntroduction h2,
.solutionSection.emotion3 .solutionIntroduction h3 {
  color: #a29d4c;
}
.solutionSection.emotion3 .solutionList .solutionListBox {
  background: #f8f7d9;
}
.solutionSection.emotion3 .solutionList .solutionListBox:nth-child(odd) {
  background: #fffeec;
}
.solutionSection.emotion3 .solutionList .solutionListBox .leftText h4 {
  color: #a29d4c;
}
.solutionSection.emotion3 .solutionList .solutionListBox .rightIcon {
  color: #a29d4c;
}

.solutionSection.seekJustice1 .solutionIntroduction h2,
.solutionSection.seekJustice1 .solutionIntroduction h3 {
  color: #396d92;
}
.solutionSection.seekJustice1 .solutionList .solutionListBox {
  background: #e4ebf1;
}
.solutionSection.seekJustice1 .solutionList .solutionListBox:nth-child(odd) {
  background: #f1f8fe;
}
.solutionSection.seekJustice1 .solutionList .solutionListBox .leftText h4 {
  color: #396d92;
}
.solutionSection.seekJustice1 .solutionList .solutionListBox .rightIcon {
  color: #396d92;
}

.solutionSection.seekJustice2 .solutionIntroduction h2,
.solutionSection.seekJustice2 .solutionIntroduction h3 {
  color: #982cd7;
}
.solutionSection.seekJustice2 .solutionList .solutionListBox {
  background: #f7e8ff;
}
.solutionSection.seekJustice2 .solutionList .solutionListBox:nth-child(odd) {
  background: #fbf5ff;
}
.solutionSection.seekJustice2 .solutionList .solutionListBox .leftText h4 {
  color: #982cd7;
}
.solutionSection.seekJustice2 .solutionList .solutionListBox .rightIcon {
  color: #982cd7;
}

.solutionSection.recoverDebt1 .solutionIntroduction h2,
.solutionSection.recoverDebt1 .solutionIntroduction h3 {
  color: #175f8f;
}
.solutionSection.recoverDebt1 .solutionList .solutionListBox {
  background: #e2f4ff;
}
.solutionSection.recoverDebt1 .solutionList .solutionListBox:nth-child(odd) {
  background: #f2f9ff;
}
.solutionSection.recoverDebt1 .solutionList .solutionListBox .leftText h4 {
  color: #175f8f;
}
.solutionSection.recoverDebt1 .solutionList .solutionListBox .rightIcon {
  color: #175f8f;
}

.solutionSection.recoverDebt2 .solutionIntroduction h2,
.solutionSection.recoverDebt2 .solutionIntroduction h3 {
  color: #4a6e6e;
}
.solutionSection.recoverDebt2 .solutionList .solutionListBox {
  background: #dff3f2;
}
.solutionSection.recoverDebt2 .solutionList .solutionListBox:nth-child(odd) {
  background: #f0ffff;
}
.solutionSection.recoverDebt2 .solutionList .solutionListBox .leftText h4 {
  color: #4a6e6e;
}
.solutionSection.recoverDebt2 .solutionList .solutionListBox .rightIcon {
  color: #4a6e6e;
}

.solutionSection.recoverDebt3 .solutionIntroduction h2,
.solutionSection.recoverDebt3 .solutionIntroduction h3 {
  color: #ff7f00;
}
.solutionSection.recoverDebt3 .solutionList .solutionListBox {
  background: #ffebc8;
}
.solutionSection.recoverDebt3 .solutionList .solutionListBox:nth-child(odd) {
  background: #fff7ea;
}
.solutionSection.recoverDebt3 .solutionList .solutionListBox .leftText h4 {
  color: #ff7f00;
}
.solutionSection.recoverDebt3 .solutionList .solutionListBox .rightIcon {
  color: #ff7f00;
}

.solutionPage {
  margin-top: 80px;
  padding-top: 50px;
  background: linear-gradient(to bottom, #f2f9ff, #fff);
}
@media (max-width: 1024px) {
  .solutionPage {
    margin-top: 60px;
  }
}
.solutionPage .solutionTitle {
  margin-bottom: 50px;
  color: red;
  text-align: center;
}
@media (max-width: 1024px) {
  .solutionPage .solutionTitle {
    padding: 0 5%;
  }
}
.solutionPage .solutionTitle h1 {
  font-size: 32px;
  margin-bottom: 10px;
}
.solutionPage .solutionTitle h2 {
  font-size: 32px;
}
@media (max-width: 1024px) {
  .solutionPage .solutionTitle h2 {
    font-size: 24px;
  }
}
.solutionPage .solutionTopText {
  text-align: center;
  margin-bottom: 50px;
}
@media (max-width: 1024px) {
  .solutionPage .solutionTopText {
    padding: 0 5%;
  }
}
.solutionPage .solutionTopText h2 {
  font-size: 26px;
  color: #16608f;
  margin-bottom: 20px;
}
.solutionPage .solutionTopText p {
  letter-spacing: 2px;
}
@media (max-width: 1024px) {
  .solutionPage .solutionTopText p {
    font-size: 20px;
    line-height: 1.5;
    text-align: left;
  }
}
.solutionPage .solutionDetailed {
  margin-bottom: 50px;
}
.solutionPage .solutionDetailed h2 {
  font-size: 22px;
  color: #9a6738;
  text-align: center;
  margin-bottom: 20px;
}
@media (max-width: 1024px) {
  .solutionPage .solutionDetailed h2 {
    font-size: 26px;
  }
}
.solutionPage .solutionDetailed > p {
  font-size: 18px;
  text-align: center;
  font-weight: bold;
  margin-bottom: 30px;
}
@media (max-width: 1024px) {
  .solutionPage .solutionDetailed > p {
    text-align: left;
    padding: 0 5%;
  }
}
.solutionPage .solutionDetailed .solutionDetailedList {
  margin-bottom: 30px;
}
.solutionPage .solutionDetailed .solutionDetailedList .solutionDetailedBox {
  background: #fff9ed;
  padding: 20px 30px;
  margin-bottom: 10px;
  border-radius: 10px;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
}
@media (max-width: 1024px) {
  .solutionPage .solutionDetailed .solutionDetailedList .solutionDetailedBox {
    border-radius: 0;
  }
}
.solutionPage .solutionDetailed .solutionDetailedList .solutionDetailedBox h3 {
  color: #9a6738;
  margin-bottom: 10px;
}
@media (max-width: 1024px) {
  .solutionPage .solutionDetailed .solutionDetailedList .solutionDetailedBox h3 {
    font-size: 26px;
  }
}
.solutionPage .solutionDetailed .solutionDetailedList .solutionDetailedBox ul {
  margin-left: 20px;
}
.solutionPage .solutionDetailed .solutionDetailedList .solutionDetailedBox ul li {
  margin-bottom: 5px;
  font-weight: bolder;
}
@media (max-width: 1024px) {
  .solutionPage .solutionDetailed .solutionDetailedList .solutionDetailedBox ul li {
    font-size: 18px;
  }
}
.solutionPage .solutionWarn {
  margin-bottom: 50px;
  text-align: center;
}
.solutionPage .solutionWarn h2 {
  color: #f00;
  font-size: 40px;
  margin-bottom: 20px;
}
@media (max-width: 1024px) {
  .solutionPage .solutionWarn h2 {
    font-size: 26px;
  }
}
.solutionPage .solutionWarn p {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 10px;
}
@media (max-width: 1024px) {
  .solutionPage .solutionWarn p {
    text-align: left;
    padding: 0 5%;
    margin-bottom: 20px;
    line-height: 1.5;
  }
}
.solutionPage .solutionWarn p i {
  margin-right: 5px;
}
.solutionPage .solutionHelp {
  margin-bottom: 50px;
}
.solutionPage .solutionHelp h2 {
  text-align: center;
  font-size: 32px;
  color: #1a5e8b;
  margin-bottom: 20px;
}
.solutionPage .solutionHelp > p {
  text-align: center;
  margin-bottom: 20px;
}
.solutionPage .solutionHelp .solutionHelpList .solutionHelpBox {
  display: block;
  background: #ebf2f8;
  position: relative;
  padding: 20px;
  margin-bottom: 10px;
  border-radius: 10px;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
}
@media (max-width: 1024px) {
  .solutionPage .solutionHelp .solutionHelpList .solutionHelpBox {
    border-radius: 0;
  }
}
.solutionPage .solutionHelp .solutionHelpList .solutionHelpBox:nth-child(even) {
  background: #e4ebf1;
}
.solutionPage .solutionHelp .solutionHelpList .solutionHelpBox .leftText {
  margin-right: 40px;
}
.solutionPage .solutionHelp .solutionHelpList .solutionHelpBox .leftText h3 {
  color: #1a5e8b;
  margin-bottom: 10px;
}
@media (max-width: 1024px) {
  .solutionPage .solutionHelp .solutionHelpList .solutionHelpBox .leftText h3 {
    font-size: 26px;
  }
}
.solutionPage .solutionHelp .solutionHelpList .solutionHelpBox .leftText ul {
  margin-left: 20px;
  list-style: none;
}
@media (max-width: 1024px) {
  .solutionPage .solutionHelp .solutionHelpList .solutionHelpBox .leftText ul {
    margin: 0;
  }
}
.solutionPage .solutionHelp .solutionHelpList .solutionHelpBox .leftText ul li {
  color: #000;
  margin-bottom: 10px;
}
@media (max-width: 1024px) {
  .solutionPage .solutionHelp .solutionHelpList .solutionHelpBox .leftText ul li {
    font-size: 18px;
    font-weight: bold;
  }
}
.solutionPage .solutionHelp .solutionHelpList .solutionHelpBox .rightIcon {
  color: #1a5e8b;
  font-size: 30px;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
}
.solutionPage .blueBgArea.solution > a {
  color: #f00;
  font-size: 24px;
  font-weight: bold;
}
.solutionPage .blueBgArea.solution > a br {
  display: none;
}
@media (max-width: 1024px) {
  .solutionPage .blueBgArea.solution > a br {
    display: block;
  }
}
.solutionPage .blueBgArea.solution .contactsBtns {
  margin-top: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 1024px) {
  .solutionPage .blueBgArea.solution .contactsBtns {
    flex-direction: column;
  }
}
.solutionPage .blueBgArea.solution .contactsBtns a {
  font-size: 22px;
  padding: 10px 25px;
  border-radius: 25px;
  background: #396d92;
  color: #d5effe;
  margin: 0 10px;
}
.solutionPage .blueBgArea.solution .contactsBtns a:hover {
  background: #4788b7;
}
@media (max-width: 1024px) {
  .solutionPage .blueBgArea.solution .contactsBtns a {
    margin: 10px 0;
  }
}
.solutionPage .solutionProcess {
  margin-top: 50px;
  margin-bottom: 50px;
}
.solutionPage .solutionProcess h2 {
  color: #486f6e;
  text-align: center;
  margin-bottom: 20px;
  font-size: 32px;
}
.solutionPage .solutionProcess .solutionProcessList .solutionProcessBox {
  padding: 20px;
  background: #f0ffff;
  margin-bottom: 10px;
  border-radius: 10px;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
}
.solutionPage .solutionProcess .solutionProcessList .solutionProcessBox:nth-child(even) {
  background: #dff3f2;
}
@media (max-width: 1024px) {
  .solutionPage .solutionProcess .solutionProcessList .solutionProcessBox {
    border-radius: 0;
  }
}
.solutionPage .solutionProcess .solutionProcessList .solutionProcessBox h3 {
  color: #486f6e;
  margin-bottom: 10px;
}
@media (max-width: 1024px) {
  .solutionPage .solutionProcess .solutionProcessList .solutionProcessBox h3 {
    font-size: 22px;
  }
}
.solutionPage .solutionProcess .solutionProcessList .solutionProcessBox ul {
  margin-left: 0px;
  list-style: none;
}
.solutionPage .solutionProcess .solutionProcessList .solutionProcessBox ul li {
  margin-bottom: 10px;
}
@media (max-width: 1024px) {
  .solutionPage .solutionProcess .solutionProcessList .solutionProcessBox ul li {
    font-size: 18px;
    font-weight: bold;
    line-height: 1.5;
  }
}
.solutionPage .solutionFeedback {
  margin-bottom: 50px;
}
@media (max-width: 1024px) {
  .solutionPage .solutionFeedback {
    padding: 0 5%;
  }
}
.solutionPage .solutionFeedback h2 {
  text-align: center;
  color: #bcb66c;
  font-size: 36px;
  margin-bottom: 30px;
}
.solutionPage .solutionFeedback .solutionFeedbackList .solutionFeedbackBox {
  background: #bcb66c;
  margin-bottom: 80px;
  padding: 20px;
  color: #fff;
  position: relative;
}
.solutionPage .solutionFeedback .solutionFeedbackList .solutionFeedbackBox:nth-child(odd) {
  border-radius: 15px 15px 0 15px;
}
.solutionPage .solutionFeedback .solutionFeedbackList .solutionFeedbackBox:nth-child(odd):after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 0;
  height: 0;
  border: 36px solid transparent;
  border-top-color: #bcb66c;
  border-bottom: 0;
  border-right: 0;
  margin-left: -23px;
  margin-bottom: -36px;
}
.solutionPage .solutionFeedback .solutionFeedbackList .solutionFeedbackBox:nth-child(even) {
  border-radius: 15px 15px 15px 0;
}
.solutionPage .solutionFeedback .solutionFeedbackList .solutionFeedbackBox:nth-child(even):after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 3%;
  width: 0;
  height: 0;
  border: 46px solid transparent;
  border-top-color: #bcb66c;
  border-bottom: 0;
  border-left: 0;
  margin-left: -23px;
  margin-bottom: -36px;
}
@media (max-width: 1024px) {
  .solutionPage .solutionFeedback .solutionFeedbackList .solutionFeedbackBox:nth-child(even):after {
    left: 23px;
  }
}
.solutionPage .solutionFeedback .solutionFeedbackList .solutionFeedbackBox h4 {
  font-size: 18px;
  margin-bottom: 20px;
}
.solutionPage .solutionFeedback .solutionFeedbackList .solutionFeedbackBox p {
  font-size: 18px;
}

.faqPage {
  margin-top: 80px;
  padding-top: 40px;
}
.faqPage h1 {
  text-align: center;
  margin-bottom: 30px;
  color: #113d5a;
}
.faqPage > p {
  font-weight: bold;
  text-align: center;
  color: #175f8f;
  line-height: 2;
  font-size: 18px;
}
.faqPage > p a {
  color: red;
}
@media (max-width: 1024px) {
  .faqPage > p {
    padding: 0 10px;
    font-size: 20px;
  }
  .faqPage > p br {
    display: none;
  }
}
.faqPage .faqPageContent {
  margin-top: 80px;
}
@media (max-width: 1024px) {
  .faqPage .faqPageContent {
    margin-top: 40px;
  }
}
@media (max-width: 1024px) {
  .faqPage .faqPageContent .pcFaq {
    display: none;
  }
}
.faqPage .faqPageContent .pcFaq #tab-menu {
  display: flex;
  justify-content: space-between;
  padding: 0 30px;
}
.faqPage .faqPageContent .pcFaq #tab-menu button {
  width: calc(16.6666666667% - 15px);
  padding: 20px;
  border: none;
  border-radius: 5px;
  font-size: 22px;
  cursor: pointer;
  color: #fff;
}
.faqPage .faqPageContent .pcFaq #tab-menu button:nth-child(1) {
  background: #113d5a;
}
.faqPage .faqPageContent .pcFaq #tab-menu button:nth-child(2) {
  background: #561b75;
}
.faqPage .faqPageContent .pcFaq #tab-menu button:nth-child(3) {
  background: #124a23;
}
.faqPage .faqPageContent .pcFaq #tab-menu button:nth-child(4) {
  background: #7a3901;
}
.faqPage .faqPageContent .pcFaq #tab-menu button:nth-child(5) {
  background: #d48600;
}
.faqPage .faqPageContent .pcFaq #tab-menu button:nth-child(6) {
  background: #280f6a;
}
.faqPage .faqPageContent .pcFaq #tab-menu button.active {
  position: relative;
}
.faqPage .faqPageContent .pcFaq #tab-menu button.active::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(-4.5%, -10%);
  border-radius: 5px 5px 0 0;
  width: 110%;
  height: 120px;
  background: #f9f8fe;
  z-index: -1;
}
.faqPage .faqPageContent .pcFaq #support-services-content {
  padding: 50px 0;
  margin-top: 20px;
  background: #f9f8fe;
}
.faqPage .faqPageContent .pcFaq #support-services-content h2 {
  text-align: center;
}
.faqPage .faqPageContent .pcFaq #support-services-content .qa-block {
  width: 768px;
  margin: 0 auto;
  padding: 30px 0;
}
.faqPage .faqPageContent .pcFaq #support-services-content .qa-block .question {
  width: 700px;
  margin-bottom: 20px;
  padding: 20px;
  background: #175f8f;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
  color: #fff;
  display: flex;
  align-items: center;
}
.faqPage .faqPageContent .pcFaq #support-services-content .qa-block .question span {
  font-weight: bold;
  padding: 10px;
  background: #fff;
  color: #113d5a;
  margin-right: 10px;
  border-radius: 5px;
  font-size: 22px;
}
.faqPage .faqPageContent .pcFaq #support-services-content .qa-block .answer {
  width: 700px;
  margin-left: auto;
  padding: 20px;
  background: #fff;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
  display: flex;
  align-items: center;
}
.faqPage .faqPageContent .pcFaq #support-services-content .qa-block .answer p {
  margin-bottom: 5px;
}
.faqPage .faqPageContent .pcFaq #support-services-content .qa-block .answer a {
  color: red;
  font-weight: bold;
}
.faqPage .faqPageContent .pcFaq #support-services-content .qa-block .answer span {
  font-weight: bold;
  padding: 10px;
  background: #113d5a;
  color: #fff;
  margin-right: 10px;
  border-radius: 5px;
  font-size: 22px;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq1 h2 {
  color: #113d5a;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq1 .qa-block .question {
  background: #113d5a;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq1 .qa-block .question span {
  color: #113d5a;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq1 .qa-block .answer {
  color: #113d5a;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq1 .qa-block .answer span {
  background: #113d5a;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq2 h2 {
  color: #561b75;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq2 .qa-block .question {
  background: #561b75;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq2 .qa-block .question span {
  color: #561b75;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq2 .qa-block .answer {
  color: #561b75;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq2 .qa-block .answer span {
  background: #561b75;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq3 h2 {
  color: #124a23;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq3 .qa-block .question {
  background: #124a23;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq3 .qa-block .question span {
  color: #124a23;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq3 .qa-block .answer {
  color: #124a23;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq3 .qa-block .answer span {
  background: #124a23;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq4 h2 {
  color: #7a3901;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq4 .qa-block .question {
  background: #7a3901;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq4 .qa-block .question span {
  color: #7a3901;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq4 .qa-block .answer {
  color: #7a3901;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq4 .qa-block .answer span {
  background: #7a3901;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq5 h2 {
  color: #d48600;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq5 .qa-block .question {
  background: #d48600;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq5 .qa-block .question span {
  color: #d48600;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq5 .qa-block .answer {
  color: #d48600;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq5 .qa-block .answer span {
  background: #d48600;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq6 h2 {
  color: #280f6a;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq6 .qa-block .question {
  background: #280f6a;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq6 .qa-block .question span {
  color: #280f6a;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq6 .qa-block .answer {
  color: #280f6a;
}
.faqPage .faqPageContent .pcFaq #support-services-content.faq6 .qa-block .answer span {
  background: #280f6a;
}
.faqPage .faqPageContent .mobileFaq {
  display: none;
  margin-bottom: 50px;
}
@media (max-width: 1024px) {
  .faqPage .faqPageContent .mobileFaq {
    display: block;
  }
}
.faqPage .faqPageContent .mobileFaq .faqCategory .accordionTitle {
  width: 100%;
  margin-bottom: 10px;
  padding: 20px;
  border: none;
  font-size: 28px;
}
.faqPage .faqPageContent .mobileFaq .faqCategory .accordionTitle span {
  font-weight: bold;
  letter-spacing: 2px;
  color: #000;
}
.faqPage .faqPageContent .mobileFaq .faqCategory .accordionTitle i {
  position: absolute;
  right: 20px;
  background-color: #fff;
  border-radius: 50%;
  padding: 5px;
}
.faqPage .faqPageContent .mobileFaq .faqCategory .accordionContent {
  padding: 20px;
}
.faqPage .faqPageContent .mobileFaq .faqCategory .accordionContent .accordionGroup .accordionContentBox h5 {
  display: flex;
  align-items: center;
  font-size: 20px;
  background: #280f6a;
  color: #fff;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
  margin-bottom: 20px;
}
.faqPage .faqPageContent .mobileFaq .faqCategory .accordionContent .accordionGroup .accordionContentBox h5 span {
  background: #fff;
  padding: 5px;
  color: #280f6a;
  margin-right: 10px;
  border-radius: 5px;
  font-size: 32px;
}
.faqPage .faqPageContent .mobileFaq .faqCategory .accordionContent .accordionGroup .accordionContentBox > div {
  background: #fff;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
  margin-bottom: 20px;
}
.faqPage .faqPageContent .mobileFaq .faqCategory .accordionContent .accordionGroup .accordionContentBox > div p {
  margin-bottom: 10px;
  font-size: 18px;
}
.faqPage .faqPageContent .mobileFaq .faqCategory .accordionContent .accordionGroup .accordionContentBox > div a {
  font-weight: bold;
  color: red;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq1 .accordionTitle {
  background: #113d5a;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq1 .accordionTitle span {
  color: #fff;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq1 .accordionTitle i {
  color: #113d5a;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq1 .accordionContent {
  background: #f2f9ff;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq1 .accordionContent .accordionGroup .accordionContentBox h5 {
  background: #113d5a;
  color: #fff;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq1 .accordionContent .accordionGroup .accordionContentBox h5 span {
  background: #fff;
  color: #113d5a;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq1 .accordionContent .accordionGroup .accordionContentBox > div p {
  color: #113d5a;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq2 .accordionTitle {
  background: #561b75;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq2 .accordionTitle span {
  color: #fff;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq2 .accordionTitle i {
  color: #561b75;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq2 .accordionContent {
  background: #faefff;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq2 .accordionContent .accordionGroup .accordionContentBox h5 {
  background: #561b75;
  color: #fff;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq2 .accordionContent .accordionGroup .accordionContentBox h5 span {
  background: #fff;
  color: #561b75;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq2 .accordionContent .accordionGroup .accordionContentBox > div p {
  color: #561b75;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq3 .accordionTitle {
  background: #124a23;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq3 .accordionTitle span {
  color: #fff;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq3 .accordionTitle i {
  color: #124a23;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq3 .accordionContent {
  background: #f8fefa;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq3 .accordionContent .accordionGroup .accordionContentBox h5 {
  background: #124a23;
  color: #fff;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq3 .accordionContent .accordionGroup .accordionContentBox h5 span {
  background: #fff;
  color: #124a23;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq3 .accordionContent .accordionGroup .accordionContentBox > div p {
  color: #124a23;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq4 .accordionTitle {
  background: #7a3901;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq4 .accordionTitle span {
  color: #fff;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq4 .accordionTitle i {
  color: #7a3901;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq4 .accordionContent {
  background: #fff5ec;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq4 .accordionContent .accordionGroup .accordionContentBox h5 {
  background: #7a3901;
  color: #fff;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq4 .accordionContent .accordionGroup .accordionContentBox h5 span {
  background: #fff;
  color: #7a3901;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq4 .accordionContent .accordionGroup .accordionContentBox > div p {
  color: #7a3901;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq5 .accordionTitle {
  background: #d48600;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq5 .accordionTitle span {
  color: #fff;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq5 .accordionTitle i {
  color: #d48600;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq5 .accordionContent {
  background: #fff4e2;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq5 .accordionContent .accordionGroup .accordionContentBox h5 {
  background: #d48600;
  color: #fff;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq5 .accordionContent .accordionGroup .accordionContentBox h5 span {
  background: #fff;
  color: #d48600;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq5 .accordionContent .accordionGroup .accordionContentBox > div p {
  color: #d48600;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq6 .accordionTitle {
  background: #280f6b;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq6 .accordionTitle span {
  color: #fff;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq6 .accordionTitle i {
  color: #280f6b;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq6 .accordionContent {
  background: #f9f8fe;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq6 .accordionContent .accordionGroup .accordionContentBox h5 {
  background: #280f6b;
  color: #fff;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq6 .accordionContent .accordionGroup .accordionContentBox h5 span {
  background: #fff;
  color: #280f6b;
}
.faqPage .faqPageContent .mobileFaq .faqCategory.mobileFaq6 .accordionContent .accordionGroup .accordionContentBox > div p {
  color: #280f6b;
}

.accordion-enter-active,
.accordion-leave-active {
  transition: all 0.3s ease;
}

.accordion-enter-from,
.accordion-leave-to {
  opacity: 0;
  max-height: 0;
}

.accordion-enter-to,
.accordion-leave-from {
  opacity: 1;
  max-height: 500px; /* 根據內容調整 */
}

.caseIndexPage {
  background: linear-gradient(to bottom, #f2f9ff, #fff);
  margin-top: 80px;
  margin-bottom: 50px;
}
@media (max-width: 1024px) {
  .caseIndexPage {
    margin-top: 60px;
  }
}
.caseIndexPage h1 {
  text-align: center;
  color: #113d5a;
  padding: 50px 0;
}
@media (max-width: 1024px) {
  .caseIndexPage .pcCaseIndex {
    display: none;
  }
}
.caseIndexPage .pcCaseIndex .caseList {
  display: flex;
}
@media (max-width: 1024px) {
  .caseIndexPage .pcCaseIndex .caseList {
    flex-direction: column-reverse;
  }
}
.caseIndexPage .pcCaseIndex .caseList .leftType {
  width: 25%;
  display: flex;
  flex-direction: column;
}
@media (max-width: 1024px) {
  .caseIndexPage .pcCaseIndex .caseList .leftType {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 50px;
  }
}
.caseIndexPage .pcCaseIndex .caseList .leftType .caseLink {
  background: #113d5a;
  color: #fff;
  margin-bottom: 10px;
  padding: 10px 20px;
  border-radius: 10px;
  text-align: center;
  position: relative;
  font-size: 20px;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
}
@media (max-width: 1024px) {
  .caseIndexPage .pcCaseIndex .caseList .leftType .caseLink {
    padding: 5px;
  }
}
.caseIndexPage .pcCaseIndex .caseList .leftType .caseLink:hover, .caseIndexPage .pcCaseIndex .caseList .leftType .caseLink.active {
  background: #175f8f;
}
.caseIndexPage .pcCaseIndex .caseList .leftType .caseLink i {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #fff;
  font-size: 26px;
}
@media (max-width: 1024px) {
  .caseIndexPage .pcCaseIndex .caseList .leftType .caseLink i {
    display: none;
  }
}
.caseIndexPage .pcCaseIndex .caseList .rightList {
  width: 74%;
  margin-left: 1%;
  display: flex;
  flex-direction: column;
}
@media (max-width: 1024px) {
  .caseIndexPage .pcCaseIndex .caseList .rightList {
    margin-left: 0;
    width: 100%;
  }
}
.caseIndexPage .pcCaseIndex .caseList .rightList a {
  background: #dbf1ff;
  color: #113d5a;
  margin-bottom: 10px;
  padding: 10px 20px;
  border-radius: 10px;
  position: relative;
  padding-left: 20px;
  font-size: 20px;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
  font-weight: bold;
  padding-right: 50px;
}
.caseIndexPage .pcCaseIndex .caseList .rightList a i {
  font-size: 26px;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  border-radius: 50%;
  border: 2px solid #113d5a;
}
@media (max-width: 1024px) {
  .caseIndexPage .pcCaseIndex .caseList .rightList a i {
    right: 10px;
  }
}
.caseIndexPage .pcCaseIndex .caseList .rightList a:hover {
  background: #113d5a;
  color: #fff;
}
.caseIndexPage .pcCaseIndex .caseList .rightList a:hover i {
  color: #fff;
  border: 2px solid #fff;
}
.caseIndexPage .mobileCaseIndex {
  display: none;
}
@media (max-width: 1024px) {
  .caseIndexPage .mobileCaseIndex {
    display: flex;
    flex-direction: column;
  }
}
.caseIndexPage .mobileCaseIndex .caseTitleButton {
  border: none;
  margin-bottom: 5px;
  padding: 15px 0;
  font-size: 20px;
  background: #113d5a;
  color: #fff;
  font-weight: bold;
}
.caseIndexPage .mobileCaseIndex .caseTitleButton i {
  position: absolute;
  right: 20px;
  border-radius: 50%;
  background: #fff;
  color: #113d5a;
  font-size: 26px;
  font-weight: bold;
  transition: all 0.3s;
}
.caseIndexPage .mobileCaseIndex .caseTitleButton.active i {
  transform: rotate(180deg);
}
.caseIndexPage .mobileCaseIndex .caseTitleButton.even {
  background: #175f8f;
}
.caseIndexPage .mobileCaseIndex .caseListContent {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-in-out; /* 過渡動畫 */
  margin-bottom: 10px;
}
.caseIndexPage .mobileCaseIndex .caseListContent a {
  color: #113d5a;
  display: block;
  padding: 20px;
  background: #dbf1ff;
  margin: 5px 20px;
  border-radius: 10px;
  font-weight: bold;
  font-size: 20px;
}
.caseIndexPage .mobileCaseIndex .caseListContent.active {
  max-height: 1000px;
}

.casePage {
  background: linear-gradient(to bottom, #f2f9ff, #fff);
  margin-top: 70px;
  padding-top: 50px;
  margin-bottom: 50px;
}
.casePage h1 {
  font-size: 32px;
  text-align: center;
  color: red;
  margin-bottom: 50px;
}
.casePage h2,
.casePage h3 {
  color: #113d5a;
  margin-top: 30px;
  margin-bottom: 10px;
}
.casePage h3 {
  color: red;
}
.casePage ul,
.casePage ol {
  margin-left: 20px;
}
.casePage ul li,
.casePage ol li {
  margin-bottom: 10px;
  font-weight: bold;
  font-size: 20px;
  letter-spacing: 2px;
  line-height: 1.5;
}
.casePage p {
  margin-bottom: 20px;
  font-size: 20px;
  letter-spacing: 2px;
  line-height: 1.5;
}
.casePage p span {
  font-weight: bold;
}
.casePage .bottomButton {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 50px;
}
@media (max-width: 1024px) {
  .casePage .bottomButton {
    flex-direction: column;
  }
}
.casePage .bottomButton a {
  background: #dbf1ff;
  color: #113d5a;
  padding: 10px 20px;
  border-radius: 10px;
  letter-spacing: 2px;
  font-weight: bold;
}
@media (max-width: 1024px) {
  .casePage .bottomButton a {
    width: 100%;
    margin-bottom: 10px;
    text-align: center;
    font-size: 20px;
  }
}
.casePage .bottomButton a:hover {
  background: #113d5a;
  color: #fff;
}

.custom-swal-popup {
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}

.custom-swal-title {
  font-size: 22px;
  font-weight: bold;
  color: #333;
}

.custom-swal-text {
  font-size: 16px;
  color: #555;
  line-height: 1.5;
}/*# sourceMappingURL=main.css.map */