<template>
  <div id="ErrRoot">
    <div id="upbarErr"></div>
    <div id="ErrContent">
      <div>
        <span class="itemtitle">404:Not Found</span>
        <br/>
        <span class="itemcontent">您要找的页面不存在，<a href="/">返回主页</a></span>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "Err404"
}
</script>

<style scoped lang="scss">
@import "node_modules/bootstrap/scss/_functions.scss";
@import "node_modules/bootstrap/scss/_variables.scss";
@import "node_modules/bootstrap/scss/_mixins.scss";
#upbarErr{
  position: relative;
  flex:1;
  width: 100%;
  flex-shrink: 0;
  @include media-breakpoint-between(xs, md) {
    min-height: 70px!important;
  }

  @include media-breakpoint-up(md) {
    //min-height: 95.17px!important;
    min-height: 95.17px!important;
  }
}

#ErrContent{
  position: relative;
  flex:2;
  display: flex;
  background-color: black;
  width:100%;
  align-items: center;
  justify-content: center;
  //height: 100%;
  @include media-breakpoint-between(xs, md) {
    min-height: 614px;
  }
  @include media-breakpoint-up(md) {
    min-height: 338px;
  }
}

#ErrRoot{
  position: relative;
  flex:1;
  display: flex;
  flex-direction: column;
  background-color: black;
  margin-top: 0px;
  align-items: center;
  justify-content: center;
  width:100%;
  min-height: 100%;

  @include media-breakpoint-between(xs, md) {
    //min-height:700px;
  }

  @include media-breakpoint-up(md) {
    //min-height: 700px;
  }
}
.itemtitle
{
  width: 280px;
  overflow-wrap: break-word;
  color: rgba(255, 255, 255, 0.6);
  font-size: 20px;
  font-family: PingFangSC-Regular;
  font-weight: normal;
  text-align: left;
  line-height: 30px;
  display: inline-block;
}
.itemcontent
{
  width: 280px;
  overflow-wrap: break-word;
  color: rgba(255, 255, 255, 1);
  font-size: 20px;
  font-family: PingFangSC-Regular;
  font-weight: normal;
  text-align: left;
  line-height: 30px;
  display: inline-block;
}

</style>
