/* 正式站的連結改成收單按鈕：先歸零按鈕預設樣式，讓外觀跟原本的連結一樣（後面的 class 規則會蓋過） */ /* 輪播：正式站用 Swiper 套件，這裡改用捲動吸附＋本頁 JS（沒有 JS 也能左右滑） */ .lp .op-page .op-swiper { position: relative; overflow: hidden; } .lp .op-page .op-swiper-wrapper { position: relative; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; } .lp .op-page .op-swiper-wrapper::-webkit-scrollbar { display: none; } .lp .op-page .op-swiper-slide { flex: 0 0 100%; min-width: 0; scroll-snap-align: start; } .lp .op-page .op-swiper-button-prev, .lp .op-page .op-swiper-button-next { position: absolute; top: 50%; margin-top: -22px; width: 27px; height: 44px; z-index: 10; display: flex; align-items: center; justify-content: center; } .lp .op-page .op-swiper-button-prev { left: 10px; } .lp .op-page .op-swiper-button-next { right: 10px; } .lp .op-page .op-swiper-button-prev:not([style])::after, .lp .op-page .op-swiper-button-next:not([style])::after { content: ""; width: 22px; height: 22px; border-top: 4px solid currentColor; border-right: 4px solid currentColor; } .lp .op-page .op-swiper-button-prev:not([style])::after { transform: translateX(4px) rotate(-135deg); } .lp .op-page .op-swiper-button-next:not([style])::after { transform: translateX(-4px) rotate(45deg); } .lp .op-page .op-swiper-button-prev:focus-visible, .lp .op-page .op-swiper-button-next:focus-visible, .lp .op-page .op-swiper-dot:focus-visible { outline: 3px solid #1B2A4A; outline-offset: 2px; } .lp .op-page .op-swiper-pagination { display: flex; justify-content: center; gap: 8px; padding: 12px 0; } .lp .op-page .op-swiper-dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%; background: #000; opacity: .2; cursor: pointer; } .lp .op-page .op-swiper-dot[aria-current="true"] { background: #007aff; opacity: 1; } .lp .op-page .op-was-link { -webkit-appearance: none; appearance: none; background: none; border: 0; padding: 0; margin: 0; font: inherit; color: inherit; text-align: inherit; line-height: inherit; cursor: pointer; } .lp .op-page { --op-bs-orange: #ffa400; --op-bs-red: #ff5959; --op-bs-green: #00c4b3; --op-bs-dark-gray: #4d4d4d; --op-bs-orange-dark: #FFA300; --op-bs-orange-deep: #FFA300; --op-bs-orange-fade: #fcbd4d; --op-bs-orange-light: #fef2e1; --op-bs-red-dark: #ab191a; --op-bs-red-deep: #dd3e3f; --op-bs-red-fade: #fb8384; --op-bs-red-light: #f6e8e9; --op-bs-green-dark: #074746; --op-bs-green-deep: #098a7f; --op-bs-green-fade: #3addcf; --op-bs-green-light: #e0ebeb; --op-bs-blue-dark: #0b2e44; --op-bs-blue-deep: #2e6587; --op-bs-blue-fade: #79b8e8; --op-bs-blue-light: #c9e8ff; --op-bs-gray-100: #f8f9fa; --op-bs-gray-200: #e9ecef; --op-bs-gray-300: #dee2e6; --op-bs-gray-400: #ced4da; --op-bs-gray-500: #adb5bd; --op-bs-gray-600: #6c757d; --op-bs-gray-700: #495057; --op-bs-gray-800: #343a40; --op-bs-gray-900: #212529; --op-bs-primary: #4990c6; --op-bs-secondary: #6c757d; --op-bs-success: #00c4b3; --op-bs-info: #17a2b8; --op-bs-warning: #ffc107; --op-bs-danger: #ff5959; --op-bs-light: #f8f9fa; --op-bs-dark: #212529; --op-bs-primary-rgb: 73, 144, 198; --op-bs-secondary-rgb: 108, 117, 125; --op-bs-success-rgb: 0, 196, 179; --op-bs-info-rgb: 23, 162, 184; --op-bs-warning-rgb: 255, 193, 7; --op-bs-danger-rgb: 255, 89, 89; --op-bs-light-rgb: 248, 249, 250; --op-bs-dark-rgb: 33, 37, 41; --op-bs-primary-text-emphasis: #1d3a4f; --op-bs-secondary-text-emphasis: #2b2f32; --op-bs-success-text-emphasis: #004e48; --op-bs-info-text-emphasis: #09414a; --op-bs-warning-text-emphasis: #664d03; --op-bs-danger-text-emphasis: #662424; --op-bs-light-text-emphasis: #495057; --op-bs-dark-text-emphasis: #495057; --op-bs-primary-bg-subtle: #dbe9f4; --op-bs-secondary-bg-subtle: #e2e3e5; --op-bs-success-bg-subtle: #ccf3f0; --op-bs-info-bg-subtle: #d1ecf1; --op-bs-warning-bg-subtle: #fff3cd; --op-bs-danger-bg-subtle: #ffdede; --op-bs-light-bg-subtle: #fcfcfd; --op-bs-dark-bg-subtle: #ced4da; --op-bs-primary-border-subtle: #b6d3e8; --op-bs-secondary-border-subtle: #c4c8cb; --op-bs-success-border-subtle: #99e7e1; --op-bs-info-border-subtle: #a2dae3; --op-bs-warning-border-subtle: #ffe69c; --op-bs-danger-border-subtle: #ffbdbd; --op-bs-light-border-subtle: #e9ecef; --op-bs-dark-border-subtle: #adb5bd; --op-bs-white-rgb: 255, 255, 255; --op-bs-black-rgb: 0, 0, 0; --op-bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --op-bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --op-bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0)); --op-bs-root-font-size: 18px; --op-bs-body-font-family: "Noto Sans TC", sans-serif; --op-bs-body-font-size: 1rem; --op-bs-body-font-weight: 400; --op-bs-body-line-height: 1.5; --op-bs-body-color: #4d4d4d; --op-bs-body-color-rgb: 77, 77, 77; --op-bs-body-bg: #ffffff; --op-bs-body-bg-rgb: 255, 255, 255; --op-bs-emphasis-color: #000000; --op-bs-emphasis-color-rgb: 0, 0, 0; --op-bs-secondary-color: rgba(77, 77, 77, 0.75); --op-bs-secondary-color-rgb: 77, 77, 77; --op-bs-secondary-bg: #e9ecef; --op-bs-secondary-bg-rgb: 233, 236, 239; --op-bs-tertiary-color: rgba(77, 77, 77, 0.5); --op-bs-tertiary-color-rgb: 77, 77, 77; --op-bs-tertiary-bg: #f8f9fa; --op-bs-tertiary-bg-rgb: 248, 249, 250; --op-bs-heading-color: inherit; --op-bs-link-color: #4d4d4d; --op-bs-link-color-rgb: 77, 77, 77; --op-bs-link-decoration: underline; --op-bs-link-hover-color: #ffa400; --op-bs-link-hover-color-rgb: 255, 164, 0; --op-bs-code-color: #d63384; --op-bs-highlight-color: #4d4d4d; --op-bs-highlight-bg: #fff3cd; --op-bs-border-width: 1px; --op-bs-border-style: solid; --op-bs-border-color: #dee2e6; --op-bs-border-color-translucent: rgba(0, 0, 0, 0.175); --op-bs-border-radius: 0.375rem; --op-bs-border-radius-sm: 0.25rem; --op-bs-border-radius-lg: 0.5rem; --op-bs-border-radius-xl: 1rem; --op-bs-border-radius-xxl: 2rem; --op-bs-border-radius-2xl: var(--op-bs-border-radius-xxl); --op-bs-border-radius-pill: 50rem; --op-bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); --op-bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); --op-bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175); --op-bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075); --op-bs-focus-ring-width: 0.25rem; --op-bs-focus-ring-opacity: 0.25; --op-bs-focus-ring-color: rgba(73, 144, 198, 0.25); --op-bs-form-valid-color: #00c4b3; --op-bs-form-valid-border-color: #00c4b3; --op-bs-form-invalid-color: #ff5959; --op-bs-form-invalid-border-color: #ff5959; } .lp .op-page *, .lp .op-page *::before, .lp .op-page *::after { box-sizing: border-box; } .lp .op-page { font-size: var(--op-bs-root-font-size); } @media (prefers-reduced-motion: no-preference) { .lp .op-page { scroll-behavior: smooth; } } .lp .op-page { margin: 0; font-family: var(--op-bs-body-font-family); font-size: var(--op-bs-body-font-size); font-weight: var(--op-bs-body-font-weight); line-height: var(--op-bs-body-line-height); color: var(--op-bs-body-color); text-align: var(--op-bs-body-text-align); background-color: var(--op-bs-body-bg); -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .lp .op-page .op-h5, .lp .op-page h4, .lp .op-page .op-h4, .lp .op-page h3, .lp .op-page .op-h3, .lp .op-page h2, .lp .op-page .op-h2, .lp .op-page h1, .lp .op-page .op-h1 { margin-top: 0; margin-bottom: 0px; font-weight: 500; line-height: 1.5; color: var(--op-bs-heading-color); } .lp .op-page h1, .lp .op-page .op-h1 { font-size: calc(1.425rem + 2.1vw); } @media (min-width: 1200px) { .lp .op-page h1, .lp .op-page .op-h1 { font-size: 3rem; } } .lp .op-page h2, .lp .op-page .op-h2 { font-size: calc(1.35rem + 1.2vw); } @media (min-width: 1200px) { .lp .op-page h2, .lp .op-page .op-h2 { font-size: 2.25rem; } } .lp .op-page h3, .lp .op-page .op-h3 { font-size: calc(1.275rem + 0.3vw); } @media (min-width: 1200px) { .lp .op-page h3, .lp .op-page .op-h3 { font-size: 1.5rem; } } .lp .op-page h4, .lp .op-page .op-h4 { font-size: calc(1.275rem + 0.3vw); } @media (min-width: 1200px) { .lp .op-page h4, .lp .op-page .op-h4 { font-size: 1.5rem; } } .lp .op-page .op-h5 { font-size: 1.25rem; } .lp .op-page p { margin-top: 0; margin-bottom: 0px; } .lp .op-page ul { padding-left: 2rem; } .lp .op-page ul { margin-top: 0; margin-bottom: 1rem; } .lp .op-page ul ul { margin-bottom: 0; } .lp .op-page .op-small { font-size: 0.875em; } .lp .op-page a { color: rgba(var(--op-bs-link-color-rgb), var(--op-bs-link-opacity, 1)); text-decoration: underline; } @media (hover: hover) and (pointer: fine) { .lp .op-page a:hover { --op-bs-link-color-rgb: var(--op-bs-link-hover-color-rgb); } } .lp .op-page a:not([href]):not([class]) { color: inherit; text-decoration: none; } @media (hover: hover) and (pointer: fine) { .lp .op-page a:not([href]):not([class]):hover { color: inherit; text-decoration: none; } } .lp .op-page img { vertical-align: middle; } /* 圖片寫了 width/height（避免版面跳動），顯示尺寸仍由 CSS 的寬度決定、高度照比例 */ .lp .op-page img[height] { height: auto; } .lp .op-page button { border-radius: 0; } .lp .op-page button:focus:not(:focus-visible) { outline: 0; } .lp .op-page button { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; } .lp .op-page button { text-transform: none; } .lp .op-page [role=button] { cursor: pointer; } .lp .op-page:not(#op-important) [list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator { display: none; } .lp .op-page button, .lp .op-page [type=button], .lp .op-page [type=reset], .lp .op-page [type=submit] { -webkit-appearance: button; } .lp .op-page button:not(:disabled), .lp .op-page [type=button]:not(:disabled), .lp .op-page [type=reset]:not(:disabled), .lp .op-page [type=submit]:not(:disabled) { cursor: pointer; } .lp .op-page ::-moz-focus-inner { padding: 0; border-style: none; } .lp .op-page ::-webkit-datetime-edit-fields-wrapper, .lp .op-page ::-webkit-datetime-edit-text, .lp .op-page ::-webkit-datetime-edit-minute, .lp .op-page ::-webkit-datetime-edit-hour-field, .lp .op-page ::-webkit-datetime-edit-day-field, .lp .op-page ::-webkit-datetime-edit-month-field, .lp .op-page ::-webkit-datetime-edit-year-field { padding: 0; } .lp .op-page ::-webkit-inner-spin-button { height: auto; } .lp .op-page [type=search] { -webkit-appearance: textfield; outline-offset: -2px; } .lp .op-page ::-webkit-search-decoration { -webkit-appearance: none; } .lp .op-page ::-webkit-color-swatch-wrapper { padding: 0; } .lp .op-page ::file-selector-button { font: inherit; -webkit-appearance: button; } .lp .op-page:not(#op-important) [hidden] { display: none; } .lp .op-page .op-display-4 { font-size: calc(1.475rem + 2.7vw); font-weight: 300; line-height: 1.5; } @media (min-width: 1200px) { .lp .op-page .op-display-4 { font-size: 3.5rem; } } .lp .op-page .op-container { --op-bs-gutter-x: 1.5rem; --op-bs-gutter-y: 0; width: 100%; padding-right: calc(var(--op-bs-gutter-x) * 0.5); padding-left: calc(var(--op-bs-gutter-x) * 0.5); margin-right: auto; margin-left: auto; } @media (min-width: 576px) { .lp .op-page .op-container { max-width: 540px; } } @media (min-width: 768px) { .lp .op-page .op-container { max-width: 720px; } } @media (min-width: 992px) { .lp .op-page .op-container { max-width: 960px; } } @media (min-width: 1200px) { .lp .op-page .op-container { max-width: 1140px; } } @media (min-width: 1400px) { .lp .op-page .op-container { max-width: 1320px; } } .lp .op-page { --op-bs-breakpoint-xs: 0; --op-bs-breakpoint-sm: 576px; --op-bs-breakpoint-md: 768px; --op-bs-breakpoint-lg: 992px; --op-bs-breakpoint-xl: 1200px; --op-bs-breakpoint-xxl: 1400px; } .lp .op-page .op-row { --op-bs-gutter-x: 1.5rem; --op-bs-gutter-y: 0; display: flex; flex-wrap: wrap; margin-top: calc(-1 * var(--op-bs-gutter-y)); margin-right: calc(-0.5 * var(--op-bs-gutter-x)); margin-left: calc(-0.5 * var(--op-bs-gutter-x)); } .lp .op-page .op-row > * { flex-shrink: 0; width: 100%; max-width: 100%; padding-right: calc(var(--op-bs-gutter-x) * 0.5); padding-left: calc(var(--op-bs-gutter-x) * 0.5); margin-top: var(--op-bs-gutter-y); } .lp .op-page .op-col-6 { flex: 0 0 auto; width: 50%; } .lp .op-page .op-col-12 { flex: 0 0 auto; width: 100%; } @media (min-width: 768px) { .lp .op-page .op-col-md-3 { flex: 0 0 auto; width: 25%; } .lp .op-page .op-col-md-5 { flex: 0 0 auto; width: 41.66666667%; } .lp .op-page .op-col-md-6 { flex: 0 0 auto; width: 50%; } .lp .op-page .op-col-md-7 { flex: 0 0 auto; width: 58.33333333%; } .lp .op-page .op-col-md-8 { flex: 0 0 auto; width: 66.66666667%; } } .lp .op-page .op-btn { --op-bs-btn-padding-x: 15px; --op-bs-btn-padding-y: 6px; --op-bs-btn-font-family:; --op-bs-btn-font-size: 1.125rem; --op-bs-btn-font-weight: 400; --op-bs-btn-line-height: 1.5; --op-bs-btn-color: var(--op-bs-body-color); --op-bs-btn-bg: transparent; --op-bs-btn-border-width: var(--op-bs-border-width); --op-bs-btn-border-color: transparent; --op-bs-btn-border-radius: 11px; --op-bs-btn-hover-border-color: transparent; --op-bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075); --op-bs-btn-disabled-opacity: 0.65; --op-bs-btn-focus-box-shadow: 0 0 0 0px rgba(var(--op-bs-btn-focus-shadow-rgb), .5); display: inline-block; padding: var(--op-bs-btn-padding-y) var(--op-bs-btn-padding-x); font-family: var(--op-bs-btn-font-family); font-size: var(--op-bs-btn-font-size); font-weight: var(--op-bs-btn-font-weight); line-height: var(--op-bs-btn-line-height); color: var(--op-bs-btn-color); text-align: center; text-decoration: none; vertical-align: middle; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none; border: var(--op-bs-btn-border-width) solid var(--op-bs-btn-border-color); border-radius: 11px; background-color: var(--op-bs-btn-bg); box-shadow: var(--op-bs-btn-box-shadow); transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } @media (prefers-reduced-motion: reduce) { .lp .op-page .op-btn { transition: none; } } @media (hover: hover) and (pointer: fine) { .lp .op-page .op-btn:hover { color: var(--op-bs-btn-hover-color); background-color: var(--op-bs-btn-hover-bg); border-color: var(--op-bs-btn-hover-border-color); } } .lp .op-page .op-btn:focus-visible { color: var(--op-bs-btn-hover-color); background-color: var(--op-bs-btn-hover-bg); border-color: var(--op-bs-btn-hover-border-color); outline: 0; box-shadow: var(--op-bs-btn-box-shadow), var(--op-bs-btn-focus-box-shadow); } .lp .op-page :not(.op-btn-check) + .op-btn:active, .lp .op-page .op-btn:first-child:active { color: var(--op-bs-btn-active-color); background-color: var(--op-bs-btn-active-bg); border-color: var(--op-bs-btn-active-border-color); box-shadow: var(--op-bs-btn-active-shadow); } .lp .op-page :not(.op-btn-check) + .op-btn:active:focus-visible, .lp .op-page .op-btn:first-child:active:focus-visible { box-shadow: var(--op-bs-btn-active-shadow), var(--op-bs-btn-focus-box-shadow); } .lp .op-page .op-btn:disabled { color: var(--op-bs-btn-disabled-color); pointer-events: none; background-color: var(--op-bs-btn-disabled-bg); border-color: var(--op-bs-btn-disabled-border-color); opacity: var(--op-bs-btn-disabled-opacity); box-shadow: none; } .lp .op-page:not(#op-important) .op-overflow-hidden { overflow: hidden; } .lp .op-page:not(#op-important) .op-d-inline-block { display: inline-block; } .lp .op-page:not(#op-important) .op-d-block { display: block; } .lp .op-page:not(#op-important) .op-d-flex { display: flex; } .lp .op-page:not(#op-important) .op-d-none { display: none; } .lp .op-page:not(#op-important) .op-shadow { box-shadow: var(--op-bs-box-shadow); } .lp .op-page:not(#op-important) .op-position-relative { position: relative; } .lp .op-page:not(#op-important) .op-position-absolute { position: absolute; } .lp .op-page:not(#op-important) .op-border-bottom { border-bottom: var(--op-bs-border-width) var(--op-bs-border-style) var(--op-bs-border-color); } .lp .op-page .op-border-white { --op-bs-border-opacity: 1; } .lp .op-page:not(#op-important) .op-border-white { border-color: rgba(var(--op-bs-white-rgb), var(--op-bs-border-opacity)); } .lp .op-page:not(#op-important) .op-w-100 { width: 100%; } .lp .op-page:not(#op-important) .op-flex-column { flex-direction: column; } .lp .op-page:not(#op-important) .op-justify-content-center { justify-content: center; } .lp .op-page:not(#op-important) .op-align-items-center { align-items: center; } .lp .op-page:not(#op-important) .op-my-3 { margin-top: 20px; margin-bottom: 20px; } .lp .op-page:not(#op-important) .op-my-4 { margin-top: 30px; margin-bottom: 30px; } .lp .op-page:not(#op-important) .op-mt-2 { margin-top: 10px; } .lp .op-page:not(#op-important) .op-mt-3 { margin-top: 20px; } .lp .op-page:not(#op-important) .op-mt-5 { margin-top: 40px; } .lp .op-page:not(#op-important) .op-mt-auto { margin-top: auto; } .lp .op-page:not(#op-important) .op-me-auto { margin-right: auto; } .lp .op-page:not(#op-important) .op-mb-0 { margin-bottom: 0; } .lp .op-page:not(#op-important) .op-mb-1 { margin-bottom: 5px; } .lp .op-page:not(#op-important) .op-mb-2 { margin-bottom: 10px; } .lp .op-page:not(#op-important) .op-mb-3 { margin-bottom: 20px; } .lp .op-page:not(#op-important) .op-mb-4 { margin-bottom: 30px; } .lp .op-page:not(#op-important) .op-mb-5 { margin-bottom: 40px; } .lp .op-page:not(#op-important) .op-p-2 { padding: 10px; } .lp .op-page:not(#op-important) .op-p-3 { padding: 20px; } .lp .op-page:not(#op-important) .op-px-5 { padding-right: 40px; padding-left: 40px; } .lp .op-page:not(#op-important) .op-py-1 { padding-top: 5px; padding-bottom: 5px; } .lp .op-page:not(#op-important) .op-py-2 { padding-top: 10px; padding-bottom: 10px; } .lp .op-page:not(#op-important) .op-py-3 { padding-top: 20px; padding-bottom: 20px; } .lp .op-page:not(#op-important) .op-py-4 { padding-top: 30px; padding-bottom: 30px; } .lp .op-page:not(#op-important) .op-pt-4 { padding-top: 30px; } .lp .op-page:not(#op-important) .op-pt-5 { padding-top: 40px; } .lp .op-page:not(#op-important) .op-pb-5 { padding-bottom: 40px; } .lp .op-page:not(#op-important) .op-text-center { text-align: center; } .lp .op-page .op-text-white { --op-bs-text-opacity: 1; } .lp .op-page:not(#op-important) .op-text-white { color: rgba(var(--op-bs-white-rgb), var(--op-bs-text-opacity)); } .lp .op-page .op-text-muted { --op-bs-text-opacity: 1; } .lp .op-page:not(#op-important) .op-text-muted { color: var(--op-bs-secondary-color); } .lp .op-page .op-bg-light { --op-bs-bg-opacity: 1; } .lp .op-page:not(#op-important) .op-bg-light { background-color: rgba(var(--op-bs-light-rgb), var(--op-bs-bg-opacity)); } .lp .op-page .op-bg-white { --op-bs-bg-opacity: 1; } .lp .op-page:not(#op-important) .op-bg-white { background-color: rgba(var(--op-bs-white-rgb), var(--op-bs-bg-opacity)); } .lp .op-page:not(#op-important) .op-rounded { border-radius: var(--op-bs-border-radius); } .lp .op-page:not(#op-important) .op-rounded-circle { border-radius: 50%; } @media (min-width: 768px) { .lp .op-page:not(#op-important) .op-d-md-inline { display: inline; } .lp .op-page:not(#op-important) .op-d-md-flex { display: flex; } .lp .op-page:not(#op-important) .op-d-md-none { display: none; } .lp .op-page:not(#op-important) .op-p-md-4 { padding: 30px; } .lp .op-page:not(#op-important) .op-py-md-5 { padding-top: 40px; padding-bottom: 40px; } } .lp .op-page .op-bg-cover { background-repeat: no-repeat; background-size: cover; background-position: center; } .lp .op-page h1, .lp .op-page .op-h1 { font-weight: bold; font-size: 48px; line-height: 56px; } .lp .op-page h2, .lp .op-page .op-h2 { font-weight: bold; font-size: 36px; line-height: 48px; } .lp .op-page h3, .lp .op-page .op-h3 { font-weight: bold; font-size: 24px; line-height: 32px; } .lp .op-page p { font-size: 18px; line-height: 28px; } @media (max-width: 575.98px) { .lp .op-page h1, .lp .op-page .op-h1 { font-size: 36px; line-height: 48px; } .lp .op-page h2, .lp .op-page .op-h2 { font-size: 24px; line-height: 32px; } .lp .op-page h3, .lp .op-page .op-h3 { font-size: 20px; line-height: 26px; } .lp .op-page p { font-size: 16px; line-height: 28px; } } .lp .op-page .op-btn-orange { color: #fff; } .lp .op-page .op-bg-cover { background-size: cover; background-position: center; } /* 紅線：亮橘不當淺底文字色（2026-10-25）。強調字改深墨＋亮橘螢光底（同營隊頁、about 的 hl-mark）；區塊標題的螢光底加在內層 .op-hl，才會貼著字逐行斷開 */ .lp .op-page:not(#op-important) .op-text-orange { color: #2D2E32; } .lp .op-page:not(#op-important) .op-hl, .lp .op-page:not(#op-important) :is(span, a, small, b, strong, em).op-text-orange { background-image: linear-gradient(180deg, transparent 55%, rgba(255, 163, 0, 0.5) 55%); -webkit-box-decoration-break: clone; box-decoration-break: clone; } .lp .op-page:not(#op-important) .op-text-green { color: #00c4b3; } .lp .op-page:not(#op-important) .op-bg-orange { background-color: #ffa400; } .lp .op-page .op-btn.op-btn-orange { color: #ffffff; background-color: #ffa400; border-color: #ffa400; } @media (hover: hover) and (pointer: fine) { .lp .op-page .op-btn.op-btn-orange:hover { color: #ffffff; background-color: #FFA300; border-color: #FFA300; } } .lp .op-page .op-text-muted { text-decoration: none; } .lp .op-page:not(#op-important) .op-text-muted { color: #6c757d; } @media (hover: hover) and (pointer: fine) { .lp .op-page a.op-text-muted:hover { text-decoration: underline; } } .lp .op-page:not(#op-important) .op-bg-orange-light { background-color: #fef2e1; } .lp .op-page:not(#op-important) a.op-bg-orange-light:focus, .lp .op-page:not(#op-important) button.op-bg-orange-light:focus { background-color: #fcddb0; } @media (hover: hover) and (pointer: fine) { .lp .op-page:not(#op-important) a.op-bg-orange-light:hover, .lp .op-page:not(#op-important) button.op-bg-orange-light:hover { background-color: #fcddb0; } } /* 原頁行內