<template>
  <box title="风险收益特征">
    <div class="content-box">
      <input type="text" class="input-id1" placeholder="请输入基金类型">
      <input type="text" class="input-id2" placeholder="请输入基金类型">
      <input type="text" class="input-id3" placeholder="请输入基金类型">
      <input type="text" class="input-id4" placeholder="请输入基金类型">
    </div>
  </box>
</template>

<script>
import Box from './Box.vue'
export default {
  components: { Box }
}
</script>

<style lang="scss" scoped>
.content-box{
  position: relative;
  margin: 29px 0 0 19px;
  width: 491px;
  height: 325px;
  background: url(https://webapp-pub.ezijing.com/x-training-new/features-bg.png);
  background-size: 100% 100%;
  input{
    width: 110px;
    font-size: 16px;
    color: #666666;
    background: none;
    outline: none;
  }
  .input-id1{
    position: absolute;
    top: 45px;
    right: -10px;
  }
  .input-id2{
    position: absolute;
    top: 106px;
    right: -45px;
  }
  .input-id3{
    position: absolute;
    top: 170px;
    right: -80px;
  }
  .input-id4{
    position: absolute;
    top: 238px;
    right: -118px;
  }
}
</style>
