﻿.pay-list {
    background: #fff;
    padding: 34px 0 50px 40px;
    min-height: 680px;
    position: relative;
}

.guide {
    font-size: 16px;
    color: #333;
    text-align: center;
    height: 72px;
}

.guide_IsShow {
    font-size: 16px;
    color: #FF740B;
    height: 72px;
}

.next_btn {
    background: #ff0000;
    border: 0;
    width: 100px;
    height: 35px;
    border-radius: 20px;
    color: #fff;
    font-size: 15px;
    margin-top: 15px;
    display: inline-block;
    line-height: 35px;
    margin-left: 30px;
}

.pay-list em {
    font-style: normal;
    padding-left: 10px;
}

@media (min-width: 1280px) {
    .pay-list {
        min-height: 750px;
    }
}

.tuition-list {
    border: 1px solid #F1F1F1;
    border-radius: 2px;
    margin-bottom: 20px;
}

.annual-tuition {
    background: #F5F5F5;
    font-size: 18px;
}

    .annual-tuition em {
        font-size: 14px;
    }

    .annual-tuition .tuition-year {
        float: right;
        font-size: 16px;
    }

        .annual-tuition .tuition-year em {
            color: #FF740B;
        }

    .annual-tuition.prohibition-pay .checkbox-btn {
        border: 0;
        background: none;
        cursor: initial
    }

    .annual-tuition .term-batch {
        color: #44b86d;
        display: block;
        float: left;
        margin-top: -1px;
        margin-right: 10px;
    }

    .annual-tuition.prohibition-pay .tuition-year em {
        color: #b4b4b4;
    }

.annual-tuition,
.tuition-list ul li {
    height: 60px;
    line-height: 60px;
    padding: 0 15px;
}

.checkbox-btn {
    display: block;
    width: 16px;
    height: 16px;
    border: 1px solid #ccc;
    background: #fff;
    margin-top: 22px;
    margin-right: 15px;
    float: left;
    cursor: pointer;
}

    .checkbox-btn.disabled {
        background: #F5F5F5;
    }

    .checkbox-btn.active {
        background: url('../../../../images/questionsIcon/multiCorrect.png');
        background-size: 16px;
        border: 0;
    }

.tuition-list ul {
    margin: 0;
    padding: 0;
}

    .tuition-list ul li {
        border-top: 1px solid #F1F1F1;
        font-size: 16px;
    }

        .tuition-list ul li .tuition-name {
            width: 300px;
            display: inline-block;
        }

        .tuition-list ul li .tuition-money em {
            color: #FF740B;
        }

.total-amount,
.account-balance {
    border: 1px solid #F1F1F1;
    color: #999;
    height: 60px;
    line-height: 60px;
    background: #FAFAFA;
}

.account-balance {
    margin-top: 28px;
    border-bottom: 0;
    font-size: 16px;
    padding-right: 15px;
}

    .account-balance > div {
        text-align: right;
    }

        .account-balance > div .checkbox-btn {
            display: inline-block;
            float: initial;
        }

        .account-balance > div p {
            float: right;
        }

    .account-balance span.active {
        background: url(../../../../images/questionsIcon/multiCorrect.png);
        background-size: 16px;
        border: 0;
    }

.total-amount span {
    float: right;
    font-size: 16px;
    margin-right: 38px;
}

    .total-amount span em {
        padding-left: 10px;
    }

.total-amount button {
    width: 139px;
    height: 60px;
    background: #F5F5F5;
    float: right;
    font-size: 18px;
    border-radius: 0;
}

    .total-amount button:hover {
        background: #F5F5F5;
        color: #999;
    }

.total-amount.active {
    color: #FF740B;
}

    .total-amount.active button {
        background: #FF740B;
        color: #fff;
        outline: none;
    }

.data-none {
    display: none;
    width: 130px;
    height: 180px;
    background: url(../../../../images/common/none.png) no-repeat;
    margin: 0px auto;
    margin-top: 100px;
}

.montmorillonite_layer {
    position: absolute;
    left: 0;
    top: -144px;
    width: 200px;
    z-index: 1000;
    height: 100%;
    bottom: 0px;
}

.montmorillonite_IsShow_layer {
    position: absolute;
    left: 230px;
    top: -136px;
    width: 1100px;
    z-index: 10;
    height: 100%;
    padding-bottom: 200px;
    bottom: 0px;
}

.checkbox-btn-input{
    float: left;
    margin: 18px 10px 0 0;
    width: 18px;
    height: 18px;
}
.checkbox-btn-input input{
    display: none;
}

.checkbox-btn-input span{
    display: block;
    text-align: center;
    font-size: 14px;
    background:#fff;
    color: #636363;
    cursor: pointer;
    border: 1px solid #636363;
    border-radius: 4px;
    width: 18px;
    height: 18px;
    color: #fff;
}
.checkbox-btn-input span i{
    display: none;
    line-height: 16px;
}

.checkbox-btn-input input:disabled + span{
    border-color: #ccc !important;
    background:#ccc !important;
}

.checkbox-btn-input input:checked + span{
    background:#44b86d;
    border-color: #44b86d;
}
.checkbox-btn-input input:checked + span i{
    display: block;
}
