#entranceAnimation{
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    background: rgba(0,0,0,1);
    margin: auto;
    z-index: 99;
    display: none;
}
.answer-board{
    position: fixed;
    left: 0;
    top: 0;
    background: rgba(0,0,0,.5);
    width: 100%;
    height: 100%;
    z-index: 6;
    display: none;
}

.no_answer{font-size: 36px;text-align: center;display: none;}

.answer-board .close_btn{
    position: absolute;
    display: inline-block;
    top: -68px;
    right: -40px;
    width: 32px;
    height: 32px;
    background: url(../images/web1/close_mini.png) no-repeat;
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

#abuWork{height: 100px;
    width: 100px;
    position: absolute;
    top: -126px;
    right: 0;
}

#abuWork .close_abu{
    display: inline-block;
    height: 18px;
    width: 18px;
    background: url('../images/encourage/close.png') no-repeat;
    background-size: cover;
}

#abuWork .abu-close-btn{
    position: absolute;
    right: 12px;
    top: 14px;
    height: 18px;
    width: 18px;
    background: rgba(0,0,0,.5);
    z-index: 9;
    border-radius: 50%;
    display: none;
}

.board-container{
    height: 124px;
    width: 260px;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    background: url('../images/encourage/answer_right_back.png') no-repeat;
    background-size: contain;
}

.board-container.fail{
    background: url('../images/encourage/answer_wrong_back.png') no-repeat;
    background-size: contain;
}


.board-container.fill-blank{
    background: url('../images/encourage/answer_fill_wrong_back.png') no-repeat;
    height: 180px;
    width: 308px;
    background-size: contain;
}

.board-container.muitiple{
    background: url('../images/encourage/muitiple_right_back.png') no-repeat;
    height: 270px;
    width: 308px;
    background-size: contain;
}

.board-container.fail.muitiple{
    background: url('../images/encourage/multiple_wrong_back.png') no-repeat;
    height: 270px;
    width: 308px;
    background-size: contain;
}

.board-container.fail.muitiple .grades-info{visibility: hidden;}

#abuAnimation{
    position: absolute;
    right: -95px;
    bottom: -16px;
    height: 165px;
    width: 156px;
}

.abu-cry{
    right: -107px !important;
    bottom: -28px !important;
}

.board-container.fill-blank .fill-info,.board-container.muitiple .fill-info{
    justify-content: space-evenly;
}

.abu-flex{
    display: flex;
}


.abu-disapper{
    display: none;
}


.board-container.fill-blank .fill-info div,.board-container.muitiple .fill-info div{
    text-align: center;
    overflow-wrap: break-word;
    flex: 1;
    text-align: center;
}


.board-container.muitiple .answer-tip.muitiple-fill div:nth-of-type(1){width: 72px;text-align: center;}
.board-container.muitiple .answer-tip.muitiple-fill div:nth-of-type(2){flex-grow: 1;text-align: center;}
.board-container.muitiple .answer-tip.muitiple-fill div:nth-of-type(3){flex-grow: 1;text-align: center;}

.board-container .answer-tip{
    justify-content: space-evenly;
    font-size: 14px;
    color: black;
}

.board-container .answer-tip div{
    flex: 1;
    text-align: center;
}

.board-container .question-code{display: none;}

.board-container.muitiple .answer-tip div{width: 100px;text-align: center;}
.board-container.fill-blank .fill-info div span,.board-container.muitiple .fill-info div span{
    font-size: 18px;
}

/* .board-container.fill-blank .fill-info div span{
    display: block;
} */

.board-container.muitiple .fill-info{height: 106px;overflow-y: scroll;margin-top: 3px;}

.board-container.muitiple .fill-info.muitiple-fill>div:nth-of-type(1){width: 72px;text-align: center;}
.board-container.muitiple .fill-info.muitiple-fill>div:nth-of-type(2){flex-grow: 1;text-align: center;}
.board-container.muitiple .fill-info.muitiple-fill>div:nth-of-type(3){flex-grow: 1;text-align: center;}

.board-container.muitiple .fill-info>div{width: 100px;text-align: center;}

.board-container.fail p{display: none;}

.board-container.fill-blank .self-answer span,.board-container.muitiple .self-answer span{color:#63AE1B;}
.board-container.fill-blank .self-answer .answer_wrong,.board-container.muitiple .self-answer .answer_wrong{color:rgba(222,75,75,1)}

.board-container .board-header{
    background: url('../images/encourage/answer_right_title.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    height: 82px;
    width: 100%;
    position: absolute;
    top: -50px;
    z-index: 6;
    
}

.board-container.fail .board-header{
    background: url('../images/encourage/answer_wrong_title.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.board-container.great .board-header{
    background: url('../images/encourage/great.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.board-container.perfect .board-header{
    background: url('../images/encourage/perfect.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.board-container.comeon .board-header{
    background: url('../images/encourage/comeOn.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.board-container.part-right .board-header{
    background: url('../images/encourage/part_right.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.board-container .board-header .title-back{background: url('../images/encourage/answer_right_title_back.png') no-repeat;
    background-size: contain;
    position: absolute;
    left: -10px;
    top: -40px;
    background-position: center;
    width: 100%;
    height: 108px;
    z-index: 3;
}

.board-container.fail .board-header .title-back{
    background: url('../images/encourage/answer_wrong_title_back.png');
    background-size: contain;
    top: -40px;
    background-position: center;
}


.board-container.part-right .board-header .title-back{
    background: url('../images/encourage/answer_right_title_back.png');
    background-size: contain;
    top: -40px;
    background-position: center;
}


.board-container .star{
    background: url('../images/encourage/bonus_star.png');
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    height: 42px;
    width: 42px;
}

.split-line{height: 1px;border: 1px solid rgba(216,216,216,1);width: 62%;margin: 11px 0 9px 19%;display: none;}

.board-container.fill-blank .split-line{display: block;}

.board-container .grades{font-size: 32px;font-weight: bold;color: #FF9123;}
.board-container.fail .grades{color:rgba(204,204,204,1)}
.board-container.part-right .grades{color: #FF9123}


.board-container .grades-info{display: flex;align-items: center;justify-content: center;margin-top: 39px;}

.board-container p{
    font-size: 12px;
    font-family:PingFangSC-Regular,PingFang SC;
    font-weight:400;
    color:rgba(194,194,194,1);
    text-align: center;
}

@media only screen and (max-width: 500px) {
    .board-container{
        top: auto;
        bottom: 100px;
    }
    .answer-board .close_btn{
        right: 0px;
        z-index: 9;
    }
}