<template>
  <div class="Page404 H100">
    <div class="page_box">
      <div class="img l-float" ></div>
      <div class="title r-float">
        <p>404</p>
        <p>抱歉，你访问的页面不存在</p>
        <el-button type="primary" @click="toIndex">返回首页</el-button>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
      }
    },
    computed: {
    },
    mounted() {
    },
    components: {

    },
    methods: {
      toIndex() {
        this.$router.push('/indexPage');
      }
    }
  }
</script>

<style lang="less">
  @import '../../style/common';
  .Page404{
    background: #F0F2F5;
    border: 1px solid transparent;
    .page_box{
      width: 60%;
      height: 50%;
      margin: 7% auto;
      box-sizing: border-box;
      .img{
        width: 50%;
        height: 95%;
        margin-top: 3%;
        background-image: url("../../../static/images/pic/img404.png");
        background-repeat: no-repeat;
        background-size: 100%;
      }
      .title{
        width: 40%;
        height: 100%;
        padding-top: 10%;
        p:nth-child(1){
          font-size: 4rem;
        }
        p:nth-child(2){
          font-size:20px;
          font-weight:400;
          color:rgba(0,0,0,0.45);
          margin-bottom: 10px;
        }
        .el-button{
          padding: 6px 13px;
        }
      }
    }
  }



</style>