@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');

*{margin:0;padding:0; font-family: 'Noto Sans KR', sans-serif;}

/*comment*/
#comment{width: 100%;position: relative; padding:0; margin:80px 0 ;}

#comment #comment_header{position:sticky; top: 0;display:flex; justify-content: space-between; width: 100%; border-bottom:1px solid #f5f5f5; padding:0; box-sizing: border-box; background: #fff; margin:0 auto;  height: 54px; line-height: 54px; align-items: center; z-index: 1999; }
#comment #comment_header a {text-decoration: none; display: block; width: 24px; height: 24px; line-height: 24px;}
#comment #comment_header span{font-weight: 500; font-size: 16px;}
#comment_conts{height: 100%; padding:15px 15px 30px; }
#comment_conts form{display: flex; flex-direction: column;}
#comment_conts label{font-weight: normal; font-size: 14px; margin-bottom:15px ;}
#comment_conts form textarea{ height: 40px; padding: 7px 10px; resize: none; overflow:auto; border:1px solid #bbbbbb; border-radius: 4px; box-sizing: border-box;}
#comment_conts form textarea::-webkit-scrollbar{display: none;}
#comment_conts form textarea::placeholder{font-size: 15px; color:#acacac;}
#comment_conts form textarea:focus{height: 80px; transition:all 0.3s ease-in-out; overflow:auto;}

#comment_conts #cc_btns{display: none;}
#comment_conts .cc_btns{ width: 100%; justify-content: flex-end; margin-top: 10px;}
#comment_conts .cc_btns button{width: 60px; height: 34px; border:none; border-radius: 5px; background: #d9d9d9;}
#comment_conts .cc_btns button:last-child{margin-left: 10px; background-color: #152e5f; color:#fff; border:none;}

/*comment_cont2*/
.tabmenu-wrap {padding: 0;}
.tabmenu-wrap .tab-nav {display: flex;width: 100%; justify-content: flex-end; padding:0 ; box-sizing: border-box; margin-top: 20px;}

.tabmenu-wrap .tab-nav .nav2 a {transition: 0.4s;position: relative;display: block;font-size: 14px;font-weight: normal;color: #000000;text-align: center;text-decoration: none; ;padding: 0 0 20px;}
.tabmenu-wrap .tab-nav .nav2 a:last-child{margin-left: 10px;}
.tabmenu-wrap .tab-nav .nav2 a:after {content: "";transition: 0.4s;width: 0px;}
.tabmenu-wrap .tab-nav .nav2.on a {color: #3e81da; font-weight: 500;}

.tabmenu-wrap .tab-con {border-top:1px solid #f5f5f5;}
.tabmenu-wrap .tab-con .con-box {display: none;}

.tabmenu-wrap .tab-con .con-box  > ul {list-style: none; }
.tabmenu-wrap .tab-con .con-box  > ul > li {border-bottom:1px solid #f5f5f5; padding: 10px 0 0; }

.tabmenu-wrap .tab-con .con-box  > ul > li .cb_tit{display: flex; justify-content: space-between; padding: 10px 0; margin:0 ;}
.tabmenu-wrap .tab-con .con-box  > ul > li .cb_tit div{color:#acacac; font-size: 14px; }
.tabmenu-wrap .tab-con .con-box  > ul > li .cb_tit span{font-weight: bold; font-size: 15px;}
.tabmenu-wrap .tab-con .con-box  > ul > li .cb_tit a{text-decoration: none; color:#acacac; font-size: 13px;}

.tabmenu-wrap .tab-con .con-box  > ul > li p{margin-bottom: 10px; padding:0; font-size: 14px; font-weight: normal;}
.tabmenu-wrap .tab-con .con-box  > ul > li p.tlp,
.tabmenu-wrap .tab-con .toggle-list > ul > li > ul.tli,
.tabmenu-wrap .tab-con .toggle-list2 > ul > li > ul.tli,
.tabmenu-wrap .tab-con .toggle-list3 > ul > li > ul.tli,
.tabmenu-wrap .tab-con .toggle-list4 > ul > li > ul.tli{
    padding: 0 38px !important;
}
.tabmenu-wrap .tab-con .con-box  > ul > li p .cb_time{color:#acacac; display: block;margin-top: 10px; font-size: .9em;}    

.tabmenu-wrap .tab-con .con-box  > ul li ul{list-style: none;}
.tabmenu-wrap .tab-con .con-box  > ul > li ul.cb_icon {display: flex; justify-content: flex-start; padding:0; margin-bottom:20px;}
.tabmenu-wrap .tab-con .con-box  > ul > li ul.cb_icon li:hover svg #ic_comment,.tabmenu-wrap .tab-con .con-box  > ul > li ul.cb_icon li:hover svg #ic_thumbs{fill:#3e81da;}

/*modal*/
#normalModal .modal-dialog{top:150px;}
#normalModal .modal-content{width: 250px; margin:0 auto;}
#normalModal .modal-body{padding:38px 0 20px;}
#normalModal .modal-body p{text-align: center; margin:0; font-size: 15px;color:#000; font-weight: normal;}
#normalModal .modal-footer{width: 100%;margin: 20px 0 0; display: flex; 
 justify-content: center;   text-align:center; border-top:none; }

#normalModal .modal-footer button{width: 60px; height: 34px; line-height: 34px; box-sizing: border-box; border-radius: 4px; font-size: 14px;}
#normalModal .modal-footer button.btn-default{background: #d9d9d9; border:none; margin-right: 10px !important;}
#normalModal .modal-footer button.btn-primary{background: #152e5f; border:none;}
/*modal 끝*/


.toggle-box {    text-align: center;    line-height: 30px;    margin-top: 30px;  }
.toggle-buttom,.toggle-buttom2,.toggle-buttom3,.toggle-buttom4{cursor: pointer; align-items: center; display: flex; justify-content: center; border-left:1px solid #fff;}
.toggle-buttom:hover,.toggle-buttom2:hover,.toggle-buttom3:hover,.toggle-buttom4:hover{color:#3e81da;}
.toggle-list,.toggle-list2,.toggle-list3,.toggle-list4{display: none; background-color: #f5f5f5; padding: 0 0;}

.toggle-list-li,
.toggle-list-li2{display: none; border-bottom:1px solid #e6e6e6;}
.toggle-list-li:last-child,.toggle-list-li2:last-child{padding-bottom: 20px;}
.tabmenu-wrap .tab-con .con-box > ul .toggle-list-li:last-child ul.cb_icon,.tabmenu-wrap .tab-con .con-box > ul .toggle-list-li2:last-child ul.cb_icon{margin-bottom: 0;}
#loadMore, #loadMore2 { cursor: pointer;   display: block;    margin:0 auto;    width:100%;    padding: 10px;    text-align: center;    background-color: #fff;    color: #000;    font-size: 14px;    font-weight: normal;}
#loadMore:link, #loadMore2:link{text-decoration: none;}

.re_btn_conts{display: flex;width: 100%; justify-content: center; border-top:1px solid #fff;}
.re_btn_conts a{ width: 100%;    text-align: center; background-color: #f5f5f5; color:#000;height: 42px;line-height: 42px; font-weight: bold; font-size: 14px;}
.re_btn_conts a:hover{text-decoration: none; color:#000;}
 

/*좋아요 체크박스*/
.ic_t{margin-right: 10px;}
.ic_t .styled-checkbox { position: absolute; opacity: 0;  margin: 0 0;  }

.ic_t .styled-checkbox + label { position: relative;    cursor: pointer;    padding: 0;    font-weight: normal;   margin-bottom: 0;  }
.ic_t .styled-checkbox + label:before {content: ""; display: inline-block; vertical-align: text-top; width: 18px; height: 18px; left:-20px;  background: url('../images/icon/check-off.svg') no-repeat 0 0px / contain; border:none;  }

.ic_t .styled-checkbox:checked + label{    color: #3e81da;}
.ic_t .styled-checkbox:checked + label:before {
    width: 18px; height: 18px; background: url('../images/icon/check-on.svg') no-repeat 0 0px / contain !important; left:-20px; border:none;}

.ic_t .styled-checkbox:disabled + label:before {box-shadow: none;
    background: #ddd;  }
.ic_t .styled-checkbox:checked + label:after { content: "";
    position: absolute;    left: 5px;    top: 9px;    width: 2px;    height: 2px;    transform: rotate(45deg);}


/*reply_nr2_pc.htm*/
.tab-nav{width: 200px;}
.cb_info{display: flex; justify-content: space-between; padding:0 ;}
.cb_info2{display: flex; justify-content: space-between; padding:0 0px 0 38px;}
.cb_info2 .ic_t{margin-right: 0;}


#ct_re{width: 100%; position: fixed; top:0;  background: #fff; z-index:100; padding-bottom: 20px;}

#comment_conts_pc{height: 100%; padding: 0; display: flex; }
#comment_conts_pc #hz{width: 100%; height:80px; padding: 7px 10px; resize: none; overflow:auto; border:1px solid #bbbbbb; border-radius: 4px; box-sizing: border-box; margin-right: 10px;}
#comment_conts_pc form #hz::-webkit-scrollbar{display: none;}
#comment_conts_pc form #hz::placeholder{font-size: 15px; color:#acacac;}


#comment_conts_pc #cc_btns{display: none;}

#comment_conts_pc .ccp_btn {width: 100px; height: 80px; border:none; border-radius: 5px; background: #3c3c3c; color:#fff;}

.sub_reply{width: 100%; height: 100%; padding: 15px 15px 0;}
.sub_reply form{    width: 100%;    display: flex;    flex-direction: row;}
.sub_reply form textarea{width: 100%;    height: 80px;    padding: 7px 10px;  overflow: auto; resize: none;   border: 1px solid #bbbbbb;    border-radius: 4px;    box-sizing: border-box;    margin-right: 10px; background: #fff;}
.sub_reply form button{  color:#fff;  width: 100px;    height: 80px;    border: none;    border-radius: 5px; background: #3c3c3c;}

.cb_time{font-size: 13px; color:#acacac; font-weight: normal;}
