@charset "utf-8";

/* bbs-emoticon */

.bbs-emoticon {overflow:hidden; display:block; position:absolute; top:5px; right:-1px; width:378px; height:333px; border:1px solid #e8e8e8; background-color:#f9f9fa; z-index:9000000;}
.bbs-emoticon .btn-prev,
.bbs-emoticon .btn-next {display:block; position:absolute; top:0; width:46px; height:46px; border-bottom:1px solid #e4e5e5; background-color:#ffffff; cursor:pointer;}
.bbs-emoticon .btn-prev {left:0; border-right:1px solid #e4e5e5;}
.bbs-emoticon .btn-next {right:0; border-left:1px solid #e4e5e5;}
.bbs-emoticon .btn-prev:before,
.bbs-emoticon .btn-next:before {z-index:1; display:block; content:''; position:absolute; left:calc(50% - 13px); top:calc(50% - 13px); width:26px; height:26px; background:var(--bbs-btn) no-repeat; background-position-y:-450px; opacity:0.15;}
.bbs-emoticon .btn-prev:before {background-position-x:-1000px;}
.bbs-emoticon .btn-next:before {background-position-x:-1100px;}
.bbs-emoticon .btn-prev.on:hover:before,
.bbs-emoticon .btn-next.on:hover:before {opacity:1;}
.bbs-emoticon .btn-prev:hover:before {opacity:1; background-position-x:-1050px;}
.bbs-emoticon .btn-next:hover:before {opacity:1; background-position-x:-1150px;}
.bbs-emoticon .em-header {margin:0 47px 0 47px; height:47px; position:relative; white-space:nowrap; overflow:hidden; background-color:#ffffff;}
.bbs-emoticon .em-header:before {z-index:1; display:block; content:''; position:absolute; left:0; bottom:0px; width:100%; height:0; border-bottom:1px solid #e4e5e5;}
.bbs-emoticon .em-header ul {z-index:2; position:relative; left:-1px;}
.bbs-emoticon .em-header ul li {display:inline-block; vertical-align:top; width:56px; padding:10px 0; border-left:1px solid #e4e5e5; border-bottom:1px solid transparent; text-align:center; cursor:pointer;}
.bbs-emoticon .em-header ul li:last-child {border-right:1px solid #e4e5e5;}
.bbs-emoticon .em-header ul li img {width:26px; height:26px; border:0;}
.bbs-emoticon .em-header ul li.focus {border-bottom:1px solid #f9f9fa; background-color:#f9f9fa;}
.bbs-emoticon .wrap {height:288px;}
.bbs-emoticon .wrap ul {padding:15px 0 15px 15px;}
.bbs-emoticon .wrap ul li {position:relative; display:inline-block; vertical-align:top; width:70px; height:70px; padding:8px; text-align:center; cursor:pointer;}
.bbs-emoticon .wrap ul li img {width:70px; height:70px; border:0;}
.bbs-emoticon .wrap ul li:before {z-index:-1; display:block; content:''; position:absolute; left:0; top:0px; width:calc(100% - 2px); height:calc(100% - 2px); background-color:#ffffff; border:1px solid #fff; opacity:0;}
.bbs-emoticon .wrap ul li:hover:before {opacity:1; border-color:#a7a7a7;}

/* bbs-reply */

.bbs-reply {padding:40px 0;}

/* reply-write */

#reply-write {margin-bottom:40px; border-top:1px solid #e8e8e8; border-bottom:1px solid #e8e8e8;}
#reply-write .rw-textarea .textarea .btn .cancel {display:none;}

.bbs-reply .reply-write {z-index:10; padding:20px 20px; position:relative; background-color:#f9f9fa;}
.bbs-reply .reply-write .rw-wrap {position:relative;}

.bbs-reply .rw-header .title {z-index:1; position:relative; padding-left:30px;}
.bbs-reply .rw-header .title {font-family: var(--family-regular);font-weight: var(--weight-regular); line-height:20px; font-size:16px; color:#666666;}
.bbs-reply .rw-header .title:before {z-index:-1; display:block; content:''; position:absolute; left:0; top:calc(50% - 10px); width:20px; height:20px; background:var(--bbs-btn) no-repeat; background-position:-150px -450px; opacity:0.5;}
.bbs-reply .rw-header .member {position:absolute; right:0; top:-5px;}
.bbs-reply .rw-header .member .thumb {display:block; position:absolute; left:0; top:0;}
.bbs-reply .rw-header .member .thumb img {width:30px; height:30px; border:0; border-radius:100%;}
.bbs-reply .rw-header .member .name {margin:-1px 10px 0 35px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; word-break:break-all;}
.bbs-reply .rw-header .member .name {font-family: var(--family-regular);font-weight: var(--weight-regular); line-height:30px; font-size:16px; color:#666;}
.bbs-reply .rw-header .btn {z-index:1; display:none; position:absolute; right:9px; top:-2px; border-radius:4px; cursor:pointer;}
.bbs-reply .rw-header .btn {font-family: var(--family-light);font-weight: var(--weight-light); line-height:1.4; font-size:13px; color:#999999;}
.bbs-reply .rw-header .btn:hover {color:#000;}
.bbs-reply .rw-header .btn:hover:after {z-index:-1; display:block; content:''; position:absolute; left:0; bottom:-3px; width:100%; height:0; border-bottom:1px solid #000;}

.bbs-reply .rw-textarea {margin-top:15px;}
.bbs-reply .rw-textarea .textarea {transition:border 0.2s, background 0.2s; position:relative; display:block; vertical-align:middle; background-color:#ffffff; border:1px solid #e8e8e8;}
.bbs-reply .rw-textarea .textarea .content {transition:min-height 0.2s; padding:10px 10px 10px 10px; position:relative; width:calc(100% - 20px); height:30px; border:0; background:transparent;}
.bbs-reply .rw-textarea .textarea .content {font-family: var(--family-regular);font-weight: var(--weight-regular); line-height:20px; font-size:15px; color:#999999; word-break:break-all;}
.bbs-reply .rw-textarea .textarea .content .emoticon {display:inline-block; vertical-align:middle; width:70px; height:70px; border:0;}
.bbs-reply .rw-textarea .textarea .content .focus-html {display:inline-block; vertical-align:middle;}
.bbs-reply .rw-textarea .textarea .msg {position:absolute; left:10px; top:-1px;}
.bbs-reply .rw-textarea .textarea .msg {font-family: var(--family-regular);font-weight: var(--weight-regular); line-height:50px; font-size:15px; color:#999999;}
.bbs-reply .rw-textarea .textarea .btn {display:none; position:absolute; left:0; bottom:0; width:calc(100% - 10px); padding:10px 0 10px 10px; border-top:1px solid #e4e5e5; border-top-style:dashed;}
.bbs-reply .rw-textarea .textarea .btn .submit,
.bbs-reply .rw-textarea .textarea .btn .cancel {transition:color 0.2s, background 0.2s; display:inline-block; height:40px; padding:0 20px; text-align:center; border-radius:4px; cursor:pointer;}
.bbs-reply .rw-textarea .textarea .btn .submit {background-color:#555;}
.bbs-reply .rw-textarea .textarea .btn .cancel {background-color:#ccc; margin-left:5px;}
.bbs-reply .rw-textarea .textarea .btn .submit,
.bbs-reply .rw-textarea .textarea .btn .cancel {font-family: var(--family-regular);font-weight: var(--weight-regular); line-height:40px; font-size:13px; color:#ffffff;}
.bbs-reply .rw-textarea .textarea .btn .submit:hover {background-color:#000;}
.bbs-reply .rw-textarea .textarea .btn .cancel:hover {background-color:#999;}
.bbs-reply .rw-textarea .textarea .btn .text {position:relative; top:-2px; display:inline-block; margin-left:20px;}
.bbs-reply .rw-textarea .textarea .btn .text {font-family: var(--family-regular);font-weight: var(--weight-regular); line-height:32px; font-size:12px; color:#999999;}
.bbs-reply .rw-textarea .textarea .emo {display:block; z-index:1; position:absolute; right:10px; top:calc(50% - 15px);}
.bbs-reply .rw-textarea .textarea .emo .icon {display:block; cursor:pointer;}
.bbs-reply .rw-textarea .textarea .emo .icon span {display:inline-block; vertical-align:top; background:var(--bbs-btn) no-repeat;}
.bbs-reply .rw-textarea .textarea .emo .icon span:nth-child(1) {width:110px; height:30px; background-position:-750px -450px; opacity:0.5;}
.bbs-reply .rw-textarea .textarea .emo .icon span:nth-child(2) {width:35px; height:35px; background-position:-900px -450px; opacity:0.3;}
.bbs-reply .rw-textarea .textarea .emo .icon:hover span:nth-child(2),
.bbs-reply .rw-textarea .textarea .emo .icon.focus span:nth-child(2) {opacity:1; background-position-x:-950px;}
.bbs-reply .rw-textarea .textarea .emo .load {display:block; position:relative;}
.bbs-reply .rw-textarea .textarea.focus {background-color:#ffffff; border:1px solid var(--bbs-color2);}
.bbs-reply .rw-textarea .textarea.focus .msg {display:none;}
.bbs-reply .rw-textarea .textarea.focus .content {color:#000;}
.bbs-reply .rw-textarea .textarea.value .msg {display:none;}
.bbs-reply .rw-textarea .textarea.value .content {color:#666;}
.bbs-reply .rw-textarea .textarea.active {padding-bottom:66px;}
.bbs-reply .rw-textarea .textarea.active .content {padding-bottom:20px;}
.bbs-reply .rw-textarea .textarea.active .btn {display:block;}
.bbs-reply .rw-textarea .textarea.active .emo {top:auto; bottom:66px;}

.bbs-reply .reply-write.active .title {color:#333333;}
.bbs-reply .reply-write.active .title:before {background-position-x:-250px; opacity:1;}

/* reply-list */

.bbs-reply .reply-list {background-color:#ffffff;}
.bbs-reply .item {border-top:1px solid #e8e8e8;}
.bbs-reply .item:last-child {border-bottom:1px solid #e8e8e8;}
.bbs-reply .item.focus {background-color:#fafafa;}

.bbs-reply .rl-header {position:relative; margin:0 30px; padding-top:20px; padding-bottom:7px;}
.bbs-reply .rl-header .block {position:relative;}
.bbs-reply .rl-header .name {margin:-3px 10px 0 0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; word-break:break-all;}
.bbs-reply .rl-header .name {font-family: var(--family-regular);font-weight: var(--weight-regular); line-height:1.4; font-size:15px; color:#000;}
.bbs-reply .rl-header .side {display:block; position:absolute; right:0; top:11px;}
.bbs-reply .rl-header .side li {padding:9px; display:inline-block; vertical-align:top; cursor:pointer;}
.bbs-reply .rl-header .side span {z-index:1; position:relative; display:block; border-radius:4px;}
.bbs-reply .rl-header .side span {font-family: var(--family-light);font-weight: var(--weight-light); line-height:1.4; font-size:13px; color:#999999;}
.bbs-reply .rl-header .side span:hover {color:#000;}
.bbs-reply .rl-header .side span:hover:after {z-index:-1; display:block; content:''; position:absolute; left:0; bottom:-3px; width:100%; height:0; border-bottom:1px solid #000;}
.bbs-reply .rl-header .side span.ty-red:hover {color:#ed1c24;}
.bbs-reply .rl-header .side span.ty-red:hover:after {border-color:#ed1c24;}

.bbs-reply .rl-content {margin:-4px 30px -3px 30px;}
.bbs-reply .rl-content,
.bbs-reply .rl-content a {font-family: var(--family-regular);font-weight: var(--weight-regular); line-height:21px; font-size:15px; color:#555; word-break:break-all;}
.bbs-reply .rl-content.type-blind {display:none;}
.bbs-reply .rl-content img {max-width:500px;}
.bbs-reply .rl-content .emoticon {display:inline-block; vertical-align:middle; width:84px; height:84px; border:0;}

.bbs-reply .rl-dt {margin:11px 30px 0 30px; padding-bottom:20px; position:relative;}
.bbs-reply .rl-dt ul:nth-child(1) {}
.bbs-reply .rl-dt ul:nth-child(1) li {z-index:1; position:relative; display:inline-block; vertical-align:top;}
.bbs-reply .rl-dt ul:nth-child(1) li:nth-child(n+2) {margin-left:23px;}
.bbs-reply .rl-dt ul:nth-child(1) li:nth-child(n+2):before {z-index:-1; content:''; position:absolute; left:-12px; top:calc(50% - 4px); width:0; height:12px; border-left:1px solid #e8e8e8;}
.bbs-reply .rl-dt ul:nth-child(1) li p {z-index:1; position:relative; margin:0 0 -2px 0;}
.bbs-reply .rl-dt ul:nth-child(1) li p {font-family: var(--family-regular);font-weight: var(--weight-regular); line-height:1.4; font-size:13px; color:#999999;}
.bbs-reply .rl-dt ul:nth-child(1) li p.pointer:hover {color:#000;}
.bbs-reply .rl-dt ul:nth-child(1) li p.pointer:hover:after {z-index:-1; display:block; content:''; position:absolute; left:0; bottom:-4px; width:100%; height:0; border-bottom:1px solid #000;}
.bbs-reply .rl-dt ul:nth-child(1) li:nth-child(1) p {top:-1px;}
.bbs-reply .rl-dt ul:nth-child(2) {display:block; position:absolute; right:0; top:0;}
.bbs-reply .rl-dt ul:nth-child(2) li {padding-top:1px; width:100px; height:24px; display:inline-block; vertical-align:top; background-color:#fbd2d3; border-radius:3px; text-align:center; cursor:pointer;}
.bbs-reply .rl-dt ul:nth-child(2) li {line-height:24px; font-size:12px; color:#ec1c23; font-family:gulim,'굴림',sans-serif;}
.bbs-reply .rl-dt ul:nth-child(2) li:nth-child(n+2) {margin-left:4px;}
.bbs-reply .rl-dt ul:nth-child(2) li:hover {text-decoration:underline;}
.bbs-reply .rl-dt ul:nth-child(2) li.on {text-decoration:none; background-color:#ec1c23; color:#fff;}

.bbs-reply .rl-dt .rgoods {margin-left:-5px;}
.bbs-reply .rl-dt .rgoods div {transition:background 0.2s, color 0.2s; position:relative; margin-top:-3px; padding:0 5px; height:24px; text-align:center; display:inline-block; vertical-align:top; border-radius:3px; background-color:transparent; cursor:pointer;}
.bbs-reply .rl-dt .rgoods div:nth-child(n+2) {margin-left:10px;}
.bbs-reply .rl-dt .rgoods div span {transition:color 0.2s; position:relative; display:inline-block; vertical-align:top; padding-left:19px;}
.bbs-reply .rl-dt .rgoods div span {font-family: var(--family-medium);font-weight: var(--weight-medium); line-height:24px; font-size:13px; color:#999;}
.bbs-reply .rl-dt .rgoods div span:before {z-index:1; display:block; content:''; position:absolute; left:0; top:calc(50% - 6px); width:14px; height:14px; background:var(--bbs-btn) no-repeat; background-position-x:-150px; opacity:0.3;}
.bbs-reply .rl-dt .rgoods div.good1 span:before {background-position-y:-350px;}
.bbs-reply .rl-dt .rgoods div.good2 span:before {background-position-y:-400px;}

.bbs-reply .rl-dt .rgoods div.good1.active span:before,
.bbs-reply .rl-dt .rgoods div.good2.active span:before {background-position-x:-250px; opacity:1;}

.bbs-reply .rl-dt .rgoods div.good1.active span {color:#0078dd;}
.bbs-reply .rl-dt .rgoods div.good2.active span {color:#ed1c24;}

.bbs-reply .rl-dt .rgoods div.good1:hover {background-color:#0078dd;}
.bbs-reply .rl-dt .rgoods div.good2:hover {background-color:#ed1c24;}

.bbs-reply .rl-dt .rgoods div.good1:hover span,
.bbs-reply .rl-dt .rgoods div.good2:hover span {color:#ffffff;}

.bbs-reply .rl-dt .rgoods div.good1:hover span:before,
.bbs-reply .rl-dt .rgoods div.good2:hover span:before {background-position-x:-200px; opacity:1;}

.bbs-reply .rl-blind {margin:0 30px 0 30px; padding:15px 20px 15px 0; height:60px; position:relative; background-color:#fff; border:1px solid #e8e8e8; border-radius:3px;}
.bbs-reply .rl-blind .img {display:block; position:absolute; left:20px; top:15px; width:60px; height:60px; background:var(--bbs-btn) no-repeat; background-size:900px 600px; background-position:-270px -360px; opacity:0.7;}
.bbs-reply .rl-blind .text {padding:10px 0 0 100px;}
.bbs-reply .rl-blind .text {font-family: var(--family-light);font-weight: var(--weight-light); line-height:1.4; font-size:15px; color:#555;}
.bbs-reply .rl-blind .text .ct {color:#ed1c24;}
.bbs-reply .rl-blind .text .btn {text-decoration:underline; cursor:pointer;}
.bbs-reply .rl-blind .text .btn:hover {color:#000;}

/*.bbs-reply .item.blind-open .rl-blind {display:none;}*/
.bbs-reply .item.blind-open .rl-content.type-blind {margin-top:10px; display:block;}

.bbs-reply .rl-deletion {padding:20px 30px;}
.bbs-reply .rl-deletion .name {margin:-3px 0 -4px 0;}
.bbs-reply .rl-deletion .name {font-family: var(--family-light);font-weight: var(--weight-light); line-height:1.4; font-size:15px; color:#000;}
.bbs-reply .rl-deletion .block {margin-top:10px; height:60px; padding:15px 20px 15px 0; position:relative; background-color:#fff; border:1px solid #e8e8e8; border-radius:3px;}
.bbs-reply .rl-deletion .img {display:block; position:absolute; left:20px; top:15px; width:60px; height:60px; background:var(--bbs-btn) no-repeat; background-size:900px 600px; background-position:-360px -360px; opacity:0.7;}
.bbs-reply .rl-deletion .text {padding:10px 0 0 100px;}
.bbs-reply .rl-deletion .text {font-family: var(--family-light);font-weight: var(--weight-light); line-height:1.4; font-size:15px; color:#555;}

/* edit */

.bbs-reply .item.edit .reply-write {background-color:#ffffff;}

.bbs-reply .item.edit .rw-header .member,
.bbs-reply .item.edit .rl-header,
.bbs-reply .item.edit .rl-content,
.bbs-reply .item.edit .rl-dt {display:none;}

.bbs-reply .item.edit .rw-header .btn[data-mode='edit'] {display:block;}
.bbs-reply .item.edit .rw-header .btn[data-mode='answer'] {display:none;}

/* answer */

.bbs-reply .item.answer .rw-header .member {display:none;}
.bbs-reply .item.answer .rw-header .btn[data-mode='edit'] {display:none;}
.bbs-reply .item.answer .rw-header .btn[data-mode='answer'] {display:block;}

.bbs-reply .rl-answer {display:block; position:relative; border-top:1px solid #e8e8e8; background-color:#fafafa; padding-left:30px;}
.bbs-reply .rl-answer:before {z-index:11; display:block; content:''; position:absolute; left:30px; top:16px; width:14px; height:14px; background:var(--bbs-btn) no-repeat; background-position:-150px -500px; opacity:0.4;}
.bbs-reply .rl-answer .rw-header .member {display:none;}
.bbs-reply .rl-answer .rw-header .btn[data-mode='edit'] {display:block;}
.bbs-reply .rl-answer .rw-header .btn[data-mode='answer'] {display:none;}
.bbs-reply .rl-answer.edit .reply-write {background-color:#fafafa;}
.bbs-reply .rl-answer.edit .rw-header .btn[data-mode='edit'] {display:block;}
.bbs-reply .rl-answer.edit .rw-header .btn[data-mode='answer'] {display:none;}

/* answer write */

.bbs-reply .item.answer .reply-write {padding:20px 20px 20px 50px;}
.bbs-reply .item.answer .reply-write:before {z-index:11; display:block; content:''; position:absolute; left:30px; top:16px; width:14px; height:14px; background:var(--bbs-btn) no-repeat; background-position:-150px -500px; opacity:0.4;}
