@import url(https://fonts.googleapis.com/css2?family=Dela+Gothic+One&family=Noto+Sans+TC:wght@100..900&display=swap);a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;vertical-align:middle}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1;position:relative;overflow-x:hidden}button,ol,ul{list-style:none;margin:0;padding:0}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}:focus,a:active,a:focus,a:hover,button:focus{text-decoration:none;outline:0}a,button{background:0 0;font-size:0;padding:0;margin:0}img{max-width:100%;height:auto}.tab-content>.tab-pane{height:0;display:block;opacity:0;pointer-events:none}.tab-content>.active{height:auto;opacity:1;pointer-events:auto}.nav-link{padding:0}h3{font-weight:700;font-size:28px;line-height:1.4;text-align:center;color:#fff;margin-bottom:10px}@media only screen and (max-width:767px){h3{font-size:22px}}li,p{font-weight:400;font-size:20px;line-height:180%;text-align:center;color:#fff}@media only screen and (max-width:767px){li,p{font-size:16px}}.orange{color:#f55921;vertical-align:baseline}.green{color:#af0;vertical-align:baseline}body{color:#fff;font:"Noto Sans TC",sans-serif;font-weight:200;background-color:#000;min-height:100vh;display:flex;flex-direction:column}p{margin:0}img{max-width:100%;height:auto}main.wrapper{flex:1 0 auto;overflow:hidden}#header{position:relative;background:url(../images/mainBg.jpg) no-repeat 80% 0;background-size:cover;height:1144px;overflow:hidden}@media only screen and (max-width:991px){#header{height:900px;background-position-x:86.5%}}#header .title{position:absolute;max-width:760px;min-width:320px;left:50%;transform:translateX(-50%);top:120px;z-index:5;text-align:center;display:flex;flex-direction:column}@media only screen and (max-width:767px){#header .title{width:75%;top:141px;left:39%}}#header .title h1{position:relative;z-index:5}#header .title .login-wrap{display:flex;flex-direction:column;margin-top:-40px;align-items:center}@media only screen and (max-width:767px){#header .title .login-wrap{align-items:start;margin-top:0;padding-left:40px}}#header .title .login-wrap a{position:relative;transition:.5s linear}@media only screen and (max-width:767px){#header .title .login-wrap a{display:none}}#header .title .login-wrap a .download{transition:.3s all}#header .title .login-wrap a .download.active,#header .title .login-wrap a .download:hover{filter:invert(1)}#header .title .login-wrap .arrow{display:inline-block;margin-top:-40px;width:28px;z-index:10;animation:scroll 1.5s ease-in-out infinite}@keyframes scroll{0%{transform:translateY(0)}50%{transform:translateY(10px)}100%{transform:translateY(0)}}.main-content{position:relative}.main-content::before{content:"";position:absolute;top:-100px;left:50%;transform:translateX(-50%);width:100%;max-height:327px;height:20vw;background:url(../images/gap.png) no-repeat center center;background-size:contain;z-index:2;pointer-events:none}@media only screen and (max-width:767px){.main-content::before{width:767px;top:-70px;height:140px}}.topBar{position:absolute;background-size:cover;min-height:100px;top:70px;left:50%;transform:translateX(-50%);z-index:3}@media only screen and (max-width:1200px){.topBar{width:100%;position:relative;top:0}}.topBar ul.nav{display:flex;margin:0 auto;max-width:1200px;gap:8px;flex-wrap:nowrap}@media only screen and (max-width:1200px){.topBar ul.nav{flex-wrap:wrap;gap:0;justify-content:center}}.topBar ul.nav li{text-align:center;font-weight:700}@media only screen and (max-width:1200px){.topBar ul.nav li{width:50%}}.topBar ul.nav li a{display:block;color:#fff;font-size:36px;padding:24px 40px;gap:10px;background:#000;border:8px solid #000;transform:matrix(1,0,-.21,.98,0,0);white-space:nowrap;transition:.3s;font-family:"Dela Gothic One",sans-serif;background-position:top left;font-weight:400;font-style:normal}.topBar ul.nav li a.active,.topBar ul.nav li a:hover{background:url(../images/tab-tex.png),#f55921;background-blend-mode:color-dodge,normal;background-size:cover;background-position:center center;border:8px solid #000;color:#000}@media only screen and (max-width:1200px){.topBar ul.nav li a{font-size:28px;padding:8px;letter-spacing:1px;transform:none;white-space:normal;height:100%;display:flex;align-items:center;justify-content:center}}.main-content{position:relative;z-index:1;text-align:center}.main-content .tab-content{overflow:hidden;width:100%}.main-content #s1{background:linear-gradient(0deg,rgba(0,0,0,.6),rgba(0,0,0,.6)),url(../images/BG-01.jpg) no-repeat center center;background-size:cover}.main-content #s2{background:linear-gradient(0deg,rgba(0,0,0,.6),rgba(0,0,0,.6)),url(../images/BG-02.jpg) no-repeat center center;background-size:cover}.main-content #s3{background:linear-gradient(0deg,rgba(0,0,0,.6),rgba(0,0,0,.6)),url(../images/BG-03.png) no-repeat center center;background-size:cover}.main-content #s4{background:linear-gradient(0deg,rgba(0,0,0,.6),rgba(0,0,0,.6)),url(../images/BG-04.png) no-repeat center center;background-size:cover}.main-content #s1,.main-content #s2,.main-content #s3,.main-content #s4{padding-top:180px;display:flex;flex-direction:column}@media only screen and (max-width:1200px){.main-content #s1,.main-content #s2,.main-content #s3,.main-content #s4{padding-top:40px}}.main-content h3{position:relative}.main-content .content{display:flex;gap:0;justify-content:center}@media only screen and (max-width:1200px){.main-content .content{flex-direction:column;align-items:center;gap:8px}}.main-content .content .tabBtn_content{display:flex;flex-direction:column;gap:8px;margin-top:40px;z-index:10}@media only screen and (max-width:1200px){.main-content .content .tabBtn_content{margin-top:0}}.main-content .content .tabBtn_content li{margin:0 0 0 auto}@media only screen and (max-width:1200px){.main-content .content .tabBtn_content li{margin:auto}}.main-content .content .tabBtn_content li a{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:12px 32px;background:#000;border:8px solid #000;font-weight:900;font-size:24px;line-height:29px;color:#fff;position:relative;transition:.3s}.main-content .content .tabBtn_content li a.active,.main-content .content .tabBtn_content li a:hover{background:url(../images/tab-tex-02.png) 9% 26%,#af0 center center;color:#000}.main-content .content .tabBtn_content li a.active{transition:.3s}.main-content .content .tabBtn_content li a.active::before{content:"";position:absolute;top:50%;left:-50px;transform:translateY(-50%);width:86px;height:120px;background:url(../images/tab-deco.png) center center no-repeat;background-size:contain;opacity:1;transition:.3s}@media only screen and (max-width:1200px){.main-content .content .tabBtn_content li a.active::before{width:60px;height:80px;left:-32px}}.main-content .content .blackBg{max-width:1080px;width:100%;display:flex;flex-direction:column;align-items:center;padding:80px 120px;gap:40px;background:rgba(0,0,0,.8);border:8px solid #000;backdrop-filter:blur(5px);position:relative;z-index:1}@media only screen and (max-width:767px){.main-content .content .blackBg{width:93%;padding:12px}}.main-content .content .blackBg::before{content:"";position:absolute;bottom:0;right:-20%;background:url(../images/s1-deco.png) no-repeat center center;width:333px;height:838px}@media only screen and (max-width:1440px){.main-content .content .blackBg::before{display:none}}.main-content .content .blackBg .tab-content .tab-pane{display:flex;flex-direction:column;gap:40px}@media only screen and (max-width:767px){.main-content .content .blackBg .tab-content .tab-pane{gap:28px}}.main-content .content .blackBg .tab-content .tab-pane .detail{display:flex;flex-direction:column;gap:40px}@media only screen and (max-width:767px){.main-content .content .blackBg .tab-content .tab-pane .detail{gap:28px}}.main-content .noticeWrap{margin-top:80px;padding:40px 0 80px;background:linear-gradient(180deg,rgba(0,0,0,0) 0,#000 100%)}@media only screen and (max-width:1200px){.main-content .noticeWrap{margin-top:5vh}}.main-content .noticeWrap .noticeContent{padding:5vh 2vw;max-width:740px;margin:0 auto;z-index:11;text-align:left;color:#fff;font-weight:700;line-height:30px;font-size:18px}@media only screen and (max-width:767px){.main-content .noticeWrap .noticeContent{padding:0 20px}}.main-content .noticeWrap .noticeContent h2{text-align:center;margin-bottom:20px}.main-content .noticeWrap .noticeContent ul{font-size:22px;margin-left:24px}.main-content .noticeWrap .noticeContent ul li{font-size:20px;list-style:disc;text-align:left;margin-bottom:8px}@media only screen and (max-width:767px){.main-content .noticeWrap .noticeContent ul li{font-size:16px;list-style:disc}}@keyframes move{0%,100%{transform:translate(0,0)}50%{transform:translate(0,30px)}}#ft{position:relative;background:#181818;padding:15px 0 35px;margin:0 auto;width:100%;z-index:1}#ft>div{max-width:unset}#ft .copyright{display:flex;align-items:center;flex-wrap:nowrap;list-style-type:none;font-size:12px;line-height:1.6;font-weight:300;color:#fff;margin:0;padding:0;justify-content:center;width:100%;gap:40px}@media only screen and (max-width:767px){#ft .copyright{flex-direction:column;gap:20px}}#ft .copyright li{margin:0;vertical-align:top;line-height:1.6;display:flex;font-size:12px;gap:12px;text-align:left}#ft .copyright li:last-child{line-height:1.6;align-items:center}.sideBtn{position:fixed;z-index:21;left:40px;bottom:40px;text-align:center}@media only screen and (max-width:767px){.sideBtn{left:unset;right:4px;bottom:4px;top:unset}}.sideBtn ul{padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}.sideBtn ul li{margin:0}@media only screen and (max-width:767px){.sideBtn ul li:nth-child(2){display:none}}.sideBtn ul li a{display:block;padding:0;max-width:150px;text-align:center;text-decoration:none;background-repeat:no-repeat;background-position:0 0;background-size:contain;transition:.3s}.sideBtn ul li a.active,.sideBtn ul li a:hover{filter:brightness(1.2)}#s2 .blackBg::before{content:"";position:absolute;top:36px;right:-20%;background:url(../images/s2-deco.png) no-repeat center center;width:487px;height:663px}@media only screen and (max-width:1440px){#s2 .blackBg::before{display:none}}#s2 .blackBg::after{content:"";position:absolute;bottom:10%;left:-10%;background:url(../images/s2-3-deco.png) no-repeat center center;width:282px;height:284px}@media only screen and (max-width:1440px){#s2 .blackBg::after{display:none}}#s2 .blackBg .tab-content .tab-pane{gap:0}#s2 .blackBg #t21{overflow:visible}#s2 .blackBg #t21 h2{text-align:left}#s2 .blackBg #t21 .detail{margin-bottom:100px}@media only screen and (max-width:767px){#s2 .blackBg #t21 .detail{margin-bottom:40px}}#s2 .blackBg #t21 .detail .d-flex,#s2 .blackBg #t21 .story .d-flex{gap:12px}#s2 .blackBg #t21 .detail h3,#s2 .blackBg #t21 .detail p,#s2 .blackBg #t21 .story h3,#s2 .blackBg #t21 .story p{text-align:left}#s2 .blackBg #t21 .story{display:flex;gap:20px;overflow:visible}@media only screen and (max-width:767px){#s2 .blackBg #t21 .story{flex-direction:column;gap:40px}}#s2 .blackBg #t21 .story .alice{min-width:280px}#s2 .blackBg #t21 .story .desc{display:flex;flex-direction:column}#s2 .blackBg #t21 .story .desc .content{display:flex;flex-direction:column;gap:40px;margin-bottom:80px}@media only screen and (max-width:767px){#s2 .blackBg #t21 .story .desc .content{margin-bottom:40px}}#s2 .blackBg #t21 .story .desc .content .title{padding-left:24px;border-left:5px solid #f55921}#s2 .blackBg #t21 .story .desc .content .title h3{font-family:"Dela Gothic One";font-size:48px;color:#f55921;font-weight:400;line-height:1}#s2 .blackBg #t21 .story .desc .demo-position{display:flex;flex-direction:column;gap:12px}#s2 .blackBg #t21 .story .desc .demo-position .main-demo{position:relative}#s2 .blackBg #t21 .story .desc .demo-position .main-demo span{position:absolute;width:fit-content;background:#af0;color:#000;padding:4px 16px;font-size:20px;font-weight:700;left:50%;transform:translateX(-50%);white-space:nowrap;border-radius:8px;top:-12px}#s2 .blackBg #t21 .story .desc .demo-position .main-demo img{width:100%;border-radius:8px;border:4px solid #af0;overflow:hidden;max-height:390px}#s2 .blackBg #t21 .story .desc .demo-position .demo-btn{display:flex;gap:12px}#s2 .blackBg #t21 .story .desc .demo-position .demo-btn a{border-radius:8px;overflow:hidden;border:4px solid rgba(255,255,255,.2117647059);transition:.3s}#s2 .blackBg #t21 .story .desc .demo-position .demo-btn a.active,#s2 .blackBg #t21 .story .desc .demo-position .demo-btn a:hover{border-color:#af0}#s2 .blackBg #t22 .detail{margin-bottom:40px}#s3 .blackBg::before{content:"";position:absolute;top:0;right:-20%;background:url(../images/s3-deco.png) no-repeat center center;width:420px;height:603px}@media only screen and (max-width:1440px){#s3 .blackBg::before{display:none}}#s4 .blackBg{padding-top:40px}@media only screen and (max-width:767px){#s4 .blackBg{padding-top:20px}}#s4 .blackBg::before{content:"";position:absolute;top:15px;right:-14%;background:url(../images/s4-deco.png) no-repeat center center;width:311px;height:731px}@media only screen and (max-width:1440px){#s4 .blackBg::before{display:none}}#s4 .blackBg::after{content:"";position:absolute;bottom:15px;left:-14%;background:url(../images/s4-deco.png) no-repeat center center;width:311px;height:731px;transform:scaleX(-1)}@media only screen and (max-width:1440px){#s4 .blackBg::after{display:none}}#s4 .blackBg .char{display:none;order:-1}@media only screen and (max-width:1440px){#s4 .blackBg .char{display:inline-block}}.navbar{position:fixed;z-index:20;width:100%;left:auto;background-color:none;display:flex;justify-content:flex-end;top:0;right:0;padding:24px 40px;gap:12px}@media only screen and (max-width:991px){.navbar{padding:20px}}.navbar::before{content:"";position:fixed;top:0;left:0;width:100%;height:100dvh;border:20px solid #000;pointer-events:none}@media only screen and (max-width:991px){.navbar::before{border-width:10px}}.navbar::after{content:"";position:fixed;top:0;left:0;width:100%;height:100dvh;border-radius:60px;border:20px solid #000;pointer-events:none}@media only screen and (max-width:991px){.navbar::after{border-width:10px;border-radius:30px}}.navbar .bg-container{position:fixed;bottom:7px;left:4px;width:129px;height:463px;background:url(../images/aside.svg) no-repeat 0 0}@media only screen and (max-width:991px){.navbar .bg-container{display:none}}.navbar .bg-container2{position:fixed;top:4px;right:11px;width:331px;height:105px;background:url(../images/aside2.svg) no-repeat 0 0;z-index:-1}@media only screen and (max-width:991px){.navbar .bg-container2{display:none}}.navbar .navbar-brand{position:absolute;left:60px;top:60px;margin:0;padding:0}@media only screen and (max-width:991px){.navbar .navbar-brand{left:24px;top:24px;max-width:180px}}.navbar .navbar-toggler{background:#000;border-radius:500px;align-items:flex-end;width:48px;height:48px}.navbar .navbar-toggler span{display:block;width:20px;height:2px;background-color:#fff;border-radius:2px;margin:4px auto;transition-duration:.3s}.navbar .navbar-toggler.active span:nth-child(1){transform:rotate(45deg) translate(4px,5px)}.navbar .navbar-toggler.active span:nth-child(2){opacity:0}.navbar .navbar-toggler.active span:nth-child(3){transform:rotate(-45deg) translate(3px,-5px)}.navbar .navbar-collapse .navbar-nav{display:flex;align-content:flex-end;flex-wrap:wrap;gap:4px}.navbar .navbar-collapse .navbar-nav .nav-link{padding:0;transition:.3s}@media only screen and (max-width:767px){.navbar .navbar-collapse .navbar-nav .nav-link{width:48px;height:48px}}.navbar .navbar-collapse .navbar-nav .nav-link:hover{filter:invert(1)}@keyframes blink{0%,100%{filter:brightness(10);opacity:1}50%{opacity:0}}@keyframes blink2{0%,100%{filter:brightness(3);opacity:1}60%{opacity:0}}@keyframes blink3{0%,100%{filter:brightness(5);opacity:1}60%{opacity:.7}}