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