@media (max-width: 768px) {
  h1.color-blue {
    font-size: 20px;
  }
}

#loading {
  background-color: rgba(0, 0, 0, 0.99);
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  color: #fff;
  position: fixed;
  box-sizing: border-box;
  overflow: hidden;
  z-index: 999999;
}

#loading:before {
  content: attr(data-text);
  top: calc(50% - 63px);
  position: fixed;
  left: 0;
  color: currentColor;
  text-align: center;
  width: 100%;
  font-size: 14px;
  animation: blink 1s linear infinite alternate;
}

#loading:after {
  box-sizing: border-box;
  content: "";
  position: fixed;
  width: 80px;
  height: 80px;
  border: 4px solid #3ca3f0;
  border-left-color: transparent;
  border-radius: 50%;
  top: calc(50% - 40px);
  left: calc(50% - 40px);
  animation: rotation 1s linear infinite;
}

@keyframes rotation {
  from {
    transform: rotate(0);
  }

  to {
    transform: rotate(359deg);
  }
}

@keyframes blink {
  from {
    opacity: 0.5;
  }

  to {
    opacity: 1;
  }
}

#loading svg {
  height: auto;
  position: fixed;
  width: 40px;
  height: 29px;
  top: calc(50% - 15px);
  left: calc(50% - 20px);
}

/* 調整所有帶有錨點的標題的滾動偏移 */
h3[id],
h2[id],
div[id],
section[id] {
  scroll-margin-top: 95px;
}

/* 限定打勾樣式只應用於帶有 custom-check 的 ul */
ul.custom-check {
  list-style: none;
  /* 移除預設的圓點符號 */
  padding-left: 0;
}

ul.custom-check li {
  color: #2858aa;
}

/* ul.custom-check li a:hover {
    text-decoration: underline;
  } */

/* ul.custom-check li a {
    text-decoration: none;
    color: #2858AA;
  } */

ul.custom-check li a:hover {
  text-decoration: underline;
  text-decoration-color: #2858aa;
}

ul.custom-check li::before {
  content: "\2714";
  /* Unicode 粗體打勾符號 ✔ */
  color: #2858aa;
  /* 自訂藍色 */
  margin-right: 10px;
  /* 與文字的間距 */
  font-size: 18px;
  /* 可調整大小 */
  font-weight: bold;
  /* 確保文字加粗 */
  text-decoration: none;
  /* 排除符號底線 */
}

#case {
  position: relative;
}

.swiper-pagination {
  position: absolute;
  bottom: 20px;
  left: 50% !important;
  transform: translateX(-50%);
  z-index: 10;
}

/* 自訂點點點樣式 */
.swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background-color: #ccc;
  opacity: 1;
}

.swiper-pagination-bullet-active {
  background-color: #007bff;
  /* 活動的點點顏色 */
}

#fraud-warning-container {
  position: fixed;
  bottom: 0;
  width: 100%;
  background-color: #f79523;
  z-index: 9999;
  display: flex;
  justify-content: center;
  /* 讓容器水平置中 */
  padding: 10px;
}

#fraud-warning {
  width: 100%;
  max-width: 1200px;
  /* 最大寬度 */
  display: flex;
  align-items: center;
  /* 按鈕和文字垂直置中 */
  justify-content: space-between;
  /* 讓按鈕和文字自然排列 */
  text-align: left;
  /* 文字靠左 */
  flex-wrap: nowrap;
  /* 不允許換行 */
}

#fraud-warning-text {
  flex-grow: 1;
  font-size: 16px;
  color: black;
}

#fraud-warning button {
  background-color: black;
  color: white;
  border: none;
  padding: 5px 10px;
  cursor: pointer;
  margin-left: 10px;
  font-size: inherit;
  white-space: nowrap;
  /* 確保按鈕不換行 */
}

/* 當螢幕寬度小於 600px 時，讓按鈕移到文字下方 */
/* 當螢幕寬度小於 600px 時，讓按鈕移到文字下方並水平置中 */
@media (max-width: 600px) {
  #fraud-warning {
    flex-direction: column;
    /* 按鈕在手機版換到文字下方 */
    align-items: flex-start;
    /* 文字靠左對齊 */
  }

  #fraud-warning button {
    margin-left: 0;
    /* 去除左邊距 */
    margin-top: 10px;
    /* 增加上方距離 */
    padding: 3px 8px;
    /* 調整按鈕大小 */
    font-size: 14px;
    /* 調整按鈕字體大小 */
    align-self: center;
    /* 按鈕在下方時水平置中 */
  }
}

/* 調整所有帶有錨點的標題的滾動偏移 */
h3[id],
h2[id],
li[id] {
  scroll-margin-top: 95px;
  /* 根據你的 header 高度調整 */
}

.english:hover {
  color: #f89c1c;
}