.view-cmnt-wp{width:100%; background: rgba(0,0,0,0.8); position: fixed; left:0; top:0; height: 100vh; z-index: 200;  overflow-x: scroll; -ms-overflow-style:none; scrollbar-width: none; display:none;}
.view-cmnt-wp::-webkit-scrollbar{display: none;}
.view-cmnt-area{max-width:600px; width:100%; margin:0 auto; float:right; background:#fff; height:100%}

/*�볤��곸뿭 �곷떒*/
.view-cmnt-area .top-cmnt{width:100%; height:64px; background-color:#fff; position: fixed;top:0; border-bottom:1px solid #ddd; z-index:200;}
.view-cmnt-area .top-cmnt h2{font-size:0.8rem; color:#333; font-family: 'Noto Sans KR'; font-weight:500; letter-spacing:-0.4px; line-height:62px; margin-left:2px; display:inline-block;}
.view-cmnt-area .top-cmnt h2 span{color:#E63740;}
.view-cmnt-area .top-cmnt a.close-btn{display:inline-block; width:17px; height:17px; background:url(/assets/img/icon_back.png) center / 15px 15px no-repeat; margin-bottom:-3px; margin-left:20px;}
/*�볤��곸뿭 �곷떒*/

/*�볤� �묒꽦�곸뿭*/
.view-cmnt-area .cmnt-write{background:#f6f6f6; width:100%; padding:20px; border-bottom:1px solid #ddd; margin-top:64px;}
.view-cmnt-area .cmnt-write input[type="text"].cmnt-name{width:180px; height:32px; border:1px solid #ddd; display:block; margin-bottom:6px; padding-left:10px; color:#333; box-sizing:border-box; margin-right:4px; padding:8px 8px 7px 8px; float: left;}
.view-cmnt-area .cmnt-write input[type="text"].cmnt-name::placeholder{color:#bbb; font-size:0.7rem; font-weight:400; position:relative; top:-1px}
.view-cmnt-area .cmnt-write input[type="text"].cmnt-name::-webkit-input-placeholder{color:#bbb}
.view-cmnt-area .cmnt-write input[type="text"].cmnt-name::-moz-input-placeholder{color:#bbb}
.view-cmnt-area .cmnt-write input[type="text"].cmnt-name:-ms-input-placeholder{color:#bbb}
.view-cmnt-area .cmnt-write .cmnt-box{width:calc(100% - 120px); height: 68px; border: solid #ddd; border-width:1px 0 1px 1px; box-sizing:border-box; float:left; display:block; padding:8px 10px; color:#333; border-radius:0}
.view-cmnt-area .cmnt-write .cmnt-box::placeholder{color:#bbb; font-size:0.7rem; font-weight:400; word-break:keep-all}
.view-cmnt-area .cmnt-write .cmnt-box::-webkit-input-placeholder{color:#bbb}
.view-cmnt-area .cmnt-write .cmnt-box::-moz-input-placeholder{color:#bbb}
.view-cmnt-area .cmnt-write .cmnt-box:-ms-input-placeholder{color:#bbb}
.view-cmnt-area .cmnt-write .name-check{height:32px; line-height:30px; width:80px; display:block; color:#777; background:#fff; border:1px solid #ddd; cursor:pointer; font-size:0.7rem; box-sizing:border-box; font-weight:500;}
.view-cmnt-area .cmnt-write .cmnt-btn{width:120px; background:#999; color:#fff; height:68px; line-height:66px; display:block;cursor:pointer; font-size: 0.7rem; box-sizing:border-box; font-weight:500; float: right;}
/*****踰꾪듉 �볤� �낅젰 �� �쒖꽦�� �됱긽*****/
/*.view-cmnt-area .cmnt-write button{background: #E63740;}*/
/*****踰꾪듉 �볤� �낅젰 �� �쒖꽦�� �됱긽*****/
/*�볤� �묒꽦�곸뿭*/

/*�볤�由ъ뒪��*/
.view-cmnt-area .cmnt-list{background: #fff;}
.view-cmnt-area .cmnt-list li{padding:20px; border-bottom:1px solid #ddd; position:relative}
.view-cmnt-area .cmnt-list li .cmnt-info{width:calc(100% - 64px - 20px);}
.view-cmnt-area .cmnt-list .best-cmnt{}
.view-cmnt-area .cmnt-list .best-cmnt strong{max-width:30%}
.view-cmnt-area .cmnt-list .best-cmnt em{font-size:0.5rem; color:#e63740; border:2px solid #e63740; border-radius:50px; font-weight:500; width:40px; height:18px; display:block; text-align:center; line-height: 14px; font-style:normal; float:left; margin-right:8px; margin-top: 1px; padding-left:2px; box-sizing:border-box}
.view-cmnt-area .cmnt-list li strong{font-size:0.8rem; font-weight:500; color:#444; display: block; margin-top:-2px; float:left; margin-right:8px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; max-width:40%}
.view-cmnt-area .cmnt-list li p{}

.view-cmnt-area .cmnt-list li:last-of-type{border:none;}
.view-cmnt-area .cmnt-list li .cmnt-like-area{height:30px; padding:6px; position:absolute; top:14px; right:20px; display:block; text-align:right; cursor:pointer;}
.view-cmnt-area .cmnt-list li .cmnt-like-area img{width:17px; display:inline-block;}
.view-cmnt-area .cmnt-list li .cmnt-like-area .cmnt-like{font-size:0.7rem; display:inline-block; color:#666; position: relative; top:-1px;}
/**********�볤� 異붿쿇�� �쒖꽦��***********/
.view-cmnt-area .cmnt-list li .cmnt-like-area .like-active{font-weight: 500; color:#e63740;}
/**********�볤� 異붿쿇�� �쒖꽦��***********/
.view-cmnt-area .cmnt-list li p.date{font-size:0.6rem; display:block; color:#bbb; float: left; white-space: nowrap;}
.view-cmnt-area .cmnt-list li p.cmnt{font-size:0.8rem; padding-top: 2px; letter-spacing:-0.4px; word-break:break-all; word-wrap: break-word; width:100%; display:inline-block; clear: both;}
.view-cmnt-area .cmnt-list li p.cmnt_sc{font-size:0.8rem; padding-top:0; letter-spacing:-0.4px; color:#000;}
@media (min-width:0) and (max-width:767px) {
    .view-cmnt-area .cmnt-list li p.cmnt_sc{font-size:0.9rem;}
}

.view-cmnt-area .cmnt-list .remove_btn{background: #fff; color:#e63740; padding: 0 3px; border: 1px solid #eaeaea; margin-left: 6px; position: relative; top:-4px; font-size: 0.7rem; cursor:pointer}

/*�볤�由ъ뒪��*/

/*�붾낫湲� 踰꾪듉*/
.view-cmnt-area a.more-btn{display:block; width:100%; border:1px solid #ddd; height:50px; background:#f6f6f6; text-align:center; line-height:48px; font-size:0.8rem; color:#666;}


/* :::�뚮툝由� 踰꾩쟾::: */
@media (min-width:768px) and (max-width:1023px){
    /*�볤�由ъ뒪��*/
    .view-cmnt-area .cmnt-list li strong{margin-top: -1px;}
    .view-cmnt-area .cmnt-list li .cmnt-like-area{top:13px;}
    .view-cmnt-area .cmnt-list .best-cmnt em{margin-top: 0;}
    .view-cmnt-area .cmnt-list li p.cmnt{padding-top: 4px;}
    .view-cmnt-area .cmnt-list .remove_btn{top: -2px;}
    /*�볤�由ъ뒪��*/
}

/* :::紐⑤컮�� 踰꾩쟾::: */
@media (min-width:0) and (max-width:767px) {
    .view-cmnt-wp{overflow-y:scroll; -webkit-overflow-scrolling: touch;}
    /*�볤��곸뿭 �곷떒*/
    .view-cmnt-area .top-cmnt{height:50px; background-color:#fff;}
    .view-cmnt-area .top-cmnt h2{line-height:49px;}
    .view-cmnt-area .top-cmnt a.close-btn{position:relative; top:1px; margin-left:10px;}
    /*�볤��곸뿭 �곷떒*/

    /*�볤� �묒꽦�곸뿭*/
    .view-cmnt-area .cmnt-write{height:auto; margin-top:50px; padding:16px 10px;}
    .view-cmnt-area .cmnt-write input[type="text"].cmnt-name{width:180px; height:36px; padding-left:10px; padding-right:10px; line-height:34px}
    .view-cmnt-area .cmnt-write input[type="text"].cmnt-name::placeholder{font-size:0.75rem;}
    .view-cmnt-area .cmnt-write .cmnt-box{width:calc(100% - 20%); height:60px; color:#333; font-size:0.75rem}
    .view-cmnt-area .cmnt-write .cmnt-box::placeholder{font-size:0.75rem}
    .view-cmnt-area .cmnt-write .cmnt-btn{width:20%; height:60px; line-height:58px; font-size:0.75rem}
    .view-cmnt-area .cmnt-write .name-check{height:36px; line-height:34px; width:70px; font-size:0.75rem}

    /*�볤� �묒꽦�곸뿭*/

    /*�볤�由ъ뒪��*/
    .view-cmnt-area .cmnt-list{}
    .view-cmnt-area .cmnt-list .best-cmnt em{padding:0; margin-right:5px;line-height:14px; height:16px; border:1px solid #e63740;}
    .view-cmnt-area .cmnt-list li{padding:20px 12px;}
    .view-cmnt-area .cmnt-list li strong{margin-top:0px; margin-right:5px;}
    .view-cmnt-area .cmnt-list li .cmnt-like-area{right:10px;}
    .view-cmnt-area .cmnt-list li .cmnt-like-area img{width: 14px;}
    .view-cmnt-area .cmnt-list li p.date{padding-top:1px;}
    .view-cmnt-area .cmnt-list li p.cmnt{padding-top: 4px;}
    .view-cmnt-area .cmnt-list .remove_btn{top: -2px;}
    /*�볤�由ъ뒪��*/

    /*�붾낫湲� 踰꾪듉*/
    .view-cmnt-area a.more-btn{height:40px; line-height:38px;}
}