acquizhang
/
404.html



<!DOCTYPE html>
<html lang="zh-CN" data-default-color-scheme=&#34;auto&#34;>


<head>
  <meta charset="UTF-8">
  <link rel="apple-touch-icon" sizes="76x76" href="/img/favicon.jpg">
  <link rel="icon" type="image/png" href="/img/favicon.jpg">
  <meta name="viewport"
        content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, shrink-to-fit=no">
  <meta http-equiv="x-ua-compatible" content="ie=edge">

  <meta name="theme-color" content="#2f4154">
  <meta name="description" content="">
  <meta name="author" content="acqui~zhang">
  <meta name="keywords" content="">
  <title>页面走丢啦~ - acqui~zhang</title>

  <link  rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" />


<!-- 主题依赖的图标库，不要自行修改 -->

<link rel="stylesheet" href="//at.alicdn.com/t/font_1749284_ba1fz6golrf.css">


<link rel="stylesheet" href="//at.alicdn.com/t/font_1736178_kmeydafke9r.css">


<link  rel="stylesheet" href="/css/main.css" />

<!-- 自定义样式保持在最底部 -->


  <script id="fluid-configs">
    var Fluid = window.Fluid || {};
    var CONFIG = {"hostname":"example.com","root":"/","version":"1.8.7","typing":{"enable":true,"typeSpeed":70,"cursorChar":"_","loop":false},"anchorjs":{"enable":true,"element":"h1,h2,h3,h4,h5,h6","placement":"right","visible":"hover","icon":""},"progressbar":{"enable":true,"height_px":3,"color":"#29d","options":{"showSpinner":false,"trickleSpeed":100}},"copy_btn":true,"image_zoom":{"enable":true},"toc":{"enable":true,"headingSelector":"h1,h2,h3,h4,h5,h6","collapseDepth":0},"lazyload":{"enable":true,"onlypost":false},"web_analytics":{"enable":false,"baidu":null,"google":null,"gtag":null,"tencent":{"sid":null,"cid":null},"woyaola":null,"cnzz":null,"leancloud":{"app_id":null,"app_key":null,"server_url":null}}};
  </script>
  <script  src="/js/utils.js" ></script>
  <script  src="/js/color-schema.js" ></script>

<meta name="generator" content="Hexo 5.3.0"></head>


<body>
  <header style="height: 85vh;">
    <nav id="navbar" class="navbar fixed-top  navbar-expand-lg navbar-dark scrolling-navbar">
  <div class="container">
    <a class="navbar-brand"
       href="/">&nbsp;<strong>acqui-blog</strong>&nbsp;</a>

    <button id="navbar-toggler-btn" class="navbar-toggler" type="button" data-toggle="collapse"
            data-target="#navbarSupportedContent"
            aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
      <div class="animated-icon"><span></span><span></span><span></span></div>
    </button>

    <!-- Collapsible content -->
    <div class="collapse navbar-collapse" id="navbarSupportedContent">
      <ul class="navbar-nav ml-auto text-center">


            <li class="nav-item">
              <a class="nav-link" href="/">
                <i class="iconfont icon-home-fill"></i>
                首页
              </a>
            </li>


            <li class="nav-item">
              <a class="nav-link" href="/archives/">
                <i class="iconfont icon-archive-fill"></i>
                归档
              </a>
            </li>


            <li class="nav-item">
              <a class="nav-link" href="/categories/">
                <i class="iconfont icon-category-fill"></i>
                分类
              </a>
            </li>


            <li class="nav-item">
              <a class="nav-link" href="/tags/">
                <i class="iconfont icon-tags-fill"></i>
                标签
              </a>
            </li>


            <li class="nav-item">
              <a class="nav-link" href="/about/">
                <i class="iconfont icon-user-fill"></i>
                关于
              </a>
            </li>


          <li class="nav-item" id="search-btn">
            <a class="nav-link" data-toggle="modal" data-target="#modalSearch">&nbsp;<i
                class="iconfont icon-search"></i>&nbsp;</a>
          </li>


          <li class="nav-item" id="color-toggle-btn">
            <a class="nav-link" href="javascript:">&nbsp;<i
                class="iconfont icon-dark" id="color-toggle-icon"></i>&nbsp;</a>
          </li>

      </ul>
    </div>
  </div>
</nav>


    <div class="banner" id="banner" parallax=true
         style="background: url('/img/default.png') no-repeat center center;
           background-size: cover;">
      <div class="full-bg-img">
        <div class="mask flex-center" style="background-color: rgba(0, 0, 0, 0.3)">
          <div class="page-header text-center fade-in-up">
            <span class="h2" id="subtitle" title="Page not found">

            </span>


          </div>


        </div>
      </div>
    </div>
  </header>

  <main>


<script>
  function redirect() {
    location.href = "/";
  }

  //setTimeout(redirect, 3000)
</script>


      <a id="scroll-top-button" href="#" role="button">
        <i class="iconfont icon-arrowup" aria-hidden="true"></i>
      </a>


      <div class="modal fade" id="modalSearch" tabindex="-1" role="dialog" aria-labelledby="ModalLabel"
     aria-hidden="true">
  <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header text-center">
        <h4 class="modal-title w-100 font-weight-bold">搜索</h4>
        <button type="button" id="local-search-close" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body mx-3">
        <div class="md-form mb-5">
          <input type="text" id="local-search-input" class="form-control validate">
          <label data-error="x" data-success="v"
                 for="local-search-input">关键词</label>
        </div>
        <div class="list-group" id="local-search-result"></div>
      </div>
    </div>
  </div>
</div>


  </main>

  <footer class="text-center mt-5 py-3">
  <div class="footer-content">
     <a href="https://hexo.io" target="_blank" rel="nofollow noopener"><span>Hexo</span></a> <i class="iconfont icon-love"></i> <a href="https://github.com/fluid-dev/hexo-theme-fluid" target="_blank" rel="nofollow noopener"><span>Fluid</span></a> <i class="iconfont icon-love"></i> <a href="#" target="_blank" rel="nofollow noopener"><span>acqui</span></a>
  </div>

  <div class="statistics">


        <!-- 不蒜子统计PV -->
        <span id="busuanzi_container_site_pv" style="display: none">
            总访问量
            <span id="busuanzi_value_site_pv"></span>
             次
          </span>


        <!-- 不蒜子统计UV -->
        <span id="busuanzi_container_site_uv" style="display: none">
            总访客数
            <span id="busuanzi_value_site_uv"></span>
             人
          </span>


  </div>


</footer>

<!-- SCRIPTS -->

  <script  src="https://cdn.jsdelivr.net/npm/nprogress@0.2.0/nprogress.min.js" ></script>
  <link  rel="stylesheet" href="https://cdn.jsdelivr.net/npm/nprogress@0.2.0/nprogress.min.css" />

  <script>
    NProgress.configure({"showSpinner":false,"trickleSpeed":100})
    NProgress.start()
    window.addEventListener('load', function() {
      NProgress.done();
    })
  </script>


<script  src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js" ></script>
<script  src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.min.js" ></script>
<script  src="/js/debouncer.js" ></script>
<script  src="/js/events.js" ></script>
<script  src="/js/plugins.js" ></script>

<!-- Plugins -->


    <script  src="/js/lazyload.js" ></script>


  <script defer src="https://cdn.jsdelivr.net/npm/clipboard@2.0.6/dist/clipboard.min.js" ></script>


  <script defer src="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js" ></script>


<div bgcolor="#000000">
	<canvas id="knife" style="width: 98vw"></canvas>
</div>
<script type="text/javascript">
	var canvas = document.getElementById("knife");
	canvas.style.position = "absolute";
	canvas.style.top = 0;
	canvas.width = window.innerWidth;
	canvas.height = window.innerHeight;
	var cxt = canvas.getContext("2d");
	var list = [];
	var list2 = [];
	var g = 0.05;
	cxt.textAlign = "center";

	cxt.strokeStyle = "#FFF";
	cxt.fillStyle = "#FFF";
	cxt.font = "12px SimHei";

	function draw() {
		for (var i = 0; i < list.length; i++) {
			if (list[i].e == 0) {
				list[i].list.push({
					x: list[i].x,
					y: list[i].y
				});
			} else {
				if (list[i].list.length) {
					list[i].list.shift();
				} else {
					list2.push({
						x: list[i].x,
						y: list[i].y,
						sy: list[i].sy,
						sx: list[i].sx,
						a: 8
					});
					list.splice(i, 1);
					i--;
					continue;
				}
			}
			if (list[i].list.length > 12)
				list[i].list.shift();
			list[i].x += list[i].sx;
			list[i].y += list[i].sy;
			list[i].sy += g;
			if (list[i].sy > 1 + Math.random()) {
				list[i].e = 1;
			}
		}
		var x = canvas.width / 2 - 10,
			y = canvas.height - 70;
		cxt.clearRect(0, 0, canvas.width, canvas.height);
		cxt.beginPath();
		cxt.fillStyle = "#F00";
		cxt.fillRect(x, y, 20, 50);
		cxt.beginPath();
		cxt.fillStyle = "#a00";
		cxt.moveTo(x, y);
		cxt.quadraticCurveTo(x + 10, y + 8, x + 20, y);
		cxt.quadraticCurveTo(x + 10, y - 8, x, y);
		cxt.closePath();
		cxt.fill();
		cxt.beginPath();
		cxt.fillStyle = "#F00";
		cxt.moveTo(x, y + 50);
		cxt.quadraticCurveTo(x + 10, y + 6 + 50, x + 20, y + 50);
		cxt.closePath();
		cxt.fill();
		cxt.beginPath();
		cxt.fillStyle = "#FFF";
		cxt.fillText("福", x + 10, y + 30);
		for (var i = 0; i < list.length; i++) {
			cxt.beginPath();
			for (var j = 0; j < list[i].list.length; j++) {
				if (j == 0)
					cxt.moveTo(list[i].list[j].x, list[i].list[j].y);
				else
					cxt.lineTo(list[i].list[j].x, list[i].list[j].y);
			}
			cxt.strokeStyle = list[i].c;
			cxt.stroke();
		}
		for (var i = 0; i < list2.length; i++) {
			cxt.beginPath();
			cxt.fillStyle = "rgba(255,255,255," + 0.1 * list2[i].a + ")";
			cxt.arc(list2[i].x, list2[i].y, 8 - list2[i].a, 0, Math.PI * 2);
			cxt.fill();
			list2[i].a -= 1;
			if (list2[i].a <= 0) {
				list2.splice(i, 1);
				i--;
			}
		}
	}

	function addFire() {
		for (var i = 0; i < 2; i++) {
			var p = {
				x: canvas.width / 2,
				y: canvas.height - 70,
				sx: Math.random() - 0.5,
				sy: -(Math.random() + 5),
				c: "rgba(255," + Math.round(Math.random() * 155 + 100) + "," + Math.round(Math.random() * 155 + 100) + ",1)",
				e: 0,
				list: []
			}
			list.push(p);
		}
	}

	function step() {
		addFire();
		draw();
		requestAnimationFrame(step);
	}
	requestAnimationFrame(step);
</script>
<!-- partial('my-plugin/lantern-6.html')-->
<!-- 浮动的猫 -->
<style scoped>
  #cat_down{
    position: fixed;
    top: 0px;
    left: .9375rem;
  }

  .all-wrap {
    -webkit-animation: bob 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both;
    animation: bob 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both;
  }

  .all {
    top: 10rem;
    left: calc(20% - 2.5rem);
    position: absolute;
    width: 5rem;
    height: 5rem;
    -webkit-transform-origin: center -20rem;
    transform-origin: center -20rem;
    -webkit-animation: swing 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both;
    animation: swing 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both;
  }

  .all:before {
    height: 20rem;
    width: 2px;
    background-color: #DB242A;
    left: calc(20% - 1px);
    bottom: 20rem;
    top: 20px;
  }

  .yarn {
    position: absolute;
    top: 0;
    left: 0;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background-image: -webkit-radial-gradient(top left, circle, #e97c7f, #db242a 50%, #af1d22);
    background-image: radial-gradient(circle at top left, #e97c7f, #db242a 50%, #af1d22);
    z-index: 1;
  }

  .yarn:before,
  .yarn:after {
    position: absolute;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: white;
    top: -1px;
  }

  .yarn:before {
    left: calc(50% + 7px);
    background-color: #b1bce6;
  }

  .yarn:after {
    right: calc(50% + 7px);
    background-color: #D5E8F8;
  }

  .cat-wrap {
    position: absolute;
    top: 0;
    left: calc(50% - 45px);
    width: 90px;
    height: 130px;
    -webkit-animation: reverse-swing 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both;
    animation: reverse-swing 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both;
    -webkit-transform-origin: top center;
    transform-origin: top center;
  }

  .cat {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-animation: swing 7s 0.2s infinite both;
    animation: swing 7s 0.2s infinite both;
    -webkit-transform-origin: top center;
    transform-origin: top center;
  }

  .cat-upper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transform-origin: top center;
    transform-origin: top center;
    z-index: 1;
  }

  .cat-upper .cat-leg {
    position: absolute;
    width: 20px;
    height: 100%;
    background-color: white;
    z-index: -1;
    background-image: -webkit-linear-gradient(left, #D5E8F8, #D5E8F8 20%, #8B9BD9);
    background-image: linear-gradient(to right, #D5E8F8, #D5E8F8 20%, #8B9BD9);
  }

  .cat-upper .cat-leg:nth-child(1) {
    border-top-left-radius: 100px;
    left: 10px;
  }

  .cat-upper .cat-leg:nth-child(1):after {
    left: 50%;
  }

  .cat-upper .cat-leg:nth-child(2) {
    border-top-left-radius: 0;
    border-top-right-radius: 100px;
    right: 10px;
  }

  .cat-upper .cat-leg:nth-child(2):after {
    right: 50%;
  }

  .cat-lower-wrap {
    height: 90%;
    width: 100%;
    position: absolute;
    top: 100%;
    width: 75px;
    left: calc(50% - 37.5px);
    -webkit-animation: reverse-swing 7s 0.2s infinite both;
    animation: reverse-swing 7s 0.2s infinite both;
    -webkit-transform-origin: top center;
    transform-origin: top center;
  }

  .cat-lower {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-animation: swing 7s 0.5s infinite both;
    animation: swing 7s 0.5s infinite both;
    -webkit-transform-origin: top center;
    transform-origin: top center;
  }

  .cat-lower:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 100px;
    background-image: -webkit-radial-gradient(10px 50px, circle, #ffffff, #ffffff 40%, #d5e8f8 65%, #8b9bd9);
    background-image: radial-gradient(circle at 10px 50px, #ffffff, #ffffff 40%, #d5e8f8 65%, #8b9bd9);
    z-index: 1;
  }

  .cat-lower .cat-leg,
  .cat-lower .cat-paw {
    z-index: -1;
    position: absolute;
    height: 20px;
    width: 20px;
    -webkit-animation: swing-leg 7s 0.3s infinite both;
    animation: swing-leg 7s 0.3s infinite both;
    z-index: 1;
    -webkit-transform-origin: top center;
    transform-origin: top center;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    background-image: -webkit-linear-gradient(left, white, #D5E8F8, #8B9BD9);
    background-image: linear-gradient(to right, white, #D5E8F8, #8B9BD9);
  }

  .cat-lower>.cat-leg {
    bottom: 20px;
  }

  .cat-lower>.cat-leg .cat-leg {
    top: 25%;
  }

  .cat-lower>.cat-leg+.cat-leg {
    right: 0;
  }

  .cat-lower .cat-paw {
    top: 50%;
    border-radius: 50%;
    background-color: #fff;
  }

  .cat-lower .cat-tail {
    position: absolute;
    height: 15px;
    width: 10px;
    -webkit-animation: swing-tail 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both;
    animation: swing-tail 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both;
    -webkit-transform-origin: top center;
    transform-origin: top center;
    z-index: 0;
    background-image: -webkit-linear-gradient(left, white, #D5E8F8, #8B9BD9);
    background-image: linear-gradient(to right, white, #D5E8F8, #8B9BD9);
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
  }

  .cat-lower .cat-tail>.cat-tail {
    top: 50%;
  }

  .cat-lower>.cat-tail {
    left: calc(50% - 5px);
    top: 95%;
  }

  .cat-head {
    width: 90px;
    height: 90px;
    background-image: -webkit-radial-gradient(10px 10px, circle, #ffffff, #ffffff 40%, #d5e8f8 65%, #8b9bd9);
    background-image: radial-gradient(circle at 10px 10px, #ffffff, #ffffff 40%, #d5e8f8 65%, #8b9bd9);
    border-radius: 50%;
    top: calc(100% - 45px);
  }

  .cat-face {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    -webkit-animation: face 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both;
    animation: face 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-perspective: 100px;
    perspective: 100px;
  }

  .cat-ears {
    position: absolute;
    top: 0;
    left: 0;
    height: 50%;
    width: 100%;
    z-index: -1;
  }

  .cat-ear {
    width: 20px;
    height: 100%;
    position: absolute;
    border-radius: 5px;
    top: -10px;
  }

  .cat-ear:first-child {
    left: 0;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-transform: skewY(40deg);
    transform: skewY(40deg);
    background-color: white;
  }

  .cat-ear:first-child:before {
    left: 0;
    border-top-right-radius: 50%;
    border-bottom-right-radius: 50%;
    background-color: #D7EBFB;
  }

  .cat-ear:last-child {
    right: 0;
    -webkit-transform-origin: top right;
    transform-origin: top right;
    -webkit-transform: skewY(-40deg);
    transform: skewY(-40deg);
    background-color: #d1e6f7;
  }

  .cat-ear:last-child:before {
    right: 0;
    border-top-left-radius: 50%;
    border-bottom-left-radius: 50%;
    background-color: #e0f0fc;
  }

  .cat-ear:before {
    width: 60%;
    height: 100%;
    top: 10px;
    position: absolute;
    background-color: #fff;
  }

  .cat-eyes {
    position: absolute;
    top: 50%;
    width: 100%;
    height: 6px;
    -webkit-animation: blink 7s step-end infinite both;
    animation: blink 7s step-end infinite both;
  }

  .cat-eyes:before,
  .cat-eyes:after {
    position: absolute;
    height: 6px;
    width: 6px;
    border-radius: 50%;
    background-color: #4B4D75;
  }

  .cat-eyes:before {
    left: 20px;
  }

  .cat-eyes:after {
    right: 20px;
  }

  .cat-mouth {
    position: absolute;
    width: 12px;
    height: 8px;
    background-color: #4B4D75;
    top: 60%;
    left: calc(50% - 6px);
    border-top-left-radius: 50% 30%;
    border-top-right-radius: 50% 30%;
    border-bottom-left-radius: 50% 70%;
    border-bottom-right-radius: 50% 70%;
    -webkit-transform: translateZ(10px);
    transform: translateZ(10px);
  }

  .cat-mouth:before,
  .cat-mouth:after {
    position: absolute;
    width: 90%;
    height: 100%;
    border: 2px solid #9FA2CB;
    top: 80%;
    border-radius: 100px;
    border-top-color: transparent;
    z-index: -1;
  }

  .cat-mouth:before {
    border-left-color: transparent;
    right: calc(50% - 1px);
    -webkit-transform-origin: top right;
    transform-origin: top right;
    -webkit-transform: rotate(10deg);
    transform: rotate(10deg);
  }

  .cat-mouth:after {
    border-right-color: transparent;
    left: calc(50% - 1px);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  .cat-whiskers {
    width: 50%;
    height: 8px;
    position: absolute;
    bottom: 25%;
    left: 25%;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-perspective: 60px;
    perspective: 60px;
  }

  .cat-whiskers:before,
  .cat-whiskers:after {
    position: absolute;
    height: 100%;
    width: 30%;
    border: 2px solid #9FA2CB;
    border-left: none;
    border-right: none;
  }

  .cat-whiskers:before {
    right: 100%;
    -webkit-transform-origin: right center;
    transform-origin: right center;
    -webkit-transform: rotateY(70deg) rotateZ(-10deg);
    transform: rotateY(70deg) rotateZ(-10deg);
  }

  .cat-whiskers:after {
    left: 100%;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    -webkit-transform: rotateY(-70deg) rotateZ(10deg);
    transform: rotateY(-70deg) rotateZ(10deg);
  }

  @-webkit-keyframes bob {
    0% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    6.25% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    12.5% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    18.75% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    25% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    31.25% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    37.5% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    43.75% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    50% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    56.25% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    62.5% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    68.75% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    75% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    81.25% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    87.5% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    93.75% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    100% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }
  }

  @keyframes bob {
    0% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    6.25% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    12.5% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    18.75% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    25% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    31.25% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    37.5% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    43.75% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    50% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    56.25% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    62.5% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    68.75% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    75% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    81.25% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    87.5% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }

    93.75% {
      -webkit-transform: translateY(-0.4rem);
      transform: translateY(-0.4rem);
    }

    100% {
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem);
    }
  }

  @-webkit-keyframes swing {
    0% {
      -webkit-transform: rotate(5deg);
      transform: rotate(5deg);
    }

    12.5% {
      -webkit-transform: rotate(-10deg);
      transform: rotate(-10deg);
    }

    25% {
      -webkit-transform: rotate(10deg);
      transform: rotate(10deg);
    }

    37.5% {
      -webkit-transform: rotate(-15deg);
      transform: rotate(-15deg);
    }

    50% {
      -webkit-transform: rotate(23deg);
      transform: rotate(23deg);
    }

    62.5% {
      -webkit-transform: rotate(-23deg);
      transform: rotate(-23deg);
    }

    75% {
      -webkit-transform: rotate(15deg);
      transform: rotate(15deg);
    }

    87.5% {
      -webkit-transform: rotate(-10deg);
      transform: rotate(-10deg);
    }

    100% {
      -webkit-transform: rotate(5deg);
      transform: rotate(5deg);
    }
  }

  @keyframes swing {
    0% {
      -webkit-transform: rotate(5deg);
      transform: rotate(5deg);
    }

    12.5% {
      -webkit-transform: rotate(-10deg);
      transform: rotate(-10deg);
    }

    25% {
      -webkit-transform: rotate(10deg);
      transform: rotate(10deg);
    }

    37.5% {
      -webkit-transform: rotate(-15deg);
      transform: rotate(-15deg);
    }

    50% {
      -webkit-transform: rotate(23deg);
      transform: rotate(23deg);
    }

    62.5% {
      -webkit-transform: rotate(-23deg);
      transform: rotate(-23deg);
    }

    75% {
      -webkit-transform: rotate(15deg);
      transform: rotate(15deg);
    }

    87.5% {
      -webkit-transform: rotate(-10deg);
      transform: rotate(-10deg);
    }

    100% {
      -webkit-transform: rotate(5deg);
      transform: rotate(5deg);
    }
  }

  @-webkit-keyframes swing-leg {
    0% {
      -webkit-transform: rotate(0.5deg);
      transform: rotate(0.5deg);
    }

    12.5% {
      -webkit-transform: rotate(-1deg);
      transform: rotate(-1deg);
    }

    25% {
      -webkit-transform: rotate(1deg);
      transform: rotate(1deg);
    }

    37.5% {
      -webkit-transform: rotate(-1.5deg);
      transform: rotate(-1.5deg);
    }

    50% {
      -webkit-transform: rotate(2.3deg);
      transform: rotate(2.3deg);
    }

    62.5% {
      -webkit-transform: rotate(-2.3deg);
      transform: rotate(-2.3deg);
    }

    75% {
      -webkit-transform: rotate(1.5deg);
      transform: rotate(1.5deg);
    }

    87.5% {
      -webkit-transform: rotate(-1deg);
      transform: rotate(-1deg);
    }

    100% {
      -webkit-transform: rotate(0.5deg);
      transform: rotate(0.5deg);
    }
  }

  @keyframes swing-leg {
    0% {
      -webkit-transform: rotate(0.5deg);
      transform: rotate(0.5deg);
    }

    12.5% {
      -webkit-transform: rotate(-1deg);
      transform: rotate(-1deg);
    }

    25% {
      -webkit-transform: rotate(1deg);
      transform: rotate(1deg);
    }

    37.5% {
      -webkit-transform: rotate(-1.5deg);
      transform: rotate(-1.5deg);
    }

    50% {
      -webkit-transform: rotate(2.3deg);
      transform: rotate(2.3deg);
    }

    62.5% {
      -webkit-transform: rotate(-2.3deg);
      transform: rotate(-2.3deg);
    }

    75% {
      -webkit-transform: rotate(1.5deg);
      transform: rotate(1.5deg);
    }

    87.5% {
      -webkit-transform: rotate(-1deg);
      transform: rotate(-1deg);
    }

    100% {
      -webkit-transform: rotate(0.5deg);
      transform: rotate(0.5deg);
    }
  }

  @-webkit-keyframes swing-tail {
    0% {
      -webkit-transform: rotate(-2deg);
      transform: rotate(-2deg);
    }

    12.5% {
      -webkit-transform: rotate(4deg);
      transform: rotate(4deg);
    }

    25% {
      -webkit-transform: rotate(-4deg);
      transform: rotate(-4deg);
    }

    37.5% {
      -webkit-transform: rotate(6deg);
      transform: rotate(6deg);
    }

    50% {
      -webkit-transform: rotate(-9.2deg);
      transform: rotate(-9.2deg);
    }

    62.5% {
      -webkit-transform: rotate(9.2deg);
      transform: rotate(9.2deg);
    }

    75% {
      -webkit-transform: rotate(-6deg);
      transform: rotate(-6deg);
    }

    87.5% {
      -webkit-transform: rotate(4deg);
      transform: rotate(4deg);
    }

    100% {
      -webkit-transform: rotate(-2deg);
      transform: rotate(-2deg);
    }
  }

  @keyframes swing-tail {
    0% {
      -webkit-transform: rotate(-2deg);
      transform: rotate(-2deg);
    }

    12.5% {
      -webkit-transform: rotate(4deg);
      transform: rotate(4deg);
    }

    25% {
      -webkit-transform: rotate(-4deg);
      transform: rotate(-4deg);
    }

    37.5% {
      -webkit-transform: rotate(6deg);
      transform: rotate(6deg);
    }

    50% {
      -webkit-transform: rotate(-9.2deg);
      transform: rotate(-9.2deg);
    }

    62.5% {
      -webkit-transform: rotate(9.2deg);
      transform: rotate(9.2deg);
    }

    75% {
      -webkit-transform: rotate(-6deg);
      transform: rotate(-6deg);
    }

    87.5% {
      -webkit-transform: rotate(4deg);
      transform: rotate(4deg);
    }

    100% {
      -webkit-transform: rotate(-2deg);
      transform: rotate(-2deg);
    }
  }

  @-webkit-keyframes reverse-swing {
    0% {
      -webkit-transform: rotate(-5deg);
      transform: rotate(-5deg);
    }

    12.5% {
      -webkit-transform: rotate(10deg);
      transform: rotate(10deg);
    }

    25% {
      -webkit-transform: rotate(-10deg);
      transform: rotate(-10deg);
    }

    37.5% {
      -webkit-transform: rotate(15deg);
      transform: rotate(15deg);
    }

    50% {
      -webkit-transform: rotate(-23deg);
      transform: rotate(-23deg);
    }

    62.5% {
      -webkit-transform: rotate(23deg);
      transform: rotate(23deg);
    }

    75% {
      -webkit-transform: rotate(-15deg);
      transform: rotate(-15deg);
    }

    87.5% {
      -webkit-transform: rotate(10deg);
      transform: rotate(10deg);
    }

    100% {
      -webkit-transform: rotate(-5deg);
      transform: rotate(-5deg);
    }
  }

  @keyframes reverse-swing {
    0% {
      -webkit-transform: rotate(-5deg);
      transform: rotate(-5deg);
    }

    12.5% {
      -webkit-transform: rotate(10deg);
      transform: rotate(10deg);
    }

    25% {
      -webkit-transform: rotate(-10deg);
      transform: rotate(-10deg);
    }

    37.5% {
      -webkit-transform: rotate(15deg);
      transform: rotate(15deg);
    }

    50% {
      -webkit-transform: rotate(-23deg);
      transform: rotate(-23deg);
    }

    62.5% {
      -webkit-transform: rotate(23deg);
      transform: rotate(23deg);
    }

    75% {
      -webkit-transform: rotate(-15deg);
      transform: rotate(-15deg);
    }

    87.5% {
      -webkit-transform: rotate(10deg);
      transform: rotate(10deg);
    }

    100% {
      -webkit-transform: rotate(-5deg);
      transform: rotate(-5deg);
    }
  }

  @-webkit-keyframes face {
    0% {
      -webkit-transform: translateX(-2.5px);
      transform: translateX(-2.5px);
    }

    12.5% {
      -webkit-transform: translateX(5px);
      transform: translateX(5px);
    }

    25% {
      -webkit-transform: translateX(-5px);
      transform: translateX(-5px);
    }

    37.5% {
      -webkit-transform: translateX(7.5px);
      transform: translateX(7.5px);
    }

    50% {
      -webkit-transform: translateX(-11.5px);
      transform: translateX(-11.5px);
    }

    62.5% {
      -webkit-transform: translateX(11.5px);
      transform: translateX(11.5px);
    }

    75% {
      -webkit-transform: translateX(-7.5px);
      transform: translateX(-7.5px);
    }

    87.5% {
      -webkit-transform: translateX(5px);
      transform: translateX(5px);
    }

    100% {
      -webkit-transform: translateX(-2.5px);
      transform: translateX(-2.5px);
    }
  }

  @keyframes face {
    0% {
      -webkit-transform: translateX(-2.5px);
      transform: translateX(-2.5px);
    }

    12.5% {
      -webkit-transform: translateX(5px);
      transform: translateX(5px);
    }

    25% {
      -webkit-transform: translateX(-5px);
      transform: translateX(-5px);
    }

    37.5% {
      -webkit-transform: translateX(7.5px);
      transform: translateX(7.5px);
    }

    50% {
      -webkit-transform: translateX(-11.5px);
      transform: translateX(-11.5px);
    }

    62.5% {
      -webkit-transform: translateX(11.5px);
      transform: translateX(11.5px);
    }

    75% {
      -webkit-transform: translateX(-7.5px);
      transform: translateX(-7.5px);
    }

    87.5% {
      -webkit-transform: translateX(5px);
      transform: translateX(5px);
    }

    100% {
      -webkit-transform: translateX(-2.5px);
      transform: translateX(-2.5px);
    }
  }

  @-webkit-keyframes fade-in {
    from {
      opacity: 0;
    }

    to {
      opacity: 1;
    }
  }

  @keyframes fade-in {
    from {
      opacity: 0;
    }

    to {
      opacity: 1;
    }
  }

  @-webkit-keyframes blink {

    from,
    to,
    10%,
    25%,
    80% {
      -webkit-transform: scaleY(1);
      transform: scaleY(1);
    }

    8%,
    23%,
    78% {
      -webkit-transform: scaleY(0.1);
      transform: scaleY(0.1);
    }
  }

  @keyframes blink {

    from,
    to,
    10%,
    25%,
    80% {
      -webkit-transform: scaleY(1);
      transform: scaleY(1);
    }

    8%,
    23%,
    78% {
      -webkit-transform: scaleY(0.1);
      transform: scaleY(0.1);
    }
  }


  #cat_down *,
  #cat_down *:before,
  #cat_down *:after {
    box-sizing: border-box;
    position: absolute;
    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1);
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1);
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
  }

  #cat_down *:before,
  #cat_down *:after {
    content: '';
    display: block;
  }
</style>

<section id="cat_down">
  <div class="all-wrap">
    <div class="all">
      <div class="yarn"></div>
      <div class="cat-wrap">
        <div class="cat">
          <div class="cat-upper">
            <div class="cat-leg"></div>
            <div class="cat-leg"></div>
            <div class="cat-head">
              <div class="cat-ears">
                <div class="cat-ear"></div>
                <div class="cat-ear"></div>
              </div>
              <div class="cat-face">
                <div class="cat-eyes"></div>
                <div class="cat-mouth"></div>
                <div class="cat-whiskers"></div>
              </div>
            </div>
          </div>
          <div class="cat-lower-wrap">
            <div class="cat-lower">
              <div class="cat-leg">
                <div class="cat-leg">
                  <div class="cat-leg">
                    <div class="cat-leg">
                      <div class="cat-leg">
                        <div class="cat-leg">
                          <div class="cat-leg">
                            <div class="cat-leg">
                              <div class="cat-leg">
                                <div class="cat-leg">
                                  <div class="cat-leg">
                                    <div class="cat-leg">
                                      <div class="cat-leg">
                                        <div class="cat-leg">
                                          <div class="cat-leg">
                                            <div class="cat-leg">
                                              <div class="cat-paw"></div>
                                            </div>
                                          </div>
                                        </div>
                                      </div>
                                    </div>
                                  </div>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="cat-leg">
                <div class="cat-leg">
                  <div class="cat-leg">
                    <div class="cat-leg">
                      <div class="cat-leg">
                        <div class="cat-leg">
                          <div class="cat-leg">
                            <div class="cat-leg">
                              <div class="cat-leg">
                                <div class="cat-leg">
                                  <div class="cat-leg">
                                    <div class="cat-leg">
                                      <div class="cat-leg">
                                        <div class="cat-leg">
                                          <div class="cat-leg">
                                            <div class="cat-leg">
                                              <div class="cat-paw"></div>
                                            </div>
                                          </div>
                                        </div>
                                      </div>
                                    </div>
                                  </div>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="cat-tail">
                <div class="cat-tail">
                  <div class="cat-tail">
                    <div class="cat-tail">
                      <div class="cat-tail">
                        <div class="cat-tail">
                          <div class="cat-tail">
                            <div class="cat-tail">
                              <div class="cat-tail">
                                <div class="cat-tail">
                                  <div class="cat-tail">
                                    <div class="cat-tail">
                                      <div class="cat-tail">
                                        <div class="cat-tail">
                                          <div class="cat-tail">
                                            <div class="cat-tail -end"></div>
                                          </div>
                                        </div>
                                      </div>
                                    </div>
                                  </div>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>


  <script  src="https://cdn.jsdelivr.net/npm/typed.js@2.0.11/lib/typed.min.js" ></script>
  <script>
    (function (window, document) {
      var typing = Fluid.plugins.typing;
      var title = document.getElementById('subtitle').title;

      typing(title)

    })(window, document);
  </script>


  <script  src="/js/local-search.js" ></script>
  <script>
    (function () {
      var path = "/local-search.xml";
      var inputArea = document.querySelector("#local-search-input");
      inputArea.onclick = function () {
        searchFunc(path, 'local-search-input', 'local-search-result');
        this.onclick = null
      }
    })()
  </script>


<!-- 主题的启动项 保持在最底部 -->
<script  src="/js/boot.js" ></script>


<div style="text-align: center;">
	<span id="timeDate">载入天数...</span><span id="times">载入时分秒...</span>
</div>
<script>
    var now = new Date();
    function createtime() {
        var grt= new Date("01/23/2021 10:00:00");//此处修改你的建站时间或者网站上线时间
        now.setTime(now.getTime()+250);
        days = (now - grt ) / 1000 / 60 / 60 / 24; dnum = Math.floor(days);
        hours = (now - grt ) / 1000 / 60 / 60 - (24 * dnum); hnum = Math.floor(hours);
        if(String(hnum).length ==1 ){hnum = "0" + hnum;} minutes = (now - grt ) / 1000 /60 - (24 * 60 * dnum) - (60 * hnum);
        mnum = Math.floor(minutes); if(String(mnum).length ==1 ){mnum = "0" + mnum;}
        seconds = (now - grt ) / 1000 - (24 * 60 * 60 * dnum) - (60 * 60 * hnum) - (60 * mnum);
        snum = Math.round(seconds); if(String(snum).length ==1 ){snum = "0" + snum;}
        document.getElementById("timeDate").innerHTML = "本站已安全运行 "+dnum+" 天 ";
        document.getElementById("times").innerHTML = hnum + " 小时 " + mnum + " 分 " + snum + " 秒";
    }
setInterval("createtime()",250);
</script>

<script src="/live2dw/lib/L2Dwidget.min.js?094cbace49a39548bed64abff5988b05"></script><script>L2Dwidget.init({"pluginModelPath":"assets/","model":{"scale":1,"hHeadPos":0.5,"vHeadPos":0.618,"jsonPath":"/live2dw/assets/hijiki.model.json"},"display":{"superSample":2,"width":250,"height":500,"position":"right","hOffset":0,"vOffset":-20},"mobile":{"show":false,"scale":0.5},"react":{"opacityDefault":0.7,"opacityOnHover":0.2},"log":false,"pluginJsPath":"lib/","pluginRootPath":"live2dw/","tagMode":false});</script></body>
</html>