@font-face {
    font-family: "iconfont";
    src: url('iconfont.eot?t=1561269216151');
    src: url('iconfont.eot?t=1561269216151#iefix') format('embedded-opentype'), url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAKEAAsAAAAABjAAAAI5AAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCCcAo0UgE2AiQDCAsGAAQgBYRtBzcbfwURBbzJfhTG7Unt3Ey2twWJIGgkjUTfFxE87c3N+7t32eyldBVqUSmKVqsCYc6iwAk8wqBLlV0j4W9NV/0YE5btkj1061m+I/nRnaaD8ziNUgiJkHSDMfg7n+dyehPoQOYHOsf2oLEmTeoF1IsDKdA9MIqsUAJvGLvAJTwmUC21Wezdf/SsIrNWBeLpowe3lFxUllmhCN2ag1m80lGaF81bvAy/H3/MRaHRSayWk/f33bXz+4Jdkvpt31WfECOg4x0kbEYmztZmj0uCcUnNZivZV2PwfaFtfY/Yq1Owv86qHwKzUHVPanelAA3c1lQVk6N+B1HPXTk/fOXS8NlLt3+sv73l34edvKZ/jv9Al3XaCdp36XWaEAju/U+5Mbr1b9ll8HFxoTDcvsv6+Skr+4KfoO45kHWt5W6yqq4dbdSdt1UVLRyc8G2sbfqMxVBMj/APWJIiKVaTmd2Mjp4FdBU7UG1y4HjPpGeSyN8gNnoDhDEfNEa8QTLmS2b2h44Zf3SNRUJ1PiYv7Fkbj9QexlywguIFtuw7cryiosYr6rnJOasN+SfyZBMQ+WGxkGGHPMeWadGxCAFx30IKnsOm6WHg3mEpvhEZkiCgujf5Zd96yh4M5QSqgMILsEq9DvnjhSp9/gpps0aOW/pqyifEJnZ2EPGFPcjM1PXqu5dXJgstJgQBhPVaIAXzUKPRA0P9PAeVhM+MSA8SgT2M+pr89S3t152AyrI3Yd+QDD83dp2dzfvNdtrzAAA=') format('woff2'), url('iconfont.woff?t=1561269216151') format('woff'), url('iconfont.ttf?t=1561269216151') format('truetype'), url('iconfont.svg?t=1561269216151#iconfont') format('svg');
}

.iconfont {
    font-family: "iconfont" !important;
    font-size: 20px;
    font-style: normal;
    color: #888;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.star-five span {
    display: block;
    float: left;
    font-size: 18px;
    font-family: "iconfont" !important;
    text-align: center;
    color: #a9a9a9;
    width: 18px;
    height: 24px;
    line-height: 24px;
    margin-right: 1px;
    position: relative;
    overflow: hidden;
    white-space: pre;
}

    .star-five span:before {
        position: absolute;
        left: 0;
        top: 0;
        display: block;
        width: 50%;
        content: attr(data-content);
        overflow: hidden;
        color: #F63;
    }

.incomplete1 span:before {
    width: 40%;
}

.incomplete2 span:before {
    width: 50%;
}

.incomplete3 span:before {
    width: 60%;
}

.incomplete4 span:before {
    width: 70%;
}

.incomplete5 span:before {
    width: 80%;
}

.incomplete6 span:before {
    width: 90%;
}

.star-five b {
    font-weight: normal;
    line-height: 27px;
    font-size: 12px;
    color: #888;
    margin-left: 4px;
}

.integral {
    color: #F63 !important;
}