<template>
    <div style="padding: 0 10px">
      <flexbox>
        <flexbox-item><div class="flex-demo">
          <img src="../../assets/images/service/insure1.png" alt="">
        </div></flexbox-item>
        <flexbox-item><div class="flex-demo">
          <img src="../../assets/images/service/insure2.png" alt="">
        </div></flexbox-item>
        <flexbox-item><div class="flex-demo">
          <img src="../../assets/images/service/insure3.png" alt="">
        </div></flexbox-item>
      </flexbox>

      <p >
        人保财险黄石市分公司黄石港支公司
        1.全国统一热线电话（95518）24小时全天候服务。2.全国范围内车辆故障免费救援（50公里内），提供拖车、送油、充电、更换轮胎、轮胎充气等救援服务。3.网点机构遍布全国，异地出险、就地理赔。
      </p>

      <p style="margin: 40px 0 20px;color: red;text-align: center">
        若有业务咨询,请预留电话,客服人员会尽快联系到您
      </p>

      <!--<x-input title="手机号码格式化" mask="999 9999 9999" v-model="maskValue" :max="13" is-type="china-mobile"></x-input>-->

      <group title=" ">
        <x-input title="手机号码" name="mobile" placeholder="请输入手机号码" keyboard="number" is-type="china-mobile"></x-input>
      </group>

      <x-button type="primary" style="margin-top: 20px">确定</x-button>
    </div>
</template>

<script>
export default {
  name: "insureDetail",
  data(){
    return{
      maskValue:''
    }
  }
};
</script>

<style scoped lang="scss">
  .flex-demo {
    text-align: center;
    color: #fff;
    background-color: #20b907;
    border-radius: 4px;
    background-clip: padding-box;
    height: 100px;
    img{
      width: 100%;
      height: 100%;
    }
  }
</style>
