<template>
  <div class="footer-container">
    <div class="footer-top">
      <div style="display: flex">
        <dl>
          <dt>企业服务</dt>
          <dd>职位搜索</dd>
          <dd>人才搜索</dd>
        </dl>
        <dl>
          <dt>使用与帮助</dt>
          <dd>用户协议</dd>
          <dd>使用帮助</dd>
        </dl>
        <dl>
          <dt>关于我们</dt>
          <dd>深圳市西部人力资源发展有限公司</dd>
          <dd>深圳市南山区桃园西路287号南山人才大厦四楼</dd>
          <dd>联系电话：0755-86218514</dd>
        </dl>
      </div>
      <div class="qrcode">
        <img height="110" width="110" src="@/assets/XBRLPX.png" />
        <p>手机版</p>
      </div>
    </div>
    <div class="footer-bottom">
      <p>本网之所有招聘信息及作品，末经南山就业帮同意不得转载</p>
      <p>
        <span
          ><a href="https://beian.miit.gov.cn" target="_blank"
            >Copyright©2022 南山就业帮 粤ICP20018364号</a
          ></span
        >
        <span>电子营业执照</span>
        <span>粤公网安备11010502032801</span>
      </p>
      <p>
        <span>人力资源服务许可证</span>
        <span>网上有害信息举报专区</span>
      </p>
    </div>
  </div>
</template>

<script setup lang="ts"></script>

<style lang="scss" scoped>
.footer-container {
  width: 1316px;
  height: 100%;
  margin: 0 auto;
  box-sizing: border-box;

  .footer-top {
    display: flex;
    justify-content: space-between;
    padding: 35px 0 20px 0;
    box-sizing: border-box;
    border-bottom: 1px solid rgba(255, 255, 255, 0.6);

    dl {
      margin-right: 170px;
      font-weight: 400;
      font-size: 18px;
      line-height: 18px;
      font-family: Source Han Sans CN;
      color: #333;

      dt {
        margin-bottom: 40px;
        color: #ffffff;
      }

      dd {
        margin: 0 0 20px;
        font-weight: 400;
        font-size: 14px;
        line-height: 14px;
        color: rgba(255, 255, 255, 0.6);
        cursor: pointer;
      }
    }
    .qrcode {
      height: 24px;
      font-size: 16px;
      font-weight: 500;
      color: #ffffff;
      display: flex;
      align-items: center;
      flex-direction: column;

      p {
        width: 100%;
        text-align: center;
        margin-top: 16px;
      }
    }
  }

  .footer-bottom {
    padding: 42px 0 50px 0;
    box-sizing: border-box;
    p {
      margin-bottom: 14px;
      font-weight: 400;
      font-size: 14px;
      line-height: 14px;
      color: rgba(255, 255, 255, 0.6);

      span {
        margin-right: 42px;

        a {
          color: rgba(255, 255, 255, 0.6);
          text-decoration: none;
        }
      }
    }
  }
}
</style>
