<template>
  <div class="about">
    <div class="top-placeholder"></div>
    <div class="banner rel">
      <div class="abs imamge"></div>
    </div>
    <div class="">
      <div class="g3 title1">公司介绍</div>
      <div class="g6 f20 mt10">乐玩游戏自创建以来，一直致力于小游戏的研发和运营，成员包括阿里、网易、4399等游戏厂商的优秀人才</div>
      <div class="g6 f20 mt5">我们崇尚扁平化管理，本着对产品专注、专业、高效、创新的态度，立志做出有趣、有品质、有理念的三有产品</div>
    </div>
    <div class="introduce cl">
      <img class="game-imamge" src="../assets/03/zhaopian.jpg" alt="">
    </div>
    <div class="">
      <div class="g3 title1">团队介绍</div>
      <!-- <div class="g6 f20 mt10">成员包括阿里、网易、4399、百田等游戏厂商的优秀人才</div> -->
      <div class="g6 f20 mt10">小游戏&手游策划、美术、技术（2D+3D）运营、市场、产品经理目前共30多个小伙伴，配置一应俱全</div>
    </div>
    <div class="introduce cl">
      <img class="game-imamge" src="../assets/03/renyuan1.jpg" alt="">
    </div>
    <div class="bgf5 ovh ceo">
      <div class="g3 title1">CEO</div>
      <div class="g3 f20 mt10 tl ceo-introduce auto">
        <div class="f20 mt5">• 10年团队管理经验，8年产品策划经验，擅长移动互联网/游戏策划运营。</div>
        <div class="f20 mt5">• 主持过众多产品项目，包括大型手游平台App—4399游戏盒，从0到1，总用户量1.5亿，DAU350w，MAU2000w，游戏分发600w/天。</div>
        <div class="f20 mt5">• 对多种产品设计和用户运营有丰富经验，组建H5/微信小游戏研发团队，并参与平台搭建制作，擅长管理、沟通、市场分析。</div>
      </div>
    </div>
    <!-- 公司成长 -->
    <div class="team rel cl">
      <!-- <div class="abs imamge"></div> -->
      <div class="cl">
        <div class="g3 title3">公司成长</div>
        <div class="g6 f20 mt20">
          <!-- <div>合作渠道覆盖面广，IP定制方式灵活，研发推广一体无忧</div> -->
        </div>
      </div>
      <ul class="team-item-box auto cl ovh">
        <!-- <li class="item rel tc l">
          <div class="normal1">
            <img class="img1"  src="../assets/03/chengzhang01.png" alt="">
          </div>
        </li> -->
        <li class="item rel tl l">
          <div class="normal">
            <h4 class="desc1 g3 f28">2018.05</h4>
            <img class="number"  src="../assets/03/chengzhang02.jpg" alt="">
            <div class="desc2 g6 f14 tl mt15">
              <div>公司成立</div>
            </div>
          </div>
        </li>
        <li class="item rel tc l">
          <div class="normal1">
            <img class="img1"  src="../assets/03/chengzhang01.png" alt="">
          </div>
        </li>
        <li class="item rel tl l">
          <div class="normal">
            <h4 class="desc1 g3 f28">2018.10</h4>
            <img class="number"  src="../assets/03/chengzhang02.jpg" alt="">
            <div class="desc2 g6 f14 tl mt15">
              <div>单日产品活跃200w</div>
            </div>
          </div>
        </li>
        <li class="item rel tc l">
          <div class="normal1">
            <img class="img1"  src="../assets/03/chengzhang01.png" alt="">
          </div>
        </li>
        <li class="item rel tl l">
          <div class="normal">
            <h4 class="desc1 g3 f28">2019.02</h4>
            <img class="number"  src="../assets/03/chengzhang02.jpg" alt="">
            <div class="desc2 g6 f14 tl mt15">
              <div>单品累计注册4000w</div>
            </div>
          </div>
        </li>
        <li class="item rel tc l">
          <div class="normal1">
            <img class="img1"  src="../assets/03/chengzhang01.png" alt="">
          </div>
        </li>
        <li class="item rel tl l">
          <div class="normal">
            <h4 class="desc1 g3 f28">2019.05</h4>
            <img class="number"  src="../assets/03/chengzhang02.jpg" alt="">
            <div class="desc2 g6 f14 tl mt15">
              <div>财政部合作产品上线</div>
            </div>
          </div>
        </li>
        <li class="item rel tc l">
          <div class="normal1">
            <img class="img1"  src="../assets/03/chengzhang01.png" alt="">
          </div>
        </li>
        <li class="item rel tl l">
          <div class="normal">
            <h4 class="desc1 g3 f28">2019.06</h4>
            <img class="number"  src="../assets/03/chengzhang02.jpg" alt="">
            <div class="desc2 g6 f14 tl mt15">
              <div>产品累计用户6500w</div>
            </div>
          </div>
        </li>
        <li class="item rel tc l">
          <div class="normal1">
            <img class="img1"  src="../assets/03/chengzhang01.png" alt="">
          </div>
        </li>
        <li class="item rel tl l">
          <div class="normal">
            <h4 class="desc1 g3 f28">2019.07</h4>
            <img class="number"  src="../assets/03/chengzhang02.jpg" alt="">
            <div class="desc2 g6 f14 tl mt15">
              <div>肯德基合作产品上线</div>
            </div>
          </div>
        </li>
        <li class="item rel tc l">
          <div class="normal1">
            <img class="img1"  src="../assets/03/chengzhang01.png" alt="">
          </div>
        </li>
        <li class="item rel tl l">
          <div class="normal">
            <h4 class="desc1 g3 f28">2019.08</h4>
            <img class="number"  src="../assets/03/chengzhang02.jpg" alt="">
            <div class="desc2 g6 f14 tl mt15">
              <div>央行合作产品上线</div>
            </div>
          </div>
        </li>
        <li class="item rel tc l">
          <div class="normal1">
            <img class="img1"  src="../assets/03/chengzhang01.png" alt="">
          </div>
        </li>
        <li class="item rel tl l">
          <div class="normal">
            <h4 class="desc1 g3 f28">2019.09</h4>
            <img class="number"  src="../assets/03/chengzhang02.jpg" alt="">
            <div class="desc2 g6 f14 tl mt15">
              <div>美赞臣蓝臻合作产品上线</div>
            </div>
          </div>
        </li>
        <li class="item rel tc l">
          <div class="normal1">
            <img class="img1"  src="../assets/03/chengzhang01.png" alt="">
          </div>
        </li>
        <li class="item rel tl l">
          <div class="normal">
            <h4 class="desc1 g3 f28">2019.10</h4>
            <img class="number"  src="../assets/03/chengzhang02.jpg" alt="">
            <div class="desc2 g6 f14 tl mt15">
              <div>美赞臣安儿宝合作产品上线</div>
            </div>
          </div>
        </li>
        <li class="item rel tc l">
          <div class="normal1">
            <img class="img1"  src="../assets/03/chengzhang01.png" alt="">
          </div>
        </li>
      </ul>
    </div>
    <PageFooter msg="Welcome to Your Vue.js App"/>
  </div>
</template>

<script>
// @ is an alias to /src
import PageFooter from '@/components/PageFooter.vue'

export default {
  name: 'home',
  components: {
    PageFooter
  }
}
</script>

<style lang="scss" scoped>
.top-placeholder {
  width: 100%;
  height: 100px;
}
.banner {
  width: 100%;
  height: 500px;
  .imamge {
    width: 100%;
    height: 500px;
    background: url('../assets/03/banner.jpg') no-repeat center center / 1920px;
  }
}
.title1 {
  margin-top: 100px;
  font-size: 40px;
}
.introduce {
  margin-top: 45px;
}
.ceo {
  padding-bottom: 100px;
}
.ceo-introduce {
  width: 700px;
}
/* 团队 */
.team {
  width: 100%;
  height: 480px;
  .title3 {
    padding-top: 60px;
    font-size: 40px;
  }
  .subtitle {
    color: #eeeeee;
  }
  .team-item-box {
    margin-top: 40px;
    width: 1102px;
  }
  .item {
    height: 100px;
    margin:30px 18px 10px 18px;
    .game-imamge {
      width: 200px;
      height: 250px;
      display: block;
    }
    .desc1 {
      margin: 12px 0 0 0;
    }
    .game-desc {
      margin-left: 28px;
    }
    .normal{
      height: 100px;
    }
    .normal1{
      height: 100px;
      line-height: 100px
    }
  }
}
</style>
