.circle{ border-radius: 100rem; display: inline-block; text-align: center; width: 2em; height: 2em; line-height: 1.9em; font-style: normal; }

.cs-ask{ width: 20em; max-width: 100%;}
.cs-ask .select-box{ display: block;}
.qst-head{ display: flex; justify-content: space-between; line-height: 2.2;}
.qst-head h3{ font-weight: normal;}

.qst-list li{ padding: 0.5em; background: rgba(255, 255, 255, 0.5); margin: 0.5em 0; position: relative;}
.qst-list li .time{ float: right;}
.qst-list li.sign::after{
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: red;
    position: absolute;
    left: 2px;
    top: 2px;
    -webkit-animation: heartbeat 4s;
    animation: heartbeat 4s;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
@keyframes heartbeat
{
    0%, 20%, 40%, 60%, 80%, 100%
    {
        transform: scale(.9);
    }
    10%, 30%, 50%, 70%, 90%
    {
        transform: scale(1.15);
    }
}
@-webkit-keyframes heartbeat
{
    0%, 20%, 40%, 60%, 80%, 100%
    {
        -webkit-transform: scale(1);
    }
    10%, 30%, 50%, 70%, 90%
    {
        -webkit-transform: scale(1.15);
    }
}
.qst-detail .title{ font-size: 1.2em; text-align: center;}
.qst-detail .imgs li{ width: 40px; height: 40px; overflow: hidden;}
.qst-detail .foot{display: flex; justify-content: space-between; align-items: stretch; height: 46px;}
.qst-detail .foot textarea{ flex-grow: 5; padding: 0.5em}
.qst-detail .foot .btn-save{ text-align-last: justify; padding: 0.25em 1em; width: 5em; margin-right: 10px;}

.reply-item{ display: flex; margin: 1em auto;}
.reply-item::after{ content: " ";}
.reply-item .avatar, .reply-item::after{ width: 40px; font-size: 40px; height: 40px; overflow: hidden; line-height: 40px; text-align: center; border-radius: 40px;  flex-shrink: 0;}
.reply-item .avatar{background: #fff;}
.reply-item .content{ padding: 0.75em 1em; border-radius: 0.25em; flex-grow: 10; margin: 0 var(--mg1) ;}
.reply-item .content .imgs{ display: flex; margin-top: 1em;}
.reply-item .content .imgs img{ width: 30px; height: 30px;}
.player{ justify-content: flex-start; flex-direction: row-reverse;}
.player .content{ background: #3cadd6; color: #fff; }
.cser .content{ background: #fff; }