.hero-text-cont[data-v-44d7e1a2]{cursor:default;overflow:hidden;width:100%;height:100vh;display:grid;grid-template-columns:repeat(17,1fr);grid-template-rows:repeat(8,1fr)}.hero-text-cont .block[data-v-44d7e1a2]{font-family:"Noto Serif SC";font-weight:100;width:100%;height:12.5vh;position:relative;perspective:1000px}.hero-text-cont .block span[data-v-44d7e1a2]{transition-timing-function:ease-in-out;position:relative;display:block;width:100%;height:100%;font-size:5vw;backface-visibility:hidden;font-weight:100;display:flex;align-items:center;justify-content:center;transform:rotateY(0);transition-duration:.4s}.hero-text-cont .block.flip span[data-v-44d7e1a2]{transform:rotateY(180deg)}.hero-text-cont .block[data-v-44d7e1a2]:after{font-size:1.5vw;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;transition-timing-function:ease-in-out;transition-duration:.4s;position:absolute;top:0;left:0;width:100%;height:100%;backface-visibility:hidden;transform:rotateY(180deg)}.hero-text-cont .block:nth-child(4n)[data-v-44d7e1a2]:after{content:"HTML";background-color:#cc421c}.hero-text-cont .block:nth-child(4n-1)[data-v-44d7e1a2]:after{content:"CSS";background-color:#8745ca}.hero-text-cont .block:nth-child(4n-2)[data-v-44d7e1a2]:after{content:"JS";background-color:#61630e}.hero-text-cont .block:nth-child(4n-3)[data-v-44d7e1a2]:after{content:"Vue";background-color:#0f7949}.hero-text-cont .block:hover span[data-v-44d7e1a2]{transition-duration:0ms;transform:rotateY(180deg)}.hero-text-cont .block:hover[data-v-44d7e1a2]:after{transition-duration:0ms;transform:rotateY(360deg)}.home[data-v-da51c009]{position:relative}@keyframes flip{0%{transform:rotateY(180deg)}to{transform:rotateY(0)}}.project[data-v-f389a92d]{position:relative}.project .view-mask[data-v-f389a92d]{transition-duration:.4s;pointer-events:none;padding:8px;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0000;z-index:200;display:flex;justify-content:flex-end}.project .view-mask .view-cont[data-v-f389a92d]{display:grid;grid-template-rows:auto auto 1fr auto;font-family:"Noto Serif SC";transition-duration:.6s;border-radius:12px;width:50vw;height:100%;background-color:#fff;transform:translate(calc(100% + 16px))}.project .view-mask .view-cont .view-link[data-v-f389a92d]{margin:0 16px 16px;display:flex;justify-content:flex-end;align-items:center}.project .view-mask .view-cont .view-link a[data-v-f389a92d]{margin-right:12px;font-weight:400;position:relative;width:fit-content;text-decoration:none;font-size:18px;color:#111}.project .view-mask .view-cont .view-link a[data-v-f389a92d]:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:0;transform:scaleX(0);box-shadow:0 0 0 1px #2c64ff;transition-duration:.4s;transform-origin:top left}.project .view-mask .view-cont .view-link a[data-v-f389a92d]:hover:after{transform:scaleX(1)}.project .view-mask .view-cont .view-website[data-v-f389a92d]{pointer-events:none;position:relative;width:100%;height:100%}.project .view-mask .view-cont .view-website .view-inner[data-v-f389a92d]{border:1px solid #e2e2e2;background-color:#f7f7f7;border-radius:8px;overflow:hidden;position:absolute;top:12px;left:12px;width:calc(100% - 24px);height:calc(100% - 24px)}.project .view-mask .view-cont .view-website .view-inner .view-text[data-v-f389a92d]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:18px;color:#a0a0a0}.project .view-mask .view-cont .view-website .view-inner .view-iframe[data-v-f389a92d]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.67);width:150%;height:150%}.project .view-mask .view-cont .view-desc[data-v-f389a92d]{padding:16px}.project .view-mask .view-cont .view-desc .name[data-v-f389a92d]{margin:12px;font-size:28px;font-weight:600}.project .view-mask .view-cont .view-desc .desc[data-v-f389a92d]{margin-left:12px;font-size:18px;color:#a0a0a0}.project .view-mask .view-cont .view-header[data-v-f389a92d]{border-bottom:1px solid #e2e2e2;font-weight:100;font-size:14px;padding:8px 16px;display:flex;justify-content:space-between}.project .view-mask .view-cont .view-header .desc[data-v-f389a92d]{color:#a0a0a0}.project .view-mask .view-cont .view-header .close[data-v-f389a92d]{cursor:pointer;font-weight:600;color:#111}.project .view-mask.show[data-v-f389a92d]{pointer-events:auto;background-color:#0006}.project .view-mask.show .view-cont[data-v-f389a92d]{transform:translate(0)}.project .project-list[data-v-f389a92d]{position:relative;width:100%}.project .project-list .project-item[data-v-f389a92d]{position:relative;font-family:"Noto Serif SC";font-weight:100;border-top:1px solid #e2e2e2;display:block;text-decoration:none;color:#111;font-size:2.5vw;padding:30px 20px;animation:text-in 1s ease-out forwards;animation-timeline:view(60% 0);animation-range:contain;opacity:0;transform:translateY(80%)}.project .project-list .project-item span[data-v-f389a92d]{transition-duration:.2s;position:relative}.project .project-list .project-item[data-v-f389a92d]:before{transition-duration:.3s;content:"";position:absolute;top:0;left:0;width:100%;height:100%;transform:scaleY(0);background-color:#2c64ff}.project .project-list .project-item[data-v-f389a92d]:last-child{border-bottom:1px solid #e2e2e2}.project .project-list .project-item:hover[data-v-f389a92d]{color:#fff}.project .project-list .project-item:hover[data-v-f389a92d]:before{transform:scaleY(1)}@keyframes text-in{0%{opacity:0;transform:translateY(80%)}to{opacity:1;transform:translateY(0)}}.float-blog .inner{color:#111;font-family:"Noto Serif SC";font-weight:600}.float-blog .inner img{border-radius:12px;width:100%;height:200px;object-fit:cover;display:block}.blog[data-v-d1e8091f]{position:relative}.blog .float-blog[data-v-d1e8091f]{overflow:hidden;padding:8px;pointer-events:none;position:fixed;top:0;left:0;width:600px;background-color:#fff;border-radius:16px;box-shadow:0 0 16px #0002;z-index:200;transition-duration:.3s;transition-property:transform,height,opacity;transform:translateY(-50%) scale(.8);opacity:0}.blog .float-blog.show[data-v-d1e8091f]{transform:translateY(0) scale(1);opacity:1}.blog .float-blog .inner[data-v-d1e8091f]{transform-origin:top left;width:180%;scale:.556}.blog .blog-list[data-v-d1e8091f]{position:relative;width:100%}.blog .blog-list .blog-item[data-v-d1e8091f]{position:relative;font-family:"Noto Serif SC";font-weight:100;border-top:1px solid #e2e2e2;display:block;text-decoration:none;color:#111;font-size:2.5vw;padding:30px 20px;animation:text-in 1s ease-out forwards;animation-timeline:view(60% 0);animation-range:contain;opacity:0;transform:translateY(80%)}.blog .blog-list .blog-item span[data-v-d1e8091f]{transition-duration:.2s;position:relative}.blog .blog-list .blog-item[data-v-d1e8091f]:before{transition-duration:.3s;content:"";position:absolute;top:0;left:0;width:100%;height:100%;transform:scaleY(0);background-color:#2c64ff}.blog .blog-list .blog-item[data-v-d1e8091f]:last-child{border-bottom:1px solid #e2e2e2}.blog .blog-list .blog-item:hover[data-v-d1e8091f]{color:#fff}.blog .blog-list .blog-item:hover[data-v-d1e8091f]:before{transform:scaleY(1)}.project[data-v-c8b3e683],.project[data-v-76104814]{position:relative}html,html #app{width:100%;height:100%}html body{margin:0;padding:0;background-color:#f7f7f7;width:100%;height:100%}html body *{box-sizing:border-box}html body .foot{margin-top:128px;border-top:1px solid #e2e2e2;padding:16px 24px}html body .foot a{position:relative;width:fit-content}html body .foot a:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:0;transform:scaleX(0);box-shadow:0 0 0 1px #2c64ff;transition-duration:.4s;transform-origin:top left}html body .foot a:hover:after{transform:scaleX(1)}html body .foot .nav{display:grid;grid-template-columns:3fr 1fr 1fr 1fr}html body .foot .nav .nav-item{font-family:"Noto Serif SC"}html body .foot .nav .nav-item .title{font-weight:500;color:#a0a0a0;font-size:14px;margin-bottom:12px}html body .foot .nav .nav-item .item{margin:8px 0;text-decoration:none;display:block;color:#111;font-size:13px}html body .foot .foot-toy{margin-top:128px;display:flex;justify-content:space-between;align-items:flex-end}html body .foot .foot-toy .toy{height:70px;display:flex;align-items:flex-end;gap:4px}html body .foot .foot-toy .toy .toy-item{transition-duration:.4s;cursor:default;font-size:12px;color:#111;border-radius:8px;border:1px solid #e2e2e2;width:46px;height:46px;display:flex;align-items:center;justify-content:center}html body .foot .foot-toy .toy .toy-item:hover{width:70px;height:70px}html body .foot .foot-toy .beian{font-family:"Noto Serif SC";position:relative;display:flex;justify-content:center;align-items:center;gap:12px;font-size:12px;color:#111}html body .foot .foot-toy .beian .beian-item{color:#111;text-decoration:none;display:flex;align-items:center;justify-content:center;gap:4px}html body .foot .foot-toy .beian .beian-item img{object-fit:contain;width:1.2em;height:1.2em}html body .head-bar{z-index:100;padding:8px;position:fixed;top:0;left:0;width:100%;height:76px;display:flex;justify-content:space-between;pointer-events:none}html body .head-bar .head-item{box-shadow:0 0 12px #00000001;width:60px;height:60px;border-radius:12px;text-decoration:none}html body .head-bar .head-menu{pointer-events:auto;display:flex;align-items:center;gap:4px;background-color:#f7f7f7;box-shadow:0 0 0 12px #f7f7f7}html body .head-bar .head-menu:first-child{border-bottom-right-radius:12px}html body .head-bar .head-menu:last-child{border-bottom-left-radius:12px}html body .head-bar .head-menu .head-menu-item{background-color:#fff;color:#111;width:60px;transition-duration:.4s;cursor:pointer;display:flex;align-items:center;justify-content:center}html body .head-bar .head-menu .head-menu-item .head-menu-item-cont{height:24px;width:60px;overflow:hidden;text-align:center;line-height:24px}html body .head-bar .head-menu .head-menu-item .head-menu-item-cont .iconfont{transition-property:transform;transition-delay:.2s;transition-duration:.2s;color:inherit;text-decoration:none;display:block}html body .head-bar .head-menu .head-menu-item .head-menu-item-cont .head-menu-item-text{font-family:"Noto Serif SC";font-size:14px;transition-property:transform;transition-delay:.1s;transition-duration:.2s;display:block}html body .head-bar .head-menu .head-menu-item:hover{background-color:#2c64ff;color:#fff;width:100px}html body .head-bar .head-menu .head-menu-item:hover .iconfont{transform:translateY(-24px);transition-delay:.1s}html body .head-bar .head-menu .head-menu-item:hover .head-menu-item-text{transform:translateY(-24px);transition-delay:.2s}html body .head-bar .head-menu .head-menu-item.active{background-color:#2c64ff;color:#fff}html body .head-bar .head-bar-home{pointer-events:auto;background-color:#2c64ff;color:#fff;text-align:center;line-height:60px;font-size:32px;font-weight:900;box-shadow:0 0 0 12px #f7f7f7}html{font-family:Arial,Helvetica}