:root{--ink:#1c3354;--sub:#5a6d88;--blue:#2f8fe8;--blue-d:#1d6fc4;--blue-l:#eaf4ff;
  --gold:#f7a400;--gold-l:#ffd45c;--card:#fff;--line:#dbe6f2}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:"Microsoft JhengHei","Noto Sans TC",sans-serif;color:var(--ink);background:#fff;min-height:100vh}
a{color:inherit;text-decoration:none}
.box{max-width:1320px;margin:0 auto;padding:0 16px}
.hd{position:relative}
.hg{display:grid;grid-template-columns:auto 1fr auto;align-items:center;column-gap:28px}
.hg .logo{grid-column:1;grid-row:1;padding:12px 0}
.hg .eh-nav{grid-column:3;grid-row:1;white-space:nowrap}
.hg .news{grid-column:1/-1;grid-row:2}
.tk{min-width:0;flex:1}
.news .more{display:none;white-space:nowrap;font-size:14px;font-weight:700;color:var(--blue-d)}
.logo img{height:56px;display:block}
.eh-nav{display:flex;align-items:center;gap:22px;font-size:16px;font-weight:700}
.eh-nav select{font:inherit;font-size:14px;font-weight:400;padding:3px 6px;border-radius:8px;border:1px solid var(--line);color:var(--ink);background:#fff}
.eh-nav .out{display:flex;flex-direction:column;align-items:center;font-size:13px;gap:2px}
.eh-nav .out i{width:34px;height:34px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;color:var(--blue);font-style:normal;font-size:16px;box-shadow:0 3px 8px rgba(30,80,140,.18)}
.news{display:flex;gap:18px;align-items:flex-start;padding:16px 20px;border-radius:18px;margin:4px 0 0}
.news h3{margin:0;font-size:15px;letter-spacing:2px;background:var(--gold);color:#fff;padding:5px 12px;border-radius:999px;white-space:nowrap}
.news ul{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:15px;min-width:0}
.news li{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.news b{color:var(--blue-d);font-weight:700;margin-right:8px}
h2.ttl{text-align:center;font-size:36px;letter-spacing:6px;margin:26px 0 22px;font-weight:900}
h2.ttl em{font-style:normal;color:var(--gold)}
.eh-row{display:flex;gap:32px;align-items:flex-start;padding-bottom:60px}
.side{flex:0 0 240px;position:sticky;top:16px}
.side a{position:relative;display:block;text-align:center;font-size:18px;font-weight:700;padding:13px 0;margin:0 0 10px;transition:background .2s,color .2s,transform .15s}
.main{flex:1;min-width:0}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 26px}
.item{position:relative;display:flex;flex-direction:column;align-items:center;cursor:pointer;opacity:0;animation:rise .5s ease-out forwards;animation-delay:calc(var(--i) * 45ms)}
.obj{position:relative;height:240px;width:100%;display:flex;align-items:flex-end;justify-content:center;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.obj img{position:relative;z-index:1;max-height:100%;max-width:100%;filter:drop-shadow(0 12px 14px rgba(40,70,110,.22));transition:filter .3s}
.obj{isolation:isolate}
.obj::after{content:"";position:absolute;z-index:-1;left:10%;right:10%;bottom:-6px;height:34px;border-radius:50%;background:radial-gradient(closest-side,rgba(80,170,255,.55),rgba(80,170,255,0));opacity:0;transition:opacity .3s}
.lab{position:relative;z-index:2;margin-top:-4px;border-radius:16px;padding:11px 12px 12px;width:94%;text-align:center;transition:background .25s,color .25s,box-shadow .25s}
.lab b{display:block;font-size:20px;letter-spacing:.5px;white-space:nowrap}
.lab span{display:block;font-size:13px;white-space:nowrap;margin-top:4px;transition:color .25s}
.spk{position:absolute;z-index:3;width:22px;height:22px;opacity:0;pointer-events:none;background:var(--gold-l);clip-path:polygon(50% 0,61% 38%,100% 50%,61% 62%,50% 100%,39% 62%,0 50%,39% 38%);filter:drop-shadow(0 0 4px rgba(255,190,40,.9))}
.spk.s1{top:14%;left:10%}
.spk.s2{top:4%;right:14%;width:16px;height:16px}
.spk.s3{top:46%;right:6%;width:13px;height:13px}
.item:hover .obj,.item.go .obj{transform:translateY(-16px) scale(1.09)}
.item:hover .obj::after,.item.go .obj::after{opacity:1}
.item:hover .lab,.item.go .lab{background:var(--blue);color:#fff;box-shadow:0 10px 22px rgba(47,143,232,.35)}
.item:hover .lab span,.item.go .lab span{color:#e3f1ff}
.item:hover .spk,.item.go .spk{animation:pop .7s ease-out forwards}
.item:hover .s2,.item.go .s2{animation-delay:.08s}
.item:hover .s3,.item.go .s3{animation-delay:.16s}
.item:active .obj{transform:translateY(-3px) scale(.98);transition-duration:.08s}
@keyframes pop{0%{opacity:0;transform:scale(.2) rotate(0)}45%{opacity:1;transform:scale(1.15) rotate(25deg)}100%{opacity:0;transform:scale(.6) rotate(60deg)}}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
body.eh{background:linear-gradient(180deg,#8fd0ff 0px,#bfe4ff 700px,#e6f4ff 1400px,#f4faff 100%)}
body.eh::before{content:"";position:fixed;inset:0;background:#8fd0ff url(img/bg_ultra.webp) center/cover no-repeat;z-index:0}
@media (min-aspect-ratio:2/1){
  body.eh::before{background-image:url(img/bg_ultra.webp)}
}
@media (max-aspect-ratio:1/1){
  body.eh::before{background-image:url(img/bg_tall.webp)}
}
body.eh .hd,body.eh .wrap{position:relative;z-index:1}
body.eh .hd{background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,.62));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 24px rgba(30,90,160,.14);border-bottom:1px solid rgba(255,255,255,.9)}
body.eh .news{margin:0;padding:12px 0 16px;border-radius:0;border-top:1px solid rgba(47,143,232,.18)}
body.eh h2.ttl{color:#17305a;text-shadow:0 1px 0 rgba(255,255,255,.9),0 0 18px rgba(255,255,255,.85)}
body.eh .side a{display:flex;align-items:center;gap:12px;text-align:left;padding:9px 14px;border-radius:16px;color:var(--ink);background:linear-gradient(180deg,#fff,#eef6ff);border-bottom:4px solid #c3d9f1;box-shadow:0 6px 12px rgba(30,90,160,.12)}
body.eh .side a:hover{transform:translateY(-2px)}
body.eh .side a.on{background:linear-gradient(180deg,#5cb4ff,#2482e0);border-bottom-color:#1660b0;color:#fff;text-shadow:0 1px 0 rgba(0,0,0,.15)}
body.eh .side a.on::before{display:none;content:"";position:absolute;left:16px;top:50%;width:16px;height:16px;margin-top:-8px;background:var(--gold-l);clip-path:polygon(50% 0,61% 38%,100% 50%,61% 62%,50% 100%,39% 62%,0 50%,39% 38%)}
body.eh .lab{background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 8px 20px rgba(30,80,140,.16)}
body.eh .lab span{color:var(--sub)}
.obj{--h:240px}
@keyframes conf{0%{opacity:1;transform:translate(0,0) rotate(0)}60%{opacity:1;transform:translate(var(--dx),var(--dy)) rotate(var(--r))}100%{opacity:0;transform:translate(var(--dx),calc(var(--dy) + 6cqw)) rotate(calc(var(--r) * 2))}}
@property --n{syntax:'<integer>';inherits:false;initial-value:7200}
.obj{perspective:900px}
.sim{position:relative;height:100%;display:flex;align-items:flex-end;justify-content:center;transition:transform .25s ease-out;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transform-style:preserve-3d}
.sim .base{max-height:100%;max-width:100%;display:block;filter:drop-shadow(0 12px 14px rgba(40,70,110,.22));transition:filter .3s}
.sim .shn{position:absolute;inset:0;margin:auto;pointer-events:none;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center bottom;mask-position:center bottom;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.5) 42%,rgba(255,255,255,1) 50%,rgba(255,255,255,.5) 58%,transparent 70%) no-repeat;background-size:260% 100%;background-position:130% 0;opacity:0;mix-blend-mode:screen}
.go .sim .shn{animation:shn 1s ease-in-out .15s}
.go .sim .base{filter:drop-shadow(0 16px 18px rgba(40,70,110,.28)) brightness(1.04) saturate(1.06)}
@keyframes shn{0%{opacity:1;background-position:130% 0}100%{opacity:1;background-position:-30% 0}}
.item:active .sim{transform:scale(.97);transition-duration:.08s}
.item{transition:opacity .3s,filter .3s}
.grid:has(.item:hover) .item:not(:hover){opacity:.5;filter:saturate(.6)}
.lyr{position:relative;width:100%;max-width:calc(var(--h,240px) * var(--ar));aspect-ratio:var(--ar);container-type:inline-size;filter:drop-shadow(0 12px 14px rgba(40,70,110,.22));transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .25s ease-out}
.obj .lyr>*{position:absolute;display:block;z-index:auto;max-width:none;max-height:none;filter:none;margin:0}
.obj .lyr .ly-robot img{max-width:none;max-height:none;filter:none}
.lyr .ly-robot img{position:absolute;inset:0;width:100%;height:100%}
.lyr .r2,.lyr .r3{opacity:0}
.ly-needle{transform:rotate(45deg)}
.ly-num{counter-reset:n var(--n);display:flex;align-items:center;justify-content:center}
.ly-num::after{content:counter(n);font:900 9.4cqw/1 "Arial Rounded MT Bold","Arial Black",sans-serif;color:#1e3d72;text-shadow:0 .25cqw 0 #0f2550,0 .6cqw .8cqw rgba(15,37,80,.35);-webkit-text-stroke:.15cqw #1e3d72}
.ly-lvl{display:flex;align-items:center;justify-content:center;font:900 4.6cqw/1 "Microsoft JhengHei",sans-serif;color:#1e3d72;letter-spacing:.1em;text-shadow:0 .2cqw 0 rgba(15,37,80,.3)}
.go .ly-needle{animation:lyNd 1s cubic-bezier(.3,.8,.35,1) .1s backwards}
@keyframes lyNd{0%{transform:rotate(-88deg)}65%{transform:rotate(62deg)}82%{transform:rotate(38deg)}100%{transform:rotate(45deg)}}
.go .ly-num{animation:lyCnt .8s cubic-bezier(.2,.7,.3,1) .1s backwards}
@keyframes lyCnt{from{--n:0}to{--n:7200}}
.go .ly-lvl{animation:lyLvl .5s ease .95s backwards}
@keyframes lyLvl{0%{opacity:0;transform:scale(.6)}60%{opacity:1;transform:scale(1.2);text-shadow:0 0 2cqw rgba(255,210,60,.9)}100%{opacity:1;transform:none}}
.go .pr-plane{animation:lyFly 1s cubic-bezier(.5,0,.75,.6) .1s forwards}
@keyframes lyFly{0%{transform:none;opacity:1}80%{opacity:1}100%{transform:translate(270%,-157%) scale(.85);opacity:0}}
.obj .lyr .ly-prop img{position:static;display:block;width:100%;height:100%;max-width:none;max-height:none;filter:none}
[data-k=world] .lyr{overflow:hidden}
.pr-dog{opacity:0;z-index:5!important;filter:drop-shadow(0 .8cqw .8cqw rgba(40,60,90,.3))}
[data-k=gept_sw] .obj{z-index:3;position:relative}
.go .pr-dog{animation:dogJump 1.1s cubic-bezier(.35,0,.45,1) .1s forwards}
@keyframes dogJump{0%{opacity:0;transform:translate(53%,-12%) scale(.24)}8%{opacity:1;transform:translate(53%,-12%) scale(.27)}45%{opacity:1;transform:translate(29%,-62%) scale(.7) rotate(-12deg)}78%{opacity:1;transform:translate(0,0) scale(1.08,.9) rotate(0)}88%{opacity:1;transform:translateY(-5%) scale(.97,1.04)}100%{opacity:1;transform:none}}
@keyframes twk{0%{opacity:0;transform:scale(.2) rotate(0)}50%{opacity:1;transform:scale(1.2) rotate(30deg)}100%{opacity:0;transform:scale(.6) rotate(60deg)}}
@property --ca{syntax:'<angle>';inherits:false;initial-value:0deg}
[data-k=bridge_sw] .pr-k2,[data-k=bridge_sw] .pr-k3,[data-k=bridge_sw] .pr-k4,[data-k=bridge_sw] .pr-pen1,[data-k=bridge_sw] .pr-pen2,[data-k=bridge_sw] .pr-pen3,[data-k=bridge_sw] .pr-pen4,[data-k=bridge_sw] .pr-cfix,[data-k=bridge_sw] .pr-stamp{opacity:0}
@keyframes penIn{0%{opacity:1;transform:translate(110%,-130%) rotate(-15deg)}99%{opacity:1;transform:none}100%{opacity:0;transform:none}}
@keyframes penGrab{0%{opacity:1;transform:none}14%{transform:translateY(-6%) rotate(-4deg)}26%{transform:translateY(0) rotate(3deg)}48%{opacity:1;transform:translateY(-4%)}49%,100%{opacity:0}}
@keyframes penWrite{0%{opacity:0}1%{opacity:1;transform:translate(0,0)}25%{transform:translate(-14%,-6%)}55%{transform:translate(-16%,4%)}85%{opacity:1;transform:translate(-4%,6%)}86%,100%{opacity:0}}
[data-k=bridge_sw] .pr-cfix{-webkit-mask:conic-gradient(from 40deg,#000 var(--ca),transparent 0);mask:conic-gradient(from 40deg,#000 var(--ca),transparent 0)}
@keyframes cDraw{0%{opacity:1;--ca:0deg}100%{opacity:1;--ca:360deg}}
@keyframes penProud{0%{opacity:1;transform:translate(-8%,30%) scale(.9)}100%{opacity:1;transform:none}}
@keyframes stampDown{0%{opacity:0;transform:scale(1.9) rotate(-18deg)}60%{opacity:1;transform:scale(.92) rotate(-8deg)}100%{opacity:1;transform:rotate(-8deg)}}
.go[data-k=bridge_sw] .pr-k1{animation:lyOff .01s step-end .3s forwards}
.go[data-k=bridge_sw] .pr-k2{animation:lyOn .01s step-end .3s forwards,kPeek .5s ease-in-out .35s,lyOff .01s step-end 1.02s forwards}
@keyframes kPeek{0%,100%{transform:none}30%{transform:translateX(-3%) rotate(-3deg)}65%{transform:translateX(3%) rotate(2deg)}}
.go[data-k=bridge_sw] .pr-k4{animation:lyOn .01s step-end 1.02s forwards,kJolt .12s ease-out 1.02s,lyOff .01s step-end 1.15s forwards}
@keyframes kJolt{0%{transform:translateY(0)}100%{transform:translateY(-25%)}}
.go[data-k=bridge_sw] .pr-pen1{animation:penIn .35s cubic-bezier(.5,0,.8,.5) .8s forwards}
.go[data-k=bridge_sw] .pr-pen2{animation:penGrab 1.1s ease 1.15s forwards}
@keyframes penGrab{0%{opacity:1;transform:none}20%{transform:translate(4%,-10%) rotate(-5deg)}35%{transform:translate(4%,-8%) rotate(4deg)}50%{opacity:1;transform:translate(4%,-9%)}51%,100%{opacity:0}}
.go[data-k=bridge_sw] .pr-pen3{animation:penWrite .8s ease 1.72s forwards}
.go[data-k=bridge_sw] .pr-cfix{animation:cDraw .6s linear 1.82s forwards}
.go[data-k=bridge_sw] .pr-pen4{animation:penProud .5s cubic-bezier(.3,1.5,.5,1) 2.4s forwards}
.go[data-k=bridge_sw] .pr-stamp{animation:stampDown .35s cubic-bezier(.5,0,.8,1.4) 2.6s forwards}
@keyframes envPop{0%{opacity:1;transform:translate(8%,-30%) scale(.25)}100%{opacity:1;transform:none}}
[data-k=toeic_sw] .pr-bars{transform:scaleY(.45);transform-origin:50% 100%}
[data-k=toeic_sw] .pr-env2,[data-k=toeic_sw] .pr-env3,[data-k=toeic_sw] .pr-env4,[data-k=toeic_sw] .pr-stk,[data-k=toeic_sw] .pr-arrow{opacity:0}
.go[data-k=toeic_sw] .pr-env1{animation:envPop .5s cubic-bezier(.3,1.5,.5,1) .2s backwards,lyOff .01s step-end .75s forwards}
.go[data-k=toeic_sw] .pr-env2{animation:envStrut .7s ease-in-out .75s forwards}
@keyframes envStrut{0%{opacity:1;transform:translate(110%,-4%)}20%{transform:translate(85%,-10%) rotate(-5deg)}40%{transform:translate(55%,0) rotate(4deg)}60%{transform:translate(30%,-10%) rotate(-5deg)}80%{transform:translate(8%,0) rotate(3deg)}99%{opacity:1;transform:none}100%{opacity:0}}
.go[data-k=toeic_sw] .pr-env3{animation:envClimb .45s cubic-bezier(.3,0,.5,1) 1.45s forwards,envSlap .2s ease-in 1.95s,envHop .5s cubic-bezier(.45,0,.75,1) 2.25s forwards}
@keyframes envHop{0%{opacity:1;transform:none}30%{opacity:1;transform:translate(-30%,-30%) rotate(-12deg)}99%{opacity:1;transform:translate(-70%,271%) rotate(0)}100%{opacity:0;transform:translate(-70%,271%)}}
@keyframes envClimb{0%{opacity:1;transform:translate(110%,150%) scale(.9)}100%{opacity:1;transform:none}}
@keyframes envSlap{0%{transform:none}60%{transform:translateY(8%) rotate(-6deg)}100%{transform:none}}
.go[data-k=toeic_sw] .pr-stk{animation:stkSlap .25s cubic-bezier(.5,0,.8,1.5) 2.05s forwards}
@keyframes stkSlap{0%{opacity:1;transform:translateY(-30%) scale(1.3)}100%{opacity:1;transform:none}}
.go[data-k=toeic_sw] .pr-bars{animation:barsUp .5s cubic-bezier(.3,1.4,.5,1) 2.2s forwards}
@keyframes barsUp{0%{transform:scaleY(.45)}100%{transform:scaleY(.9)}}
.go[data-k=toeic_sw] .pr-arrow{animation:arrowOut .45s ease-out 2.5s forwards}
@keyframes arrowOut{0%{opacity:1;clip-path:inset(0 100% 0 0)}100%{opacity:1;clip-path:inset(0 0 0 0)}}
.go[data-k=toeic_sw] .pr-env4{animation:envWin .5s cubic-bezier(.3,1.6,.5,1) 2.75s forwards}
@keyframes envWin{0%{opacity:1;transform:scale(.9,.8)}60%{opacity:1;transform:translateY(-12%) scale(1.05)}100%{opacity:1;transform:none}}
.pr-confetti i{position:absolute;left:50%;top:50%;width:5%;height:9%;border-radius:2px;opacity:0}
.pr-confetti i:nth-child(5n+1){background:#ff5a8a}
.pr-confetti i:nth-child(5n+2){background:#ffd23f}
.pr-confetti i:nth-child(5n+3){background:#3d9bff}
.pr-confetti i:nth-child(5n+4){background:#3ccf6a}
.pr-confetti i:nth-child(5n){background:#b07cff}
.go .pr-confetti i{animation:conf 1s ease-out 2.8s forwards}
.pr-confetti i:nth-child(1){--dx:-260%;--dy:-320%;--r:200deg}
.pr-confetti i:nth-child(2){--dx:-120%;--dy:-420%;--r:-160deg}
.pr-confetti i:nth-child(3){--dx:40%;--dy:-460%;--r:240deg}
.pr-confetti i:nth-child(4){--dx:220%;--dy:-380%;--r:-200deg}
.pr-confetti i:nth-child(5){--dx:360%;--dy:-260%;--r:180deg}
.pr-confetti i:nth-child(6){--dx:-380%;--dy:-180%;--r:-220deg}
.pr-confetti i:nth-child(7){--dx:-60%;--dy:-280%;--r:150deg}
.pr-confetti i:nth-child(8){--dx:140%;--dy:-240%;--r:-170deg}
.pr-confetti i:nth-child(9){--dx:300%;--dy:-120%;--r:210deg}
.pr-confetti i:nth-child(10){--dx:-200%;--dy:-100%;--r:-190deg}
[data-k=eng_speak] .pr-bub,[data-k=eng_speak] .pr-card2,[data-k=eng_speak] .pr-card3,[data-k=eng_speak] .pr-card4{opacity:0}
[data-k=eng_speak] .pr-bub .mask{position:absolute;margin:-1% -1%;padding:1%;box-sizing:content-box}
.go[data-k=eng_speak] .pr-bub{animation:bubPop .35s cubic-bezier(.3,1.6,.5,1) .3s forwards}
@keyframes bubPop{0%{opacity:1;transform:scale(.2)}100%{opacity:1;transform:none}}
.go[data-k=eng_speak] .pr-bub .mask{animation:typeOut 1s steps(18) .6s forwards}
@keyframes typeOut{0%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 0 0 100%)}}
.pr-waves i{position:absolute;left:0;top:50%;width:22%;aspect-ratio:1;margin-top:-11%;border-radius:50%;border:.5cqw solid #4aa8ff;border-left-color:transparent;border-bottom-color:transparent;border-top-color:transparent;opacity:0}
.go[data-k=eng_speak] .pr-waves i{animation:waveGo .7s ease-out forwards}
.go[data-k=eng_speak] .pr-waves i:nth-child(1){animation-delay:.6s}
.go[data-k=eng_speak] .pr-waves i:nth-child(2){animation-delay:.9s}
.go[data-k=eng_speak] .pr-waves i:nth-child(3){animation-delay:1.2s}
@keyframes waveGo{0%{opacity:0;transform:translateX(0) scale(.6)}20%{opacity:1}100%{opacity:0;transform:translateX(330%) scale(1.3)}}
.go[data-k=eng_speak] .pr-card1{animation:lyOff .01s step-end .65s forwards}
.go[data-k=eng_speak] .pr-card2{animation:lyOn .01s step-end .65s forwards,cardLean .7s ease-in-out .65s forwards,lyOff .01s step-end 1.6s forwards}
@keyframes cardLean{0%{transform:none}100%{transform:rotate(-6deg) translateX(-4%)}}
.go[data-k=eng_speak] .pr-card3{animation:lyOn .01s step-end 1.6s forwards,cardNod .45s ease-in-out 1.6s,lyOff .01s step-end 2.15s forwards}
@keyframes cardNod{0%,100%{transform:none}30%{transform:translateY(3%) rotate(2deg)}65%{transform:translateY(-1%)}}
.go[data-k=eng_speak] .pr-card4{animation:cardFlip .4s ease-out 2.15s forwards}
@keyframes cardFlip{0%{opacity:1;transform:perspective(40cqw) rotateY(90deg)}100%{opacity:1;transform:none}}
.pr-spark3 b{position:absolute;font-size:4.2cqw;color:#ffd23f;text-shadow:0 0 1cqw rgba(255,200,40,.9);opacity:0}
.pr-spark3 b:nth-child(1){left:5%;top:40%}
.pr-spark3 b:nth-child(2){left:55%;top:5%;font-size:3cqw}
.pr-spark3 b:nth-child(3){left:80%;top:55%;font-size:2.6cqw}
.go[data-k=eng_speak] .pr-spark3 b{animation:twk .7s ease-out 2.45s forwards}
.go[data-k=eng_speak] .pr-spark3 b:nth-child(2){animation-delay:2.55s}
.go[data-k=eng_speak] .pr-spark3 b:nth-child(3){animation-delay:2.65s}
[data-k=jp_speak] .pr-dm2,[data-k=jp_speak] .pr-dm3,[data-k=jp_speak] .pr-brush,[data-k=jp_speak] .pr-sign{opacity:0}
.go[data-k=jp_speak] .pr-dm1{animation:dmWob .5s ease-in-out .2s 2,lyOff .01s step-end 1.25s forwards}
@keyframes dmWob{0%,100%{transform:rotate(0)}25%{transform:rotate(-9deg)}75%{transform:rotate(9deg)}}
.go[data-k=jp_speak] .pr-brush{animation:brushIn 1.2s cubic-bezier(.45,0,.4,1) .55s forwards}
@keyframes brushIn{0%{opacity:1;transform:translate(150%,-120%) rotate(-12deg)}55%{opacity:1;transform:translate(8%,-10%) rotate(-4deg)}62%{transform:none}68%{transform:translate(-4%,3%) rotate(3deg)}76%{opacity:1;transform:translate(0,-6%)}100%{opacity:0;transform:translate(150%,-130%) rotate(-12deg)}}
.pr-ink i{position:absolute;left:50%;top:50%;width:12%;aspect-ratio:1;border-radius:50%;background:#1a1a1a;opacity:0}
.go[data-k=jp_speak] .pr-ink i{animation:inkPop .5s ease-out 1.25s forwards}
.pr-ink i:nth-child(1){--dx:-260%;--dy:-180%}
.pr-ink i:nth-child(2){--dx:240%;--dy:-220%;width:9%}
.pr-ink i:nth-child(3){--dx:300%;--dy:120%;width:8%}
.pr-ink i:nth-child(4){--dx:-200%;--dy:200%;width:10%}
.pr-ink i:nth-child(5){--dx:20%;--dy:-320%;width:7%}
@keyframes inkPop{0%{opacity:1;transform:translate(-50%,-50%) scale(.3)}60%{opacity:1;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(1)}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.8)}}
.go[data-k=jp_speak] .pr-dm2{animation:lyOn .01s step-end 1.25s forwards,dmJolt .3s ease-out 1.25s,lyOff .01s step-end 1.75s forwards}
@keyframes dmJolt{0%{transform:scale(1.08,.92)}100%{transform:none}}
.go[data-k=jp_speak] .pr-dm3{animation:lyOn .01s step-end 1.75s forwards,dmRock .9s ease-in-out 1.75s}
@keyframes dmRock{0%,100%{transform:rotate(0)}20%{transform:rotate(-14deg)}45%{transform:rotate(11deg)}70%{transform:rotate(-6deg)}88%{transform:rotate(3deg)}}
.go[data-k=jp_speak] .pr-sign{animation:signPop .5s cubic-bezier(.3,1.7,.5,1) 1.9s forwards}
@keyframes signPop{0%{opacity:1;transform:translateY(40%) scale(.2)}100%{opacity:1;transform:none}}
.pr-petals i{position:absolute;width:3.5%;aspect-ratio:1;border-radius:70% 0 70% 0;background:#ffb7cf;box-shadow:inset -.3cqw -.3cqw 0 #ff93b6;opacity:0}
.pr-petals i:nth-child(1){left:10%}
.pr-petals i:nth-child(2){left:24%}
.pr-petals i:nth-child(3){left:38%}
.pr-petals i:nth-child(4){left:52%}
.pr-petals i:nth-child(5){left:66%}
.pr-petals i:nth-child(6){left:80%}
.pr-petals i:nth-child(7){left:92%}
.go[data-k=jp_speak] .pr-petals i{animation:petal 1.6s ease-in forwards;animation-delay:calc(1.95s + var(--d,0s))}
.pr-petals i:nth-child(2){--d:.15s}
.pr-petals i:nth-child(3){--d:.05s}
.pr-petals i:nth-child(4){--d:.25s}
.pr-petals i:nth-child(5){--d:.1s}
.pr-petals i:nth-child(6){--d:.3s}
.pr-petals i:nth-child(7){--d:.2s}
@keyframes petal{0%{opacity:0;transform:translate(0,0) rotate(0)}10%{opacity:1}100%{opacity:0;transform:translate(-30%,1100%) rotate(300deg)}}
[data-k=toeic_mock] .ly-robot .r2,[data-k=toeic_mock] .ly-robot .r3,[data-k=toeic_mock] .pr-reps{opacity:0}
[data-k=toeic_mock] .ly-robot{transform-origin:50% 100%}
.go[data-k=toeic_mock] .ly-robot .r1{animation:tm1 .86s linear forwards}
@keyframes tm1{0%,17%,31%,45%,59%,73%,87%{transform:none;opacity:1}10%,38%,66%{transform:translateX(-1.2%) rotate(-1deg)}24%,52%,80%{transform:translateX(1.2%) rotate(1deg)}99.9%{opacity:1}100%{opacity:0}}
.go[data-k=toeic_mock] .ly-robot .r2{animation:tm2 2.15s linear forwards}
@keyframes tm2{0%,39.5%{opacity:0;transform:none}40%{opacity:1;transform:none}47%,61%,75%,89%{opacity:1;transform:translateY(-2.5%)}54%,68%,82%,96%{opacity:1;transform:none}99.8%{opacity:1}100%{opacity:0}}
@property --rp{syntax:'<integer>';inherits:false;initial-value:0}
.pr-reps{z-index:6!important;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:999px;box-shadow:0 .5cqw 1.2cqw rgba(30,60,120,.25)}
.pr-reps b{counter-reset:rp var(--rp);font:900 7.5cqw/1 "Arial Rounded MT Bold","Arial Black",sans-serif;color:#d8322d}
.pr-reps b::before{content:"×" counter(rp)}
.go[data-k=toeic_mock] .pr-reps{animation:repsShow 1.3s ease .9s forwards}
.go[data-k=toeic_mock] .pr-reps b{animation:repsCount 1.15s steps(10) .95s forwards}
@keyframes repsShow{0%{opacity:0;transform:scale(.4)}10%{opacity:1;transform:scale(1.1)}18%{transform:none}88%{opacity:1}100%{opacity:0}}
@keyframes repsCount{from{--rp:10}to{--rp:100}}
.go[data-k=toeic_mock] .ly-robot .r3{animation:tmLift .45s cubic-bezier(.3,1.6,.5,1) 2.15s forwards}
@keyframes tmLift{0%{opacity:1;transform:translateY(6%) scale(.96,1.04)}100%{opacity:1;transform:none}}
.tl-hid{opacity:0}
.go .lyr [data-tl]{animation:var(--anim)}
@keyframes tlOn{to{opacity:1}}
@keyframes tlOff{to{opacity:0}}
@keyframes tlPop{0%{opacity:1;transform:scale(.2)}100%{opacity:1;transform:none}}
@keyframes tlShake{0%,100%{transform:none}25%{transform:translateX(-2%) rotate(-2deg)}75%{transform:translateX(2%) rotate(2deg)}}
@keyframes tlHop{0%{transform:none}35%{transform:translate(calc(var(--dx,0%) * .4),calc(var(--dy,0%) * .4 - 25%)) rotate(var(--rr,0deg))}100%{transform:translate(var(--dx,0%),var(--dy,0%))}}
@keyframes tlBob{0%,100%{transform:none}50%{transform:translateY(-4%)}}
@keyframes tlFlip{0%{opacity:1;transform:perspective(40cqw) rotateY(90deg)}100%{opacity:1;transform:none}}
@keyframes tlWipe{0%{opacity:1;clip-path:inset(0 100% 0 0)}100%{opacity:1;clip-path:inset(0 0 0 0)}}
@keyframes tlDrop{0%{opacity:1;transform:translateY(-40%) scale(1.3)}100%{opacity:1;transform:none}}
@keyframes tlRock{0%,100%{transform:rotate(0)}25%{transform:rotate(-10deg)}60%{transform:rotate(8deg)}85%{transform:rotate(-3deg)}}
@keyframes tlFlyIn{0%{opacity:1;transform:translate(var(--dx,0%),var(--dy,-200%)) rotate(var(--rr,-20deg))}100%{opacity:1;transform:none}}
@keyframes tlWipeDown{0%{opacity:1;clip-path:inset(0 0 100% 0)}100%{opacity:1;clip-path:inset(0 0 0 0)}}
@keyframes tlFly{0%{transform:none}100%{transform:translate(var(--dx,0%),var(--dy,0%)) rotate(var(--rr,0deg))}}
@property --cn{syntax:'<integer>';inherits:false;initial-value:0}
@keyframes tlCount{from{--cn:var(--c0)}to{--cn:var(--c1)}}
[data-k=word_magic] .ly-robot{transform-origin:50% 100%}
[data-k=word_magic] .ly-robot .r2,[data-k=word_magic] .ly-robot .r3{opacity:0}
.go[data-k=word_magic] .ly-robot .r1{animation:lyOff .01s step-end .3s forwards}
.go[data-k=word_magic] .ly-robot .r2{animation:lyOn .01s step-end .3s forwards,lyOff .01s step-end .85s forwards}
.go[data-k=word_magic] .ly-robot .r3{animation:lyOn .01s step-end .85s forwards}
.go[data-k=word_magic] .ly-robot{animation:wmSneak .55s ease-in-out .3s,wmChomp .25s ease-out .85s,wmChew .32s ease-in-out 1.1s 3}
@keyframes wmSneak{0%,100%{transform:none}30%{transform:translateX(-2%) rotate(-3deg)}65%{transform:translateX(2%) rotate(3deg)}}
@keyframes wmChomp{0%{transform:translateX(3%) rotate(4deg)}100%{transform:none}}
@keyframes wmChew{0%,100%{transform:none}50%{transform:scale(1.03,.97)}}
[data-k=word_magic] .pr-crumbs i{background:#f6f1e6}
.go[data-k=word_magic] .pr-crumbs i{animation:crumb .8s cubic-bezier(.3,0,.8,.6) .88s forwards}
.pr-heart{display:flex;align-items:center;justify-content:center;opacity:0}
.pr-heart b{font-size:5.5cqw;color:#ff5a8a;text-shadow:0 .2cqw .4cqw rgba(200,40,90,.35)}
.go .pr-heart{animation:wmHeart 1s ease-out 1.25s forwards}
@keyframes wmHeart{0%{opacity:0;transform:translateY(20%) scale(.3)}35%{opacity:1;transform:translateY(-10%) scale(1.15)}60%{transform:translateY(-25%) scale(1)}100%{opacity:1;transform:translateY(-40%) scale(1)}}
.pr-crumbs i{position:absolute;left:50%;top:50%;width:12%;aspect-ratio:1;border-radius:30%;background:#f3ead8;box-shadow:0 0 0 .1cqw rgba(140,100,60,.4);opacity:0}
.go .pr-crumbs i{animation:crumb .8s cubic-bezier(.3,0,.8,.6) .47s forwards}
.pr-crumbs i:nth-child(1){--dx:60%;--dy:300%}
.pr-crumbs i:nth-child(2){--dx:140%;--dy:380%;width:9%}
.pr-crumbs i:nth-child(3){--dx:-20%;--dy:340%;width:8%}
.pr-crumbs i:nth-child(4){--dx:100%;--dy:260%;width:7%}
@keyframes crumb{0%{opacity:1;transform:translate(0,0) rotate(0)}85%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(200deg)}}
@keyframes lyOn{to{opacity:1}}
@keyframes lyOff{to{opacity:0}}
@media (prefers-reduced-motion:reduce){
  .lyr *{animation:none!important}
  .sim{transform:none!important}
  .go .sim .shn{animation:none}
}
:root.eh .news{align-items:stretch}
:root.eh .news h3{align-self:center}
:root.eh .tk ul{grid-template-columns:repeat(4,1fr);gap:12px}
:root.eh .tk li{white-space:normal;background:rgba(255,255,255,.8);border-radius:14px;padding:10px 14px;box-shadow:0 4px 12px rgba(30,90,160,.10);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:14px;line-height:1.45;cursor:pointer;transition:transform .2s,box-shadow .2s}
:root.eh .tk li:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(30,90,160,.18)}
:root.eh .tk li b{display:block;font-size:13px}
:root.eh .news .more{display:block;align-self:center}
.side a img{width:34px;height:34px;flex:none;filter:drop-shadow(0 2px 3px rgba(20,60,120,.25));transition:transform .2s}
.side a:hover img{transform:scale(1.12) rotate(-6deg)}
.side a.on img{transform:scale(1.08);filter:drop-shadow(0 0 6px rgba(255,255,255,.9))}
@media (prefers-reduced-motion:reduce){
  .item{animation:none;opacity:1}
  .obj,.item:hover .obj,.item.go .obj{transform:none}
  .item:hover .spk{animation:none}
}
@media (max-width:1100px){
  .grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .hg{grid-template-columns:1fr;column-gap:0}
  .hg .logo{padding:10px 0 4px}
  .hg .logo img{height:40px}
  .hg .eh-nav{grid-column:1;grid-row:2;justify-content:flex-start;gap:12px;font-size:13px;flex-wrap:wrap;white-space:normal}
  .eh-nav select{max-width:160px;font-size:12px}
  .eh-nav .out{flex-direction:row;gap:6px;font-size:13px}
  .eh-nav .out i{width:26px;height:26px;font-size:13px}
  :root.eh .hg .news{grid-column:1;grid-row:3;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;margin:8px 0 10px;padding:5px 10px 5px 5px;border:0;border-radius:999px;background:rgba(255,255,255,.75)}
  :root.eh .news h3{font-size:11px;padding:3px 8px;letter-spacing:1px}
  :root.eh .tk{height:22px;overflow:hidden}
  :root.eh .tk ul{display:block;transition:transform .5s ease}
  :root.eh .tk li{height:22px;line-height:22px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:none;box-shadow:none;padding:0;border-radius:0;display:block}
  :root.eh .tk li b{display:inline;font-size:13px}
  :root.eh .news .more{display:none}
  .eh-row{flex-direction:column;gap:18px}
  .side{position:static;flex:none;width:100%;display:flex;gap:8px;overflow-x:auto;padding:4px 2px 8px!important;border-radius:16px!important}
  .side a{flex:0 0 auto;margin:0;padding:7px 14px!important;font-size:15px}
  .side a img{width:24px;height:24px}
  .side a.on::before{display:none}
  .side{scrollbar-width:none}
  .side::-webkit-scrollbar{display:none}
  h2.ttl{font-size:22px;letter-spacing:2px;margin:18px 0 14px}
}
@media (max-width:560px){
  .grid{grid-template-columns:1fr}
  .obj{height:220px;--h:220px}
  .lab b{font-size:18px}
}
:root{--ink:#1c3354;--fr:"Huninn","Microsoft JhengHei","Noto Sans TC",sans-serif}
body.eh{font-family:var(--fr)}
body.eh .lab b,body.eh .side a,body.eh h2.ttl,body.eh .news h3,body.eh .eh-nav{font-family:var(--fr);font-weight:400}
body.eh .hd,body.eh .lab,:root.eh body.eh .tk li{background:linear-gradient(160deg,rgba(255,255,255,.82),rgba(255,255,255,.55) 55%,rgba(255,255,255,.68));
  -webkit-backdrop-filter:blur(16px) saturate(170%);backdrop-filter:blur(16px) saturate(170%);
  border:1px solid rgba(255,255,255,.7);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(255,255,255,.3),0 10px 30px rgba(30,80,140,.16)}
body.eh .hd{border-width:0 0 1px;border-radius:0}
body.eh .side{position:sticky;top:16px;padding:0;background:none;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
body.eh .side a{color:#17305a;background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.75);border-bottom:1px solid rgba(255,255,255,.75);box-shadow:inset 0 1px 0 rgba(255,255,255,.9);font-size:18px}
body.eh .side a:hover{background:rgba(255,255,255,.75);transform:translateY(-1px)}
body.eh .side a.on{background:linear-gradient(160deg,rgba(92,180,255,.85),rgba(36,130,224,.8));border-color:rgba(255,255,255,.6);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 6px 16px rgba(36,130,224,.35)}
body.eh .lab{border-radius:20px;overflow:hidden}
body.eh .lab::before{display:none;content:"";position:absolute;left:8%;right:8%;top:0;height:45%;border-radius:0 0 50% 50%/0 0 100% 100%;background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,0));pointer-events:none}
body.eh .lab b{font-size:21px;letter-spacing:1px;color:#17305a}
body.eh .lab span{font-size:13.5px;color:#3d5577}
:root.eh body.eh .tk li{border-radius:18px}
body.eh h2.ttl{letter-spacing:8px}
:root.eh body.eh .item:hover .lab,:root.eh body.eh .item.go .lab{background:linear-gradient(160deg,rgba(255,255,255,.88),rgba(255,255,255,.6));color:var(--ink);border-color:rgba(120,190,255,.95);box-shadow:inset 0 1px 0 #fff,0 0 0 3px rgba(120,190,255,.35),0 14px 30px rgba(30,100,190,.25);transform:translateY(-3px)}
:root.eh body.eh .item:hover .lab b,:root.eh body.eh .item.go .lab b{color:#1d6fc4}
:root.eh body.eh .item:hover .lab span,:root.eh body.eh .item.go .lab span{color:#3d5577}
body.eh::after{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:linear-gradient(170deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.12) 38%,rgba(255,255,255,.22) 62%,rgba(255,255,255,.08) 100%),radial-gradient(120% 60% at 20% 0%,rgba(255,255,255,.35),rgba(255,255,255,0) 60%);-webkit-backdrop-filter:none;backdrop-filter:none}
body.eh .lab{background:linear-gradient(160deg,rgba(255,255,255,.9),rgba(255,255,255,.72))}
body.eh .hd{position:relative;z-index:3;overflow:visible;background:linear-gradient(180deg,rgba(255,255,255,.86) 0%,rgba(236,247,255,.78) 70%,rgba(220,240,255,.7) 100%);border-bottom:0;box-shadow:none}
body.eh .hd::after{content:"";position:absolute;left:0;right:0;bottom:-30px;height:32px;pointer-events:none;
 background:radial-gradient(90px 34px at 0% 0,rgba(226,243,255,.82) 97%,transparent 100%),radial-gradient(120px 34px at 7% 0,rgba(226,243,255,.82) 97%,transparent 100%),radial-gradient(100px 34px at 14% 0,rgba(226,243,255,.82) 97%,transparent 100%),radial-gradient(130px 34px at 21% 0,rgba(226,243,255,.82) 97%,transparent 100%),radial-gradient(95px 34px at 28% 0,rgba(226,243,255,.82) 97%,transparent 100%),radial-gradient(125px 34px at 35% 0,rgba(226,243,255,.82) 97%,transparent 100%),radial-gradient(105px 34px at 42% 0,rgba(226,243,255,.82) 97%,transparent 100%),radial-gradient(135px 34px at 49% 0,rgba(226,243,255,.82) 97%,transparent 100%),radial-gradient(100px 34px at 56% 0,rgba(226,243,255,.82) 97%,transparent 100%),radial-gradient(120px 34px at 63% 0,rgba(226,243,255,.82) 97%,transparent 100%),radial-gradient(95px 34px at 70% 0,rgba(226,243,255,.82) 97%,transparent 100%),radial-gradient(130px 34px at 77% 0,rgba(226,243,255,.82) 97%,transparent 100%),radial-gradient(110px 34px at 84% 0,rgba(226,243,255,.82) 97%,transparent 100%),radial-gradient(120px 34px at 91% 0,rgba(226,243,255,.82) 97%,transparent 100%),radial-gradient(95px 34px at 98% 0,rgba(226,243,255,.82) 97%,transparent 100%);
 -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);filter:drop-shadow(0 6px 8px rgba(30,90,160,.10))}
.hd-cloud{position:absolute;z-index:4;pointer-events:none;border-radius:999px;background:radial-gradient(circle at 35% 35%,#fff,#d9edff 75%);box-shadow:0 6px 14px rgba(30,90,160,.25),inset 0 -4px 6px rgba(150,190,230,.35)}
.hd-cloud::before,.hd-cloud::after{content:"";position:absolute;border-radius:50%;background:inherit}
.hd-cloud.c1{right:2%;top:16px;width:58px;height:22px}
.hd-cloud.c1::before{width:28px;height:28px;left:10px;top:-14px}
.hd-cloud.c1::after{width:20px;height:20px;left:30px;top:-8px}
.hd-cloud.c2{left:1.5%;top:58px;width:40px;height:16px;opacity:.85}
.hd-cloud.c2::before{width:20px;height:20px;left:7px;top:-10px}
.hd-cloud.c2::after{width:14px;height:14px;left:21px;top:-6px}
.hd-cloud.c3{right:6%;top:70px;width:34px;height:14px;opacity:.7}
.hd-cloud.c3::before{width:16px;height:16px;left:6px;top:-8px}
.hd-cloud.c3::after{width:12px;height:12px;left:17px;top:-5px}
.hd-spk{position:absolute;z-index:4;pointer-events:none;font-style:normal;color:#ffc93a;text-shadow:0 0 6px rgba(255,200,60,.9)}
.hd-spk.k1{left:3%;top:18px;font-size:16px}
.hd-spk.k2{right:1.5%;top:120px;font-size:13px}
body.eh .news h3{background:linear-gradient(180deg,#ffbf3a,#ff9500);border-radius:999px;padding:7px 16px;box-shadow:inset 0 2px 0 rgba(255,255,255,.65),inset 0 -3px 0 rgba(180,90,0,.35),0 4px 10px rgba(255,140,0,.35);text-shadow:0 1px 0 rgba(150,70,0,.35);font-weight:700}
:root.eh body.eh .tk li{background:linear-gradient(160deg,rgba(255,255,255,.92),rgba(255,255,255,.72));border:1px solid rgba(255,255,255,.85);border-radius:20px;box-shadow:inset 0 1px 0 #fff,0 10px 24px rgba(30,80,140,.14);-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);transition:transform .2s,box-shadow .2s,border-color .2s}
:root.eh body.eh .tk li:hover{transform:translateY(-3px);border-color:rgba(120,190,255,.95);box-shadow:inset 0 1px 0 #fff,0 0 0 3px rgba(120,190,255,.3),0 14px 28px rgba(30,100,190,.22)}
body.eh .wrap{padding-top:18px}
@media (max-width:1480px){
  .hd-cloud,.hd-spk{display:none}
}
@media (max-width:900px){
  .hg{grid-template-columns:minmax(0,1fr)!important}
  .hg>*{min-width:0}
  .hg .logo img{max-width:100%;height:auto;max-height:40px}
  :root.eh .tk{min-width:0;flex:1}
  :root.eh .tk li{max-width:100%}
  body.eh .hd::after{bottom:-18px;height:20px}
  body.eh .wrap{padding-top:6px}
  h2.ttl{white-space:nowrap;font-size:20px;letter-spacing:1px;margin:14px 0 12px}
  h2.ttl em{font-size:16px}
}
@media (max-width:560px){
  .grid{grid-template-columns:1fr 1fr!important;gap:18px 10px}
  .obj{height:150px!important;--h:150px!important}
  body.eh .lab{padding:7px 6px 8px;border-radius:14px;width:100%}
  body.eh .lab b{font-size:15px;letter-spacing:0;white-space:normal;line-height:1.25}
  body.eh .lab span{display:none}
  body.eh .lab b{font-size:14.5px}
  .hg .eh-nav{gap:10px!important;font-size:12.5px!important}
  .eh-nav select{max-width:96px;font-size:11px!important;padding:2px 4px}
  body.eh .lab{min-height:56px;display:flex;align-items:center;justify-content:center}
  .eh-nav .out{font-size:12px!important}
  .eh-nav .out i{width:22px!important;height:22px!important;font-size:11px!important}
  body.eh .hd::after{bottom:-14px;height:16px}
  .item:hover .obj,.item.go .obj{transform:translateY(-6px) scale(1.04)}
}
@media (min-width:901px) and (max-width:1200px){
  :root.eh .tk ul{grid-template-columns:repeat(2,1fr)!important}
  :root.eh .tk li:nth-child(n+3){display:none}
}
.burger{display:none}
@media (max-width:700px){
  .burger{display:flex;flex-direction:column;justify-content:center;gap:5px;position:absolute;right:14px;top:12px;z-index:6;width:44px;height:40px;padding:0 11px;border:1px solid rgba(255,255,255,.85);border-radius:12px;background:linear-gradient(160deg,rgba(255,255,255,.9),rgba(255,255,255,.65));box-shadow:0 4px 12px rgba(30,80,140,.18);cursor:pointer}
  .burger i{display:block;height:2.5px;border-radius:2px;background:#1c3354}
  .hg .eh-nav{display:none!important}
  :root.eh .hg .news{display:flex!important;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 0!important;margin:4px 0 2px!important;padding:0!important;background:none!important;border-radius:0!important}
  :root.eh .news h3{font-size:11px!important;padding:3px 10px!important;letter-spacing:1.5px}
  :root.eh .news .more{display:block!important;font-size:12.5px!important;align-self:center}
  :root.eh .tk{order:3;flex:0 0 calc(100% + 28px);height:auto!important;overflow-x:auto!important;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding:0 14px;scrollbar-width:none;margin:0 -14px;padding:2px 14px 5px;width:auto!important;max-width:none!important}
  :root.eh .tk::-webkit-scrollbar{display:none}
  .wrap.box{padding-top:2px!important}
  h2.ttl{margin-top:4px!important}
  :root.eh .tk ul{display:flex!important;gap:10px!important;transform:none!important}
  :root.eh .tk li{flex:0 0 68%;height:auto!important;white-space:normal!important;background:rgba(255,255,255,.82)!important;border-radius:14px!important;padding:9px 12px!important;box-shadow:0 4px 12px rgba(30,90,160,.12)!important;display:-webkit-box!important;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:13px!important;line-height:1.4!important;scroll-snap-align:start;max-height:none!important}
  :root.eh .tk li b{display:block!important;font-size:12px!important;margin:0 0 2px}
  body.menu-open .hg .eh-nav{display:flex!important;position:absolute;top:60px;right:12px;z-index:20;width:min(250px,calc(100vw - 24px));flex-direction:column;align-items:stretch;gap:0!important;padding:10px!important;font-size:15px!important;white-space:nowrap;background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid #fff;border-radius:18px;box-shadow:0 18px 40px rgba(20,60,120,.28);animation:mnu .18s ease-out}
  @keyframes mnu{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
  body.menu-open .eh-nav select{max-width:none!important;width:100%;height:38px;margin:0 0 6px;padding:0 10px!important;font-size:14px!important;border-radius:10px;border:1px solid #d5e4f4;background:#f3f8ff}
  body.menu-open .eh-nav a{display:flex!important;flex-direction:row!important;align-items:center;gap:12px!important;padding:11px 8px!important;border-radius:12px;color:#17305a;font-size:15px!important;border-top:1px solid rgba(23,48,90,.08)}
  body.menu-open .eh-nav a:active{background:#e8f2ff}
  body.menu-open .eh-nav a::after{content:"›";margin-left:auto;font-size:20px;line-height:1;color:#9db3cc}
  body.menu-open .eh-nav a svg{display:block;width:30px;height:30px;padding:6px;flex:none;border-radius:9px;background:#e8f2ff;color:#2482e0}
  body.menu-open .eh-nav .out{color:#d9534f;margin-top:4px}
  body.menu-open .eh-nav .out i{display:none}
  body.menu-open .eh-nav .out svg{background:#fdecec;color:#d9534f}
  body.menu-open .eh-nav .out::after{display:none}
  body.menu-open .burger i{transition:transform .2s,opacity .2s}
  body.menu-open .burger i:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
  body.menu-open .burger i:nth-child(2){opacity:0}
  body.menu-open .burger i:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
  .hg .logo{padding:10px 60px 8px 0}
  .hg .logo img{max-height:34px}
  body.eh .hd::after{bottom:-12px;height:14px}
  h2.ttl{font-size:18px!important;margin:12px 0 10px!important}
  .side{gap:6px!important;padding:2px 0 6px!important}
  .side a{flex:0 0 auto;padding:6px 10px!important;font-size:13px!important;line-height:1.25;border-radius:12px!important;white-space:normal;width:66px;justify-content:flex-start;text-align:center!important;font-size:12px!important;padding:6px 4px 7px!important;align-items:center;flex-direction:column;gap:3px!important}
  .side a img{width:28px!important;height:28px!important}
  .side a em em{display:block}
  .grid{grid-template-columns:repeat(3,1fr)!important;gap:12px 8px!important}
  .obj{height:104px!important;--h:104px!important}
  body.eh .lab{min-height:34px!important;margin-top:-2px;padding:4px 3px 5px!important;border-radius:10px!important}
  body.eh .lab b{font-size:11.5px!important;white-space:normal;line-height:1.2}
  body.eh .lab span{display:none}
  .item:hover .obj,.item.go .obj,.item:active .obj{transform:none!important}
  .eh-row{gap:10px!important}
}
.side a em{font-style:normal}
.eh-nav a svg{display:none}
html:not([lang="zh-TW"]) .hide-when-translated{display:none!important}
body.eh{line-height:normal;font-size:16px}
.grid .item{color:inherit}
.item .lyr{display:none}
.item.fx-ready .lyr{display:block}
.item.fx-ready .sim{display:none}
.side-m{display:none!important}
.wrap.box>.eh-row:first-child{margin-top:48px}
.tk li{cursor:pointer}
.tk li .nb{display:none}
.eh-nav .lang{display:flex;align-items:center;gap:6px}
.eh-nav .lang .fa{color:var(--blue-d)}
.eh-nav .gtranslate_wrapper{display:inline-block}
.eh-nav a{cursor:pointer}
.eh-help{position:relative;z-index:1;padding:10px 0 40px}
.eh-help .cards{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.eh-help .card-x{border-radius:20px;overflow:hidden;text-align:center;background:linear-gradient(160deg,rgba(255,255,255,.82),rgba(255,255,255,.55) 55%,rgba(255,255,255,.68));-webkit-backdrop-filter:blur(16px) saturate(170%);backdrop-filter:blur(16px) saturate(170%);border:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 10px 30px rgba(30,80,140,.16)}
.eh-help .card-x img{display:block;width:100%;height:190px;object-fit:contain;padding:14px 12px 0;filter:drop-shadow(0 10px 12px rgba(40,70,110,.18))}
.eh-help .card-x h4{margin:14px 12px 6px;font-family:var(--fr);font-weight:400;font-size:20px;color:#17305a}
.eh-help .card-x p{margin:0 16px 18px;font-size:14px;line-height:1.6;color:var(--sub)}
.eh-foot{position:relative;z-index:1;padding:22px 16px 30px;text-align:center;font-size:13px;line-height:1.8;color:#3a4f6e;background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,.85));-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid rgba(255,255,255,.8)}
.eh-foot a{color:var(--blue-d)}
.eh-foot p{margin:0 0 6px;font-weight:700}
#go-top{position:fixed;right:18px;bottom:96px;z-index:40;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;color:var(--blue-d);background:rgba(255,255,255,.9);box-shadow:0 6px 16px rgba(30,80,140,.25);opacity:0;pointer-events:none;transition:opacity .25s}
#go-top.show{opacity:1;pointer-events:auto}
#QA{cursor:pointer}
@media (max-width:900px){.eh-help .cards{grid-template-columns:repeat(2,1fr);gap:14px}}
@media (max-width:700px){
  .side-pc{display:none!important}
  .side-m{display:flex!important}
  .wrap.box>.eh-row:first-child{margin-top:22px}
  body.menu-open .eh-nav .lang{width:100%;padding:0 0 6px}
  body.menu-open .eh-nav .gtranslate_wrapper{flex:1}
  body.menu-open .eh-nav .lang .fa{display:none}
  body.menu-open .eh-nav .out.in{color:#2482e0}
  body.menu-open .eh-nav .out.in svg{background:#e8f2ff;color:#2482e0}
  .eh-help .card-x img{height:130px;padding:10px 8px 0}
  .eh-help .card-x h4{font-size:16px;margin:10px 8px 4px}
  .eh-help .card-x p{font-size:12.5px;margin:0 10px 12px}
  #go-top{right:12px;bottom:84px;width:38px;height:38px}
}
.grid>.item{min-width:0}
@media (min-width:901px){
  :root.eh .tk li{display:block}
  .tk li .t{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;-webkit-line-clamp:2}
}
@media (max-width:700px){
  :root.eh .tk li{display:block!important}
  .tk li .t{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;-webkit-line-clamp:2}
}
:is(html:not([lang="zh-TW"]),html.translated-ltr,html.translated-rtl) body.eh .item .lab{flex:1 0 auto;display:flex;flex-direction:column;justify-content:center}
:is(html:not([lang="zh-TW"]),html.translated-ltr,html.translated-rtl) body.eh .lab b{white-space:normal;line-height:1.25;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;-webkit-line-clamp:2}
@media (min-width:701px){
  :is(html:not([lang="zh-TW"]),html.translated-ltr,html.translated-rtl) body.eh .lab b{font-size:18px;letter-spacing:.5px}
  :is(html:not([lang="zh-TW"]),html.translated-ltr,html.translated-rtl) body.eh .lab span{white-space:normal;line-height:1.4;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;-webkit-line-clamp:2}
}
@media (max-width:700px){
  :is(html:not([lang="zh-TW"]),html.translated-ltr,html.translated-rtl) body.eh .lab b{-webkit-line-clamp:3}
}
@media (max-width:900px){
  .wrap.box>.eh-row{align-items:stretch}
  .eh-row>.main{width:100%}
}
@media (min-width:701px) and (max-width:900px){
  .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 14px}
  .obj{height:180px;--h:180px}
  body.eh .lab{padding:9px 8px 10px}
  body.eh .lab b{font-size:17px;letter-spacing:.5px}
  body.eh .lab span{font-size:12px;white-space:normal;line-height:1.4}
}
@media (max-width:700px){
  .obj{height:clamp(104px,21vw,150px)!important;--h:clamp(104px,21vw,150px)!important}
  body.eh .lab b{font-size:clamp(11.5px,2.1vw,14px)!important}
}
@media (min-width:521px) and (max-width:700px){
  .side-m a{flex:1 1 0;width:auto;min-width:0}
}
@media (min-width:701px) and (max-width:900px){
  :root.eh .hg .news{display:flex!important;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 0!important;margin:4px 0 2px!important;padding:0!important;background:none!important;border-radius:0!important}
  :root.eh .news h3{font-size:11px!important;padding:3px 10px!important;letter-spacing:1.5px}
  :root.eh .news .more{display:block!important;font-size:12.5px!important;align-self:center}
  :root.eh .tk{order:3;flex:0 0 calc(100% + 28px);height:auto!important;overflow-x:auto!important;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding:0 14px;scrollbar-width:none;margin:0 -14px;padding:2px 14px 5px;width:auto!important;max-width:none!important}
  :root.eh .tk::-webkit-scrollbar{display:none}
  :root.eh .tk ul{display:flex!important;gap:10px!important;transform:none!important}
  :root.eh .tk li{flex:0 0 68%;height:auto!important;white-space:normal!important;background:rgba(255,255,255,.82)!important;border-radius:14px!important;padding:9px 12px!important;box-shadow:0 4px 12px rgba(30,90,160,.12)!important;display:-webkit-box!important;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:13px!important;line-height:1.4!important;scroll-snap-align:start;max-height:none!important}
  :root.eh .tk li b{display:block!important;font-size:12px!important;margin:0 0 2px}
}
@media (max-width:900px){
  :root.eh .tk li{display:block!important;flex:0 0 min(58%,240px);padding:6px 10px!important;font-size:12.5px!important}
  :root.eh .tk li b{font-size:11.5px!important;margin:0}
  .tk li .t{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;-webkit-line-clamp:1}
}
.sc-wrap{display:contents}
.sc-btn{display:none;position:absolute;top:50%;z-index:3;width:28px;height:28px;margin-top:-14px;padding:0 0 3px;align-items:center;justify-content:center;border:1px solid #fff;border-radius:50%;background:rgba(255,255,255,.95);color:#1d6fc4;font:700 22px/1 sans-serif;box-shadow:0 3px 10px rgba(30,80,140,.28);cursor:pointer;transition:opacity .2s}
.sc-prev{left:0}
.sc-next{right:0}
.sc-wrap.at-start .sc-prev,.sc-wrap.at-end .sc-next{opacity:.3;pointer-events:none;box-shadow:none}
@media (max-width:900px){
  .sc-wrap.sc-side{display:block;position:relative;width:100%;min-width:0}
  .sc-wrap.sc-side>.side{padding-left:30px!important;padding-right:30px!important}
  .sc-wrap.sc-tk{display:block;position:relative;min-width:0;order:3;flex:0 0 100%}
  :root.eh .sc-wrap>.tk{margin:0!important;flex:none;width:100%!important;padding:2px 30px 5px!important;scroll-padding:0 30px}
  .sc-wrap .sc-btn{display:flex}
  .sc-wrap.sc-side:not(.no-scroll)>.side,.sc-wrap.sc-tk:not(.no-scroll)>.tk{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30px,#000 calc(100% - 30px),transparent);mask-image:linear-gradient(90deg,transparent 0,#000 30px,#000 calc(100% - 30px),transparent)}
}
@media (max-width:700px){
  .sc-wrap.sc-pc{display:none}
}
@media (min-width:701px){
  .sc-wrap.sc-m{display:none}
}
.sc-wrap.no-scroll .sc-btn{display:none!important}
.sc-wrap.no-scroll>.side{padding-left:0!important;padding-right:0!important}
