<template>
  <div :class="isMobile ? 'is-h5' : 'is-pc'">
    <app-frame :data="frameParams">
      <div class="rele-content-box">
        <div class="content-box">
          <div class="text-content">
            <div class="title">项目费用</div>
            <div class="con-txt">
              <strong>学费：</strong>24000元（9个月）
              <br />
              <strong>申请费：</strong>600元
              <br />
              <strong>奖学金：</strong>学生可以申请奖学金（根据评审委员会评定）
            </div>
          </div>
        </div>
      </div>
    </app-frame>
  </div>
</template>
<script>
import appFrame from '@/components/appFrame'
export default {
  layout: 'normal',
  components: {
    appFrame,
  },
  data() {
    return {
      newsList: [],
      frameParams: {
        banner: '/images/apply_banner.png',
        slider: [
          {
            name: this.$t('menu.recruitChild.apply'),
            path: '/apply/relevant',
          },
          {
            name: this.$t('menu.recruitChild.cost'),
            path: '/apply/support',
          },
          // {
          //   name: this.$t('menu.recruitChild.problem'),
          //   path: '/apply/problem'
          // }
        ],
      },
    }
  },
  computed: {
    isMobile() {
      return this.$store.state.isMobile
    },
  },
}
</script>
<style lang="scss" scoped>
.is-pc {
  .rele-content-box {
    .content-box {
      padding-top: 46px;
      padding-bottom: 106px;
      .text-content {
        padding: 0 80px;
        .title {
          font-size: 22px;
          font-weight: bold;
          line-height: 100%;
          color: #333333;
          &.mar-t55 {
            margin-top: 55px;
          }
        }
        .con-txt {
          font-size: 16px;
          line-height: 34px;
          color: #424242;
          margin-top: 20px;
        }
      }
    }
  }
}
.is-h5 {
  .rele-content-box {
    background: #fff;
    padding: 0.3rem 0.2rem;
    .content-box {
      .text-content {
        padding-left: 0.2rem;
        .title {
          font-size: 0.14rem;
          font-weight: bold;
          line-height: 100%;
          color: #333333;
          &.mar-t55 {
            margin-top: 0.25rem;
          }
        }
        .con-txt {
          font-size: 0.12rem;
          line-height: 0.24rem;
          color: #424242;
          padding-top: 0.14rem;
        }
      }
    }
  }
}
</style>
