<script setup>
const props = defineProps({
  title: '',
})
const title = ref(props.title)
</script>

<template>
  <div class="topCon">
    <img src="/images/dsj/topBg.png" alt="">
    <div class="title">
      {{ title }}
    </div>
  </div>

  <div class="bottomCon">
    <img src="/images/dsj/bottomBg.png" alt="">
  </div>
</template>

<style lang="scss" scoped>
.topCon {
  height: 6.5625rem;
  position: relative;
  color: #ffffff;
  img {
    width: 100%;
    height: 100%;
    position: absolute;
  }
  .title {
    position: relative;
    z-index: 10;
    letter-spacing: 4.28px;
    font-size: 2.125rem;
    text-align: center;
    line-height: 5.9375rem;
  }
}
.bottomCon {
  width: 100%;
  height: 1rem;
  position: absolute;
  bottom: 0;
  img {
    width: 100%;
    height: 100%;
  }
}
</style>
