*{box-sizing:border-box}html,body{margin:0;width:100%;min-height:100%;font-family:Inter,"Noto Sans TC","Microsoft JhengHei",Arial,sans-serif;color:#10252b;background:#eef3f1}body{min-height:100vh}.page{height:100vh;min-height:700px;padding:26px 42px 22px;display:grid;grid-template-rows:auto 1.05fr 1.2fr .72fr auto;gap:14px;overflow:hidden;background:linear-gradient(115deg,#f7f9f7 0 58%,#e6efec 58% 100%);position:relative}.page:after{content:"SYSTEM / 2022";position:absolute;right:-18px;top:115px;font-size:92px;font-weight:900;letter-spacing:-5px;color:#153f4510;transform:rotate(90deg);pointer-events:none}header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid #b8c9c5;padding-bottom:12px;font-size:13px}header a,footer a{text-decoration:none;color:#173a40;font-weight:700}.period{text-align:center;font-weight:800;letter-spacing:.08em}.count{text-align:right;color:#607a7b;font-size:11px;letter-spacing:.16em}.hero{display:grid;grid-template-columns:1.55fr .75fr;gap:48px;align-items:center}.eyebrow,.scope span,.map-title span,.actual>span,.growth>span{font-size:12px;font-weight:900;letter-spacing:.16em;color:#28727a}.intro h1{font-size:clamp(34px,3.2vw,57px);line-height:1.08;letter-spacing:-.045em;margin:8px 0 12px}.intro h1 em{font-style:normal;color:#28727a}.intro p{max-width:850px;margin:0;font-size:15px;line-height:1.75;color:#4c6163}.scope{border-left:5px solid #d79243;padding:18px 0 18px 22px}.scope strong{display:block;font-size:22px;line-height:1.35;margin:8px 0}.scope small{color:#698083;letter-spacing:.08em}.system-map{background:#123c42;color:white;border-radius:5px;padding:19px 22px 21px;display:grid;grid-template-columns:220px 1fr;gap:24px;box-shadow:0 12px 35px #183c4218}.map-title span{color:#8fc9c5}.map-title p{font-size:14px;line-height:1.65;color:#c1d2d0;margin-top:12px}.flow{display:grid;grid-template-columns:1fr 25px 1fr 25px 1fr 25px 1fr;align-items:stretch}.flow>i{font-style:normal;display:grid;place-items:center;color:#d7a45f;font-size:25px}.flow article{border-left:1px solid #55777b;padding:4px 15px;position:relative}.flow article b{position:absolute;right:12px;top:2px;color:#87aaa8;font-size:11px}.ico{width:42px;height:42px;border:1px solid #d7a45f;color:#e9bd7d;display:grid;place-items:center;font-size:10px;font-weight:900;letter-spacing:.08em;margin-bottom:10px}.flow h2{font-size:18px;margin:0 0 7px}.flow p{font-size:12.5px;line-height:1.55;color:#bed0cf;margin:0}.bottom{display:grid;grid-template-columns:1.25fr .75fr;gap:16px}.actual,.growth{background:#fff;border:1px solid #cbd8d5;padding:14px 17px}.actual{display:grid;grid-template-columns:150px repeat(4,1fr);align-items:center}.actual div{padding:0 12px;border-left:1px solid #d8e1df}.actual strong,.actual b{display:block}.actual strong{font-size:14px}.actual b{font-size:11px;color:#28727a;margin-top:5px}.actual .muted{opacity:.55}.growth{display:grid;grid-template-columns:auto 28px auto;align-content:center;column-gap:10px}.growth>span,.growth p{grid-column:1/-1}.growth strong{font-size:17px}.growth i{text-align:center;font-style:normal;color:#d79243}.growth p{font-size:12px;color:#5b6f71;margin:7px 0 0;line-height:1.45}footer{display:flex;justify-content:space-between;border-top:1px solid #b8c9c5;padding-top:12px;font-size:12px}.next{color:#28727a}@media(max-height:800px){.page{padding-top:18px;padding-bottom:15px;gap:9px}.intro h1{font-size:38px}.intro p{font-size:13px}.system-map{padding:13px 18px}.flow p{font-size:11px}.bottom{min-height:100px}.actual,.growth{padding:9px 13px}}@media(max-width:900px){.page{height:auto;overflow:visible;padding:22px;display:block}.hero,.system-map,.bottom{display:block}.hero>*{margin-bottom:25px}.system-map{margin:18px 0}.flow{display:block}.flow>i{height:28px;transform:rotate(90deg)}.flow article{padding:14px;border-left:1px solid #55777b}.actual{display:grid;grid-template-columns:1fr 1fr;margin-bottom:14px}.actual>span{grid-column:1/-1;margin-bottom:12px}.actual div{margin:7px 0}.growth{display:grid}.page:after{display:none}footer{margin-top:20px}}