<template>
     <section class="repayment-form">   
            <p class="money">10,000.00</p>
            <p class="repay">未还本金（元）</p>
            <p class="repayment-text">仅展示三年内记录，更多信息请拨打400-0000-000</p>  
            <p class="repayment-input">还款</p>
            <p class="repayment-time">还款时间： <router-link to>近7天</router-link><router-link to>近1个月</router-link><router-link to>近1年</router-link> </p>        
        </section>
</template>

<script>
export default {
    name: "repaymentForm",
    data() {
        return {
            // routerPath: "",
            // toHome: "/"
        };
    },
   
};
</script>

<style lang="less" scoped>
@import "../../../assets/styles/common.css";
.main /deep/ .repayment-time {  
    padding:20px 0 37px;  
    color:#C0D1FF;            
    a{
        display:inline-block;
        padding:8px 9px;
        color:#C0D1FF; 
          
    }
    a:hover{ 
        border:1px solid #ffffff;
        color:#fff;
        padding:6px 9px;
        border-radius:4px;
        -moz-border-radius:4px; /* Old Firefox */  
        background:url(~assets/images/icon-checked.png) no-repeat 100% 100%;   
        background-size:12px 12px;            
    }
      
    
}

.repayment-form{
    width:100%; 
    text-align: center;
    background: url(~assets/images/icon-rdbj.png) 0 0 no-repeat;
    color:#fff;
    margin-top:30px;
    padding: 30px 0 18px;
    p{
        font-size:14px;   
        
    }    
    .repayment-input{
        background: #ffffff;
        color: #3D86E9;
        width: 184px;
        border: 1px solid;
        border-radius: 4px;
        -moz-border-radius: 4px;
        margin: 24px auto;
        padding: 15px 0;
        font-size: 18px;
        cursor:pointer;
    }
     .repay{       
        font-size:30px;
        color: #fff;
        margin: 20px 0; 
    }
    .repayment-text{  
        margin: 20px 0; 
        color: #8EB0F6;      
    }
    .money{ 
        margin:84px 0 20px 0; 
        font-size:63px;
        color: #fff;
       
    }  
}
</style>
