@charset "UTF-8";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%;font:inherit;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}body::-webkit-scrollbar{width:0;background:0 0}button,ol,ul{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{border:none;font-size:unset;padding:0;margin:0;background:0 0;background-color:none;outline:0;border:none}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-pills .nav-link,.nav-pills a.nav-link,.nav-pills a.nav-link.active,.nav-tabs .nav-link,.nav-tabs a.nav-link,.nav-tabs a.nav-link.active{padding:0;background:0 0;background-color:none}.tab-pane{display:none}.tab-pane.active{display:block}@font-face{font-family:SWEI;src:url(../font/SweiB2SerifCJKtc-Medium.ttf)}body{background-color:#fefef4;font-family:SWEI}.sideBtn{position:fixed;z-index:9;top:0;left:0;height:100vh;transition:1s all;background:linear-gradient(to right,#000,#00000000);padding:6% 0 0 20px}@media only screen and (max-width:768px){.sideBtn{padding-top:10%}}@media only screen and (max-width:480px){.sideBtn{padding-top:20%}}.sideBtn.off{left:-250px}.sideBtn .btn-on{background:#24324794;width:30px;height:100px;position:absolute;right:-30px;top:50%;transform:translateY(-50%);border-radius:0 10px 10px 0;display:none}@media only screen and (max-width:1440px){.sideBtn .btn-on{display:block}}.sideBtn .btn-on.open a{display:block;background:url(//landing.mangot5.com/template/gj/event/nav_bootstrap4/images/toggleSide.png) no-repeat center center;background-size:contain}.sideBtn .btn-on.open a img{opacity:0}.sideBtn ul{display:flex;flex-direction:column;align-items:flex-start;list-style:none}.sideBtn ul li:nth-of-type(1){margin:0 0 -4% 20%}.sideBtn ul li:nth-of-type(1) a.active,.sideBtn ul li:nth-of-type(1) a:hover{background:url(../images/s00.png) no-repeat center center;background-size:contain}.sideBtn ul li:nth-of-type(2) a.active,.sideBtn ul li:nth-of-type(2) a:hover{background:url(../images/s11.png) no-repeat center center;background-size:contain}.sideBtn ul li:nth-of-type(3) a.active,.sideBtn ul li:nth-of-type(3) a:hover{background:url(../images/s22.png) no-repeat center center;background-size:contain}.sideBtn ul li:nth-of-type(4) a.active,.sideBtn ul li:nth-of-type(4) a:hover{background:url(../images/s33.png) no-repeat center center;background-size:contain}.sideBtn ul li:nth-of-type(5) a.active,.sideBtn ul li:nth-of-type(5) a:hover{background:url(../images/s44.png) no-repeat center center;background-size:contain}.sideBtn ul li:nth-of-type(6) a.active,.sideBtn ul li:nth-of-type(6) a:hover{background:url(../images/s55.png) no-repeat center center;background-size:contain}.sideBtn ul li:nth-of-type(7) a.active,.sideBtn ul li:nth-of-type(7) a:hover{background:url(../images/s66.png) no-repeat center center;background-size:contain}.sideBtn ul li a{display:block;padding:0;margin:4% 0}.sideBtn ul li a.active img,.sideBtn ul li a:hover img{opacity:0}#main{position:relative;background:url(../images/main.jpg) no-repeat center center;background-size:cover;padding-top:60px;min-height:120vh;overflow:hidden}@media only screen and (max-width:1200px){#main{min-height:100vh}}#main .main{position:absolute;right:0;bottom:0}@media only screen and (max-width:1440px){#main .main{right:-10%}}@media only screen and (max-width:1200px){#main .main{top:0;right:-30%}}@media only screen and (max-width:480px){#main .main{top:10%}}#main .main::before{content:'';width:891px;height:846px;background:url(../images/arms.png) no-repeat center center;background-size:contain;position:absolute;right:0;-webkit-animation:moveTop 3s ease-in-out alternate infinite;animation:moveTop 3s ease-in-out alternate infinite}@media only screen and (max-width:480px){#main .main::before{display:none}}#main .logo{position:absolute;top:10vh;left:16vw}@media only screen and (max-width:1200px){#main .logo{top:8vh;left:2vw}}@media only screen and (max-width:768px){#main .logo img{width:30vw}}#main .title{position:absolute;top:30vh;left:20vw;z-index:2}@media only screen and (max-width:1200px){#main .title{top:unset;bottom:2vh}}@media only screen and (max-width:480px){#main .title{left:0}}#main .title .link{text-align:center}#main .title .link a{display:inline-block;margin:6% 2%}@media only screen and (max-width:480px){#main .title .link a{margin:0 auto}}#main .title .link a:hover img{opacity:0}#main .title .link a:first-of-type:hover{background:url(../images/btn11.png) no-repeat center center;background-size:contain}#main .title .link a:last-of-type:hover{background:url(../images/btn22.png) no-repeat center center;background-size:contain}.bg-video{width:100%;visibility:hidden;position:absolute;top:0;left:0}.bg-canvas{position:absolute;top:0;left:0;width:100%;height:100%;opacity:.4;mix-blend-mode:screen}section{position:relative;overflow-x:hidden;background-color:#000;background:url(../images/bg.jpg) no-repeat center center;background-size:cover;background-attachment:fixed;text-align:center;color:#fff;overflow-y:hidden}section h2{position:relative;margin:6vh 0 2vh;text-align:center}@media only screen and (max-width:1200px){section h2 img{max-width:98vw}}section p{line-height:2rem;margin:4vh 0}@media only screen and (max-width:480px){section p{font-size:20px}}section>div{position:relative;min-height:100vh;padding:2vh 0}section ul.note{color:#c2c2c2;font-size:1rem;line-height:1.6rem;margin-top:4vh;list-style:inside}@media only screen and (max-width:480px){section ul.note{font-size:16px;line-height:20px}}section ul.note li:first-of-type{margin-top:1.2vh}section ul.note li::marker{content:"※"}section #s1{text-align:right}@media only screen and (max-width:1440px){section #s1{text-align:center}}@media only screen and (max-width:1440px){section #s1 .char{max-width:60vw;margin-right:-20vw}}@media only screen and (max-width:768px){section #s1 .char{max-width:unset;margin-right:unset}}section .char,section .ctn-1{display:inline-block}section .ctn-1{position:relative;max-width:500px;z-index:2;margin:-20vh -4% 0 0}@media only screen and (max-width:1440px){section .ctn-1{max-width:30vw;margin:0 -10% 0 0}}@media only screen and (max-width:768px){section .ctn-1{max-width:unset;margin:unset}}section .ctn-1 .skill{display:flex;justify-content:center;align-items:center;margin-top:3%}section .ctn-1 .skill .skillTab{flex-direction:column;margin-right:3%}section .ctn-1 .skill .skillTab a:first-of-type{margin-bottom:-20%}section .ctn-1 .skill .skillTab a.active img,section .ctn-1 .skill .skillTab a:hover img{opacity:0}section .ctn-1 .skill .skillTab a.active:first-of-type,section .ctn-1 .skill .skillTab a:hover:first-of-type{background:url(../images/c1tab11.png) no-repeat center center;background-size:contain}section .ctn-1 .skill .skillTab a.active:last-of-type,section .ctn-1 .skill .skillTab a:hover:last-of-type{background:url(../images/c1tab22.png) no-repeat center center;background-size:contain}section .ctn-1 .sect{max-width:300px;margin-left:auto;margin-right:10%}section .ctn-1 .sect button{margin:0 .8%}section .ctn-1 .sect button:hover img{opacity:0}section .ctn-1 .sect button:hover:nth-of-type(1){background:url(../images/sect11.png) no-repeat center center;background-size:contain}section .ctn-1 .sect button:hover:nth-of-type(2){background:url(../images/sect22.png) no-repeat center center;background-size:contain}section .ctn-1 .sect button:hover:nth-of-type(3){background:url(../images/sect33.png) no-repeat center center;background-size:contain}section .ctn-2{display:flex;justify-content:center;margin-top:6vh}@media only screen and (max-width:1200px){section .ctn-2{flex-wrap:wrap}}section .ctn-2>div{display:inline-block;max-width:883px}section .ctn-2>div:not(#slick-area2){background:linear-gradient(to right,#0000008a,#00000000);max-width:300px;max-height:494px;text-align:left;padding:2rem 1rem}@media only screen and (max-width:1200px){section .ctn-2>div:not(#slick-area2){max-width:883px}}section .ctn-2>div:not(#slick-area2) h5,section .ctn-2>div:not(#slick-area2) p{color:#d4ecff}section .ctn-2>div:not(#slick-area2) h5{font-size:1.8rem;margin:2vh 0 0}section .ctn-2>div:not(#slick-area2) p{font-size:.9rem;font-weight:lighter;line-height:1.2rem;margin:1vh 0}section .ctn-3{display:flex;flex-wrap:wrap;justify-content:center;max-width:1200px;margin:6vh auto 0 auto}section .ctn-3 img{margin:.6vw}section #s4{overflow:hidden;padding:0}section #s4 h2{position:absolute;left:50%;top:30%;transform:translateX(-50%)}section #s4 .vtxt{background-color:#0e1933c4;width:100%;height:180px;text-align:center;position:absolute;bottom:14%;display:flex;align-items:flex-end}@media only screen and (max-width:1200px){section #s4 .vtxt{bottom:10%}}@media only screen and (max-width:350px){section #s4 .vtxt{height:200px;bottom:8%}}section #s4 .vtxt p{max-width:1200px;margin:0 auto 1% auto;color:#e3ebff;line-height:1.4rem;font-size:.9rem;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;overflow:hidden}@media only screen and (max-width:1200px){section #s4 .vtxt p{max-width:98vw}}section #s4 .video-bg{min-width:100%;min-height:100%}section #pic{justify-content:center}section #pic a{width:120px;height:40px;font-size:1.2rem;line-height:40px;background-color:#00000080;color:#8f8f8f;border-radius:0;margin:2vh .4vw}section #pic a.active,section #pic a:hover{background-color:#90909080;color:#fff;text-shadow:0 0 10px #fff,0 0 10px #fff}#event{justify-content:center;margin:6vh auto 4vh auto;background:linear-gradient(to right,#03141f00,#03141f,#03141f00);max-width:1400px;min-height:60px}#event a{display:block;width:130px;height:100%;color:#8ba0b4;border-radius:0;line-height:20px;padding:10px 0}#event a.active,#event a:hover{background-color:#7f9bef;color:#fff}.grid_ctn{display:-ms-grid;display:grid;place-content:center;grid-auto-rows:40px;margin:0 auto;grid-gap:1px;max-width:600px}.grid_ctn div{background-color:#3d4e67a6;outline:1px solid #7d96b3;display:flex;flex-wrap:wrap;justify-content:center;align-content:center}.grid_ctn div.thead{background-color:#24324794;color:#c2c2c2;font-size:1.2rem}#tab-1{position:relative}#tab-1::before{content:'';width:773px;height:756px;background:url(../images/c6.png) no-repeat center center;background-size:contain;position:absolute;right:0}@media only screen and (max-width:1200px){#tab-1::before{display:none}}#tab-2 .grid_ctn{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2,1fr)}#tab-2 .grid_ctn .store{color:#7f9bef}#tab-2 .grid_ctn div:nth-of-type(7){-ms-grid-row:4;-ms-grid-row-span:2;grid-row:4/6}#tab-2 .grid_ctn div:nth-of-type(9){-ms-grid-row:6;-ms-grid-row-span:2;grid-row:6/8}#tab-4 .grid_ctn,#tab-6 .grid_ctn,#tab-9 .grid_ctn{-ms-grid-columns:1fr 2fr 1fr;grid-template-columns:1fr 2fr 1fr}#tab-6 .grid_ctn div:nth-of-type(4),#tab-6 .grid_ctn div:nth-of-type(5){-ms-grid-row:2;-ms-grid-row-span:2;grid-row:2/4}#tab-9 .grid_ctn div:nth-of-type(4){-ms-grid-row:2;-ms-grid-row-span:2;grid-row:2/4}#tab-9 .grid_ctn div:nth-of-type(9){-ms-grid-row:4;-ms-grid-row-span:2;grid-row:4/6}#tab-9 .grid_ctn div:nth-of-type(14){-ms-grid-row:6;-ms-grid-row-span:2;grid-row:6/8}#tab-9 .grid_ctn div:nth-of-type(19){-ms-grid-row:8;-ms-grid-row-span:2;grid-row:8/10}#tab-9 .grid_ctn div:nth-of-type(24){-ms-grid-row:10;-ms-grid-row-span:2;grid-row:10/12}#tab-9 .grid_ctn div:nth-of-type(29){-ms-grid-row:12;-ms-grid-row-span:2;grid-row:12/14}#sect3{color:#d4ecff}#sect3 h6{font-size:2rem}#sect3 p{line-height:1.4rem;margin-top:1vh;text-align:left}.modal{z-index:999;padding-top:10vh;background:url(../images/popbg.png) no-repeat center center;background-size:cover}@media only screen and (max-width:480px){.modal{padding-top:20vh}}.modal .modal-content{background:0 0;border:none}.modal .modal-dialog{max-width:1200px;pointer-events:auto}.modal .modal-body{text-align:center;padding:0}@media only screen and (max-width:1200px){.modal .modal-body{padding:2%}}.modal-backdrop{display:none}button.close{opacity:1;position:absolute;right:0;font-size:0;text-shadow:none;overflow:hidden;border:none;z-index:9;top:-35px;right:-35px}button.close:hover{opacity:1;transition:.4s;transform:rotate(-180deg)}@media only screen and (max-width:1200px){button.close{right:2vw}button.close img{width:50px}}@media only screen and (max-width:1200px){#player1{width:90vw;height:70vh}}@media only screen and (max-width:800px){#player1{height:50vh}}.slick-next,.slick-prev{top:50%;transform:translateY(-50%);width:32px;height:65px;z-index:9;filter:blur(2px);display:none!important}@media only screen and (max-width:480px){.slick-next,.slick-prev{visibility:hidden}}.slick-next:focus,.slick-next:hover,.slick-prev:focus,.slick-prev:hover{filter:blur(0)}.slick-next::before,.slick-prev::before{content:''}.slick-prev{left:18vw;background:url(../images/arrow.png) no-repeat center center!important;background-size:contain}@media only screen and (max-width:1440px){.slick-prev{left:8vw}}@media only screen and (max-width:1200px){.slick-prev{left:2vw}}.slick-next{right:18vw;background:url(../images/arrow.png) no-repeat center center!important;background-size:contain;transform:rotate(180deg)}@media only screen and (max-width:1440px){.slick-next{right:8vw}}@media only screen and (max-width:1200px){.slick-next{right:2vw}}.slick-slide img{display:initial}.slick-dotted.slick-slider.slick-slider{margin:0}.slick-dots{position:relative;display:flex;justify-content:flex-end;bottom:-10px}@media only screen and (max-width:768px){.slick-dots{justify-content:center}}.slick-dots li{display:block;width:23px;height:24px;margin:0 .3vw;background:url(../images/dot.png) no-repeat center center;background-size:contain}@media only screen and (max-width:480px){.slick-dots li{margin:0 2vw}}.slick-dots li.slick-active,.slick-dots li:hover{background:url(../images/dott.png) no-repeat center center;background-size:contain}#sect2 .modal-body{max-width:882px;margin:0 auto}#sect2 .slick-slide>div{max-width:882px;max-height:494px}#sect2 .slick-dots{max-width:882px}#slick-area2 .slick-slide>div{max-width:883px;max-height:494px}#slick-area2 .slick-dots{max-width:883px}#slick-area3{width:100%;height:100%;position:relative;top:0;left:0}#slick-area3 .slick-dots{justify-content:center;position:absolute;bottom:28%}@media only screen and (max-width:1200px){#slick-area3 .slick-dots{bottom:25%}}#slick-area3 .slick-dots::before{content:'';width:950px;height:1px;border-top:dashed 1px grey;position:absolute;top:19px}#slick-area3 .slick-dots li{position:relative;width:38px;height:38px;background:url(../images/dot2.png) no-repeat center center;background-size:contain;margin:0 3%}#slick-area3 .slick-dots li.slick-active,#slick-area3 .slick-dots li:hover{background:url(../images/dott2.png) no-repeat center center;background-size:contain}#slick-area3 .slick-dots li.slick-active::before,#slick-area3 .slick-dots li:hover::before{color:#fff}#slick-area3 .slick-dots li::before{content:'';color:#879dc2;position:absolute;width:65px;left:-14px;bottom:-20px}#slick-area3 .slick-dots li:nth-of-type(1)::before{content:'蒼生冢'}#slick-area3 .slick-dots li:nth-of-type(2)::before{content:'孤崖舊憶'}#slick-area3 .slick-dots li:nth-of-type(3)::before{content:'羽光鏡影'}#slick-area3 .slick-dots li:nth-of-type(4)::before{content:'瘟骨紅顏'}#slick-area3 .slick-dots li:nth-of-type(5)::before{content:'臥治閣'}#slick-area3 .slick-dots li:nth-of-type(6)::before{content:'蒼閣魔音'}.animated{-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-fill-mode:both;animation-fill-mode:both}@-webkit-keyframes willow{0%{transform-origin:right top;transform:skew(0deg,0deg)}50%{transform-origin:right top;transform:skew(8deg,0deg)}100%{transform-origin:right top;transform:skew(0deg,0deg)}}@keyframes willow{0%{transform-origin:right top;transform:skew(0deg,0deg)}50%{transform-origin:right top;transform:skew(8deg,0deg)}100%{transform-origin:right top;transform:skew(0deg,0deg)}}.willow{-webkit-animation:willow;animation:take 10s infinite linear}@-webkit-keyframes movemove{0%{transform-origin:center top;transform:rotate(6deg)}50%{transform-origin:center top;transform:rotate(-6deg)}100%{transform-origin:center top;transform:rotate(6deg)}}@keyframes movemove{0%{transform-origin:center top;transform:rotate(6deg)}50%{transform-origin:center top;transform:rotate(-6deg)}100%{transform-origin:center top;transform:rotate(6deg)}}.movemove{-webkit-animation-name:movemove;animation-name:movemove}