<template>
  <div class="bg">
    <div class="bg-middle"></div>
    <div class="bg-up"></div>
    <div class="bg-down"></div>
  </div>
</template>
<style scoped>
.bg {
  width: 100%;
  padding-left: 15px;
  position: absolute;
  left: 0;
  bottom: 38px;
  height: 96px;
  min-height: 96px;
}

.bg-up {
  position: absolute;
  top: 0;
  height: 32px;
  width: 300px;
  background: url("@/assets/img/about/boder-top.svg") no-repeat;
  background-size: 300px 32px ;
}
.bg-middle {
  position: absolute;
  top: 22px;
  height: calc(100% - 22px);
  width: 300px;
  background: url("@/assets/img/about/boder-center.svg") repeat-y;
  background-size: 300px 32px ;
}

.bg-down {
  position: absolute;
  bottom: 0;
  height: 32px;
  width: 300px;
  background: url("@/assets/img/about/boder-bottom.svg") no-repeat;
  background-size:300px 32px ;
}
</style>
