/* ATCC 主站共用樣式：去 WordPress / Elementor 重建後，頁首、選單、頁尾與全站共用元件的樣式都放這裡。 */

/* ---- 圖示 ----
   原站用 Font Awesome 圖示字型；現在改成每個圖示一段內嵌 SVG，當成遮罩套在 ::before 上，顏色跟著文字顏色走，
   不再載入圖示字型。外形取自 Font Awesome Free（https://fontawesome.com），圖示授權 CC BY 4.0。
   尺寸與位置比照字型字形：寬度 = 字寬／512 em、高度 1em、基線在 0.875em 處。 */
.ic{display:inline-block;line-height:0;font-style:normal}
.ic::before{content:"";display:inline-block;height:1em;vertical-align:-.125em;background-color:currentColor;-webkit-mask:var(--ic) no-repeat 0 0/100% 100%;mask:var(--ic) no-repeat 0 0/100% 100%}
.ic-arrow-down{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath transform='translate(0 -11)' d='M169 482Q179 491 192 491L192 491L192 491Q205 491 215 482L375 322L375 322Q384 312 384 299Q384 286 375 276Q365 267 352 267Q339 267 329 276L224 382L224 382L224 75L224 75Q224 61 215 52Q206 43 192 43Q178 43 169 52Q160 61 160 75L160 382L160 382L55 276L55 276Q45 267 32 267Q19 267 9 276Q0 286 0 299Q0 312 9 322L169 482L169 482Z'/%3E%3C/svg%3E")}
.ic-arrow-down::before{width:.75em}
.ic-arrow-left{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath transform='translate(0 -11)' d='M9 244Q0 254 0 267L0 267L0 267Q0 280 9 290L169 450L169 450Q179 459 192 459Q205 459 215 450Q224 440 224 427Q224 414 215 404L109 299L109 299L416 299L416 299Q430 299 439 290Q448 281 448 267Q448 253 439 244Q430 235 416 235L109 235L109 235L215 130L215 130Q224 120 224 107Q224 94 215 84Q205 75 192 75Q179 75 169 84L9 244L9 244Z'/%3E%3C/svg%3E")}
.ic-arrow-left::before{width:.875em}
.ic-arrow-right{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath transform='translate(0 -11)' d='M439 290Q448 280 448 267L448 267L448 267Q448 254 439 244L279 84L279 84Q269 75 256 75Q243 75 233 84Q224 94 224 107Q224 120 233 130L339 235L339 235L32 235L32 235Q18 235 9 244Q0 253 0 267Q0 281 9 290Q18 299 32 299L339 299L339 299L233 404L233 404Q224 414 224 427Q224 440 233 450Q243 459 256 459Q269 459 279 450L439 290L439 290Z'/%3E%3C/svg%3E")}
.ic-arrow-right::before{width:.875em}
.ic-caret-down{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath transform='translate(0 -11)' d='M137 386Q147 395 160 395L160 395L160 395Q173 395 183 386L311 258L311 258Q325 242 318 223Q309 204 288 203L32 203L32 203Q11 204 2 223Q-5 242 9 258L137 386L137 386Z'/%3E%3C/svg%3E")}
.ic-caret-down::before{width:.625em}
.ic-caret-left{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 512'%3E%3Cpath transform='translate(0 -11)' d='M9 290Q0 280 0 267L0 267L0 267Q0 254 9 244L137 116L137 116Q153 102 172 109Q191 118 192 139L192 395L192 395Q191 416 172 425Q153 432 137 418L9 290L9 290Z'/%3E%3C/svg%3E")}
.ic-caret-left::before{width:.5em}
.ic-caret-right{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 512'%3E%3Cpath transform='translate(0 -11)' d='M247 290Q256 280 256 267L256 267L256 267Q256 254 247 244L119 116L119 116Q103 102 84 109Q65 118 64 139L64 395L64 395Q65 416 84 425Q103 432 119 418L247 290L247 290Z'/%3E%3C/svg%3E")}
.ic-caret-right::before{width:.5em}
.ic-chevron-down{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath transform='translate(0 -11)' d='M233 418Q243 427 256 427L256 427L256 427Q269 427 279 418L471 226L471 226Q480 216 480 203Q480 190 471 180Q461 171 448 171Q435 171 425 180L256 350L256 350L87 180L87 180Q77 171 64 171Q51 171 41 180Q32 190 32 203Q32 216 41 226L233 418L233 418Z'/%3E%3C/svg%3E")}
.ic-chevron-down::before{width:1em}
.ic-chevron-right{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath transform='translate(0 -11)' d='M311 244Q320 254 320 267L320 267L320 267Q320 280 311 290L119 482L119 482Q109 491 96 491Q83 491 73 482Q64 472 64 459Q64 446 73 436L243 267L243 267L73 98L73 98Q64 88 64 75Q64 62 73 52Q83 43 96 43Q109 43 119 52L311 244L311 244Z'/%3E%3C/svg%3E")}
.ic-chevron-right::before{width:.625em}
.ic-chevron-up{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath transform='translate(0 -11)' d='M233 116Q243 107 256 107L256 107L256 107Q269 107 279 116L471 308L471 308Q480 318 480 331Q480 344 471 354Q461 363 448 363Q435 363 425 354L256 184L256 184L87 354L87 354Q77 363 64 363Q51 363 41 354Q32 344 32 331Q32 318 41 308L233 116L233 116Z'/%3E%3C/svg%3E")}
.ic-chevron-up::before{width:1em}
.ic-facebook{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath transform='translate(0 -11)' d='M512 268Q511 196 477 139L477 139L477 139Q443 81 385 47L385 47L385 47Q328 13 256 12Q184 13 127 47Q69 81 35 139Q1 196 0 268Q2 360 55 427Q109 494 194 517L194 346L194 346L141 346L141 346L141 268L141 268L194 268L194 268L194 234L194 234Q193 105 319 107Q332 107 349 109Q365 111 375 113L375 184L375 184Q365 183 345 183Q314 183 300 196Q287 210 287 240L287 268L287 268L371 268L371 268L356 346L356 346L287 346L287 346L287 522L287 522Q384 508 447 438Q510 368 512 268L512 268L512 268Z'/%3E%3C/svg%3E")}
.ic-facebook::before{width:1em}
.ic-instagram{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath transform='translate(0 -11)' d='M224 153Q175 154 143 187L143 187L143 187Q110 219 109 268Q110 317 143 349Q175 382 224 383Q273 382 305 349Q338 317 339 268Q338 219 305 187Q273 154 224 153L224 153ZM224 343Q192 342 171 321L171 321L171 321Q150 300 149 268Q150 236 171 215Q192 194 224 193Q256 194 277 215Q298 236 299 268Q298 300 277 321Q256 342 224 343L224 343ZM371 148Q368 173 344 175Q319 173 317 148Q317 137 325 129Q332 122 344 122Q355 122 363 129Q370 137 371 148L371 148ZM447 176Q447 121 410 82Q371 45 317 45Q297 44 260 44Q224 44 188 44Q151 44 132 45Q78 45 38 82Q1 121 2 175Q0 195 0 232Q0 268 0 304Q0 340 2 360Q1 415 38 454Q77 491 132 490Q151 491 188 492Q224 492 260 492Q297 491 317 490Q371 491 410 454Q447 415 447 360Q448 340 448 304Q448 268 448 232Q448 195 447 175L447 176ZM399 400Q386 430 356 443Q336 450 302 451Q268 452 240 452Q231 452 224 452Q217 452 208 452Q180 452 146 451Q113 450 92 443Q62 430 49 400Q42 379 41 346Q40 312 40 284Q40 275 40 268Q40 261 40 252Q40 224 41 190Q42 156 49 136Q62 106 92 93Q113 86 146 85Q180 83 208 84Q217 84 224 84Q231 84 240 84Q268 84 302 85Q336 86 356 93Q386 106 399 136Q406 156 407 190Q409 224 408 252Q408 261 408 268Q408 275 408 284Q409 312 407 346Q406 380 399 400L399 400Z'/%3E%3C/svg%3E")}
.ic-instagram::before{width:.875em}
.ic-long-arrow-alt-right{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath transform='translate(0 -11)' d='M335 425Q349 430 361 420L505 284L505 284Q512 277 512 267Q512 257 505 250L361 114L361 114Q349 104 335 109Q321 116 320 131L320 203L320 203L32 203L32 203Q18 203 9 212Q0 221 0 235L0 299L0 299Q0 313 9 322Q18 331 32 331L320 331L320 331L320 403L320 403Q321 418 335 425L335 425Z'/%3E%3C/svg%3E")}
.ic-long-arrow-alt-right::before{width:1em}
.ic-youtube{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath transform='translate(0 -11)' d='M550 136Q538 99 501 87Q477 82 427 79Q377 77 334 76Q291 76 288 76Q285 76 242 76Q199 77 149 79Q99 82 75 87Q38 99 26 136Q21 159 18 189Q16 220 15 244Q15 267 15 268Q15 270 15 293Q16 317 18 347Q21 378 26 401Q38 438 75 449Q99 454 149 457Q199 459 242 460Q285 460 288 460Q288 460 288 460Q291 460 334 460Q377 459 427 457Q477 454 501 449Q538 438 550 401Q555 378 558 347Q560 317 561 293Q561 270 561 268Q561 267 561 244Q560 220 558 189Q555 159 550 136L550 136ZM232 350L232 187L232 350L232 187L375 268L375 268L232 350L232 350Z'/%3E%3C/svg%3E")}
.ic-youtube::before{width:1.125em}

/* ---- 頁首與主選單 ----
   版面比照原站的 Elementor 頁首範本：固定在頂端的 66px 藍色橫列，分成 Logo（12%）、空白（25%）、選單（63%）三欄。
   桌機（寬 1025px 起）選單橫排在右側，滑過前三個項目時展開貼齊視窗左右兩側的白色面板；
   平板與手機（1024px 以下）右側改成漢堡按鈕，選單從左側滑入蓋住整個畫面，點有面板的項目會在原地展開同一份面板。
   面板位置：.mega-anchor 是定位用的空框，以整個頁首（固定定位、與視窗同寬）為基準放在選單欄左緣（37%），寬度 100% 等於視窗寬；
   面板再從那裡往左退回 37%。原站腳本把這段距離取整數像素，結果面板比視窗左緣多偏 0～1px，這裡用 round() 重現同樣的偏移
   （left: 0 是不支援 round() 的瀏覽器的退路，只差不到 1px）。日後不必與原站逐像素比對時，可直接改成 left: -37%。 */
html, body { overflow-x: auto; } /* 原站頁首範本樣式表帶的全站規則，照舊保留 */
.site-head, .site-head * { box-sizing: border-box; }
.site-head {
  position: fixed;
  z-index: 100;
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 66px;
  margin: 0;
  padding: 0;
  background-color: #135dab;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12);
}
.site-head > * {
  display: flex;
  flex: 0 1 auto;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  min-height: 56px;
}
.head-brand { width: 12%; }
.head-gap { width: 25%; }
.head-menu { width: 63%; }
.head-logo { display: block; line-height: 0; text-align: center; } /* line-height 0：連結高度剛好等於圖片，Logo 才會正好垂直置中 */
.head-logo img { display: inline-block; max-width: 100%; height: auto; vertical-align: middle; }
.site-head-space { min-height: 66px; }

/* 漢堡按鈕：桌機不顯示 */
.menu-toggle { display: none; }

/* 桌機選單列 */
.main-nav { position: static; height: 56px; max-width: 80%; }
.main-nav-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  height: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}
.main-nav-item { position: static; margin: 0; }
.main-nav-link {
  display: flex;
  align-items: center;
  height: 100%;
  padding: 0;
  font-family: "Noto Sans", noto sans;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
  text-decoration: none;
  color: #fffefe;
  border-style: none;
  border-radius: 0;
  transition: all 0.4s ease;
}
.main-nav-link:hover, .main-nav-link:focus, .main-nav-link:active, .main-nav-item:hover > .main-nav-link { color: #a3a3a3; background-color: transparent; text-decoration: none; }
.main-nav-item.is-current > .main-nav-link { color: #fffefe; border-style: solid; border-width: 0 0 2px 0; border-color: #fff; }

/* 桌機面板：預設透明並上移 10px，滑過項目時顯示 */
.mega-anchor {
  position: absolute;
  top: calc(100% - 5px); /* 選單列（56px）在 66px 頁首裡垂直置中，面板緊接在選單列下緣 */
  left: 37%;
  z-index: 999;
  width: 100%;
  height: 0;
}
.mega-panel {
  position: absolute;
  top: 0;
  left: 0;
  left: round(down, -37%, 1px);
  display: block;
  width: 100%;
  background-color: #fff;
  box-shadow: 0 10px 25px 0 rgba(0, 0, 0, 0.1);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  pointer-events: none;
  transition: transform 0.4s ease;
}
.main-nav-item:hover .mega-panel { opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto; }

/* 面板內容：左邊 25% 是標題（圖示在右），右邊 75% 是數欄連結 */
.mega-inner {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  width: 100%;
  max-width: 75%;
  height: 100%;
  margin: 0 auto;
  padding: 50px 0 60px;
}
.mega-lead-col { display: flex; flex-direction: column; width: 25%; padding: 0 70px 0 0; }
.mega-lead { display: flex; flex-direction: row-reverse; align-items: center; gap: 15px; text-align: start; }
.mega-icon { display: inline-block; flex: 0 0 auto; font-size: 30px; line-height: 1; color: #000; fill: #000; text-align: center; transition: all 0.3s; }
.mega-icon .ic { position: relative; display: block; width: 1em; height: 1em; }
.mega-icon .ic::before { position: absolute; left: 50%; transform: translateX(-50%); }
.mega-title {
  flex-grow: 1;
  width: 100%;
  margin: 0.5rem 0 1rem;
  font-family: "Roboto", noto sans;
  font-size: 40px;
  font-weight: 600;
  line-height: 1.2;
  color: #000;
}
.mega-cols { display: flex; flex-direction: row; justify-content: space-evenly; width: 75%; padding: 20px 0 0; }
.mega-col { display: flex; flex-direction: column; width: 20%; }
.mega-col:first-child { flex: 0 0 auto; }
.mega-panel--wide .mega-col { width: 16.5%; }
.mega-heading {
  margin: 0;
  padding: 0;
  font-family: "Roboto", noto sans;
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  text-align: start;
  color: #000;
}
.mega-heading a { color: inherit; font-size: inherit; line-height: inherit; text-decoration: none; }
.mega-heading:hover { color: #135dab; }
.mega-list { margin: 36px 0 0; padding: 0; list-style: none; }
.mega-list li { position: relative; display: flex; align-items: center; margin: 0; padding: 0; }
.mega-list li:not(:last-child) { padding-bottom: 10px; }
.mega-list li:not(:first-child) { margin-top: 10px; }
.mega-list a {
  display: flex;
  align-items: center;
  justify-content: start;
  width: 100%;
  font-family: "Roboto", noto sans;
  font-size: 16px;
  font-weight: 500;
  text-align: start;
  text-decoration: none;
  color: #808080;
}
.mega-list li:hover > a { color: #135dab; }

/* 平板與手機：漢堡按鈕與側滑選單 */
@media (max-width: 1024px) {
  .head-brand { margin-left: 60px; }
  .head-menu { align-items: flex-end; padding-right: 60px; }
  .menu-toggle {
    position: relative;
    z-index: 10;
    display: block;
    width: 45px;
    margin: 0;
    padding: 8px;
    border: 0;
    border-radius: 3px;
    background-color: transparent;
    color: #fff;
    cursor: pointer;
    transition: all 0.4s ease-in;
  }
  .menu-toggle:hover, .menu-toggle:focus { border: 0; background-color: transparent; color: #fff; }
  .menu-toggle span { display: block; width: 100%; height: 4px; margin-bottom: 4px; background-color: #fff; }
  .menu-toggle span:last-child { margin-bottom: 0; }
  .main-nav {
    position: fixed;
    top: 0;
    left: -100vw;
    z-index: 1000;
    width: 100%;
    max-width: 100%;
    height: 100%;
    margin: 56px 0 0;
    padding: 0 0 10px;
    overflow-x: hidden;
    overflow-y: auto;
    background-color: #f7f7f7;
    transition: left 0.6s cubic-bezier(0.6, 0.1, 0.68, 0.53);
  }
  .main-nav.is-open { left: 0; }
  .main-nav-list { display: block; height: 100%; padding: 36px 0 72px; overflow-y: auto; background-color: #1157a2; }
  .main-nav-item { position: relative; margin: 0 60px; }
  .main-nav-link { padding: 24px 0; font-size: 28px; font-weight: 700; color: #bfdeff; border-style: solid; border-width: 0 0 1px 0; }
  .main-nav-link:hover, .main-nav-link:focus, .main-nav-link:active, .main-nav-item:hover > .main-nav-link { color: #fff; }
  .main-nav-item:hover > .main-nav-link { border-radius: 0 0 5px 0; }
  .main-nav-item.is-current > .main-nav-link { color: #fff; border-width: 0 0 1px 0; }
  .mega-anchor { position: static; width: auto; height: auto; }
  .mega-panel {
    position: static;
    display: none;
    width: 100%;
    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto;
  }
  .mega-panel.is-open { display: block; }
  .mega-list { background-color: #075098; } /* 原站自訂樣式把側滑選單裡所有清單都加上這個底色 */
}

/* 手機：三欄等寬，Logo 靠左 */
@media (max-width: 767px) {
  .site-head { flex-wrap: wrap; }
  .head-brand { width: 33%; align-items: flex-start; margin-left: 0; padding-left: 36px; }
  .head-gap { width: 33%; }
  .head-menu { width: 33%; padding-right: 30px; }
  .main-nav-item { margin: 0 36px; }
  .mega-inner { flex-wrap: wrap; max-width: 100%; }
  .mega-lead-col, .mega-cols, .mega-col, .mega-panel--wide .mega-col { flex-wrap: wrap; width: 100%; } /* 所有欄位都疊成一行一欄（含較窄的 16.5% 欄） */
  .mega-lead { flex-direction: column; align-items: normal; }
}

/* ---- 略過連結（鍵盤操作時按 Tab 第一個停在這裡，按 Enter 直接跳到主要內容；平常看不到） ---- */
.skip-link {
  position: absolute;
  top: -10000em;
  left: 5px;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}
.skip-link:focus {
  top: 5px;
  z-index: 100000;
  display: block;
  width: auto;
  height: auto;
  margin: 0;
  padding: 12px 24px;
  clip: auto;
  font-size: 1rem;
  line-height: normal;
  text-decoration: none;
  color: #333;
  background-color: #eee;
}

/* ---- 頁尾 ----
   版面比照原站的 Elementor 頁尾範本：深灰底，上半是簡介（25%）與兩欄連結（各 20%，中間空 10%），
   一條分隔線，下半是版權、聯絡方式、atona 商標與三個社群圖示排成一列（放不下就換行置中）。
   平板（768～1024px）：簡介與連結欄改為上下排列（連結兩欄各 45%），底列拆成「商標＋圖示」與「文字」兩行。
   手機（767px 以下）：全部單欄，連結改成橫向排列可換行，底列拆成商標、圖示、三行文字。 */
.site-foot { padding-top: 70px; color: #fff; background-color: #292929; }
.site-foot, .site-foot * { box-sizing: border-box; }
.foot-main { display: flex; flex-direction: row; width: 75%; max-width: 1920px; margin: 0 auto; }
.foot-intro { display: flex; flex-direction: column; width: 25%; }
.foot-title {
  margin: 0;
  padding: 0;
  font-family: "Roboto", noto sans;
  font-size: 24px;
  font-weight: 600;
  line-height: 1;
  color: #fff;
}
.foot-title a { color: inherit; font-size: inherit; line-height: inherit; text-decoration: none; }
.foot-about {
  margin-top: 40px;
  font-family: "Roboto", noto sans;
  font-size: 16px;
  font-weight: 500;
  line-height: 2rem;
  color: #fff;
}
.foot-about p { margin: 0; }
.foot-links { display: flex; flex-direction: row; justify-content: flex-start; gap: 20px; width: 65%; margin-left: 10%; }
.foot-col { display: flex; flex-direction: column; width: 20%; }
.foot-list-box { margin-top: 40px; }
.foot-list { margin: 0; padding: 0; list-style: none; }
.foot-list li { position: relative; display: flex; align-items: center; margin: 0; padding: 0; }
.foot-list li:not(:last-child) { padding-bottom: 15px; }
.foot-list li:not(:first-child) { margin-top: 15px; }
.foot-list a {
  display: flex;
  align-items: center;
  width: 100%;
  font-family: "Noto Sans", noto sans;
  font-size: 20px;
  font-weight: 400;
  text-decoration: none;
  color: #939393;
  transition: color 0.3s;
}
.foot-rule { width: 75%; height: 0; margin: 40px auto; border: 0; border-top: 1px solid #898989; }
.foot-bar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 75%;
  max-width: 1920px;
  margin: 0 auto;
  padding: 0 40px 60px 0; /* 原站清單元件右側留 40px，所以整列的中心比頁面中心偏左 20px */
  font-family: "Noto Sans", noto sans;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  color: #fff;
}
.foot-bar ul { display: contents; margin: 0; padding: 0; list-style: none; } /* 桌機：兩份清單的項目排成同一列 */
.foot-bar li { display: flex; align-items: center; justify-content: center; margin: 20px 20px 0; }
.foot-bar .foot-contact li:last-child { order: -1; } /* 桌機：版權文字排在最前面 */
.foot-bar a { display: flex; align-items: center; padding-right: 5px; color: #fff; text-decoration: none; }
.foot-bar svg { width: 100px; height: 24px; margin: 0 3px; }
.foot-bar .atona-logo--mobile { display: none; }
.foot-bar .ic { width: 1.25em; font-size: 24px; text-align: center; color: #fff; transition: color 0.3s; }

@media (max-width: 1024px) {
  .foot-main { flex-wrap: wrap; width: 80%; }
  .foot-intro, .foot-links { width: 100%; margin-left: 0; }
  .foot-col { width: 45%; padding-top: 40px; }
  .foot-rule { width: 80%; }
  .foot-bar { flex-direction: column; flex-wrap: nowrap; align-items: center; width: 90%; padding: 20px 0 80px; }
  .foot-bar ul { display: flex; flex-wrap: wrap; justify-content: center; }
  .foot-bar .foot-social { order: -1; } /* 選取器都帶 .foot-bar，優先權才蓋得過上面桌機的 .foot-bar ul／li 規則 */
  .foot-bar .foot-contact { padding: 20px 0; }
  .foot-bar .foot-contact li:last-child { order: 0; }
  .foot-bar li { margin: 0 20px; }
  .foot-bar .atona-logo--desktop { display: none; }
  .foot-bar .atona-logo--mobile { display: block; }
}

@media (max-width: 767px) {
  .site-foot { padding-top: 40px; }
  .foot-main { flex-direction: column; width: 90%; }
  .foot-links { flex-direction: column; }
  .foot-col { width: 100%; }
  .foot-list-box { margin-top: 0; padding-top: 20px; overflow: hidden; } /* 原站清單元件外框裁掉超出欄寬的部分（連字邊的反鋸齒都裁） */
  .foot-list { display: flex; flex-wrap: wrap; margin: 0 -15px; }
  .foot-list li { margin: 0 15px; }
  .foot-list li:not(:last-child) { padding-bottom: 0; }
  .foot-list li:not(:first-child) { margin-top: 0; }
  .foot-list--coop { margin: 0 -12px; }
  .foot-list--coop li { margin: 0 12px; }
  .foot-rule { width: 100%; }
  .foot-bar { width: 100%; padding: 0 0 40px; }
  .foot-bar .foot-social { padding: 20px 0; }
  .foot-bar .foot-atona { flex: 0 0 100%; margin: 0 0 40px; }
  .foot-bar .foot-contact { flex-direction: column; align-items: center; padding: 20px 0; }
  .foot-bar .foot-contact li { margin: 0; }
  .foot-bar .foot-contact li:not(:last-child) { padding-bottom: 20px; }
  .foot-bar .foot-contact li:not(:first-child) { margin-top: 20px; }
}

/* ---- LINE 浮動按鈕（原本寫在 post-8.css） ---- */
/* LINE 浮動按鈕：原站沒有寫樣式，圖示會以 320×320 出現在頁尾下方 */
#line-float-btn {
    position: fixed;
    right: calc(24px + env(safe-area-inset-right, 0px));
    bottom: calc(24px + env(safe-area-inset-bottom, 0px));
    z-index: 99; /* 在頁首（100）與手機選單之下 */
    display: block;
    width: 60px;
    height: 60px;
    line-height: 0;
    filter: drop-shadow(0 3px 8px rgba(0, 0, 0, 0.3));
}
#line-float-btn img {
    display: block;
    width: 100%;
    height: 100%;
}
@media (max-width: 767px) {
    #line-float-btn {
        right: calc(16px + env(safe-area-inset-right, 0px));
        bottom: calc(16px + env(safe-area-inset-bottom, 0px));
        width: 52px;
        height: 52px;
    }
}

/* ---- 內容區共用 ----
   .page-title：原站把文章／部分頁面的標題 h1 藏起來（kit 的 --page-title-display:none），照舊藏著。
   其餘是 Elementor 對內容區根元素底下所有連結、圖片、iframe 的預設（原 .elementor a／img／iframe…），照搬到 .page-body，
   權重跟原本一樣低（類別＋標籤），各頁樣式表裡的規則一樣蓋得過。 */
.page-title { display: none; }
.page-body a { box-shadow: none; text-decoration: inherit; }
.page-body img { border: none; border-radius: 0; box-shadow: none; height: auto; max-width: 100%; }
.page-body embed, .page-body iframe, .page-body object, .page-body video { border: none; line-height: 1; margin: 0; max-width: 100%; width: 100%; }
.page-body hr { background-color: transparent; margin: 0; }
.text-title { line-height: 1; margin: 0; padding: 0; } /* 文字內容裡夾帶的標題（兩個 21st 協辦夥伴頁），原本套 Elementor 的標題預設 */

/* ---- 全站自訂規則（原本寫在 Elementor kit 的 post-8.css 自訂區，類別名稱改成新的） ---- */
body { overflow-x: inherit !important; }
ol, ul { padding-left: 1.5rem; }
p { margin-bottom: 0; }
.activeSidebar { color: #fff !important; background: #135DAB !important; border: 1px solid #135DAB !important; } /* 側欄目前頁按鈕（main.js 加上） */
.kv { max-width: 100%; overflow-x: hidden; }
.text_stroke { -webkit-text-stroke: 1px #fff; font-weight: bold; }
.schedule_card:hover .schedule_title .title { color: #135DAB !important; transition: all 0.2s linear !important; }
.collaboration_post_list .plist-item:hover { background: #DCDCDC !important; border: 0.5px solid #BFBFBF; box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, 0.06); transition: all 0.2s linear; }
.sidebar_btn { max-width: 240px !important; }
@media (max-width: 1024px) { .sidebar_btn { width: auto !important; } }
.flex_box_21 .tabs-nav { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; }
.flex_box_21 .tab-title { width: 120px !important; height: 120px; border: 1px solid #606060 !important; border-radius: 12px; text-align: center; margin: 5px; }
.flex_box_21 .tab-title:hover { background: #135DAB; color: #fff !important; transition: all 0.3s ease; }
.news_post_list .plist-item .d_line { background: black; }
.news_post_list .plist-item:hover { background: #135DAB !important; transition: all 0.3s ease; }
.news_post_list .plist-item:hover span, .news_post_list .plist-item:hover a { color: #fff !important; transition: all 0.3s ease; }
.news_post_list .plist-item:hover .d_line { background: #fff !important; transition: all 0.3s ease; }
.w-bd960e7 .acc-title { border-bottom: 1px solid #000 !important; } /* 首頁常見問題每題下方的黑線 */

/* 合作夥伴頁說明會簡報：頁面內預覽下方的開啟連結（Android 等無法在頁面內顯示 PDF 的裝置也能開啟）。
   原站的底線被 Elementor 的「連結不畫底線」蓋掉，實際上沒有底線，這裡照實際外觀寫。 */
.pdf-open-link { margin-top: 12px; font-size: 16px; line-height: 1.6; }
.pdf-open-link a { color: #135DAB; }

/* ---- 內容裡的行內樣式 ----
   原站文章內容的 style 屬性在第 0 階段抽成 .si-N 類別（嚴格 CSP 不允許行內樣式），每條加 !important 重現行內樣式的優先權。
   這些類別只出現在各頁的文字內容裡，規則很少，集中放這裡。 */
.si-1 { font-weight: 400 !important; }
.si-2 { color: black !important; }
.si-3 { color: #656565 !important; }
.si-4 { display: flex !important; height: 100% !important; }
.si-5 { max-width: 100% !important; display: inline-block !important; }
.si-6 { display: flex !important; align-items: center !important; }
.si-7 { color: #135dab !important; }
.si-8 { color: #000000 !important; }
.si-9 { font-weight: bold !important; text-align: var(--text-align) !important; }
.si-10 { text-align: var(--text-align) !important; }
.si-11 { width: 100% !important; height: 600px !important; max-width: 100% !important; }
.si-12 { color: #606060 !important; font-size: 16px !important; font-weight: 400 !important; background-color: #f0f0f0 !important; }
.si-13 { color: #135DAB !important; }
.si-14 { font-size: 24px !important; }
.si-15 { font-size: 12px !important; display: block !important; }
.si-16 { display: none !important; }
.si-17 { display: inline !important; align-items: center !important; }
.si-18 { display: inline !important; color: #656565 !important; }
.si-19 { color: #000 !important; }
.si-20 { white-space: pre-wrap !important; }
.si-21 { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji' !important; }
.si-22 { line-height: 1.38 !important; margin-top: 0pt !important; margin-bottom: 0pt !important; }
.si-23 { font-size: 14.6667px !important; font-weight: 400 !important; white-space-collapse: preserve !important; }
.si-24 { font-size: 96px !important; }
.si-25 { font-size: 60px !important; }
.si-26 { color: black !important; }
.si-29 { vertical-align: inherit !important; }
.si-30 { width: 100% !important; height: 600px !important; max-width: 100% !important; display: inline-block !important; }
.si-31 { width: 600% !important; height: 800px !important; max-width: 100% !important; display: inline-block !important; }
.si-32 { width: 600% !important; height: 600px !important; max-width: 100% !important; display: inline-block !important; }
