.main .main-bg {
  background: #fff1b0;
}

.main-header {
  text-align: left;
  padding: 16px 8px 8px;
}
.main-header .title {
  position: absolute;
  margin-left: 27px;
  font-size: 22px;
  line-height: 23px;
  width: 294px;
  text-align: left;
  -webkit-transform: translateY(-6px);
      -ms-transform: translateY(-6px);
          transform: translateY(-6px);
}
.main-header .btn-disp {
  margin-left: 26px;
}
.main-header .area {
  height: 44px;
}
.main-header .area .text-s {
  font-size: 14px;
  line-height: 44px;
}
.main-header .area-debt {
  margin-left: 240px;
}
.main-header .area-mode {
  margin-left: 20px;
  margin-right: 25px;
  width: 190px;
}
.main-header .area-type, .main-header .area-guarantee {
  width: 230px;
}
.main-header .area-school {
  width: 332px;
}
.main-header .area-mode, .main-header .area-school, .main-header .area-type, .main-header .area-guarantee, .main-header .area-start {
  display: inline-block;
  vertical-align: top;
  margin-top: 8px;
  height: 76px;
}
.main-header .area-mode > *, .main-header .area-school > *, .main-header .area-type > *, .main-header .area-guarantee > *, .main-header .area-start > * {
  -webkit-transform: translateY(0px);
      -ms-transform: translateY(0px);
          transform: translateY(0px);
}
.main-header .area-mode > * .text-s, .main-header .area-school > * .text-s, .main-header .area-type > * .text-s, .main-header .area-guarantee > * .text-s, .main-header .area-start > * .text-s {
  -webkit-transform: translateY(-3px) !important;
      -ms-transform: translateY(-3px) !important;
          transform: translateY(-3px) !important;
}
.main-header .area-mode .text-title-s, .main-header .area-school .text-title-s, .main-header .area-type .text-title-s, .main-header .area-guarantee .text-title-s, .main-header .area-start .text-title-s {
  display: block;
  font-size: 14px;
  line-height: 14px;
  margin-top: 6px;
  margin-bottom: 5px;
}
.main-header .area-mode label, .main-header .area-school label, .main-header .area-type label, .main-header .area-guarantee label, .main-header .area-start label {
  display: inline-block;
  text-align: left;
  margin-top: 0px;
  margin-bottom: 0px;
  line-height: 20px;
}
.main-header .area-mode label .text-b, .main-header .area-school label .text-b, .main-header .area-type label .text-b, .main-header .area-guarantee label .text-b, .main-header .area-start label .text-b {
  display: block;
  line-height: 18px;
  font-size: 18px;
  margin-left: 26px;
}
.main-header .area-mode label .text-s, .main-header .area-school label .text-s, .main-header .area-type label .text-s, .main-header .area-guarantee label .text-s, .main-header .area-start label .text-s {
  display: block;
  font-size: 14px;
  line-height: 14px;
  margin-top: 4px;
  margin-left: 20px;
}
.main-header .area-mode input[type=radio], .main-header .area-school input[type=radio], .main-header .area-type input[type=radio], .main-header .area-guarantee input[type=radio], .main-header .area-start input[type=radio] {
  width: 16px;
  height: 16px;
  position: absolute;
}
.main-header .area-mode form, .main-header .area-school form, .main-header .area-type form, .main-header .area-guarantee form, .main-header .area-start form {
  height: 22px;
  line-height: 22px;
}
.main-header .area-mode form label, .main-header .area-school form label, .main-header .area-type form label, .main-header .area-guarantee form label, .main-header .area-start form label {
  height: 22px;
  line-height: 22px;
  margin-left: 6px;
}
.main-header .btn-disp {
  margin-left: 76px;
}
.main-header .btn-reset {
  margin-left: 10px;
}

.main-graph {
  width: 100%;
  padding: 7px 30px 7px;
}
.main-graph .graph-title {
  font-size: 20px;
  margin: 4px 10px 4px;
  font-weight: 600;
  color: #484848;
}
.main-graph .area-graph {
  width: 100%;
  background: #FAFAFA;
  display: inline-block;
  border-radius: 8px;
  -webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.2);
          box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.2);
  border: solid 1px rgba(0, 0, 0, 0.6);
}
.main-graph .area-graph .list-repayment {
  padding: 4px 10px 8px;
  margin: 0px;
  height: 414px;
}
.main-graph .area-graph .list-repayment li {
  display: inline-block;
  text-align: center;
  width: 74px;
  margin: 3px 6px 3px;
}
.main-graph .area-graph .list-repayment li .graph {
  text-align: center;
}
.main-graph .area-graph .list-repayment li .graph .pay-total {
  display: inline-block;
  height: 290px;
  width: 84%;
  margin: 0 auto;
}

.main-footer .area-complete {
  margin-left: 35px;
}
.main-footer .area-complete .num {
  color: #ce5753;
  font-size: 22px;
}
.main-footer .area-complete .text {
  font-size: 14px;
  margin-right: 0px;
}

.main-meisai {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
}
.main-meisai .bg {
  position: absolute;
  background: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
}
.main-meisai .bg-main {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  text-align: center;
  background: #FAFAFA;
  padding: 20px;
  border-radius: 6px;
}
.main-meisai table {
  display: inline-block;
  border: solid 1px #a0a0a0;
}
.main-meisai table td {
  width: 200px;
  border: solid 1px #a0a0a0;
}
.main-meisai table td.al-r {
  text-align: right;
  padding-right: 8px;
}
.main-meisai table .title {
  background: #fff1b0;
  height: 32px;
  font-size: 15px;
}
.main-meisai table .num {
  background: #FFFFFF;
  height: 70px;
  font-size: 18px;
}