html{height:100%}body{background-color:#eec277;margin:0;font-family:PingFang SC,Hiragino Sans GB,Microsoft Yahei,sans-serif}p,h1,h2{margin:0}ul,ol,li{margin:0;padding:0;list-style:none}.hide{display:none!important}#app{height:100vh;position:relative;overflow-y:auto}.overflowh #app{overflow-y:hidden}.map{z-index:5;visibility:hidden;background:#fff url(../img/map01.jpg) top/100% no-repeat;width:100%;height:110vh;transition:visibility .6s;position:absolute;top:0;left:0;overflow-x:hidden}.map.active{opacity:1;visibility:visible}.map .point{color:#fff;z-index:10;font-size:0;position:absolute}.map .point:after,.map .point:before{content:" ";background-color:#fffc;border-radius:10px;width:20px;height:20px;animation:1s linear infinite flashDot;position:absolute;top:35%;left:48%}.map .point:before{transform:scale(.5)}.map .point:nth-child(odd):after{animation-delay:.5s}@keyframes flashDot{0%{opacity:.5}50%{opacity:1}to{opacity:.5}}.point[data-pid="0"]{width:20vw;height:20vw;top:104vw;left:20vw}.point[data-pid="1"]{width:20vw;height:20vw;top:137vw;left:30vw}.point[data-pid="2"]{width:20vw;height:17vw;top:71vw;left:47vw}.point[data-pid="3"]{width:28vw;height:20vw;top:34%;left:8vw}.point[data-pid="4"]{width:20vw;height:20vw;top:50vw;left:64vw}.point[data-pid="5"]{width:30vw;height:20vw;top:20vw;left:67vw}.btn-menu{z-index:10;background:#3ca7b1 url(../img/icon-back.svg) 0 0/100% no-repeat;border-radius:50%;width:30px;height:30px;position:absolute;top:10px;right:10px;transform:rotate(90deg);box-shadow:0 0 4px #00000080}.map .tree{z-index:10;width:6vw;position:absolute}.map .tree[data-pid="1"]{top:52vw;left:23vw}.map .tree[data-pid="2"]{top:109vw;left:51vw}.map .tree[data-pid="3"]{top:154vw;left:80vw}.map .bridge{z-index:2;width:37vw;position:absolute;top:40%;right:-17vw}.map .ship{z-index:1;width:40vw;animation:60s linear infinite ship_run;position:absolute;top:58vw;right:-28vw}@keyframes ship_run{to{transform:rotate(-360deg)}}.maker{box-sizing:border-box;background:#3ca7b1 50%/100% 100% no-repeat;width:100%;position:absolute;bottom:0;left:0}.maker p{text-align:center;color:#fff;padding:20px 15px;font-size:14px;line-height:1.5em}.maker p em{font-style:normal;font-weight:700}.page{z-index:10;box-sizing:border-box;color:#000;background-color:#fff;height:100vh;padding:45px 15px 0;display:none;position:relative}.page.active{scroll-behavior:smooth;display:block;overflow:scroll hidden}.page>video{z-index:1;object-fit:cover;width:100%;height:100%;position:absolute;top:0;left:0}.btn-showcon{z-index:2;color:#fff;box-sizing:border-box;background-color:#000c;border:1px solid #fff;border-radius:4px;padding:6px 20px;position:absolute;bottom:20px;right:20px}.btn-showcon.hidden{display:none}.conbox{z-index:5;width:100%;height:100%;display:none;position:absolute;top:0;left:0}.conbox.active{background-color:#00000080;flex-direction:column;justify-content:center;align-items:center;display:flex}.conbox .inner{width:80%;position:relative}.conbox .inner h2 img{vertical-align:top;width:100%}.conbox .inner .content{box-sizing:border-box;background:url(../img/bg-card.png?v2) bottom/100% no-repeat;padding:0 30px 30px}.conbox .inner .content .text{height:22vh;overflow-y:auto}.conbox .inner .content .text div{white-space:pre-wrap;word-break:break-word;text-align:justify;height:max-content;font-size:14px;line-height:1.6em}.conbox .inner .btn-close{z-index:2;background:url(../img/btn-close.png) 50%/100% no-repeat;width:30px;height:30px;margin-left:-15px;position:absolute;top:-15px;right:-15px}@keyframes fadeIn{to{opacity:1}}@-webkit-keyframes btnZoom{0%{-webkit-transform:scale(1)}50%{-webkit-transform:scale(1.1)}to{-webkit-transform:scale(1)}}@keyframes btnZoom{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}@media only screen and (width>=992px){body{background-color:#69bff2}#app{width:56vh;margin:0 auto}.btn-close,.btn-showcon,.btn-menu,.point{cursor:pointer}.point[data-pid="0"]{width:20%;height:10vh;top:53%;left:20%}.point[data-pid="1"]{width:20%;height:10vh;top:70%;left:30%}.point[data-pid="2"]{width:18%;height:10vh;top:35%;left:47%}.point[data-pid="3"]{width:29%;height:10vh;top:37%;left:8%}.point[data-pid="4"]{width:20%;height:10vh;top:26%;left:64%}.point[data-pid="5"]{width:30%;height:10vh;top:11%;left:68%}.map .tree{width:6%}.map .tree[data-pid="1"]{top:26%;left:23%}.map .tree[data-pid="2"]{top:54%;left:50%}.map .tree[data-pid="3"]{top:77%;left:79%}.map .bridge{z-index:2;width:40%;position:absolute;top:41%;right:-17%}.map .ship{z-index:1;width:46%;animation:60s linear infinite ship_run;position:absolute;top:30%;right:-36%}}.btn-start{z-index:5;background:url(../img/btn-next1.png) 0 0/100% no-repeat;width:30px;height:30px;margin-left:-15px;animation:2s infinite forwards tips_scroll;position:absolute;bottom:1%;left:50%}@keyframes tips_scroll{0%{transform:translateY(0)}50%{transform:translateY(-10px)}to{transform:translateY(0)}}@media only screen and (width>=992px){.btn-start{cursor:pointer}}.cover[data-v-c4ed8f6d]{z-index:102;background-color:#f6eedb;width:100%;height:100vh;animation:.6s ease-out forwards coverEnter-c4ed8f6d;position:fixed;top:0;left:0;overflow:hidden}@keyframes coverEnter-c4ed8f6d{0%{opacity:0}to{opacity:1}}.cover.fadeout[data-v-c4ed8f6d]{opacity:0;transition:transform .6s,opacity .6s;transform:translateY(-100%)}.cover .ct[data-v-c4ed8f6d]{z-index:2;opacity:0;background:url(../img/ct.png) 0 0/100% no-repeat;width:100%;height:100%;animation:3s forwards fadeIn-c4ed8f6d;position:absolute;top:0;left:0;transform:translateY(20px)}.cover .bg[data-v-c4ed8f6d]{z-index:1;background:url(../img/bg1.jpg) 0 0/cover no-repeat;width:100%;height:100%;position:absolute;top:0;left:0}@keyframes fadeIn-c4ed8f6d{to{opacity:1;transform:translateY(0)}}.cover .logo[data-v-c4ed8f6d]{z-index:5;background:url(../img/paper-logo.png) 0 0/100% no-repeat;width:80px;height:50px;position:absolute}.cover .icon-lt[data-v-c4ed8f6d]{top:20px;left:20px}.cover .icon-rt[data-v-c4ed8f6d]{top:10px;right:10px}.cover .icon-cb[data-v-c4ed8f6d]{bottom:10px;left:50%;transform:translate(-50%)}.btn-next[data-v-c4ed8f6d]{z-index:1;width:120px;height:40px;margin-left:-60px;animation:1s linear infinite btnZoom;position:absolute;bottom:10%;left:50%}@media only screen and (width>=992px){#app[data-v-c4ed8f6d]{width:56vh;margin:0 auto}.cover[data-v-c4ed8f6d]{width:56vh;height:100vh;margin-left:-28vh;left:50%}}