.comment-wr {
    position: fixed;
    top : 0;
    /* left : -100%; */
    height: 100%;
    width: 500px;
    padding : 20px;
    margin : 0 auto;
    z-index: 99999999;

    /* display: none; */
    transition: all .2s;
    background-color: white;
    box-shadow: 1px 2px 3px black;
    overflow: auto;
    
}

.comment-wr .cmm-write textarea {
    border: .1px solid #546574;
    border-radius: .5vw;
    width: 100%;
    /* height: 5vw;
    padding : 1vw; */
    padding : 10px;
    resize: none;

}
.comment-wr .cmm-write > div > div{
    padding : 10px 0;
    text-align: right;
}

.comment-wr > div {
}

/* .comment-wr > div * {
    color : #546574;
} */
/* .comment-wr > div > h3 {
    position: relative;
} */
.cmm-close-btn {
    position: absolute;
    top : 0;
    right : 0;
}

.cmm-sub-title {
}
.cmm-sub-title > span {
    font-size: 22px;
    font-weight: 600;
}

.comment-wr > div .cmm-list ul {

    /* height : calc(100% - 170px); */
    overflow: auto;
    overflow-x: hidden;
    margin-top: 10px;
}
.comment-wr > div .cmm-list ul li {
    border : 1px solid #ccc;
    border-radius: 9px;
    box-shadow: 1px 2px 3px #ccc;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.comment-wr .page-total-num {
    text-align: center;
}
.comment-wr .page-total-num * {
    font-size: 13px;
}

.comment-wr .page-total-num > span > span {
    color: #99233c;
    font-size: 15px;
}
.comment-wr button {
    color : white;
    margin-left: 3vw;
}




.ds-comment {}

.ds-comment > div {
    padding : 10px;
}
.ds-comment > div * {
    font-size: 13px;
}

.ds-comment > div .ds-comment-top {
    display: flex;
}
.ds-comment > div .c-nm {
    flex : 1;
    display: inline-block;
    text-align: left;
}


.ds-comment > div .c-nm img {
    border-radius: 50%;
    width : 3vw;
    box-shadow: 1px 1px 1px black;
}


.ds-comment > div .stars {
    display: inline-block;
    width: 100%;
    text-align: center;
}

.ds-comment > div .cmt {
    display: inline-block;
    width: 100%;
    text-align: left;
    font-size: 13px;
    background-color: aliceblue;
    padding : 1vw;
    margin-bottom: 1vw;
}


.ds-comment > div .hearts {
    text-align: right;
    padding: .7vw;
}

.ds-comment > div .review-on {
    display: inline-block;
    width: 100%;
    text-align: right;
}
.ds-comment > div .review-on > span:nth-child(2){
    cursor: pointer;
}
.ds-comment > div .review-on > span:nth-child(3){
    cursor: pointer;
}
.ds-comment > div .review-on > span > span:hover {
    color: #99233c;
}
.ds-comment > div .review-on > span > span:active {
    color: #bb1338;
}

.ccm-footer {
    position: relative;
}
.ccm-footer > div {
    position: absolute;
    width: 200%;
    left: 50%;
    transform: scale(.8) translateX(-62.5%);
}


.comment-wr h3 {
    color : #333 !important;
    cursor: initial;
}
.comment-wr h3::after {
    content: '';
}
.comment-wr h3:hover {
    background : none;
}


li.active > .isometric-card {
    background-color: #48A6A7 !important;
}



.ccm-page {
    padding : 50px 10px !important;
}

.each-page > select {
    width: 100%;
    border: 0;
    width: 100%;
    color: #292929;
    background: aliceblue;
}