<template>
  <div class="homepage_footer">
    <div class="fo-bg"></div>
    <div class="homepage_footer_body">
      <div class="footer_lj fot">
        <h4>
          <span>学校官网</span>
        </h4>
        <a href="https://www.ciis.edu" target="_blank"><span class="fo">加州整合大学官网</span></a>
      </div>
      <div class="footer_cx fot">
        <h4>
          <span>学校认证</span>
        </h4>
        <a href="http://jsj.moe.gov.cn/news/1/170.shtml" target="_blank"><span class="fo">教育涉外监管网</span></a>
        <a href="https://www.wscuc.org/institutions/california-institute-integral-studies" target="_blank"><span class="fo">WASC认证</span></a>
      </div>
      <div class="footer_cx fot">
        <h4>
          <span>认证查询</span>
        </h4>
        <a href="https://www.universities.com/find/california/best/counseling-psychology-degrees" target="_blank"><span class="fo">2020年加州最佳心理咨询学院排名第1</span></a>
        <a href="https://www.universities.com/find/california/best/counseling-psychology-degrees" target="_blank"><span class="fo">2020年CIIS临床心理咨询专业排名全美第4</span></a>
        <a href="https://www.greatvaluecolleges.net/by-city/online-colleges-san-francisco-ca/" target="_blank"><span class="fo">2020年旧金山最佳在线学位项目排名第3</span></a>
        <a href="https://www.online-phd-programs.org/best-online-phd-psychology/" target="_blank"><span class="fo">2020年心理学在线博士项目全美排名第14</span></a>
      </div>
      <div class="footer_logo">
        <img src="@/assets/images/logo.png" alt />
        <img src="@/assets/images/logginred.png" alt />
      </div>
    </div>
  </div>
</template>

<script>
export default {}
</script>

<style lang="scss" scoped>
.homepage_footer {
  min-height: 460px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: cover;
  background: #fff;
  width: 100%;
  margin: 0 auto;
  position: relative;
  .fo-bg {
    position: absolute;
    height: 100%;
    z-index: 6;
    width: 100%;
    background: url('~@/assets/images/fotbk.png') no-repeat center center;
  }
  .homepage_footer_body {
    width: 80%;
    display: flex;
    justify-content: space-between;

    .fot {
      display: flex;
      z-index: 7;
      flex-direction: column;
      h4 {
        font-size: 18px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: rgba(34, 34, 34, 1);
        margin-bottom: 14px;
        position: relative;
        &::before {
          content: '';
          position: absolute;
          bottom: -4px;
          height: 3px;
          background: #ccccccff;
          width: 100%;
          max-width: 140px;
        }
        span {
          display: inline-block;
          position: relative;
          &::before {
            content: '';
            position: absolute;
            bottom: -4px;
            height: 3px;
            background:#E27F4D;
            width: 100%;
          }
        }
      }
      span {
        font-size: 18px;
        font-family: PingFangSC-Semibold, PingFang SC;
        font-weight: 600;
        color: rgba(34, 34, 34, 1);
      }
      a {
        padding: 20px 0px;
      }
    }
    .footer_logo {
      z-index: 7;
      display: flex;
      align-items: baseline;
      flex-direction: column;
      justify-content: space-around;
    }
  }
}
</style>
