<template>
  <div class="introduce-title">
    <span class="main-title">{{ title }}</span>
    <span class="sub-title"> {{ subTitle }}</span>
  </div>
</template>

<script>
export default {
  props: {
    title: {
      type: String,
      default: "标题",
    },
    subTitle: {
      type: String,
      default: "标题",
    },
  },
  data() {
    return {};
  },
};
</script>

<style lang="scss" scoped>
.introduce-title {
  height: 40px;
  background: url("~@/assets/images/ui/introduce-title.png");
  background-size: 100% 100%;
  display: flex;
  justify-content: space-between;
  padding-left: 55px;
  overflow: hidden;
  .main-title {
    padding: 4px 0;
    font-size: 20px;
    color: #ffffff;
    font-family: "Alibaba-PuHuiTi-Medium.otf";
  }
  .sub-title {
    padding: 6px 0;
    margin-left: 15px;
    font-size: 16px;
    color: #518fd4;
    font-family: "Alibaba-PuHuiTi-Regular.otf";
  }
}
</style>
