<style>
  .TuitractView {
    width: 930px;
    min-height: 500px;
    height: auto;
    margin: auto;
    padding: 20px 0;
    color: #000;
  }

  .firstPage {
    margin: 30px;
  }

  .operationAgree {
    font-size: 40px;
    letter-spacing: 10px;
    text-align: center;
    margin: 20px 0;
  }

  .operationTitle {
    display: flex;
    align-items: baseline;
    justify-content: center;
    position: relative;
  }

  .TuiContract {
    position: absolute;
    bottom: 28px;
    right: 130px;
  }
  .Tui_Jiafang{
    display:flex;
    font-size:20px;
    margin-bottom:20px;
  }
  .Tui_Inner{
    text-indent: 40px;
    font-size:20px;
    line-height: 35px;
    margin-bottom:10px;
  }
  .TuitractInput {
    border: 0;
    display: inline-block;
    border-bottom: 1px solid #c0c0c0;
    width: 200px;
    font-size: 20px;
    text-align: center;
    text-indent: 0;
  }
  .Tui_SignZhang{
    display: flex;
    font-size:20px;
    justify-content: space-between;
    margin-bottom:20px;
  }
</style>
<template>
  <div class="TuitractView">
    <div class="firstPage">
      <div class="operationTitle">
        <div class="operationAgree">培训课程退款协议</div>
        <div class="TuiContract">合约编号:123</div>
      </div>
      <div class="Tui_Jiafang">
        <div style="margin-right:100px;">甲方：</div>
        <div>（家长/监护人）：</div>
      </div>
      <div class="Tui_Jiafang">
        <div style="margin-right:150px;">乙方：</div>
        <div>法定代表人：</div>
      </div>
      <div class="Tui_Inner">
        甲乙双方经平等友好协商就 <div class="TuitractInput" style="width: 90px;">1988</div> 年
        <div class="TuitractInput" style="width: 80px;">12</div> 月 <div class="TuitractInput" style="width: 80px;">12</div> 日
        签订的《培训课程协议》解除合作关系。
      </div>
      <div class="Tui_Inner">第一条：原协议内容</div>
      <div class="Tui_Inner">
        原协议报名人员：<div class="TuitractInput" style="width: 300px;">1988</div>
      </div>
      <div class="Tui_Inner">
        原报名项目：<div class="TuitractInput" style="width: 300px;">1988</div>
      </div>
      <div class="Tui_Inner">
        原报名项目原价：<div class="TuitractInput" style="width: 100px;">1988</div>
        折后（优惠）价：<div class="TuitractInput" style="width: 100px;">1988</div>
      </div>
      <div class="Tui_Inner">
        原协议已收学费：<div class="TuitractInput" style="width: 300px;text-align:left;">
            大写：
        </div>
        （¥<div class="TuitractInput" style="width: 100px;">12</div>元整）。
      </div>
      <div class="Tui_Inner">
        原收据编号：<div class="TuitractInput" style="width: 150px;"></div>
      </div>
      <div class="Tui_Inner">
        原收款人：<div class="TuitractInput" style="width: 150px;"></div>
      </div>
      <div class="Tui_Inner">
        第二条：乙方共计课时<div class="TuitractInput" style="width: 80px;"></div>节；已销课时
        <div class="TuitractInput" style="width: 80px;"></div>节：剩余课时
        <div class="TuitractInput" style="width: 80px;"></div>节
      </div>
      <div class="Tui_Inner">
        甲方应退还乙方未上课时费用<div class="TuitractInput" style="width: 200px;">五千六百八十元整</div>
        （¥<div class="TuitractInput" style="width: 80px;"></div>元整），原协
        议自动终止、收据自动失效。退还帐户名<div class="TuitractInput" style="width: 200px;"></div>，退还帐号：<div class="TuitractInput" style="width: 300px;"></div>
        退还学费=乙方已缴总学费-已上课程学费-（乙方已缴学费-已上课程学费）*10%，其中“（乙方已缴课程学费）*10%”为违约金。
      </div>
      <div class="Tui_Inner">
        第三条：乙方应将原协议和收据原件交还甲方，若原件无法交还，请乙方<br/>在此声明：
        <div class="TuitractInput" style="width: 300px;"></div>
      </div>
      <div class="Tui_Inner">
        第四条：本协议自签订之日起正式生效。
      </div>
      <div class="Tui_SignZhang">
        <div>甲方(家长/监护人)签字（盖章）： </div>
        <div>甲方(家长/监护人)签字（盖章）： </div>
      </div>
      <div class="Tui_SignZhang">
        <div>签署日期：</div>
        <div>签署日期：</div>
      </div>
    </div>
  </div>
</template>
