huijia-website/app/pages/about/components/banner.vue

<!--
 * @Author: LiZhiWei
 * @Date: 2026-01-21 08:50:15
 * @LastEditors: LiZhiWei
 * @LastEditTime: 2026-01-21 10:45:48
 * @Description: 
-->
<template>
  <div class="banner">
    <div class="flex-center pt-168px gap-48px lt-sm:flex-col lt-sm:gap-0px lt-sm:pt-84px">
      <span class="font-s-48px pf-sc-semibold text-black lt-sm:font-s-62px">
        以科技赋能物业企业
      </span>
      <span class="font-s-48px text-#0F67F8 pf-sc-semibold lt-sm:font-s-62px">
        驱动管理效率跃升
      </span>
    </div>
  </div>
</template>

<script setup lang="ts"></script>
<style scoped lang="scss">
  .banner {
    @apply h-680px w-full bg-cover bg-center;
    @apply lt-sm:h-750px;
    background-image: url('@/assets/images/about-bg.png');
    @screen lt-sm {
      background-image: url('~/assets/images/about-mobile.png');
    }
  }
</style>