@charset "utf-8";
/* CSS Document */
#notice-wrap{padding-bottom:6.25rem;}
#notice-wrap > .inner-wrap{width:calc(100% - 40px); max-width:1200px; margin:0 auto;}
#notice-wrap .inner-wrap > .search-wrap{width:calc(100% - 40px); padding:20px; background-color:#e8e8e8;}
#notice-wrap .inner-wrap > .search-wrap > .inner-wrap{display:flex; align-items: center; background-color: #fff;}
#notice-wrap .inner-wrap > .search-wrap .board-search-select{background-color: #fff; width:205px; height: 60px; color:#000; font-size:1.125rem;}
#notice-wrap .inner-wrap > .search-wrap .hv{width:1px; height: 25px; background-color: #e8e8e8;}
#notice-wrap .inner-wrap > .search-wrap .search-input{background-color:#fff; border-radius: 0; color:#858585; width:calc(100% - 266px); height: 60px;}
#notice-wrap .inner-wrap > .search-wrap .search-input:focus{background-color: #e8e8e8; color:#000;}
#notice-wrap .inner-wrap > .search-wrap  button{width:60px; height: 60px; background-color: #445CB4; display:flex; justify-content: center; align-items: center;}
p.emptyMessage{text-align: center; margin:50px auto;}

#notice-wrap.read-wrap{padding:6.25rem 0;}
#notice-wrap.read-wrap h1.title{color:#000; text-align: center; font-weight: 900; font-size:2.1875rem; margin:3.125rem 0;}
#notice-wrap.read-wrap .head-info-wrap{display:flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}
#notice-wrap.read-wrap .head-info-wrap .info-wrap{display: flex; align-items: center;}
#notice-wrap.read-wrap .head-info-wrap .info-wrap > .hv{width:1px; height: 15px; background-color: #d6d6d6; margin:0 15px;}
#notice-wrap .inner-wrap > .hr{width:100%; height: 2px; background-color: #000; margin:30px 0 0 0;}
#notice-wrap.read-wrap .cont-wrap{padding:3.125rem 0; width:100%; max-width:900px; margin:0 auto; }
#notice-wrap.read-wrap .cont-wrap img{max-width:100%;}
#notice-wrap.read-wrap .btn-wrap{text-align: center; margin:30px 0;}

#notice-wrap.read-wrap .file-wrap{width:273px; height: 43px; border:1px solid #d6d6d6; overflow: hidden; cursor: pointer; transition:all .5s;}
#notice-wrap.read-wrap .file-wrap > li{padding:5px 10px; border-bottom:1px solid #d6d6d6; width:calc(100% - 20px); display:flex; justify-content: space-between; align-items: center; min-height:34px; transition:all .5s;}
#notice-wrap.read-wrap .file-wrap > li:last-child{border: none;}
#notice-wrap.read-wrap .file-wrap > li .title-wrap{margin-right:5px; width:calc(100% - 29px); display:flex; align-items: flex-start; flex-wrap: wrap;}
#notice-wrap.read-wrap .file-wrap > li .title-wrap > p{font-size:0.875rem; color:#858585;}
#notice-wrap.read-wrap .file-wrap > li > a{display:flex; justify-content: space-between; align-items: center; width:100%;}
#notice-wrap.read-wrap .file-wrap > li .title-wrap > img{margin-right:5px; width:18px;}
#notice-wrap.read-wrap .file-wrap > li > a > svg{width:18px;}
#notice-wrap.read-wrap .file-wrap > li:first-child:hover{background-color: #fff;}
#notice-wrap.read-wrap .file-wrap > li:hover{background-color:#EFEFEF;}


.pn-wrap{width:calc(100% - 30px); padding:15px; border-top:1px solid #d6d6d6; display:flex; align-items: center; transition:all .5s;}
.pn-wrap:hover{background-color:#e8e8e8; transition:all .5s;}
.pn-wrap:last-of-type{border-bottom:1px solid #d6d6d6;}
.pn-wrap > svg{margin:0 15px;}

.board-list-wrap{margin-top:6.25rem;}
.board-list-wrap .list-head{width:100%; border-top:5px solid #445CB4; background-color:#fff; border-bottom:1px solid #d6d6d6; padding:25px 0; display:flex;}
.board-list-wrap .list-head > li{text-align: center; color:#000; padding:0 10px;}
.board-list-wrap ul > li.number{width:100px;}
.board-list-wrap ul > li.file{width:100px;}
.board-list-wrap ul > li.date{width:150px;}

.board-list-wrap .cont-list{display:flex; padding:20px 0; border-bottom:1px solid #d6d6d6; transition: all .5s;}
.board-list-wrap .cont-list:hover{background-color:#f4f4f4;}
.board-list-wrap .cont-list > li{text-align: center; color:#000; display: flex; align-items: center; justify-content:center; padding:0 10px;}
.board-list-wrap .cont-list > li.number{font-weight: 800;}
.board-list-wrap .cont-list > li > a{width:100%; display: inline-block;  text-overflow: ellipsis; white-space: nowrap; overflow: hidden; font-size:1.062em; font-weight: 500; text-align: left;}
.board-list-wrap .cont-list > li > a > span{color:#C51619;}
.mobile-data{display:none;}
.mobile-data > .div{height: 10px; width:1px; background-color:#d6d6d6; margin:0 10px;}
.mobile-data{color:#838383; font-size:0.875rem;}
.mobile-data .comment{display:flex; align-items: center;}
.mobile-data .comment > svg{margin-right:5px; width:18px;}

.right-wrap{width:100%; position:relative; padding-bottom:90px; border-top:1px solid #d6d6d6;}

.comments-all-wrap{}
.comments-all-wrap .comment-wrap{padding:30px 0; border-bottom:1px solid #d6d6d6;}
.comments-all-wrap .comment-wrap .info-wrap > .ctr-wrap{display:flex; align-items: center;}
.comments-all-wrap .comment-wrap .info-wrap > .ctr-wrap > .tlt{font-size:1rem; margin-right:1.25rem; font-weight: 500; color:#000;}
.comments-all-wrap .comment-wrap .info-wrap > .ctr-wrap > button{cursor: pointer; padding:0 5px; position:relative;}
.comments-all-wrap .comment-wrap .info-wrap > .ctr-wrap > button.on > .edit-wrap{display:block;}
.comments-all-wrap .comment-wrap .info-wrap > .ctr-wrap .edit-wrap{position:absolute; top:0; right:-83px; background-color:#fff; border:1px solid #d6d6d6; box-sizing: border-box; padding:10px; display:none;}
.comments-all-wrap .comment-wrap .info-wrap > .ctr-wrap .edit-wrap > a{width:100%; margin-bottom:15px; text-align: center; color:#838383; transition: all .3s; font-size:1rem; display:inline-block;}
.comments-all-wrap .comment-wrap .info-wrap > .ctr-wrap .edit-wrap > a:last-child{margin-bottom:0;}
.comments-all-wrap .comment-wrap .info-wrap > .ctr-wrap .edit-wrap > a:hover{color:#000;}
.comments-all-wrap .comment-wrap .info-wrap > .stlt{font-size:0.875rem; color:#838383; margin-top:5px;}
.comments-all-wrap .comment-wrap > .cont-wrap{ font-size:1rem; color:#838383; padding:20px 0 !important; max-width:none !important; white-space: pre-line; line-height: 150%;}
.comments-all-wrap .comment-wrap > .thumb-wrap{margin-top:10px; display:flex;}
.comments-all-wrap .comment-wrap > .thumb-wrap > .inner-wrap{display:flex; align-items: center;}
.comments-all-wrap .comment-wrap > .thumb-wrap > .inner-wrap{margin-right:1.25rem;}
.comments-all-wrap .comment-wrap > .thumb-wrap > .inner-wrap:last-child{margin-right:0}
.comments-all-wrap .comment-wrap > .thumb-wrap .icon-wrap{cursor:pointer; display:flex; align-items: center;}
.comments-all-wrap .comment-wrap > .thumb-wrap .icon-wrap > img:nth-child(2){display:none;}
.comments-all-wrap .comment-wrap > .thumb-wrap .icon-wrap.on > img:nth-child(1){display:none;}
.comments-all-wrap .comment-wrap > .thumb-wrap .icon-wrap.on > img:nth-child(2){display:block;}
.comments-all-wrap .comment-wrap > .thumb-wrap > .inner-wrap .stlt{font-size:1rem; color:#838383; margin-left:10px;}
.editableBtn{background-color:#fff;}

.comments-all-wrap .comment-wrap > .additional-comments-wrap{margin-top:1.25rem;}
.comments-all-wrap .comment-wrap > .additional-comments-wrap .openBtn{display:flex; align-items: center;}
.comments-all-wrap .comment-wrap > .additional-comments-wrap .openBtn:hover{opacity:0.7; color:#000;}
.comments-all-wrap .comment-wrap > .additional-comments-wrap .openBtn > img{margin-right:10px;}
.comments-all-wrap .comment-wrap > .additional-comments-wrap .comments-all-wrap{width:calc(100% - 20px); margin-left:20px; overflow: hidden; height: 0;}
.comments-all-wrap .comment-wrap > .additional-comments-wrap .comments-all-wrap.on{height: auto;}
.comments-all-wrap .comment-wrap > .additional-comments-wrap .comment-wrap{border-bottom:0; padding-top:30px; padding-bottom:0;}
.comments-all-wrap.sample{display:none;}

.follow-id{font-size:1rem; color:#445CB4; width:100%; text-align: left; line-height: 120%; margin-top:1.25rem;}
.typing-wrap .follow-id{margin-top:0; margin-bottom:5px;}

.typing-wrap{ padding:15px 0; position:fixed; bottom:0px; left:50%; transform: translate(-50%, 0); z-index: 1; width:100%; max-width:1200px;}
.typing-wrap > .inner-wrap{ display:flex; flex-wrap:wrap; align-items: flex-end; justify-content: space-between; border:1px solid #d6d6d6; border-radius: 30px; padding:10px 15px; box-sizing: border-box; background-color:#fff; }
.typing-wrap .reply { box-sizing: border-box; color: #838383; font-size: 1.125rem; width: calc(100% - 43px); margin-right: 15px; height: 28px; min-height: 28px; padding: 2px 4px; line-height: 1.2; overflow: hidden; resize: none; background: transparent; }
.typing-wrap .commentBtn{width:28px; height: 28px; background-color:#445CB4; border-radius: 50%; display:flex; justify-content: center; align-items: center; margin-bottom:5px;}
.typing-wrap.on > .inner-wrap{border-color:#445CB4;}

@media only screen and (max-width:580px){
	#notice-wrap .inner-wrap > .search-wrap .board-search-select{width:130px;}
	#notice-wrap .inner-wrap > .search-wrap .search-input{width:calc(100% - 130px);}
	.board-list-wrap ul > li.disappear{display:none;}
	#notice-wrap.read-wrap .file-wrap{width:100%; margin-top:15px;}
}

@media only screen and (max-width:562px){
	.board-list-wrap ul > li.date{display:none;}
	.board-list-wrap .cont-list > li.flexWidth{flex-wrap: wrap;}
	.mobile-data{display:flex; align-items: center; width:100%; margin-top:10px;}
}