<template>
  <div id="fast">
    <el-row>
      <el-col :span="24">
        <el-col :span="24" class="fastTop" :style="`background:${backColor}`"> <i class="el-icon-user-solid"></i>快速通道 </el-col>
        <el-col :span="24" class="fastLink">
          <el-col :span="11" class="link">
            <el-link :underline="false" href="http://ccut.51langtu.com/improperBrowser.htm">职业测评</el-link>
          </el-col>
          <el-col :span="11" class="link">
            <el-link :underline="false" href="http://xlzx.zt.ccut.edu.cn/">就业心理咨询</el-link>
          </el-col>
          <el-col :span="11" class="link">
            <el-link :underline="false" href="http://www.jilinjobs.cn/">就业信息网</el-link>
          </el-col>
          <el-col :span="11" class="link">
            <el-link :underline="false" href="http://wzb.dept.ccut.edu.cn/">应征入伍</el-link>
          </el-col>
        </el-col>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: 'fast',
  props: {},
  components: {},
  data: () => ({
    backColor: '#850000',
  }),
  created() {},
  computed: {},
  methods: {},
};
</script>

<style lang="less" scoped>
.fastTop {
  height: 50px;
  line-height: 50px;
  text-align: center;
  color: #fff;
  font-size: 23px;
}
.fastLink {
  margin: 20px 0;
}
.fastLink .link {
  height: 50px;
  line-height: 45px;
  text-align: center;
  border: 1px dashed #ccc;
  border-radius: 7px;
  margin: 15px 7px;
}
.fastLink .link:hover {
  border: 1px dashed #850000;
}
.fastLink .link:hover .el-link {
  color: #850000;
}
.fastLink .link .el-link {
  font-size: 16px;
}
</style>
