*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}[type=text],[type=email],[type=url],[type=password],[type=number],[type=date],[type=datetime-local],[type=month],[type=search],[type=tel],[type=time],[type=week],[multiple],textarea,select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-color:#6b7280;border-width:1px;border-radius:0;padding:.5rem .75rem;font-size:1rem;line-height:1.5rem;--tw-shadow: 0 0 #0000}[type=text]:focus,[type=email]:focus,[type=url]:focus,[type=password]:focus,[type=number]:focus,[type=date]:focus,[type=datetime-local]:focus,[type=month]:focus,[type=search]:focus,[type=tel]:focus,[type=time]:focus,[type=week]:focus,[multiple]:focus,textarea:focus,select:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset: var(--tw-empty, );--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: #2563eb;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:#2563eb}input::-moz-placeholder,textarea::-moz-placeholder{color:#6b7280;opacity:1}input::placeholder,textarea::placeholder{color:#6b7280;opacity:1}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-date-and-time-value{min-height:1.5em}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{padding-top:0;padding-bottom:0}select{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact;print-color-adjust:exact}[multiple]{background-image:initial;background-position:initial;background-repeat:unset;background-size:initial;padding-right:.75rem;-webkit-print-color-adjust:unset;print-color-adjust:unset}[type=checkbox],[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-shrink:0;height:1rem;width:1rem;color:#2563eb;background-color:#fff;border-color:#6b7280;border-width:1px;--tw-shadow: 0 0 #0000}[type=checkbox]{border-radius:0}[type=radio]{border-radius:100%}[type=checkbox]:focus,[type=radio]:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset: var(--tw-empty, );--tw-ring-offset-width: 2px;--tw-ring-offset-color: #fff;--tw-ring-color: #2563eb;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}[type=checkbox]:checked,[type=radio]:checked{border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:center;background-repeat:no-repeat}[type=checkbox]:checked{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e")}[type=radio]:checked{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e")}[type=checkbox]:checked:hover,[type=checkbox]:checked:focus,[type=radio]:checked:hover,[type=radio]:checked:focus{border-color:transparent;background-color:currentColor}[type=checkbox]:indeterminate{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e");border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:center;background-repeat:no-repeat}[type=checkbox]:indeterminate:hover,[type=checkbox]:indeterminate:focus{border-color:transparent;background-color:currentColor}[type=file]{background:unset;border-color:inherit;border-width:0;border-radius:0;padding:0;font-size:unset;line-height:inherit}[type=file]:focus{outline:1px solid ButtonText;outline:1px auto -webkit-focus-ring-color}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.hidden{display:none}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.top-100{top:100%}.bottom-100{bottom:100%}.max-h-select{max-height:300px}#dashboard-mixed-chart-canvas,#dashboard-bar-chart-canvas,#dashboard-bar-chart2,#dashboard-list-chart{min-height:60vh}@keyframes scale_ani{0%{transform:translate(-50%,-50%) scale(.5);opacity:1}40%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-50%) scale(1.4);opacity:0}}@keyframes fireworkLine{0%{right:20%;transform:scale(0)}25%{right:20%;width:6px;transform:scale(1)}35%{right:0;width:35%}70%{right:0;width:4px;transform:scale(1)}to{right:0;transform:scale(0)}}@keyframes fireworkPoint{30%{transform:scale(0)}60%{transform:scale(1)}to{transform:scale(0)}}@keyframes bounceIn{0%{transform:scale(0)}30%{transform:scale(1.25)}50%{transform:scale(.9)}70%{transform:scale(1.1)}80%{transform:scale(1)}}*:focus{outline:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,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,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}input#menu,input#termsPop{display:none}header{position:absolute;width:100%;left:0;z-index:6;transition:all .5s ease}header #headerContent{display:flex;align-items:center;box-shadow:0 0 20px 5px #0000001a;position:relative}header #headerContent #logo{flex:1;text-align:center}header #headerContent #logo a{display:inline-block;margin:0 auto;width:50%;max-width:240px}header #headerContent label{position:absolute;right:1rem;top:50%;transform:translateY(-50%);background:linear-gradient(180deg,#DBFDFF 0%,#31F5FF 33.33%,#577EFF 66.67%,#FF93FF 100%),#FFEC84;border-radius:50%;padding:1px;box-shadow:0 0 10px 5px #000}header #headerContent label>div{background:#08122F;width:100%;height:100%;border-radius:50%}#hideTerms{position:fixed;width:100%;height:100%;left:0;top:0;z-index:999;background:rgba(0,0,0,.7);opacity:0;pointer-events:none;transition:all .5s ease}#hideTerms #hideTermsContent{max-width:1080px;width:100%;position:absolute;height:100%;left:50%;transform:translate(-50%)}input#termsPop~#hideTerms label{z-index:6;width:3rem;height:3rem;display:block;position:absolute;right:1rem;top:.76rem;background:linear-gradient(180deg,#DBFDFF 0%,#31F5FF 33.33%,#577EFF 66.67%,#FF93FF 100%),#FFEC84;border-radius:50%;padding:1px;box-shadow:0 0 10px 5px #000}input#termsPop~#hideTerms label>div{background:#08122F;width:100%;height:100%;border-radius:50%}input#termsPop~#hideTerms label i{opacity:0;position:absolute;width:50%;height:.15rem;background-color:#fff;left:25%;top:50%;transform:translateY(-50%);transition:all .3s ease}input#termsPop~#hideTerms label i:first-child{opacity:1;transform:translateY(-50%) rotate(45deg)}input#termsPop~#hideTerms label i:last-child{opacity:1;transform:translateY(-50%) rotate(-45deg)}input#termsPop:checked~#hideTerms{opacity:1;pointer-events:auto}input#menu:checked~header #headerContent nav{opacity:1;pointer-events:auto}input#menu:checked~header #headerContent label i{opacity:0}input#menu:checked~header #headerContent label i:first-child{opacity:1;transform:translateY(-50%) rotate(45deg)}input#menu:checked~header #headerContent label i:last-child{opacity:1;transform:translateY(-50%) rotate(-45deg)}header #headerContent label{z-index:6;width:3rem;height:3rem;display:block;position:absolute}header #headerContent label i{position:absolute;width:50%;height:.15rem;background-color:#fff;left:25%;top:50%;transform:translateY(-50%);transition:all .3s ease}header #headerContent label i:first-child{transform:translateY(-350%)}header #headerContent label i:last-child{transform:translateY(250%)}header #headerContent nav{position:fixed;width:100%;height:100%;overflow:auto;left:0;top:0;background-color:#000000b3;z-index:5;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;opacity:0;pointer-events:none;transition:all .5s ease}header #headerContent nav>dl{display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}header #headerContent nav>dl>dt{text-align:center;margin-bottom:2rem}header #headerContent nav>dl>dt:after{content:"";display:block;width:100%;height:2px;background:linear-gradient(270deg,#DBFDFF 0%,#31F5FF 33.33%,#577EFF 66.67%,#FF93FF 100%)}header #headerContent nav>dl>dt>a{text-align:center;font-size:1.6rem;padding:1.5rem 1rem;white-space:nowrap;display:block;letter-spacing:2px;cursor:pointer;font-weight:700}header #headerContent nav>dl>dt>a:hover{color:#22e2ff}header #headerContent nav>dl>dd{display:block;margin-top:1rem}header #headerContent nav>dl>dd>a{text-align:center;font-size:1.2rem;padding:1rem;padding-top:0;white-space:nowrap;letter-spacing:2px;padding-left:2px;cursor:pointer;display:block;font-weight:700}header #headerContent nav>dl>dd>a:hover{color:#22e2ff}body,html{font-family:Noto Sans TC,sans-serif;background:radial-gradient(ellipse at center,#152e77 0%,#08122f 100%);color:#fff;font-size:2.1vh;scroll-behavior:smooth!important;width:100%;height:100%;min-width:100%;min-height:100%}a{position:relative}img{transition:all .5s ease;width:100%;height:auto;-webkit-user-select:none;-moz-user-select:none;user-select:none}img.h{position:absolute;left:0;top:0;width:100%;opacity:0}#wrapper,#app{position:relative;width:100%;height:100%;overflow:hidden;z-index:2}#wrapper{max-width:1080px;margin:0 auto}#wrapper.off #main{opacity:0;pointer-events:none}#wrapper.off header{opacity:0;pointer-events:none}.mask{position:absolute;width:100%;height:100%;top:0;background:url(/monster/ca_2024/images/mask.png) center center no-repeat;background-size:cover;z-index:1;transition:all .5s ease}.mask>img{opacity:0;pointer-events:none}.mask.on{background-color:#00000080}.scene{position:absolute;width:100vh;height:100vh;z-index:0;perspective:1500px;left:50%;top:50%;transform:translate(-50%,-50%);transition:all .5s ease}.scene.on{filter:blur(5px)}.scene .cube{width:100%;height:100%;position:relative;transform-style:preserve-3d;transform:translateZ(-50vh);transition:transform .1s}.scene .cube__face{position:absolute;width:100vh;height:100vh;display:flex;flex-wrap:wrap;align-content:flex-start;justify-content:space-around;background-color:transparent}.scene .rectangle{width:.8vh;height:4vh;margin:5.064vh 2.4vh;box-shadow:0 0 10px #fff6}.scene .controls{position:fixed;bottom:20px;display:flex;gap:10px}.scene .controls button{padding:10px 20px;font-size:16px;cursor:pointer;background-color:#333;color:#fff;border:none;border-radius:5px;transition:background-color .3s}.scene .controls button:hover{background-color:#555}.contentBox{position:absolute;width:100%;height:90%;bottom:0;z-index:1;display:flex;flex-direction:column}.contentBox .gameContent{flex:1}.contentBox .gameContent .content{position:absolute;width:100%;top:0;transition:all .5s ease;opacity:0;pointer-events:none;transform:scale(.6)}.contentBox .gameContent .content.step1 .inputBox{margin-top:1.5rem}.contentBox .gameContent .content.step5 .mainTitle{margin-top:5vh}.contentBox .gameContent .content.step5 .optionTitle{line-height:2em;margin-top:7vh}.contentBox .gameContent .content.on{opacity:1;pointer-events:auto;transform:scale(1)}.contentBox .gameContent .content.step7{height:100%;display:flex;flex-direction:column}.contentBox .gameContent .content.step7 .mainTitle{width:45%;max-width:400px;flex:none}.contentBox .gameContent .content.step7 .cover{border-radius:1rem;height:20vh;margin:2vh auto;overflow:hidden;flex:none}.contentBox .gameContent .content.step7 .cover img{width:auto;height:100%}.contentBox .gameContent .content.step7 .creator{text-align:center;font-size:1rem;padding:2vh 0 0;flex:none}.contentBox .gameContent .content.step7 .creator span{padding:0 .5rem;color:#ff7b88}.contentBox .gameContent .content.step7 .btn{width:5vh;margin:0 auto}.contentBox .gameContent .content.step7 .lyrics{padding:0;background-color:#00000080;border-radius:1rem;width:80%;margin:2vh auto;color:#fff;flex:1;position:relative;max-width:500px;white-space:pre}.contentBox .gameContent .content.step7 .lyrics div{padding:2vh;position:absolute;width:90%;height:80%;left:5%;top:10%;flex:1;min-height:1px;overflow:auto;text-align:center;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}.contentBox .gameContent .content.step7 .lyrics div::-webkit-scrollbar{width:3px}.contentBox .gameContent .content.step7 .lyrics div::-webkit-scrollbar-track{background:rgba(255,255,255,.1);border-radius:10px}.contentBox .gameContent .content.step7 .lyrics div::-webkit-scrollbar-thumb{background:#FFEABA;border-radius:10px}.contentBox .gameContent .content.step7 .lyrics div::-webkit-scrollbar-thumb:hover{background:#F5DB9E}.contentBox .gameContent .content.step7 .lyrics div h6{font-size:1rem;margin-bottom:.5rem}.contentBox .gameContent .content.step7 .lyrics div p{font-size:.8rem;line-height:1.5em}.contentBox .gameContent .content.step7 .btnBox .btnStyle{min-width:inherit;width:80%;margin-top:1rem}.contentBox .gameContent .content.step7 .btnBox .btnStyle .icon{display:inline-block;vertical-align:middle;width:1rem;margin-right:.5rem}.contentBox .gameContent .content.step7 .btnBox .btnStyle p{display:inline-block;vertical-align:middle;font-size:1.2rem;padding-bottom:.2rem}.contentBox .gameContent .content.step7 .tip{text-align:center;font-size:1.5vh;line-height:1.5em;margin-top:1vh;padding-bottom:1vh}.contentBox .gameContent .content.step8 .form{margin:2rem auto 0;max-width:600px}.contentBox .gameContent .content.step8 .form>h6{text-align:center;font-size:1rem}.contentBox .gameContent .content.step8 .form ul{padding:0 10%}.contentBox .gameContent .content.step8 .form ul li{padding:.6rem 1rem;gap:8px;background:linear-gradient(180deg,rgba(199,224,244,.9) 22.66%,rgba(170,214,250,.9) 87.41%);box-shadow:0 0 80px 10px #08122f,inset 0 0 10px #0000004d;border-radius:1.2rem;text-align:center;margin-top:1rem;position:relative;display:flex;align-items:center}.contentBox .gameContent .content.step8 .form ul li.error:before{border:2px solid #FF7B88!important}.contentBox .gameContent .content.step8 .form ul li:before{content:"";position:absolute;width:100%;height:100%;border-radius:1.2rem;border:2px solid rgba(34,225,255,0);pointer-events:none;background:none;transition:all .3s ease;left:0}.contentBox .gameContent .content.step8 .form ul li:hover:before{border:2px solid rgb(34,225,255)}.contentBox .gameContent .content.step8 .form ul li p{flex:none;color:#000}.contentBox .gameContent .content.step8 .form ul li input{border:0;flex:1;width:1px;background:none;color:#08122f}.contentBox .gameContent .content.step8 .form ul li input:-webkit-autofill{background:none;color:#08122f;-webkit-box-shadow:0 0 0px 1000px rgb(170,214,250) inset}.contentBox .gameContent .content.step8 .form ul li input:hover,.contentBox .gameContent .content.step8 .form ul li input:focus,.contentBox .gameContent .content.step8 .form ul li input:active{background:none;color:#08122f;outline:none;box-shadow:none}.contentBox .gameContent .content.step8 .form ul li input::-moz-placeholder{text-align:left;color:#08122f66}.contentBox .gameContent .content.step8 .form ul li input::placeholder{text-align:left;color:#08122f66}.contentBox .gameContent .content.step8 .form>p{text-align:center;font-size:.8rem;margin:1rem 0;position:relative;z-index:1}.contentBox .gameContent .content.step8 .form #agreeBox{width:80%;margin:0 auto 2rem;display:flex;align-items:center}.contentBox .gameContent .content.step8 .form #agreeBox .agree{color:#fff;display:flex;align-items:center;flex:none;white-space:nowrap;padding-right:.5rem}.contentBox .gameContent .content.step8 .form #agreeBox .agree input{flex:none;margin-right:1vh}.contentBox .gameContent .content.step8 .form #agreeBox .agree p{flex:1;font-size:.7rem}.contentBox .gameContent .content.step8 .form #agreeBox a{color:#22e2ff;cursor:pointer;flex:1;font-size:.7rem}.contentBox .gameContent .content.step8 .form #agreeBox a:hover{text-shadow:0 0 5px rgb(0,0,0)}.contentBox .gameContent .content.step8 .btnBox .btnStyle{min-width:inherit;width:80%;margin-top:1rem}.contentBox .gameContent .content.step8 .btnBox .btnStyle .icon{display:inline-block;vertical-align:middle;width:1rem;margin-right:.5rem}.contentBox .gameContent .content.step8 .btnBox .btnStyle p{display:inline-block;vertical-align:middle;font-size:1.2rem;padding-bottom:.2rem}.contentBox .gameContent .content .btnsBox{display:flex;width:80%;max-width:500px;margin:0 auto}.contentBox .gameContent .content .btnsBox .btnStyle{flex:1;text-align:center;padding:.6rem 0 .7rem;font-size:0}.contentBox .gameContent .content .btnsBox .btnStyle:first-child{margin-right:1.5vh}.contentBox .gameContent .content .btnsBox .btnStyle .icon{display:inline-block;vertical-align:middle;width:1rem;margin-right:.5rem}.contentBox .gameContent .content .btnsBox .btnStyle p{display:inline-block;vertical-align:middle;font-size:1.2rem;line-height:1em;padding-bottom:.1rem}.contentBox .gameContent .mainTitle{width:65%;max-width:500px;margin:0 auto}.contentBox .gameContent .inputNAme{text-align:center;padding-top:4vh;transition:all .5s ease;opacity:0;transform:scale(.6);pointer-events:none}.contentBox .gameContent .inputNAme.on{opacity:1;transform:scale(1);pointer-events:auto}.contentBox .gameContent .inputNAme>p{font-size:1rem;line-height:1.5em;letter-spacing:2px}.contentBox .gameContent .typeWords{text-align:center;padding-top:2vh}.contentBox .gameContent .typeWords+p{font-size:.8rem;padding:2rem 1rem 1rem;text-align:center}.contentBox .gameContent .typeWords .inputEffect{position:relative;gap:8px;background:linear-gradient(180deg,rgba(199,224,244,.9) 22.66%,rgba(170,214,250,.9) 87.41%);box-shadow:0 0 80px 10px #08122f,inset 0 0 10px #0000004d;border-radius:1.2rem;width:80%;margin:2rem auto 0;overflow:hidden}.contentBox .gameContent .typeWords .inputEffect.on .btn.firework .icon{animation:bounceIn .5s linear}.contentBox .gameContent .typeWords .inputEffect.on .btn.firework .effect:before{animation:fireworkLine .5s linear .1s}.contentBox .gameContent .typeWords .inputEffect.on .btn.firework .effect:after{animation:fireworkPoint .5s linear .1s}.contentBox .gameContent .typeWords .inputEffect.on .fakeText,.contentBox .gameContent .typeWords .inputEffect.on textarea{transition:all 1s .3s ease;opacity:1}.contentBox .gameContent .typeWords .inputEffect .fakeText{position:absolute;width:100%;top:50%;transform:translateY(-50%);transition:all .3s ease;opacity:0;color:#08122f;padding:1rem 2rem;line-height:1.3em;pointer-events:none;z-index:1}.contentBox .gameContent .typeWords .inputEffect .fakeText.placeholder{color:#999}.contentBox .gameContent .typeWords .inputEffect input,.contentBox .gameContent .typeWords .inputEffect textarea{margin-top:0;transition:all .3s ease;width:100%;background:none;opacity:0}.contentBox .gameContent .typeWords .inputEffect .wrap{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:3}.contentBox .gameContent .typeWords .inputEffect .btn.firework{border-radius:50%;border:0;padding:24px 12px;width:120px;height:120px;background:none;cursor:pointer}.contentBox .gameContent .typeWords .inputEffect .btn.firework .btn__effect{display:block;position:relative}.contentBox .gameContent .typeWords .inputEffect .btn.firework .btn__effect .effect-group{position:absolute;top:0;left:0;width:100%;height:100%}.contentBox .gameContent .typeWords .inputEffect .btn.firework .btn__effect .effect-group .effect{display:block;position:absolute;top:20%;left:50%;width:24px;transform-origin:0px 2px}.contentBox .gameContent .typeWords .inputEffect .btn.firework .btn__effect .effect-group .effect:nth-child(2){transform:rotate(72deg)}.contentBox .gameContent .typeWords .inputEffect .btn.firework .btn__effect .effect-group .effect:nth-child(3){transform:rotate(144deg)}.contentBox .gameContent .typeWords .inputEffect .btn.firework .btn__effect .effect-group .effect:nth-child(4){transform:rotate(216deg)}.contentBox .gameContent .typeWords .inputEffect .btn.firework .btn__effect .effect-group .effect:nth-child(5){transform:rotate(288deg)}.contentBox .gameContent .typeWords .inputEffect .btn.firework .btn__effect .effect-group .effect:before{content:"";display:block;position:absolute;right:0;border-radius:2px;height:4px;background:#FFF}.contentBox .gameContent .typeWords .inputEffect .btn.firework .btn__effect .effect-group .effect:after{content:"";display:block;position:absolute;top:10px;right:10%;border-radius:50%;width:4px;height:4px;background:#FFF;transform:scale(0)}.contentBox .gameContent .typeWords .magicBtn>p{line-height:1.5em}.contentBox .gameContent .typeWords .magicBtn a{width:12vh;height:12vh;border-radius:50%;background:linear-gradient(180deg,#DBFDFF 0%,#31F5FF 33.33%,#577EFF 66.67%,#FF93FF 100%),#FFEC84;display:block;position:relative;padding:.1rem;margin:2rem auto 1rem;box-shadow:0 0 20px #fffc;cursor:pointer}.contentBox .gameContent .typeWords .magicBtn a p{background-color:#08122f;position:absolute;width:93%;height:93%;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;z-index:1}.contentBox .gameContent .typeWords .magicBtn a p:before{content:"";position:absolute;z-index:0;width:100%;height:100%;left:50%;top:50%;transform:translate(-50%,-50%) scale(.5);border-radius:50%;background-color:#867797;animation:scale_ani 2s linear infinite}.contentBox .gameContent .typeWords .magicBtn a p span{display:block;width:88%;position:absolute;padding:15%;border-radius:50%;background:linear-gradient(180deg,#DBFDFF 0%,#31F5FF 33.33%,#577EFF 66.67%,#FF93FF 100%),#FFEC84;left:50%;top:50%;transform:translate(-50%,-50%)}.contentBox .gameContent .optionTitle{text-align:center;font-size:1.2rem;letter-spacing:1px;padding-top:2vh;font-weight:700}.contentBox .gameContent .optionTitle span{color:#ff7b88;margin:0 .2rem;padding:0 .4rem;position:relative}.contentBox .gameContent .optionTitle span:after{content:"";position:absolute;width:100%;height:1px;background-color:#ff7b88;bottom:0;left:0}.contentBox .gameContent .objectList{margin:1rem auto 0;padding:0 2rem;max-width:600px}.contentBox .gameContent .objectList ul li{padding:1vh 1rem;transition:all .3s ease}.contentBox .gameContent .objectList ul li.off{opacity:.5;filter:grayscale(100%)}.contentBox .gameContent .objectList ul li:nth-child(2) a{background-color:#ea8693;box-shadow:0 0 8px #ea8693}.contentBox .gameContent .objectList ul li:nth-child(2) a:hover{box-shadow:0 0 15px #ea8693}.contentBox .gameContent .objectList ul li:nth-child(3) a{background-color:#8dc06b;box-shadow:0 0 8px #8dc06b}.contentBox .gameContent .objectList ul li:nth-child(3) a:hover{box-shadow:0 0 15px #8dc06b}.contentBox .gameContent .objectList ul li:nth-child(4) a{background-color:#e56c36;box-shadow:0 0 8px #e56c36}.contentBox .gameContent .objectList ul li:nth-child(4) a:hover{box-shadow:0 0 15px #e56c36}.contentBox .gameContent .objectList ul li:nth-child(5) a{background-color:#00807c;box-shadow:0 0 8px #00807c}.contentBox .gameContent .objectList ul li:nth-child(5) a:hover{box-shadow:0 0 15px #00807c}.contentBox .gameContent .objectList ul li a{display:block;border-radius:10rem;background:#00aed5;display:flex;align-items:center;padding:2.2vh 2rem;box-shadow:0 0 8px #00aed5;cursor:pointer;font-weight:700}.contentBox .gameContent .objectList ul li a:hover{box-shadow:0 0 15px #00aed5}.contentBox .gameContent .objectList ul li a .icon{flex:none;width:1.2rem;height:1.2rem;position:relative}.contentBox .gameContent .objectList ul li a .icon img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.contentBox .gameContent .objectList ul li a p{flex:1;text-align:center;font:1.2rem sans-serif;font-weight:700}.contentBox .gameContent .cityList{margin:1rem auto 0;padding:0 2rem;max-width:600px}.contentBox .gameContent .cityList ul{display:flex;flex-wrap:wrap}.contentBox .gameContent .cityList ul li{padding:1vh;transition:all .3s ease;min-width:40%;flex:1}.contentBox .gameContent .cityList ul li.off{opacity:.5;filter:grayscale(100%)}.contentBox .gameContent .cityList ul li a{display:block;border-radius:10rem;background-repeat:no-repeat;background-size:cover;padding:2.2vh 2rem;box-shadow:0 0 8px #29dfef;cursor:pointer;font-weight:700}.contentBox .gameContent .cityList ul li a:hover{box-shadow:0 0 15px #29dfef}.contentBox .gameContent .cityList ul li a p{flex:1;text-align:center;font:1.2rem sans-serif;font-weight:700}.contentBox .btnBox{flex:none;padding-bottom:1.5vh}.contentBox .btnBox>p{text-align:center;font-size:1.2rem;letter-spacing:1px}.contentBox .btnBox>p.writing{line-height:5rem}.inputBox{text-align:center;margin-top:4vh;max-width:500px;margin:0 auto}.inputBox .inputTitle{text-align:center;font-size:1.2rem;letter-spacing:.3vh;z-index:2;font-weight:700;position:relative}.inputBox input,.inputBox textarea{padding:1rem 2rem;min-height:5rem;width:80%;gap:8px;background:linear-gradient(180deg,rgba(199,224,244,.9) 22.66%,rgba(170,214,250,.9) 87.41%);box-shadow:0 0 80px 10px #08122f,inset 0 0 10px #0000004d;border-radius:1.2rem;text-align:center;margin-top:1rem;position:relative;color:#08122f}.inputBox input:-webkit-autofill,.inputBox textarea:-webkit-autofill{background:linear-gradient(180deg,rgba(199,224,244,.9) 22.66%,rgba(170,214,250,.9) 87.41%);color:#08122f;-webkit-box-shadow:0 0 0px 1000px rgb(199,224,244) inset}.inputBox input:hover,.inputBox input:focus,.inputBox input:active,.inputBox textarea:hover,.inputBox textarea:focus,.inputBox textarea:active{background:linear-gradient(180deg,rgba(199,224,244,.9) 22.66%,rgba(170,214,250,.9) 87.41%);color:#08122f;outline:none}.inputBox input::-moz-placeholder,.inputBox textarea::-moz-placeholder{text-align:center;color:#08122f66}.inputBox input::placeholder,.inputBox textarea::placeholder{text-align:center;color:#08122f66}.btnStyle{background:#0A1C55;border:2px solid #22E2FF;box-shadow:0 0 5px #0aaaf7;border-radius:170px;text-align:center;width:60%;max-width:500px;padding:1rem 0;font-size:1.4rem;color:#fff;display:block;margin:0 auto;transition:all .3s ease}.btnStyle:hover{box-shadow:0 0 10px #0aaaf7;background:#051340}.btnStyle:disabled{opacity:.3}.stepBox{padding:0rem 2rem 1.4rem;opacity:0;transition:all .5s ease;width:100%;max-width:560px;margin:0 auto}.stepBox.on{opacity:1}.stepBox>p{text-align:center;line-height:2em;font-size:1.2rem;margin-bottom:.5rem}.stepBox .stepBar{border:1px solid #22E2FF;box-shadow:0 0 10px 2px #0aaaf7;border-radius:39px;height:.8rem;padding:2px}.stepBox .stepBar span{border-radius:20px;background-color:#22e2ff;display:block;height:100%;width:0%;transition:all .3s ease}.stepBox .stepBar span.step1{width:1%}.stepBox .stepBar span.step2{width:20%}.stepBox .stepBar span.step3{width:40%}.stepBox .stepBar span.step4{width:60%}.stepBox .stepBar span.step5{width:80%}.stepBox .stepBar span.step10{width:100%}#popup{position:fixed;width:100%;height:100%;z-index:999;background-color:#000000b3;left:0}#popup .content{width:80%;background-color:#040d26;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:500px}#popup .content h6{text-align:center;line-height:1.5em;margin-bottom:1rem;font-size:1.2rem;font-weight:700}#popup .content .btnBox .btnStyle{width:100%}.contentStyle{border-radius:1rem;border:1px solid #FFEABA;padding:2rem;max-width:600px;left:50%;transform:translate(-50%)}#main{height:100%;transition:all .5s ease}#main.on{filter:blur(3px)}#promot{z-index:2}#promot .gameContent{margin:2% 5% 5%;position:relative;height:1px}#promot .gameContent .contentStyle{height:100%;padding:0;position:absolute;width:100%;box-sizing:border-box;background:rgba(0,0,0,.3)}#promot .gameContent .contentStyle .promotBox{padding:5%;height:100%;box-sizing:border-box;position:relative;text-align:center;display:flex;flex-direction:column}#promot .gameContent .contentStyle .promotBox .title{flex:none;padding-bottom:.5rem;padding-left:.2rem}#promot .gameContent .contentStyle .promotBox .title h6{font-size:1.5rem;font-weight:700}#promot .gameContent .contentStyle .promotBox .title p{font-size:1.3rem;line-height:2.8rem;letter-spacing:.2rem;padding-left:.2rem}#promot .gameContent .contentStyle .promotBox .title p span{font-weight:700;font-size:1.4rem;color:#ffeaba;text-shadow:0 0 5px #22E2FF;margin-right:.3rem}#promot .gameContent .contentStyle .promotBox .splitBar{height:2px;background:linear-gradient(270deg,#DBFDFF 0%,#31F5FF 33.33%,#577EFF 66.67%,#FF93FF 100%);flex:none}#promot .gameContent .contentStyle .promotBox ul{margin:1rem 0;display:flex;flex:1;flex-wrap:wrap;overflow-y:auto}#promot .gameContent .contentStyle .promotBox ul li{background:linear-gradient(270deg,#DBFDFF 0%,#31F5FF 33.33%,#577EFF 66.67%,#FF93FF 100%);border-radius:1rem;padding:2px;overflow:hidden;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;min-width:40%;max-width:50%;flex:1;margin:1vh}#promot .gameContent .contentStyle .promotBox ul li .card{background:#fff;border-radius:calc(1rem - 2px);flex:1;overflow:hidden}#promot .gameContent .contentStyle .promotBox ul li .card .cover{height:12vh;background-repeat:no-repeat;background-size:cover}#promot .gameContent .contentStyle .promotBox ul li .card h4{color:#08122f;font-weight:700;font-size:1.4rem;line-height:1.5em}#promot .gameContent .contentStyle .promotBox ul li .card p{color:#08122f;font-size:.7rem}#promot .gameContent .contentStyle .promotBox ul li .card p span{color:#ff35ff;font-size:1.1rem;font-weight:700}#promot .gameContent .contentStyle .promotBox ul li .card .btn .btnStyle{font-size:1rem;padding:1vh 3vh;white-space:nowrap;width:auto;margin:.5rem 1rem;border:1px solid #22E2FF}#terms{z-index:2}#terms .gameContent{margin:2% 5% 5%;position:relative;height:1px}#terms .gameContent .contentStyle{height:100%;padding:0;position:absolute;width:100%;box-sizing:border-box;background:rgba(0,0,0,.6)}#terms .gameContent .contentStyle .termsBox{padding:5%;display:flex;flex-direction:column;height:100%}#terms .gameContent .contentStyle .termsBox .title{flex:none;padding-bottom:.5rem}#terms .gameContent .contentStyle .termsBox .title h6{font-size:1.4rem;font-weight:700;text-align:center;line-height:1.5em;letter-spacing:.2rem;padding-left:.2rem}#terms .gameContent .contentStyle .termsBox .title p{font-size:1.2rem;line-height:2.8rem}#terms .gameContent .contentStyle .termsBox .title p span{font-weight:700;font-size:1.4rem;color:#ffeaba;text-shadow:0 0 5px #22E2FF}#terms .gameContent .contentStyle .termsBox .splitBar{height:2px;background:linear-gradient(270deg,#DBFDFF 0%,#31F5FF 33.33%,#577EFF 66.67%,#FF93FF 100%);flex:none;width:15rem;margin:0 auto 1rem}#terms .gameContent .contentStyle .termsBox .termsContent{height:100%;flex:1;overflow:auto;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;font-size:.8rem;line-height:1.5em}#terms .gameContent .contentStyle .termsBox .termsContent .hl{color:#22e2ff;font-weight:700}#terms .gameContent .contentStyle .termsBox .termsContent ol{list-style-type:disc;padding-left:1.5em}#terms .gameContent .contentStyle .termsBox .termsContent ol li span{color:#ff7b88;padding:0 .3rem}#terms .gameContent .contentStyle .termsBox .termsContent ul{list-style-type:number;padding-left:1.5em}#terms .gameContent .contentStyle .termsBox .termsContent ul li span{color:#ff7b88}#testPhoto{position:fixed;z-index:0;left:0;bottom:0}#sharePhoto{width:1200px;position:fixed;z-index:0;opacity:1;pointer-events:none}#sharePhoto .content{text-align:center;position:absolute;top:250px;width:100%}#sharePhoto .content .cover{display:inline-block;width:240px;border-radius:20px;overflow:hidden}#sharePhoto .content p{font-size:24px;color:#fff;white-space:nowrap;line-height:1.5em;margin-top:30px}@media only screen and (min-width: 1024px){body,html{font-size:2vh}.contentBox .gameContent .mainTitle{margin-top:3rem;max-width:400px}.contentBox .gameContent .typeWords{margin-top:6rem}.contentBox .gameContent .typeWords .magicBtn{margin-top:3rem}.contentBox .gameContent .content.step5 .optionTitle{font-size:1.4rem}.contentBox .gameContent .objectList ul li,.contentBox .gameContent .cityList ul li{padding:1.6vh 1rem}.contentBox .gameContent .objectList ul li a .icon,.contentBox .gameContent .cityList ul li a .icon{width:2rem}.contentBox .gameContent .objectList ul li a p,.contentBox .gameContent .cityList ul li a p{font-size:1.4rem}}
