*{margin:0;padding:0;box-sizing:border-box}html,body{margin:0;padding:0;width:100%;height:100%;color:#000;background-color:#000;overflow:hidden}.no-scroll{overflow:hidden;position:fixed;width:100%;height:100%}#ar-scene{position:fixed;top:0;left:0;width:100vw;height:100vh;overflow:hidden}#camera-feed{position:absolute;top:0;left:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transform:scaleX(-1)}.toggle{position:fixed;bottom:7dvh;left:80dvw;transform:translate(-50%,-50%);width:10dvw;z-index:10;opacity:0;transition:opacity .3s ease-in}.capture{position:fixed;bottom:5dvh;left:50dvw;transform:translate(-50%,-50%);width:15dvw;z-index:15;opacity:0;transition:opacity .3s ease-in}.intro-ui{position:fixed;top:0;left:0;right:0;bottom:0;z-index:10;background:#000;display:flex;justify-content:center;align-items:center;flex-direction:column;font-family:sans-serif;transition:1.5s;opacity:1;pointer-events:auto}.instruction{position:absolute;top:50dvh;left:50dvw;transform:translate(-50%,-50%);width:80dvw;z-index:20}.title{position:absolute;transform:translate(-50%,-50%);top:5%;left:50%;color:#444;font-size:5dvw;letter-spacing:.1em;text-align:center;font-weight:700;font-family:Noto Sans TC,sans-serif}.card{width:100%;display:block}.start{position:absolute;transform:translate(-50%,-50%);bottom:-25dvw;left:50%;width:86%;z-index:35;opacity:0;transition:1s;pointer-events:none}.wrapper{position:absolute;transform:translate(-50%,-50%);top:45%;left:50%;width:100%;height:65%;overflow:hidden;z-index:21}.illustration{position:absolute;transform:translate(-17%,-50%);top:25%;left:50%;width:300%;z-index:21;transition:transform 1s ease-in-out}.text-instr{position:absolute;transform:translate(-50%,-50%);top:78%;left:50%;height:50%;z-index:21;opacity:0;transition:transform 1s ease-in-out,opacity .5s ease-in}.progress{position:absolute;transform:translate(-50%,-50%);bottom:5%;left:50%;width:12%;z-index:26;opacity:0}.notice{position:absolute;transform:translate(-50%,-50%);bottom:10%;left:50%;width:76%;z-index:21;opacity:0;transition:opacity .5s ease-in}#three-canvas.hide{opacity:0!important;pointer-events:none}.preview{position:absolute;top:50%;left:50%;height:100%;display:none;z-index:1;transform:translate(-50%,-50%);-o-object-fit:contain;object-fit:contain;pointer-events:none}.show{opacity:1!important;display:block!important}.enable{opacity:1!important;display:block!important;pointer-events:auto!important}.hide{opacity:0!important;display:none!important}.lang-pos-0{top:0!important}.lang-pos-1{top:12dvw!important}.lang-pos-2{top:24dvw!important}.lang-pos-3{top:36dvw!important}.close{position:absolute;top:4%;right:5%;width:4dvw;height:4dvw;cursor:pointer;pointer-events:auto;z-index:40}.scroll{position:absolute;transform:translate(-50%,-50%);top:50%;left:50%;width:80dvw;height:127dvw;z-index:28;opacity:1}.lang-wrapper{position:absolute;transform:translate(-50%);top:5dvh;right:1dvw;width:10dvw;height:46dvw;z-index:25}.lang{position:absolute;top:0;right:0;width:100%;z-index:29}.lang-ch,.lang-en,.lang-jp{position:absolute;top:0dvw;right:0;width:100%;z-index:25;opacity:0;transition:top .5s ease-in-out}.demo-1,.demo-2{opacity:0;pointer-events:none;transition:opacity 1s ease-in-out}.demo-info-1,.demo-info-2{position:absolute;bottom:10dvh;left:50dvw;transform:translate(-50%,-50%);width:78dvw;opacity:0;transition:opacity 1s ease-in-out}.demo-il-1,.demo-il-2{position:absolute;top:55dvh;left:50dvw;transform:translate(-50%,-50%);width:16dvw;transition:opacity 1s ease-in-out,left 1s ease-out}.pan{left:40dvw!important}.func{position:fixed;top:0;left:0;width:100%;height:100%;z-index:15;opacity:0;pointer-events:none;transition:opacity 1s ease-in}.share{position:absolute;bottom:10dvh;left:26dvw;transform:translate(-50%,-50%);width:40dvw;z-index:29;cursor:pointer;opacity:1;pointer-events:none;transition:opacity 1s ease-out}.retake{position:absolute;bottom:10dvh;left:74dvw;transform:translate(-50%,-50%);width:40dvw;z-index:29;cursor:pointer;opacity:1;pointer-events:none;transition:opacity 1s ease-out}