.comment-box{margin-top:1.25rem}.comment-box .comment-from{display:flex;justify-content:flex-start;margin-bottom:1.25rem}.comment-box .comment-from .avatar-box{display:flex;justify-content:center;align-items:center;background:#fff;box-shadow:0 6px 35px #00000005;width:50px;height:50px;border-radius:50%;overflow:hidden}.comment-box .comment-from .avatar-box .el-image,.comment-box .comment-from .avatar-box>img{width:100%;height:100%}.comment-box .comment-from .avatar-box .icon{color:var(--muted-3-color);font-size:1.5rem}.comment-box .comment-from .from-box{flex-grow:1;display:flex;position:relative;margin-left:1.25rem;height:6rem}.comment-box .comment-from .from-box .input{position:relative;display:block;padding:.5rem;width:100%;height:100%;font-size:1rem;line-height:1.5em;color:#4b4b4b;border:1px solid #f0f0f0;border-right:none;border-top-left-radius:var(--main-radius);border-bottom-left-radius:var(--main-radius);box-shadow:0 0 10px var(--main-shadow);background:#fff}.comment-box .comment-from .from-box .input .el-textarea{height:100%}.comment-box .comment-from .from-box .input .el-textarea textarea{font-size:1rem;border:none;box-shadow:none;height:100%}.comment-box .comment-from .from-box .btn{width:100px;height:6rem;line-height:6rem;color:#fff;font-weight:600;text-align:center;background:#379be9;border-top-right-radius:var(--main-radius);border-bottom-right-radius:var(--main-radius);box-shadow:0 0 10px var(--main-shadow);cursor:pointer}.comment-box .comment-from .from-box .btn:hover{background:#328bd1}.comment-box .comment-list .list-box{display:flex;justify-content:space-between;margin-top:1.25rem;padding:1.25rem;background:var(--main-bg-color);box-shadow:0 0 10px var(--main-shadow);border-radius:var(--main-radius)}.comment-box .comment-list .list-box .avatar-box{flex-shrink:0;display:flex;justify-content:center;align-items:center;background:#f7f8fa;box-shadow:0 6px 35px #00000005;margin-right:1.25rem;width:50px;height:50px;border-radius:50%;overflow:hidden}.comment-box .comment-list .list-box .avatar-box .el-image,.comment-box .comment-list .list-box .avatar-box img{width:100%;height:100%}.comment-box .comment-list .list-box .avatar-box .icon{color:var(--muted-3-color);font-size:1.5rem}.comment-box .comment-list .list-box .content-box{flex-grow:1}.comment-box .comment-list .list-box .content-box .head-box{display:flex;justify-content:space-between}.comment-box .comment-list .list-box .content-box .head-box .meta{display:flex;flex-direction:column}.comment-box .comment-list .list-box .content-box .head-box .meta .text{color:var(--muted-color);font-size:1rem;line-height:1em}.comment-box .comment-list .list-box .content-box .head-box .meta .time{margin-top:1rem;color:var(--muted-2-color);font-size:.75rem;line-height:1em}.comment-box .comment-list .list-box .content-box .head-box .right .icon{margin-left:10px;color:var(--muted-2-color);font-size:.875rem;cursor:pointer}.comment-box .comment-list .list-box .content-box .head-box .right .icon i{margin-right:1px;font-size:.875rem}.comment-box .comment-list .list-box .content-box .content,.comment-box .comment-list .list-box .content-box .reply{margin-top:1rem;color:var(--muted-color);font-size:1rem;line-height:1.5em}.comment-box .comment-list .list-box .content-box .reply{padding:1.25rem;background:#f7f8fa;border-radius:var(--main-radius);overflow:hidden}.comment-box .comment-list .list-box .content-box .reply .label{margin-right:10px;color:var(--muted-3-color)}.comment-box .comment-list .list-box .content-box .reply .foot{display:flex;justify-content:space-between;align-items:center;margin-top:1rem}.comment-box .comment-list .list-box .content-box .reply .foot .left{color:var(--muted-2-color);font-size:.75rem}.comment-box .comment-list .list-box .content-box .reply .foot .right .icon{margin-left:10px;color:var(--muted-2-color);font-size:.875rem;cursor:pointer}.comment-box .comment-list .list-box .content-box .reply .foot .right .icon i{margin-right:2px;font-size:.875rem}