<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
  <div class="certificate">
    <app-frame :data="frameParams">
      <div class="certificate-main">
        <img
          class="cert-img"
          src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/marywood-cert-new2.png"
        />
      </div>
    </app-frame>
  </div>
</div>
</template>
<script>
export default {
  layout: 'normal',
  data() {
    return {
      frameParams: {
        banner: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/mary_banner_nx3.jpg',
        slider: [
          {
            name: this.$t('menu.projectChild.bg'),
            path: '/project-intro/bg'
          },
          {
            name: this.$t('menu.projectChild.feature'),
            path: '/project-intro/charac'
          },
          {
            name: this.$t('menu.projectChild.cert'),
            path: '/project-intro/certificate'
          }
        ]
      }
    }
  },
  computed: {
    isMobile() {
      return this.$store.state.isMobile
    }
  }
}
</script>
<style lang="scss" scoped>
.is-pc{
  .cert-img{
    display: block;
    width: 600px;
    // height: 291px;
    margin: 40px auto;
  }
}
.is-h5{
  .cert-img{
    display: block;
    width: 100%;
    // height: 291px;
    margin: 40px auto;
  }
}
.certificate-main {
  padding: 40px;
  text-align: center;
  .checkbox {
    display: flex;
    width: 450px;
    margin: 0 auto;
    p {
      width: 50%;
      text-align: center;
      font-size: 22px;
      font-family: Source Han Sans CN;
      font-weight: 500;
      line-height: 34px;
      color: #424242;
      i {
        display: inline-block;
        width: 22px;
        height: 22px;
        background: url('https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/project-intro-certificate-icon.png');
        background-size: 22px 22px;
        margin-right: 10px;
        vertical-align: middle;
      }
    }
  }
  .text {
    text-align: center;
    font-size: 16px;
    font-family: Source Han Sans CN;
    font-weight: 400;
    line-height: 34px;
    color: #424242;
    margin-top: 40px;
  }
  .certificate-title {
    font-size: 16px;
    font-family: Source Han Sans CN;
    font-weight: 400;
    line-height: 34px;
    color: #424242;
    margin-top: 26px;
  }
  .certificate-des {
    font-size: 14px;
    font-family: Source Han Sans CN;
    font-weight: 400;
    line-height: 34px;
    color: #aa1941;
  }
}
</style>
