@charset "UTF-8";

:root {
    --color-heading: #1e3f8c;
    --color-subheading: #444;
    --color-text: #000;
    --color-footer: #3f80ee;
    --content-width: 1120px;
    --font-family: "Noto Sans TC", "Microsoft JhengHei", "PingFang TC", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; color: var(--color-text); background: #fff; font-family: var(--font-family); }
h1, h2, h3, p { margin: 0; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
a:focus-visible { outline: 3px solid #2a9bff; outline-offset: 6px; }
.pagesize { width: min(var(--content-width), calc(100% - 80px)); margin-inline: auto; }
.visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: 12px; left: 12px; z-index: 10; padding: 12px 20px; transform: translateY(-180%); background: #fff; color: var(--color-heading); }
.skip-link:focus { transform: translateY(0); }
.footer { padding: 16px 20px; color: #fff; background: var(--color-footer); text-align: center; }
.copyright { font-size: 16px; line-height: 1.2; }
@media (max-width: 767px) {
    .pagesize { width: calc(100% - 40px); }
    .copyright { font-size: 14px; line-height: 1.6; }
}