﻿@import url("https://www.digiwin.com.tw/dsc/css/bootstrap4.0_M.css");@import url("https://www.digiwin.com.tw/dsc/css/animate-3.7.2.css");*:focus{outline:none !important}button{outline:none !important;border:none !important}.act-sect{position:relative}.act-wrap input{-webkit-appearance:none;-moz-appearance:none;appearance:none}ol,ul{list-style:none}body,div,span,h1,h2,h3,h4,h5,h6,p,em,img,strong,b,small,u,i,center,dl,dt,dd,ol,ul,li,sub,sup,tt,var,del,dfn,ins,kbd,q,s,samp,strike,applet,object,iframe,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,blockquote,pre,a,abbr,acronym,address,big,cite,code,mark,audio,video,input,textarea,select{margin:0;padding:0}.wow{animation-fill-mode:both}.fadeInUpSmall{animation-name:fadeInUpSmall}@keyframes fadeInUpSmall{from{opacity:0;-webkit-transform:translate3d(0, 20%, 0);transform:translate3d(0, 20%, 0)}to{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}.fadeInDownSmall{animation-name:fadeInDownSmall}@keyframes fadeInDownSmall{from{opacity:0;-webkit-transform:translate3d(0, -20%, 0);transform:translate3d(0, -20%, 0)}to{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}.fadeInLeftSmall{animation-name:fadeInLeftSmall}@keyframes fadeInLeftSmall{from{opacity:0;-webkit-transform:translate3d(-20%, 0, 0);transform:translate3d(-20%, 0, 0)}to{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}.fadeInRightSmall{animation-name:fadeInRightSmall}@keyframes fadeInRightSmall{from{opacity:0;-webkit-transform:translate3d(20%, 0, 0);transform:translate3d(20%, 0, 0)}to{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}.fadeInTopLeftSmall{animation-name:fadeInTopLeftSmall}@keyframes fadeInTopLeftSmall{from{opacity:0;-webkit-transform:translate3d(-20%, -20%, 0);transform:translate3d(-20%, -20%, 0)}to{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}.fadeInTopRightSmall{animation-name:fadeInTopRightSmall}@keyframes fadeInTopRightSmall{from{opacity:0;-webkit-transform:translate3d(20%, -20%, 0);transform:translate3d(20%, -20%, 0)}to{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}.fadeInBottomLeftSmall{animation-name:fadeInBottomLeftSmall}@keyframes fadeInBottomLeftSmall{from{opacity:0;-webkit-transform:translate3d(-20%, 20%, 0);transform:translate3d(-20%, 20%, 0)}to{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}.fadeInBottomRightSmall{animation-name:fadeInBottomRightSmall}@keyframes fadeInBottomRightSmall{from{opacity:0;-webkit-transform:translate3d(20%, 20%, 0);transform:translate3d(20%, 20%, 0)}to{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}.bounceInSmall{animation-name:bounceInSmall}@keyframes bounceInSmall{from,20%,40%,60%,80%,to{animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1)}0%{opacity:0;transform:scale3d(0.8, 0.8, 0.8)}40%{transform:scale3d(1.04, 1.04, 1.04)}60%{transform:scale3d(1, 1, 1)}80%{opacity:1;transform:scale3d(1.01, 1.01, 1.01)}to{opacity:1;transform:scale3d(1, 1, 1)}}.section-hide{display:none}.section-show{display:block;animation:section-show 1s ease-in-out both .2s}@keyframes section-show{0%{opacity:0}50%{opacity:1;filter:brightness(150%)}100%{opacity:1;filter:brightness(100%)}}.act-container-wrap{width:100%;max-width:1200px;margin-left:auto;margin-right:auto;position:relative;padding-left:1em;padding-right:1em}.act-sect{padding-top:5em;padding-bottom:5em}@media screen and (min-width: 769px) and (max-width: 1380px){.act-container-wrap{width:90%;max-width:1000px}}@media screen and (max-width: 769px){.act-sect{font-size:calc(2vw + 1.5vmin) !important;padding-top:3em;padding-bottom:3em}}.act-wrap .act-btn{border-radius:100em;padding:.5em 2em;letter-spacing:2px;display:inline-block;cursor:pointer}.act-wrap .btn-blue{background:#01b2e6;color:#fff}.act-wrap .btn-blue:hover{color:#fff;background:#018bb3}.act-wrap .btn-red{background:#ff5771;color:#fff}.act-wrap .btn-red:hover{color:#fff;background:#ff2446}.act-wrap .btn-yellow{background:#ffcf3f;color:#fff}.act-wrap .btn-yellow:hover{color:#fff;background:#ffc20c}.act-wrap .btn-outline-white{color:#fff;border:.2em solid #fff;text-transform:uppercase}.act-wrap .btn-outline-white:hover{color:#01b2e6;background:#fff;border:.2em solid #fff}.act-wrap .btn-gradient{color:#fff;border:1px solid #fff;background:linear-gradient(to right, #6535d5 0%, #ef41b4 100%)}.act-wrap .btn-gradient:hover{color:#fff}.act-wrap .main-btn{border-radius:10em;display:inline-flex;justify-content:center;font-weight:bold;align-items:center;transition:background-color 200ms ease;padding-left:1.4em;padding-right:.6em;font-size:1.2em}.act-wrap .main-btn-text{margin-right:.5em}.act-wrap .main-btn-arrow{position:relative;display:flex;overflow:hidden;width:1.6em;height:1.6em;justify-content:flex-end;align-items:center;border-radius:50%;background-color:#fff}.act-wrap .main-btn:hover .btn-arrow-wrapper{position:absolute;animation:arrow-move 0.3s both}@keyframes arrow-move{0%{transform:translateX(0)}100%{transform:translateX(50%)}}.act-wrap .btn-arrow-wrapper{position:absolute;display:flex;width:200%;height:100%}.act-wrap .btn-arrow-pic{display:flex;width:50%;height:100%;justify-content:center;align-items:center;background-image:url("../images/btn-arrow.svg");background-position:50% 50%;background-size:cover;background-repeat:no-repeat}.act-wrap .btn-sect-center{display:block;margin-top:2em;margin-left:auto;margin-right:auto;width:80%;max-width:180px}.act-wrap .btn-wrap-center{text-align:center;margin-top:3em}.act-wrap .btn-wrap-center .btn{max-width:220px;width:45%}.act-wrap .btn-wrap-center .btn:not(:last-child){margin-right:1.2em}@media screen and (max-width: 769px){.act-wrap .btn-wrap-center .btn:not(:last-child){margin-right:.5em}}.act-wrap a:hover{color:#01b2e6}.act-wrap .sect-title{text-align:center;margin-bottom:3em}.act-wrap .sect-title h2{font-size:2.5em;font-weight:normal;line-height:1.4;color:#01b2e6}.act-wrap .sect-title p{font-size:1.4em;line-height:1.8;color:#01b2e6}@media screen and (max-width: 769px){.act-wrap .sect-title{padding-right:.75em;padding-left:.75em;margin-bottom:2em}.act-wrap .sect-title h2{font-size:1.8em}}.act-wrap .act-nb,.act-wrap .nb{font-family:"Helvetica Neue", Helvetica, Arial}.act-wrap .text-blue{color:#01b2e6 !important}.act-wrap .text-red{color:#ff5771 !important}.act-wrap .text-yellow{color:#ffcf3f !important}.act-wrap .text-list-decimal{list-style-type:decimal;padding-left:1em}.act-wrap .text-list-disc{list-style-type:disc;padding-left:1em}#toolbar{display:none !important}html{max-width:100vw;overflow-X:hidden}body{font-size:16px}.act-wrap{width:100%;height:auto;position:relative;font-family:Microsoft Yahei,"微軟正黑體", Poppins,Helvetica, Arial;font-weight:400;line-height:1.5;color:#fff;text-align:left;background:#fff;font-size:1em}@media screen and (max-width: 769px){.act-wrap{max-width:100vw;overflow-X:hidden}}.logo{font-size:clamp(16px, 2vw, 40px);position:fixed;left:.5em;top:.5em;width:4.2em;z-index:9}@media screen and (max-width: 769px){.logo{font-size:calc(2vw + 1.5vmin) !important;width:6.2em;left:1em;top:1em}}.home-wrap{position:relative;background:url("../images/01_home/home-bg.webp") no-repeat top center #0a3045;position:relative;background-size:cover;width:100vw;height:150vh;overflow:hidden;font-size:clamp(16px, 2vw, 40px)}.home-wrap .act-container-wrap{text-align:center;padding-top:2em}.home-wrap h1{font-size:1em}.home-wrap .title{width:6em;margin-bottom:.6em}.home-wrap p{font-size:.5em;color:#fff;font-style:italic;margin-bottom:1em;line-height:1.8}.home-wrap .h2-wrap{position:relative}.home-wrap h2{font-size:1.25em;font-weight:bold;font-style:italic;background:linear-gradient(to bottom, rgba(255,255,255,0.8) 30%, #7acbe9 70%, rgba(122,203,233,0) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;position:relative;z-index:2}.home-wrap .text-shadow{left:50%;transform:translateX(-50%);z-index:1;top:-0.3em;position:absolute;white-space:nowrap;font-size:1.3em;font-weight:bold;font-style:italic;background:linear-gradient(to bottom, #1f7096 40%, rgba(31,112,150,0) 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:blur(5px)}.home-wrap .btn-start{font-size:.55em;padding:0.5em 2.5em;font-weight:bold}.home-wrap .btn-wave-wrap{margin-top:-.1em;position:relative;width:40%;margin-left:auto;margin-right:auto;max-width:200px}.home-wrap .btn-wave-wrap .act-btn{position:relative;z-index:2;display:block}.home-wrap .btn-wave-wrap .wave{position:absolute;top:0;left:0;width:100%;height:100%;animation:btn-wave 2s infinite;pointer-events:none;border-radius:100em}.home-wrap .btn-wave-wrap .wave:nth-child(2){animation-delay:0.5s}@keyframes btn-wave{0%{transform:scale(1);opacity:.6}100%{transform:scale(1.2, 1.5);opacity:0}}.home-wrap .light-round{aspect-ratio:1 / 1;position:absolute;z-index:11;border-radius:100em;background:radial-gradient(ellipse at center, #ffffff 30%,rgba(255,255,255,0) 99%);filter:blur(0.5em);left:50%;transform:translateX(-50%) translateY(-50%);top:40%;pointer-events:none;opacity:0;width:20vw;mix-blend-mode:lighten}.home-wrap .light-lg{position:absolute;opacity:1;width:20vw;aspect-ratio:1 / 1;left:50%;transform:translateX(-50%) translateY(-50%);top:48%;pointer-events:none;opacity:0}.home-wrap .light-lg img{width:100%}.home-wrap.anime-start h1{animation:fadeInUpSmall 1.5s ease-in-out both}.home-wrap.anime-start .p01{animation:fadeInUpSmall 1.5s ease-in-out both 1s}.home-wrap.anime-start .p02{animation:fadeInUpSmall 1.5s ease-in-out both 1.5s}.home-wrap.anime-start .p03{animation:fadeInUpSmall 1.5s ease-in-out both 2s}.home-wrap.anime-start .h2-wrap{animation:fadeInUpSmall 1.5s ease-in-out both 3.5s}.home-wrap.anime-start .btn-wave-wrap{animation:fadeInUpSmall 1.5s ease-in-out both 3.8s}.home-wrap.anime .light-round{animation:light-lg 1s ease-in-out both 2s}.home-wrap.anime .light-lg{animation:light-lg 1s ease-in-out forwards 2s}@keyframes light-lg{0%{width:20vw;opacity:0}50%{opacity:1}100%{width:160vw;opacity:1}}@media screen and (max-width: 769px){.home-wrap{font-size:calc(2vw + 1.5vmin) !important;background:url("../images/01_home/home-bg-m.webp") no-repeat top center;background-size:auto 100%;height:100vh}.home-wrap .act-container-wrap{padding-top:4em}.home-wrap h1{font-size:1.1em}.home-wrap .title{width:7em;margin-bottom:1em}.home-wrap p{font-size:.9em;margin-bottom:1em;line-height:1.8}.home-wrap h2{font-size:1.8em}.home-wrap .text-shadow{font-size:1.9em}.home-wrap .btn-start{font-size:1em;padding:0.5em 3em;margin-top:-0.2em}}.cube-container{position:absolute;z-index:2;pointer-events:none;width:100vw;height:100%}.cube-container .cube-box{position:absolute;transition:all 2s}.cube-container .cube-box.box1{left:20%;top:8%;transform:scale(1.2)}.cube-container .cube-box.box2{left:28%;top:20%;transform:scale(0.6)}.cube-container .cube-box.box3{left:78%;top:28%;transform:scale(0.8)}.cube-container .cube-box.box4{left:70%;top:14%;transform:scale(1)}.cube-container .cube-box.box5{left:14%;top:38%;transform:scale(1)}.cube-container .cube-box.box6{left:70%;top:33%;transform:scale(0.6)}.cube-container .cube-box.box7{left:56%;top:48%;transform:scale(0.5);filter:brightness(150%)}.cube-container .cube-box.box8{left:26%;top:60%;transform:scale(1.8);filter:brightness(120%)}.cube-container .cube-box.box9{left:70%;top:56%;transform:scale(1.5);filter:brightness(120%)}.cube-container .cube-box .cube{position:relative;transform-style:preserve-3d;width:2em;height:2em}.cube-container .cube-box .cube .face{position:absolute;width:100%;height:100%;background:linear-gradient(to bottom right, #fff, #2684b1);border:0.1px solid #0a5881}.cube-container .cube-box .cube .face.front{transform:rotateY(0deg) translateZ(1em);background:linear-gradient(to bottom right, #60b4dd, #247ea9)}.cube-container .cube-box .cube .face.back{transform:rotateY(180deg) translateZ(1em);background:linear-gradient(to bottom right, #1d6587, #063852)}.cube-container .cube-box .cube .face.left{transform:rotateY(-90deg) translateZ(1em);background:linear-gradient(to bottom right, #2684b1, #0a5881)}.cube-container .cube-box .cube .face.right{transform:rotateY(90deg) translateZ(1em);background:linear-gradient(to bottom right, #2684b1, #0a5881)}.cube-container .cube-box .cube .face.top{transform:rotateX(90deg) translateZ(1em);background:linear-gradient(to bottom right, #1d6587, #084869)}.cube-container .cube-box .cube .face.bottom{transform:rotateX(-90deg) translateZ(1em);background:linear-gradient(to bottom right, #1d6587, #095278)}.cube-container .cube1{animation:rotate1 6s infinite linear}.cube-container .cube2{animation:rotate2 7s infinite linear}.cube-container .cube3{animation:rotate3 5s infinite linear}.cube-container .cube4{animation:rotate4 8s infinite linear}.cube-container .cube5{animation:rotate5 6s infinite linear}.cube-container .cube6{animation:rotate6 7s infinite linear}.cube-container .cube7{animation:rotate7 5s infinite linear}.cube-container .cube8{animation:rotate8 8s infinite linear}.cube-container .cube9{animation:rotate9 6s infinite linear}.cube-container.active{z-index:99}.cube-container.active .cube-box{transform:scale(1);transition:all 2s;filter:brightness(100%);animation:bright 3s  linear both 1.6s}@keyframes bright{from{filter:brightness(100%)}to{filter:brightness(300%)}}.cube-container.active .box1{left:44vw;top:40vh;z-index:3}.cube-container.active .box2{left:calc( 44vw + 2em );top:calc( 40vh + .1em );z-index:2}.cube-container.active .box3{left:calc( 44vw + 4em );top:calc( 40vh + .3em );z-index:1}.cube-container.active .box4{left:44vw;top:calc( 40vh + 2em );z-index:3}.cube-container.active .box5{left:calc( 44vw + 2em );top:calc( 40vh + 2.1em );z-index:2}.cube-container.active .box6{left:calc( 44vw + 4em );top:calc( 40vh + 2.2em );z-index:1}.cube-container.active .box7{left:44vw;top:calc( 40vh + 4em );z-index:3}.cube-container.active .box8{left:calc( 44vw + 2em );top:calc( 40vh + 4.1em );z-index:2}.cube-container.active .box9{left:calc( 44vw + 4em );top:calc( 40vh + 4.2em );z-index:1}.cube-container.active .cube1{animation:combine1 1s forwards}.cube-container.active .cube2{animation:combine2 1s forwards}.cube-container.active .cube3{animation:combine3 1s forwards}.cube-container.active .cube4{animation:combine4 1s forwards}.cube-container.active .cube5{animation:combine5 1s forwards}.cube-container.active .cube6{animation:combine6 1s forwards}.cube-container.active .cube7{animation:combine7 1s forwards}.cube-container.active .cube8{animation:combine8 1s forwards}.cube-container.active .cube9{animation:combine9 1s forwards}@keyframes rotate1{from{transform:rotateX(0deg) rotateY(0deg)}to{transform:rotateX(360deg) rotateY(360deg)}}@keyframes rotate2{from{transform:rotateX(0deg) rotateY(0deg)}to{transform:rotateX(-360deg) rotateY(360deg)}}@keyframes rotate3{from{transform:rotateX(0deg) rotateY(0deg)}to{transform:rotateX(360deg) rotateY(-360deg)}}@keyframes rotate4{from{transform:rotateX(0deg) rotateY(0deg)}to{transform:rotateX(-360deg) rotateY(-360deg)}}@keyframes rotate5{from{transform:rotateX(0deg) rotateY(0deg)}to{transform:rotateX(360deg) rotateY(360deg)}}@keyframes rotate6{from{transform:rotateX(0deg) rotateY(0deg)}to{transform:rotateX(-360deg) rotateY(360deg)}}@keyframes rotate7{from{transform:rotateX(0deg) rotateY(0deg)}to{transform:rotateX(360deg) rotateY(-360deg)}}@keyframes rotate8{from{transform:rotateX(0deg) rotateY(0deg)}to{transform:rotateX(-360deg) rotateY(-360deg)}}@keyframes rotate9{from{transform:rotateX(0deg) rotateY(0deg)}to{transform:rotateX(360deg) rotateY(360deg)}}@keyframes combine1{to{transform:translate(0, 0) scale(1) rotateX(15deg) rotateY(15deg)}}@keyframes combine2{to{transform:translate(0, 0) scale(1) rotateX(15deg) rotateY(15deg)}}@keyframes combine3{to{transform:translate(0, 0) scale(1) rotateX(15deg) rotateY(15deg)}}@keyframes combine4{to{transform:translate(0, 0) scale(1) rotateX(15deg) rotateY(15deg)}}@keyframes combine5{to{transform:translate(0, 0) scale(1) rotateX(15deg) rotateY(15deg)}}@keyframes combine6{to{transform:translate(0, 0) scale(1) rotateX(15deg) rotateY(15deg)}}@keyframes combine7{to{transform:translate(0, 0) scale(1) rotateX(15deg) rotateY(15deg)}}@keyframes combine8{to{transform:translate(0, 0) scale(1) rotateX(15deg) rotateY(15deg)}}@keyframes combine9{to{transform:translate(0, 0) scale(1) rotateX(15deg) rotateY(15deg)}}@media screen and (max-width: 769px){.cube-container .cube-box.box1{left:10%;top:12%;transform:scale(1.2)}.cube-container .cube-box.box2{left:17%;top:22%;transform:scale(0.6)}.cube-container .cube-box.box3{left:86%;top:28%;transform:scale(0.8)}.cube-container .cube-box.box4{left:78%;top:16%;transform:scale(1)}.cube-container .cube-box.box5{left:6%;top:40%;transform:scale(1)}.cube-container .cube-box.box6{left:78%;top:35%;transform:scale(0.6)}.cube-container .cube-box.box7{left:59%;top:58%;transform:scale(0.5)}.cube-container .cube-box.box8{left:18%;top:79%;transform:scale(2)}.cube-container .cube-box.box9{left:78%;top:72%;transform:scale(1.8)}.cube-container.active .cube-box{transform:scale(1);transition:all 2s}@keyframes bright{from{filter:brightness(100%)}to{filter:brightness(300%)}}.cube-container.active .box1{left:44vw;top:40vh;z-index:3}.cube-container.active .box2{left:calc( 44vw + 2em );top:calc( 40vh + .1em );z-index:2}.cube-container.active .box3{left:calc( 44vw + 4em );top:calc( 40vh + .3em );z-index:1}.cube-container.active .box4{left:44vw;top:calc( 40vh + 2em );z-index:3}.cube-container.active .box5{left:calc( 44vw + 2em );top:calc( 40vh + 2.1em );z-index:2}.cube-container.active .box6{left:calc( 44vw + 4em );top:calc( 40vh + 2.2em );z-index:1}.cube-container.active .box7{left:44vw;top:calc( 40vh + 4em );z-index:3}.cube-container.active .box8{left:calc( 44vw + 2em );top:calc( 40vh + 4.1em );z-index:2}.cube-container.active .box9{left:calc( 44vw + 4em );top:calc( 40vh + 4.2em );z-index:1}.cube-container.active .cube1{animation:combine1 1s forwards}.cube-container.active .cube2{animation:combine2 1s forwards}.cube-container.active .cube3{animation:combine3 1s forwards}.cube-container.active .cube4{animation:combine4 1s forwards}.cube-container.active .cube5{animation:combine5 1s forwards}.cube-container.active .cube6{animation:combine6 1s forwards}.cube-container.active .cube7{animation:combine7 1s forwards}.cube-container.active .cube8{animation:combine8 1s forwards}.cube-container.active .cube9{animation:combine9 1s forwards}}.svg{position:absolute;width:0;height:0}#future-wrap{background:#5c9ede;width:100vw;height:100vh;position:relative;min-height:520px;font-size:clamp(16px, 2vw, 40px);overflow:hidden}#future-wrap .act-container-wrap{z-index:3;max-width:1450px}@media screen and (min-width: 769px) and (max-width: 1380px){#future-wrap .act-container-wrap{width:90%;max-width:1000px}}#future-wrap .text-part{text-align:center;padding-top:1.2em}#future-wrap .text-part p{font-size:.7em;letter-spacing:1em;margin-bottom:.8em;opacity:1}#future-wrap .text-part .title{width:13em;display:block;margin-left:auto;margin-right:auto;position:relative;font-size:1.2em}#future-wrap .text-part .title img{width:100%}#future-wrap .text-part .text-select{opacity:1;margin-top:1em;padding:0.4em;font-size:0.55em;letter-spacing:0.2em;max-width:800px;width:60%;display:block;margin-left:auto;margin-right:auto;background:linear-gradient(to right, rgba(255,255,255,0) 0%, #fff 50%, rgba(255,255,255,0) 100%);color:#1c569c}#future-wrap .text-part .text-select span{color:#cd00d5}#future-wrap .nana-fly-wrap{position:absolute;right:12vw;top:8vw;width:2.6em}#future-wrap .nana-fly{width:100%}#future-wrap .char-group{position:absolute;z-index:9;left:50%;transform:translateX(-50%);width:40%;max-width:760px;bottom:0;height:100vh}#future-wrap .char-group .char{position:absolute;z-index:3;cursor:pointer;transform-origin:bottom}#future-wrap .char-group .char img{width:100%}#future-wrap .char-group .char:hover .char-sm{filter:brightness(130%);transition:all 1s;filter:brightness(120%)}#future-wrap .char-group .show-light-wrap{position:absolute;bottom:-5%;z-index:9;pointer-events:none;width:100%;mix-blend-mode:screen}#future-wrap .char-group .show-light{animation:show-light .1s  linear infinite both}@keyframes show-light{0% ,100%{transform:scaleX(1)}50%{transform:scaleX(1.05)}}#future-wrap .char-group .char-lg{opacity:1;position:absolute;display:none}#future-wrap .char-group .clipped{background-size:cover;-webkit-clip-path:url(#my-clip-path);clip-path:url(#my-clip-path);width:100%;height:100%;position:relative;z-index:2}#future-wrap .char-group .char-sm{position:relative;z-index:2;filter:brightness(100%);transition:all .5s}#future-wrap .char-boss{width:21%;left:0;bottom:14%}#future-wrap .char-boss .show-light{left:-10%}#future-wrap .char-girl{width:16%;left:40%;bottom:12%}#future-wrap .char-girl .name-box{left:-28%}#future-wrap .char-girl .show-light{left:10%}#future-wrap .char-man{width:21%;right:0;bottom:14%}#future-wrap .char-man .show-light{left:-10%}#future-wrap .name-box{position:absolute;display:inline-block;z-index:6;left:-19%;top:10%}#future-wrap .name{transform:skewX(-9deg);font-size:0.5em;padding:1em 0.4em 0.6em;z-index:2;position:relative}#future-wrap .name-bg-wrap{transform:skewX(-9deg) skewY(-15deg);position:absolute;width:100%;height:100%;top:0}#future-wrap .name-bg{width:100%;height:100%;text-align:center;position:absolute}#future-wrap .name-bg:before,#future-wrap .name-bg:after{content:"";width:100%;height:100%;position:absolute}#future-wrap .name-bg:before{background:linear-gradient(to bottom, #d17fef 10%, #794dde 80%);width:100%;height:100%;z-index:2;left:0;bottom:0}#future-wrap .name-bg:after{background:#fff;z-index:1;position:absolute;bottom:-.2em;left:-.1em}#future-wrap .platform{z-index:1;position:absolute;top:78%;width:160%;left:50%;transform:translateX(-50%)}@media screen and (min-width: 769px) and (max-width: 1380px){#future-wrap .text-part{padding-top:1.2em}#future-wrap .text-part p{font-size:.7em}#future-wrap .text-part h1{width:13em;font-size:1.2em}#future-wrap .text-part .text-select{margin-top:1em;padding:0.5em;font-size:0.6em;max-width:460px;width:50%}#future-wrap .nana-fly{right:20vw;top:8vw;width:3em}#future-wrap .char-group{width:40%;max-width:600px}#future-wrap .platform{top:78%;width:160%}}#future-wrap .circle-light{width:140%;aspect-ratio:1 / 1;left:-30%;position:absolute;bottom:-20%;z-index:1;transform:perspective(1200px) rotateX(76deg)}#future-wrap .circle-light img{width:100%;height:100%;transform-origin:center;animation:rotate 4s infinite linear;transform-style:preserve-3d}@keyframes rotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}#future-wrap .sky-bg{position:absolute;top:0;left:0;z-index:2;width:100vw;height:50vh;background:linear-gradient(to bottom, #00006a 0%, rgba(0,0,106,0) 99%)}#future-wrap .move-bg{zoom:1;transition:all .3s;width:100vw;position:absolute;z-index:1;top:0;animation:slideBackground 40s linear infinite}#future-wrap .move-bg img{width:auto;height:100vh}@keyframes slideBackground{from{transform:translateX(0%)}to{transform:translateX(-145%)}}#future-wrap .btn-end{position:absolute;z-index:11;bottom:2em;left:50%;transform:translateX(-50%);font-size:0.5em;opacity:0;pointer-events:none;white-space:nowrap}#future-wrap .btn-end.show{animation:btn-show 1.8s ease-in-out forwards;pointer-events:auto}#future-wrap .btn-end.show{animation:btn-show 1.8s ease-in-out forwards;pointer-events:auto}#future-wrap .anime-bg{position:fixed;width:100vw;height:100vh;top:0;left:0;background:#fff;opacity:0;z-index:999;pointer-events:none}#future-wrap.anime-start .text-part p{animation:fadeInUpSmall 0.6s ease-in-out both 1s}#future-wrap.anime-start .text-part h2{animation:fadeInUpSmall 1.6s ease-in-out both 1.4s}#future-wrap.anime-start .text-part h3{animation:zoomIn 1.2s ease-in-out both 2s}#future-wrap.anime-start .char-sm{animation:char-show-up 2s ease-in-out both}#future-wrap.anime-start .show-light-wrap{animation:show-light-hide .5s ease-in-out both 2s}#future-wrap.anime-start .name-box{animation:name-box-show 1s ease-in-out both 1s}#future-wrap.anime-start .nana-fly-wrap{animation:nana-fly-in  1s ease-in-out both 3s}@keyframes nana-fly-in{0%{transform:translate(3em, 2em) scale(2);opacity:0}100%{transform:translate(0) scale(1);opacity:1}}@keyframes name-box-show{0%{transform:translateY(3em);opacity:0}100%{transform:translate(0);opacity:1}}@keyframes char-show-up{0%{transform:translateY(100%)}100%{transform:translate(0)}}@keyframes show-light-hide{0%{opacity:1}100%{opacity:0;display:none}}#future-wrap.anime-out .anime-bg{opacity:1;transition:all 1s 1.5s}#future-wrap.anime-out .act-container-wrap{z-index:999}#future-wrap.anime-out .nana-fly-wrap{animation:nana-fly-out-wrap 2s ease-in-out forwards}#future-wrap.anime-out .nana-fly-box{animation:nana-fly-out 2s ease-in-out forwards}@keyframes nana-fly-out-wrap{60%{transform:translate(-52vw, 10vh) scale(1.2)}100%{transform:translate(0vw, 25vh) scale(10);z-index:99}}@keyframes nana-fly-out{59%{transform:scaleX(1)}60%{transform:scaleX(-1)}100%{transform:scaleX(-1)}}#future-wrap.anime-back .text-part{animation:text-part-in 0.5s ease-in-out both}@keyframes text-part-in{0%{transform:scale(0.5);opacity:0}100%{transform:scale(1);opacity:1}}#future-wrap.anime-back .char-group{animation:char-group-in 0.5s ease-in-out both}@keyframes char-group-in{0%{transform:scale(2) translateX(-50%);opacity:0;transform-origin:left}100%{transform:scale(1) translateX(-50%);opacity:1;transform-origin:left}}#future-wrap.anime-back .nana-fly-wrap{animation:nana-fly-in-2  .5s ease-in-out both .1s}@keyframes nana-fly-in-2{0%{transform:translate(3em, 0.5em) scale(1.4);opacity:0}100%{transform:translate(0) scale(1);opacity:1}}@keyframes btn-show{0%{transform:translateY(1em) translateX(-50%);opacity:0}100%{transform:translateY(0) translateX(-50%);opacity:1}}@media screen and (max-width: 769px){#future-wrap{font-size:calc(2vw + 1.5vmin) !important}#future-wrap .text-part{padding-top:5em}#future-wrap .text-part p{font-size:1em}#future-wrap .text-part h1{width:16em}#future-wrap .text-part .text-select{margin-top:1.5em;padding:0.5em;font-size:1em;width:100%;background:linear-gradient(to right, rgba(255,255,255,0) 0%, #fff 30%, #fff 70%, rgba(255,255,255,0) 100%)}#future-wrap .nana-fly-wrap{right:1.6em;top:10em;width:3.2em}#future-wrap .char-group{width:90%;top:-8vw}#future-wrap .char-boss{width:30%;left:0;bottom:21%}#future-wrap .char-boss .name-box{left:-5%}#future-wrap .char-girl{width:23%;left:38%;bottom:16%}#future-wrap .char-girl .name-box{left:-14%}#future-wrap .char-man{width:30%;right:0;bottom:21%}#future-wrap .char-man .name-box{left:-9%}#future-wrap .platform{top:70%;width:360%}#future-wrap .btn-end{bottom:8em;font-size:1.2em}@keyframes nana-fly-out-wrap{60%{transform:translate(-70vw, 10vh) scale(1.2)}100%{transform:translate(-30vw, 15vh) scale(10);z-index:99}}}#future-wrap.char-open .act-container-wrap{z-index:11}#future-wrap.char-open .btn-end{opacity:0 !important}#future-wrap.char-open .text-part{animation:text-part-close 0.4s ease-in-out both}@keyframes text-part-close{0%{transform:scale(1);opacity:1}100%{transform:scale(0.5);opacity:0}}#future-wrap.char-open .text-wrap-part{animation:fadeIn 1s ease-in-out both 1s}#future-wrap.char-open .char-group{top:auto}#future-wrap.char-open .title-char{animation:fadeInUpSmall 1.5s ease-in-out both 1.2s}#future-wrap.char-open .btn-closed{animation:fadeInLeftSmall 1s ease-in-out both 2.2s}#future-wrap.char-open .char{transition:all 2s;transform-origin:bottom}#future-wrap.char-open .char-sm{cursor:default}#future-wrap.char-open .show-light{display:none;opacity:0}#future-wrap.char-open .char-lg{cursor:default}#future-wrap.char-open .name-box{opacity:0 !important}#future-wrap.char-open .name-box{left:95% !important}#future-wrap.char-open .name-box .name{font-size:.8em}#future-wrap.char-open .nana-fly{opacity:0}@keyframes nana-fly-char{to{top:15vw;right:16vw;opacity:0}}#future-wrap.char-open .platform{top:86%;width:300%;left:80%;transition:all 1s}#future-wrap.char-open .move-bg{zoom:1;transition:all .3s}@keyframes text-wrap-open{0%{overflow:hidden;height:0px;opacity:1}99%{overflow:hidden;height:60vh;opacity:1}100%{overflow:visible;height:auto;opacity:1}}#future-wrap.char-boss-open .boss-text-wrap{opacity:1;animation:text-wrap-open  1s ease-in-out both 1.5s}#future-wrap.char-boss-open .char-boss{animation:char-boss-zoom .8s ease-in-out forwards, char-boss-right .8s ease-in-out forwards .5s}#future-wrap.char-boss-open .char-boss .char-lg{animation:char-lg-show 0.3s ease-in-out forwards 0.5s;display:block;opacity:0;width:140%}#future-wrap.char-boss-open .char-boss .char-sm{animation:char-sm-hide 0.3s ease-in-out forwards 0.5s}#future-wrap.char-boss-open .char-boss .name-box{opacity:1}#future-wrap.char-boss-open .char-boss .circle-light{opacity:0}#future-wrap.char-boss-open .char-girl{z-index:2;left:60%;width:11%;bottom:.5em}#future-wrap.char-boss-open .char-man{z-index:2;right:-38%;cursor:none;width:14%;bottom:.5em}#future-wrap.char-girl-open .girl-text-wrap{animation:text-wrap-open  1s ease-in-out both 1.5s}#future-wrap.char-girl-open .char{z-index:6}#future-wrap.char-girl-open .char-girl{animation:char-girl-zoom .8s ease-in-out forwards, char-girl-right .8s ease-in-out forwards .5s}#future-wrap.char-girl-open .char-girl .char-lg{animation:char-lg-show 0.3s ease-in-out forwards 0.5s;display:block;opacity:0;width:140%}#future-wrap.char-girl-open .char-girl .char-sm{animation:char-sm-hide 0.3s ease-in-out forwards 0.5s}#future-wrap.char-girl-open .char-girl .name-box{opacity:1}#future-wrap.char-girl-open .char-girl .circle-light{opacity:0}#future-wrap.char-girl-open .char-boss{z-index:2;left:60%;width:14%;bottom:.5em}#future-wrap.char-girl-open .char-man{z-index:2;right:-38%;cursor:none;width:14%;bottom:.5em}#future-wrap.char-man-open .man-text-wrap{opacity:1;animation:text-wrap-open  1s ease-in-out both 1.5s}#future-wrap.char-man-open .char-man{animation:char-man-zoom .8s ease-in-out forwards, char-man-right .8s ease-in-out forwards .5s}#future-wrap.char-man-open .char-man .char-lg{animation:char-lg-show 0.3s ease-in-out forwards 0.5s;display:block;opacity:0;width:140%}#future-wrap.char-man-open .char-man .char-sm{animation:char-sm-hide 0.3s ease-in-out forwards 0.5s}#future-wrap.char-man-open .char-man .name-box{opacity:1}#future-wrap.char-man-open .char-man .circle-light{opacity:0}#future-wrap.char-man-open .char-boss{z-index:2;left:60%;width:14%;bottom:.5em}#future-wrap.char-man-open .char-girl{z-index:2;left:130%;cursor:none;width:11%;bottom:.5em}@keyframes char-sm-hide{0%{opacity:1}100%{opacity:0}}@keyframes char-lg-show{0%{opacity:0}100%{opacity:1}}@keyframes char-boss-zoom{0%{transform:scale(1) translateY(0vh)}100%{transform:scale(2.6) translateY(22vh)}}@keyframes char-boss-right{0%{transform:scale(2.6) translateX(0) translateY(22vh)}100%{transform:scale(2.6) translateX(11vw) translateY(22vh)}}@keyframes char-girl-zoom{0%{transform:scale(1) translateY(0vh)}100%{transform:scale(3) translateY(28vh)}}@keyframes char-girl-right{0%{transform:scale(3) translateX(0) translateY(24vh)}100%{transform:scale(3) translateX(5vw) translateY(24vh)}}@keyframes char-man-zoom{0%{transform:scale(1) translateX(-2vw) translateY(0vh)}100%{transform:scale(2.4) translateX(-2vw) translateY(19vh)}}@keyframes char-man-right{0%{transform:scale(2.4) translateX(-2vw) translateY(19vh)}100%{transform:scale(2.4) translateX(0vw) translateY(19vh)}}#future-wrap .text-wrap-part{opacity:0;top:13vh;z-index:9;position:fixed;width:38vw}#future-wrap .text-wrap-part .title-char{width:76%;opacity:0;pointer-events:none;margin-bottom:1em}#future-wrap .text-wrap{width:100%;position:absolute;opacity:0}#future-wrap .text-wrap:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to bottom, #1836a4 10%, rgba(0,92,255,0.56) 60%);clip-path:polygon(5% 0, 100% 0, 100% 90%, 93% 100%, 0 100%, 0 7%)}#future-wrap .text-wrap .text-wrap-bg{position:absolute;width:100%;left:0;top:0;height:100%;background:url("../images/02_future/text-bg-top.svg") no-repeat top center,url("../images/02_future/text-bg-footer-border.svg") no-repeat bottom center;background-size:100%;z-index:1}#future-wrap .text-wrap .act-inner{position:relative;z-index:2;padding:.8em 1.4em 2em}#future-wrap .text-wrap h3{font-style:italic;font-size:1em;font-weight:bold;margin-bottom:0.4em}#future-wrap .text-wrap p{font-style:italic;font-size:.42em}#future-wrap .text-wrap .radar{display:block;margin-left:auto;margin-right:auto;width:65%;margin-top:1em}#future-wrap .text-wrap .evolution{position:absolute;right:2.5em;top:2.5em;font-size:0.4em;padding:0.3em .6em}#future-wrap .text-wrap .evolution span{color:#fff;font-weight:bold;position:relative;z-index:2;font-style:italic}#future-wrap .text-wrap .evolution .star{position:relative;z-index:2;margin-left:0.5em}#future-wrap .text-wrap .evolution .star img{width:1em;margin:0 0.06em}#future-wrap .text-wrap .evolution:before{content:"";width:100%;height:100%;background:#0c2889;border:1px solid #fff;transform:skewX(-9deg);position:absolute;left:0;top:0;z-index:1}#future-wrap .text-wrap .btn-closed{background:#fff;padding:.25em 0.5em;position:absolute;right:0;bottom:99%;color:#1c2483;font-size:0.7em;cursor:pointer}#future-wrap .text-wrap .btn-closed span{margin-left:0.2em}@media screen and (max-width: 769px){#future-wrap.char-open .text-part{padding-top:2em}#future-wrap.char-open .text-part h1{width:10em;left:auto;margin-bottom:0;top:1em;right:1em;position:fixed}#future-wrap.char-open .char-group{width:100%;top:0}#future-wrap.char-open .char-group .char{animation:fadeInLeftSmall 1s ease-in-out both 1s;top:2vh;left:10vw}#future-wrap.char-open .char-group .char-boss{width:55vw}#future-wrap.char-open .char-group .char-girl{width:45vw;left:20vw}#future-wrap.char-open .char-group .char-man{width:46vw;left:15vw}#future-wrap.char-open .char-sm{display:none}#future-wrap.char-open .circle-light{display:none}#future-wrap.char-open .name-box{left:95% !important}#future-wrap.char-open .name-box .name{font-size:1em}#future-wrap.char-open .platform{top:86%;width:320%;left:60%}#future-wrap .text-wrap-part{margin-top:20vh;position:fixed}#future-wrap .text-wrap-part .title-char{display:none}#future-wrap .text-wrap{margin-top:0;width:94vw}#future-wrap .text-wrap .act-inner{padding:1.5em 1.4em 2em}#future-wrap .text-wrap h3{font-size:2em;margin-bottom:0.6em}#future-wrap .text-wrap p{font-size:.85em}#future-wrap .text-wrap .radar{width:80%;margin-top:2em}#future-wrap .text-wrap .evolution{right:2em;top:2em;font-size:.9em;padding:0.3em .5em}#future-wrap .text-wrap .evolution .star img{width:.9em;margin:0.06em}#future-wrap .text-wrap .btn-closed{padding:.25em 0.5em;right:0;bottom:99%;font-size:1.5em}}.door-wrap{background:url("../images/03_door/door-bg.webp") no-repeat top center #0a3045;position:relative;background-size:cover;width:100vw;height:100vh;overflow:hidden}.door-wrap .anime-wrap{position:absolute;left:50%;transform:translateX(-50%);width:50vw;top:-55vh;display:flex;align-items:center;justify-content:center;flex-direction:column}.door-wrap .step{z-index:2}.door-wrap .step img{width:100%}.door-wrap .step-up img{transform:scaleY(-1) translateX(4%)}.door-wrap .step-down img{transform:translateX(4%)}.door-wrap .man{position:absolute;z-index:3;margin-left:1.78em;margin-top:10em;width:30%;opacity:0}.door-wrap .door{position:absolute;z-index:1;width:17.5%;height:10vh;background:#fff;transform:translateX(1.2em);box-shadow:0 0 2em 0.1em #fff;animation:lightDoor 5s ease-in-out infinite}@keyframes lightDoor{from{box-shadow:0 0 1em 0.1em rgba(255,255,255,0.5)}to{box-shadow:0 0 2em 0.1em #fff}}.door-wrap.anime .step-up{animation:moveTopStairs 2s ease-in-out forwards}.door-wrap.anime .step-down{animation:moveBottomStairs 2s ease-in-out forwards}.door-wrap.anime .man{animation:showPerson 1.6s ease-in-out forwards 1.5s}.door-wrap.anime .door{animation:revealDoor 2s linear forwards}@keyframes moveTopStairs{from{transform:translateY(0)}to{transform:translateY(-7em)}}@keyframes moveBottomStairs{from{transform:translateY(0)}to{transform:translateY(7em)}}@keyframes revealDoor{from{height:10vh}to{height:80vh}}@keyframes showPerson{0%{opacity:0;transform:translateY(0)}20%{opacity:1;transform:translateY(0)}30%{opacity:1;transform:translateY(0)}80%{opacity:1}100%{opacity:0;transform:translateY(-1.2em)}}@media screen and (min-width: 769px) and (max-width: 1380px){.door-wrap .anime-wrap{zoom:.8}.door-wrap .door{width:20%;transform:translateX(0.8em);box-shadow:0 0 2em 0.1em #fff;animation:lightDoor 5s ease-in-out infinite}.door-wrap .man{margin-left:1.7em;margin-top:6em;width:30%;opacity:0}@keyframes moveTopStairs{from{transform:translateY(0)}to{transform:translateY(-5em)}}@keyframes moveBottomStairs{from{transform:translateY(0)}to{transform:translateY(5em)}}}@media screen and (max-width: 769px){.door-wrap{background:url("../images/03_door/door-bg.webp") no-repeat top center;background-size:cover;font-size:calc(2vw + 1.5vmin) !important}.door-wrap .bg-m{position:absolute;top:0;left:0;z-index:2;width:100vw;height:30vh;background:linear-gradient(to bottom, #092a3c 0%, rgba(0,0,106,0) 99%)}.door-wrap .anime-wrap{left:0%;transform:translateX(-1em);width:100vw;top:-10vh}.door-wrap .man{margin-left:1.5em;margin-top:5em;width:8%;opacity:0}.door-wrap .door{width:21%;height:10vh;transform:translateX(0.6em)}@keyframes moveTopStairs{from{transform:translateY(0)}to{transform:translateY(-4em)}}@keyframes moveBottomStairs{from{transform:translateY(0)}to{transform:translateY(4em)}}@keyframes revealDoor{from{height:10vh}to{height:60vh}}}.nana-fly{width:3.6em;animation:nana-fly 0.3s steps(2) infinite both;background-image:url(../images/nana-fly.svg);aspect-ratio:5 / 5.9;background-size:200%;display:block}@keyframes nana-fly{0%{background-position:0px 0px}100%{background-position:-200% 0px}}.beach-wrap{background:url("../images/04_beach/beach-bg.webp") no-repeat top center;background-size:cover;width:100vw;height:100vh;padding:2.5em;font-size:clamp(16px, 2vw, 40px)}.beach-wrap .nana-fly-wrap{position:absolute;right:6vw;top:40vh}.beach-wrap .nana-fly-wrap .act-report{position:absolute;width:60%;left:-36%;top:40%;opacity:0.9}.beach-wrap .text-part{color:#01b2e6;background:#fff;max-width:600px;width:40%;padding:1.5em}.beach-wrap .text-part .logo-b{width:11em;margin-bottom:0.5em}.beach-wrap .text-part h2{font-weight:bold;font-size:1.05em;margin-bottom:0.5em}.beach-wrap .text-part p{font-size:0.5em;margin-bottom:1.2em}.beach-wrap .text-part .main-btn{font-size:0.6em;position:relative;left:-0.3em}.beach-wrap .text-part .main-btn .main-btn-text{margin-right:3em}.beach-wrap .share-part .icon-link{display:block}.beach-wrap .share-part .icon-link:not(:last-child){margin-right:0.5em}.beach-wrap .share-part .act-icon{width:.85em}.beach-wrap.anime .nana-fly-wrap{animation:nana-fly-in-beach  1s ease-in-out both .1s}.beach-wrap.anime .text-part{animation:fadeInUpSmall 1.5s ease-in-out both 1s}.beach-wrap.anime .p01{animation:fadeInUpSmall 1s ease-in-out both 1.8s}.beach-wrap.anime .p02{animation:fadeInUpSmall 1s ease-in-out both 2s}.beach-wrap.anime .p03{animation:fadeInUpSmall 1s ease-in-out both 2.2s}.beach-wrap.anime .footer-part{animation:fadeInUpSmall 1.5s ease-in-out both 3s}@keyframes nana-fly-in-beach{0%{transform:translate(20vw, -2em) scale(1.5);opacity:0}100%{transform:translate(0) scale(1);opacity:1}}@media screen and (max-width: 769px){.beach-wrap{background:url("../images/04_beach/beach-bg.webp") no-repeat top -8% right 0%;background-size:140%;font-size:calc(2vw + 1.5vmin) !important;padding:0;padding-top:30vh}.beach-wrap .nana-fly-wrap{right:auto;top:8vh;left:8vw}.beach-wrap .nana-fly-wrap .nana-fly{transform:scaleX(-1);width:4.6em}@keyframes nana-fly-in-beach{0%{transform:translate(-20vw, -2em) scale(2);opacity:0}100%{transform:translate(0) scale(1);opacity:1}}.beach-wrap .text-part{background:#fff;max-width:none;width:100%;padding:2em;padding-left:3.5em;padding-bottom:3em}.beach-wrap .text-part .logo{width:20em;margin-bottom:1em}.beach-wrap .text-part h2{font-weight:bold;font-size:2em;margin-bottom:0.5em}.beach-wrap .text-part p{font-size:1em;margin-bottom:1.4em}.beach-wrap .text-part .main-btn{font-size:1.2em;position:relative;left:-0.3em}.beach-wrap .text-part .main-btn .main-btn-text{margin-right:3em}.beach-wrap .share-part .icon-link{display:block}.beach-wrap .share-part .icon-link:not(:last-child){margin-right:0.5em}.beach-wrap .share-part .act-icon{width:1.8em}}
/*# sourceMappingURL=style.css.map */
