/**************************************************
	COMMENT STYLE FILE

	AUTHOR	: DOTI
	FILE	: /fine_home/comment/style.css
	NOTE	: 댓글 공통 / 나의 댓글 페이지 기본 스타일

 **************************************************/

/* SKIN START ::: MY COMMENT */
#my-comment .list-container { padding:15px; }
#my-comment .list-container .item { padding:10px 0; border-bottom:1px solid rgba(0,0,0,0.1); }
#my-comment .list-container .item:last-child { border-bottom:0px; }
#my-comment .list-container .item .item-footer { color:#aaa; }

#my-comment .widget-container { }
#my-comment .widget-container > section { margin-bottom:15px; padding:0; }
#my-comment .widget-container .title { background:rgba(86,132,255,0.8); font-weight:bold; color:#fff; margin-bottom:5px; padding:5px 10px; }
#my-comment .widget-container section > .item { padding:5px 10px; border-bottom:1px solid rgba(0,0,0,0.1); }
#my-comment .widget-container section > .item:last-child { border-bottom:0px; }
#my-comment .widget-container section > .item .item-footer { color:#aaa; }
/* SKIN END ::: MY COMMENT */


/* edit skin css START */
#my-comment {display:block;margin:0 auto}
#my-comment .grid-wrap {display:table;width:100%;table-layout:fixed}
#my-comment .grid-wrap > .grid {display:table-cell;width:100%;vertical-align:top}
#my-comment .grid-wrap > .grid.side {width:340px;padding-left:40px}	
#my-comment .grid.side .sticky {width:100%}
@media screen and (max-width: 63.9375em) {
	.row #my-comment .grid-wrap, .row #my-comment .grid-wrap > .grid {display:block;width:auto}
	.row #my-comment .grid-wrap {table-layout:initial}
	.row #my-comment .grid-wrap > .grid {vertical-align:initial}
	.row #my-comment .grid-wrap > .grid.side {padding-left:0}	
}
/* edit skin css END */

/* 201215 */
#my-comment .header .titles{font-size:1.5rem; letter-spacing:-.09em}
#my-comment .container .item{padding:15px 0; border-bottom:1px solid #edeff0}
#my-comment .container .cmt{margin-bottom:10px; padding:15px; background:#f7f8f9; border-radius:5px}
#my-comment .container .cmt-table{width:100%; display:table; table-layout:fixed}
#my-comment .container .cmt-table-cell{display:table-cell}
#my-comment .container .cmt-table-cell.arrow{width:25px}
#my-comment .container .cmt-table-cell i{margin-right:5px}
#my-comment .container .cmt-table-cell strong{display:block; color:#0a0c0d; font-family:'Malgun Gothic','돋움','dotum','Helvetica','Apple SD Gothic Neo',sans-serif; font-size:.8125rem; font-weight:normal; letter-spacing:-.03em; line-height:1.4; overflow:hidden; word-break:break-all}

#my-comment .container .date{margin-top:10px; height:25px}
#my-comment .container .date p{display:inline-block; margin:0; color:#919294; overflow:hidden}
#my-comment .container .date p.item-date{position:relative; top:-2px}
#my-comment .container .date i{float:left}
#my-comment .container .date span{padding-top:4px; display:block; float:left}

#my-comment .add-parent{padding:10px 15px; border:1px solid #edeff0}
#my-comment .add-parent ul{margin:0; list-style:none}
#my-comment .add-parent .add-name{color:#323334; font-size:.875rem; font-weight:500}
#my-comment .add-parent .add-content{margin:5px 0 10px; color:#0a0c0d; font-family:'Malgun Gothic','돋움','dotum','Helvetica','Apple SD Gothic Neo',sans-serif; font-size:.8125rem; font-weight:normal; letter-spacing:-.03em; line-height:1.4; overflow:hidden; word-break:break-all}
#my-comment .add-parent .add-datetime{color:#919294}



.svg-icon .icon{vertical-align:top; color:#5d5d5e}
.fill-current{fill:currentColor}




/* SKIN START ::: default */
/*
#comment.skin-default { margin:20px 0; }

#comment.skin-default .best-container { position:relative; }
#comment.skin-default .best-container .comment-best-alert { color:#ccc; font-size:12px; position:absolute; top:-25px; right:0px; }
#comment.skin-default .best-container .comment-item { position:relative; padding:10px; margin-top:24px; }
#comment.skin-default .best-container .comment-item.comment-best-1 { background:rgba(0,0,0,0.04); }
#comment.skin-default .best-container .comment-item.comment-best-2 { background:rgba(0,0,0,0.03); }
#comment.skin-default .best-container .comment-item.comment-best-3 { background:rgba(0,0,0,0.02); }
#comment.skin-default .best-container .comment-item .best-icon { position:absolute; left:-10px; top:-24px; height:20px; line-height:20px; color:#fff; padding:0 0 0 5px; font-size:0.675rem; }
#comment.skin-default .best-container .comment-item .best-icon .rank-num { background:rgba(0,0,0,0.3); display:inline-block; color:#fff; padding:0 5px; right:0px; position:relative; }

#comment.skin-default .comment-content-view { word-break:break-all; line-height:1.65rem; padding:10px 0; font-size:14px; }
#comment.skin-default .comment-item-sub { background:rgba(0,0,0,0.02); padding:15px; margin:5px 0 0 30px; border-radius:3px; display:none; }
#comment.skin-default .comment-item-sub .btn-comment-sub { background:rgba(0,0,0,0.04); color:#555; width:100%; height:40px; position:relative; cursor:pointer; }
#comment.skin-default .comment-item-sub .btn-comment-sub:hover { background:#c2c4ca; }

#comment.skin-default .list-container > .comment-item { border-top:solid 1px rgba(0,0,0,0.05); padding:10px 0 20px 0; }
#comment.skin-default .list-container > .comment-item:hover { background:rgba(0,0,0,0.01); }
#comment.skin-default .list-container > .comment-item:first-child { border-top:0px; }
#comment.skin-default .list-container .comment-item-sub .comment-item, #comment.skin-default .best-container .comment-item-sub .comment-item { border-top:solid 1px rgba(0,0,0,0.05); padding:10px 0 20px 0; margin-top:0px; }
#comment.skin-default .list-container .comment-item-sub .comment-item:first-child, #comment.skin-default .best-container .comment-item-sub .comment-item:first-child { border-top:0px; padding:0 0 20px 0; }

#comment.skin-default .comment-write { background:rgba(0,0,0,0.02); padding:15px; border-radius:3px; }
#comment.skin-default .comment-list { padding:15px 0; }
#comment.skin-default .comment-list .comment-ip, #comment.skin-default .comment-list .comment-date { color:#ccc; }

#comment.skin-default #comment-title .alert { float:right; color:#ccc; }
#comment.skin-default #comment-title .comment-count { }

#comment.skin-default #comment-list .comment-item header { position:relative; }
#comment.skin-default #comment-list .comment-item header .btn-comment-delete { position:absolute; background:rgba(0,0,0,0.02); color:#747A8C; width:30px; height:30px; top:0px; right:5px; border-radius:50%; cursor:pointer; }
#comment.skin-default #comment-list .comment-item header .btn-comment-delete:hover { background:#747A8C; color:#fff; }

#comment.skin-default #comment-list .comment-write { background:transparent; padding:0; border-radius:0; }

#comment.skin-default #comment-list footer { position:relative; }
#comment.skin-default #comment-list footer .btn-comment-write { background:#747A8C; color:#fff; width:40px; height:40px; position:absolute; top:-20px; right:10px; border-radius:50%; cursor:pointer; }
#comment.skin-default #comment-list footer .btn-comment-write:hover { background:#c2c4ca; }

#comment.skin-default #comment-list footer .btn-comment-more { background:rgba(0,0,0,0.02); color:#555; width:100%; height:40px; position:relative; cursor:pointer; }
#comment.skin-default #comment-list footer .btn-comment-more:hover { background:#c2c4ca; }

#comment.skin-default #comment-list footer .btn-comment-sub { display:inline-block; background:#e4e7ee; color:#555; padding:7px; font-size:0.85rem; border-radius:3px; cursor:pointer; position:relative; }
#comment.skin-default #comment-list footer .btn-comment-sub:hover { background:#c2c4ca; }
#comment.skin-default #comment-list footer .btn-comment-sub .comment-sub-count small { background:#747A8C; color:#fff; width:24px; height:24px; line-height:24px; display:inline-block; border-radius:50%; position:absolute; top:-12px; right:-15px; }

#comment.skin-default #comment-list footer .comment-vote { display:inline-block; position:relative; margin-right:5px; }
#comment.skin-default #comment-list footer .comment-vote .btn-comment-vote { background:#e4e7ee; color:#555; padding:7px; font-size:0.85rem; border-radius:3px; cursor:pointer; margin-right:-4px; }
#comment.skin-default #comment-list footer .comment-vote .btn-comment-vote:hover { background:#c2c4ca; }

#comment.skin-default.skin-default .comment-write header { position:relative; }
#comment.skin-default .comment-write header #comment-guest { text-align:right; }
#comment.skin-default .comment-write header #comment-guest > div { width:40%; display:inline-block; }
#comment.skin-default .comment-write .content { height:80px; line-height:1.45rem; }
#comment.skin-default .comment-write .recaptcha-container { }

#comment.skin-default .comment-write footer { position:relative; text-align:right; }
#comment.skin-default .comment-write footer .comment-text-count { float:left; }
/* SKIN END ::: default */


