/* 可獨立載入，或將本檔內容加到共用 tour.css 的最後。 */
.health-tours { padding: 24px 20px; background: #fff; }
.more-tour.health-tours[data-category="evergreen"] > .sub-title { margin-bottom: 24px !important; }
.health-tours .health-tours-carousel { position: relative; padding: 0 26px; max-width: 1160px; box-sizing: border-box; margin: 0 auto; }
.health-tours .health-tours-viewport { overflow-x: auto; scrollbar-width: none; margin: 0 auto; }
.health-tours .health-tours-viewport::-webkit-scrollbar { display: none; }
.health-tours .health-tours-arrow { position: absolute; top: 57px; width: 28px; height: 40px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.health-tours .health-tours-previous { left: 0; }
.health-tours .health-tours-next { right: 0; }
.health-tours .health-tours-arrow::before { content: ''; display: block; width: 14px; height: 26px; margin: auto; background: #b19a85; }
.health-tours .health-tours-previous::before { clip-path: polygon(80% 0,100% 0,25% 50%,100% 100%,80% 100%,0 50%); }
.health-tours .health-tours-next::before { clip-path: polygon(0 0,20% 0,100% 50%,20% 100%,0 100%,75% 50%); }
.health-tours .health-tours-dots { display: flex; justify-content: center; flex-wrap: wrap; gap: 2px; margin-top: 16px; }
.health-tours .health-tours-dot { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.health-tours .health-tours-dot::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #d6ccc2; }
.health-tours .health-tours-dot.is-active::before { background: #a88d72; }
.health-tours .health-tours-track { display: flex; width: max-content; }
.health-tours .health-tours-group { display: flex; gap: 20px; padding-right: 20px; }
.health-tours .health-tours-group[hidden], .health-tours button[hidden] { display: none; }
.more-tour.health-tours .health-tours-group { float: none; margin: 0; box-sizing: content-box; }
.more-tour.health-tours a.health-tours-card { display: block; flex: 0 0 var(--health-card-width, 262px); width: var(--health-card-width, 262px) !important; max-width: none; float: none; margin: 0; padding: 0; color: #333; text-decoration: none; box-sizing: border-box; }
.more-tour.health-tours a.health-tours-card img { display: block; width: 100% !important; height: auto !important; aspect-ratio: 262 / 151; max-width: none; box-sizing: border-box; margin: 0; padding: 0; border: 0; object-fit: cover; }
.more-tour.health-tours[data-category="study-tours"],
.more-tour.health-tours[data-category="independent-study"] { --health-card-width: 199px; }
.more-tour.health-tours[data-category="study-tours"] a.health-tours-card img,
.more-tour.health-tours[data-category="independent-study"] a.health-tours-card img { aspect-ratio: 199 / 133; }
.more-tour.health-tours[data-category="study-tours"] .health-tours-arrow,
.more-tour.health-tours[data-category="independent-study"] .health-tours-arrow { top: 47px; }
.more-tour.health-tours[data-category="study-tours"] .health-tours-carousel,
.more-tour.health-tours[data-category="independent-study"] .health-tours-carousel { padding: 0; max-width: 856px; }
.more-tour.health-tours[data-category="study-tours"] .health-tours-previous,
.more-tour.health-tours[data-category="independent-study"] .health-tours-previous { left: -28px; }
.more-tour.health-tours[data-category="study-tours"] .health-tours-next,
.more-tour.health-tours[data-category="independent-study"] .health-tours-next { right: -28px; }
/* 遊學類沿用頁面底色與原標題，配合既有版面。 */
.content.more-tour.health-tours[data-category="study-tours"],
.content.more-tour.health-tours[data-category="independent-study"] { background: transparent; padding: 0; }
.more-tour.health-tours[data-category="study-tours"] > .title-2,
.more-tour.health-tours[data-category="independent-study"] > .title-2 { margin-bottom: 18px; }
.more-tour.health-tours[data-category="study-tours"] .health-tours-dots,
.more-tour.health-tours[data-category="independent-study"] .health-tours-dots { margin-top: 30px; gap: 0; }
.more-tour.health-tours[data-category="study-tours"] .health-tours-dot::before,
.more-tour.health-tours[data-category="independent-study"] .health-tours-dot::before { width: 4px; height: 4px; }
.more-tour.health-tours[data-category="study-tours"] .health-tours-dot.is-active::before,
.more-tour.health-tours[data-category="independent-study"] .health-tours-dot.is-active::before { background: #666; }
@media (max-width: 576px) {
  .more-tour.health-tours .health-tours-dots {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start;
    width: max-content;
    max-width: 100%;
    overflow-x: auto;
    scrollbar-width: none;
    margin: 18px auto 0;
    gap: 0;
  }
  .more-tour.health-tours .health-tours-dots::-webkit-scrollbar { display: none; }
  .more-tour.health-tours .health-tours-dot {
    position: static !important;
    flex: 0 0 16px;
    width: 16px !important;
    min-width: 16px;
    height: 24px;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
  }
  .more-tour.health-tours .health-tours-dot::before { width: 4px; height: 4px; }
  .more-tour.health-tours .health-tours-arrow {
    top: calc(var(--health-card-width, 262px) * 151 / 262 / 2 - 20px) !important;
    bottom: auto !important;
    width: 24px !important;
    height: 40px !important;
    border-radius: 0;
    background: transparent !important;
    margin: 0 !important;
  }
  .more-tour.health-tours[data-category="study-tours"] .health-tours-arrow,
  .more-tour.health-tours[data-category="independent-study"] .health-tours-arrow { top: calc(var(--health-card-width, 199px) * 133 / 199 / 2 - 20px) !important; }
  .more-tour.health-tours a.health-tours-card h4 { font-size: 14px !important; }
}
.more-tour.health-tours a.health-tours-card h4 { margin: 8px 0 0 !important; padding: 0 !important; font-size: 18px !important; line-height: 1.4 !important; color: #111 !important; font-weight: normal !important; letter-spacing: normal; text-align: left; border: 0; }
.health-tours .health-tours-card:hover { color: #007a98; }
.health-tours a:focus-visible, .health-tours button:focus-visible { outline: 3px solid #007a98; outline-offset: -3px; }
@media (max-width: 576px) {
  .health-tours { padding: 20px 12px; }
}
