@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local('Noto Sans KR Light'), local('NotoSansKR-Light'), url(/assets/font/NotoSansKR-Light.woff2) format('woff2'), url(/assets/font/NotoSansKR-Light.woff) format('woff'), url(/assets/font/NotoSansKR-Light.otf) format('opentype');
    unicode-range: U+AC00-D7A3, U+0020-002F, U+003A-0040, U+005B-0060, U+007B-007E;
}

@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Noto Sans KR Regular'), local('NotoSansKR-Regular'), url(/assets/font/NotoSansKR-Regular.woff2) format('woff2'), url(/assets/font/NotoSansKR-Regular.woff) format('woff'), url(/assets/font/NotoSansKR-Regular.otf) format('opentype');
    unicode-range: U+AC00-D7A3, U+0020-002F, U+003A-0040, U+005B-0060, U+007B-007E;
}

@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: local('Noto Sans KR Medium'), local('NotoSansKR-Medium'), url(/assets/font/NotoSansKR-Medium.woff2) format('woff2'), url(/assets/font/NotoSansKR-Medium.woff) format('woff'), url(/assets/font/NotoSansKR-Medium.otf) format('opentype');
    unicode-range: U+AC00-D7A3, U+0020-002F, U+003A-0040, U+005B-0060, U+007B-007E;
}

@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local('Noto Sans KR Bold'), local('NotoSansKR-Bold'), url(/assets/font/NotoSansKR-Bold.woff2) format('woff2'), url(/assets/font/NotoSansKR-Bold.woff) format('woff'), url(/assets/font/NotoSansKR-Bold.otf) format('opentype');
    unicode-range: U+AC00-D7A3, U+0020-002F, U+003A-0040, U+005B-0060, U+007B-007E;
}


html, body {
	font-size:14px !important;
	font-family: "Noto Sans KR",AppleSDGothicNeo-Regular,Malgun Gothic,dotum,sans-serif;
}

input, button, select, optgroup, textarea {
	font-family: "Noto Sans KR",AppleSDGothicNeo-Regular,Malgun Gothic,dotum,sans-serif;
}


thead, tbody, tfoot, tr, td *, th * {
	font-size:14px;
}
.dropdown-item {
	font-size:14px;
}

.btn.btn-primary {
	border:1px solid #0057FF !important;
	background-color:#0057FF !important
}
.btn.btn-primary:hover {background-color:#5F96FF !important}

.ck.ck-editor {width: 100%;}

.ck-editor__editable_inline {max-height:500px !important;}

#comment_form .ck-editor__editable_inline {height:150px !important;min-height:150px !important;max-height:150px !important;}
#reply_form .ck-editor__editable_inline {height:150px !important;min-height:150px !important;max-height:150px !important;}

/**
 * 매물관리 페이지에서 td부분이 계속 길어지는 내용이 있는데 이 것 때문에 테이블이 옆으로 계속 길어지다 보니까
 * 아래 속성을 넣어서 줄바꿈이 되도록 처리하였음
 */
.ws-normal {
	white-space:normal !important;
}

@media (max-width: 1400px){
	.display-pc {
		display:none;
	}
}

/* nobleui에서 form-control은 왜 폰트 크기를 작게 했을까? */
.form-control, .typeahead.tt-input, .typeahead.tt-hint, .select2-container--default .select2-search--dropdown .select2-search__field {
	font-size:1rem;
	line-height:1.3;
}

.form-select {
	font-size:1rem;
	line-height:1.3;
}

.input-group .input-group-prepend select {
	font-size:1rem;
}

.input-group-sm > .form-control {
	font-size:1rem;
}

.badge {font-size:0.8rem !important;}

img {max-width:100%}

.image img {
    border: 1px solid #ddd;
    max-width: 100%;
    border-radius: 10px;
    margin-top: 10px;
}


.feedback-body .todo-list {padding-left:0px;}
.feedback-body .todo-list li {list-style-type:none;}
.feedback-body .todo-list li input[type='checkbox'] {margin-right:5px;}

.post a {color:#999999;}

.input-group .input-group-prepend select {
	border-top-right-radius : 0px;
	border-bottom-right-radius : 0px;
	font-size:0.925rem;
}

.input-group .form-control {
	border-color:#e4e6ef !important;
	background-color:#fff !important;
}

#content_admin {
	border:1px solid #ccc;
	background-color:#f5f5f5;
	min-height:50px;
}

#feedback_content p {
	margin-bottom:0.2rem !important;
}

#feedback_content_admin {
	white-space: pre-wrap;line-height:1em;font-size:13px;
}

.select2-container--default.select2-container--focus .select2-selection--multiple {
	border:1px solid #efefef !important;
}

/* 탭 메뉴가 너무 진해서 추가함 */
.nav.nav-tabs.nav-tabs-line .nav-link {
	color:#666;
}


#feedback_desc {
	white-space:nowrap;
	overflow:hidden;
	max-width:100%;
}

@media (max-width: 1400px){
	.card .card-header .card-toolbar {
		position:absolute;
		right:10px;
		top:0px;
	}
}

.dropzone {
	overflow:auto;
    min-height: 175px !important;
    height: 80px !important;
    border: 1px solid rgba(125,125,125,.1) !important;
    background: #f5f8fa !important;
    padding: 10px !important;
	border-radius:10px;
	font-size:13px;
}

.dropzone.dz-clickable .dz-message {
	color:#bbb !important;
	margin:15px !important;
	margin-top:60px !important;
}

.dropzone .dz-preview {
	margin:5px !important;
}

.flex-stack {
    justify-content: space-between;
    align-items: center;
}

.p-lg-6 {
    padding: 1.5rem!important;
}

.mb-10 {
    margin-bottom: 2.5rem!important;
}

.mb-5 {
    margin-bottom: 1.25rem!important;
}

.mt-5 {
    margin-top: 1.25rem!important;
}

.mt-10 {
    margin-top: 2.5rem!important;
}



.comment-left-0 {
	margin-left:0px;
}

.comment-left-1 {
	margin-left:30px;
}

.comment-left-2 {
	margin-left:60px;
}

.comment-left-3 {
	margin-left:90px;
}

.comment-left-4 {
	margin-left:120px;
}

.comment-left-5 {
	margin-left:150px;
}

.comment-left-6 {
	margin-left:180px;
}

.comment-left-7 {
	margin-left:210px;
}

.comment-left-8 {
	margin-left:2400px;
}

.comment-left-9 {
	margin-left:2700px;
}

.symbol.symbol-20px>img {
    width: 20px;
    height: 20px;
}

.comment-toolbar .btn {
	padding:5px 10px !important;
	line-height:12px;
	font-size:12px;
}


.btn-comment-vote {
	background-color:#f5f8fa;
	color:#7E8299;
	line-height:12px;
	padding:3px 10px !important;
}

.btn-comment-vote .num {
	font-size:12px;
}

.btn-comment-vote:hover {
	background-color:#eee;
	color:#7E8299
}

.btn-comment-vote.active {
	background-color:#6571ff;	
	color:#fff;
}

.btn-comment-vote.active .svg-icon {
	color:#fff;
}

.comment-body p{
	word-wrap: break-word;
}
.avatar {
	margin: 0px auto;
    border-radius: 50%;
    width: 25px;
    height: 25px;
}


.btn-feedback-vote {
	background-color:#f5f8fa;
	color:#7E8299;
	padding:3px 10px !important;
}

.btn-feedback-vote span {
	font-size:12px !important;
}

.btn-feedback-vote:hover {
	background-color:#eee;
	color:#7E8299
}

.btn-feedback-vote.active {
	background-color:#0057FF;	
	color:#fff;
}

.btn-feedback-vote.active .svg-icon {
	color:#fff;
}


.btn-feedback-view-vote.active .svg-icon {
	color:#fff;
}

.btn-feedback-view-vote {
	background-color:#f5f8fa;
	color:#7E8299;
	padding:3px 10px !important;
}

.btn-feedback-view-vote .num {
	font-size:12px;
}

.btn-feedback-view-vote:hover {
	background-color:#eee;
	color:#7E8299
}

.btn-feedback-view-vote.active {
	background-color:#0057FF;	
	color:#fff;
}

.btn-feedback-view-vote.active .svg-icon {
	color:#fff;
}

.btn-feedback-pin {
	background-color:#f5f8fa;
	color:#7E8299;
	padding:3px 10px !important;
}

.btn-feedback-pin span {
	font-size:12px !important;
}

.btn-feedback-pin:hover {
	background-color:#eee;
	color:#7E8299
}

.btn-feedback-pin.active {
	background-color:#0057FF;	
	color:#fff;
}

.btn-notice-vote {
	background-color:#f5f8fa;
	color:#7E8299;
	padding:3px 10px !important;
}

.btn-notice-vote .num {
	font-size:12px;
}

.btn-notice-vote:hover {
	background-color:#eee;
	color:#7E8299
}

.btn-notice-vote.active {
	background-color:#0057FF;	
	color:#fff;
}

.btn-notice-vote.active .svg-icon {
	color:#fff;
}

.roadmap_wrapper {
	display: flex;
	flex-direction: row;
	overflow-x:auto;
}

.roadmap_block_wrapper {
	padding: 0.6rem;
	min-width:300px;
	width:300px;
	min-height:2.5rem;
	margin-right:15px;
}

.roadmap_block_wrapper:first-child {
	padding-left:0px;
}

.roadmap_block {
	min-height:300px;
	background-color:#eee;
	border-radius:10px;
	width:100%;
	position:relative;
	display: flex;			/* 이거 안 넣어주면 안 늘어남 */
	flex-direction: column; /* 이거 안 넣어주면 안 늘어남 */
}

.roadmap_block_header {
	padding:10px;
}

.roadmap_block_body {
	margin-left:10px;
	margin-right:10px;
	padding:0 10px 10px 10px;
	margin-bottom:40px;
	min-height:400px;
	max-height:800px;
	overflow-y:scroll;
}

.roadmap_block_body .item {
	border:1px solid #ddd;
	background-color:#fff;
	padding:5px;
	border-radius:5px;
	margin-bottom:10px;
	cursor:pointer;
	display: flex;
	flex-direction: column;
}

.roadmap_block_body .item .item-desc {
	display:none;
}

.roadmap_block_body .item:hover .item-desc {
	display:none;
}

.roadmap_block_body .item a{
	color:#666;
}

.roadmap_block_footer {
	position:absolute;
	bottom:0px;
	width:100%;
	padding:10px;
}

.roadmap_block_footer a {
	color:#999;
	display:block;
	padding:5px;
	border-radius:5px;
}

.roadmap_block_footer a:hover {
	background-color:#ccc;
	color:#fff;
}

.userdesk {
	font-size:11px;
	position:fixed;
	width: 200px;
	background-color:#fff;
	bottom:0px;
	text-align:center;
	opacity:0.9;
	box-shadow:0 -4px 15px 0 rgb(0 0 0 / 8%);
	padding: 5px 0px 0px 0px;
    right: 10px;
    border: 1px solid #ccc;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
}



.chat .chat-toolbar button {
    background-color: transparent;
	border: none;
    box-sizing: content-box;
    line-height: inherit;
	cursor:pointer;
    transition: all 150ms ease 0s;
    float: left;
    display: flex;
	align-items:center;
	justify-content:center;
    flex-direction: column;
    height: 100%;
	width:20px;
	font-size:16px;
}

.btn-chat-wrapper {
	position:fixed;
	bottom:115px;
	width:100%;
	text-align:center;
	z-index:1;
}

.btn-chat-wrapper .btn {
	padding:10px 20px;
}

.content-chat {
	padding-bottom:40px !important;
}

.chat-wrapper {
	position: relative;
    animation: 1.2s ease 0s 1 normal none running animation-3x2utg;
    margin-bottom: 15px;
	height:auto;
}

.chat-info {
	display: block;
    margin: 5px 0px;
    font-size: 11px;
}

.chat-msg {
	
}

.chat-msg-content {
	max-width:70%;
	position: relative;
    display: inline-block;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.5;
    padding: 7px 12px;
    border-radius:  0px 18px 18px 18px;
    text-align: left;
    word-break: break-all;
    background: rgb(230, 230, 230) !important;
    color: rgb(100, 100, 100) !important;
}

.chat-wrapper .right {
	text-align:right;
}

.chat-wrapper .right .chat-msg-content{
    background: rgb(94, 130, 255) !important;
    color: rgb(255, 255, 255) !important;
    border-radius: 18px 0px 18px 18px;
}

.chat-msg-content ul {padding:0;margin-top:10px;margin-bottom:0px;}
.chat-msg-content ul li{list-style:none;display:block;min-height:34px;}

.chat-wrapper .chat-msg-content a {color:#333;display:inline-block}

.chat-wrapper .right .chat-msg-content a {color:#fff;}
.list_category, .list_faq {
	background-color: #fff;
	padding: 5px 10px;
	cursor: pointer;
	border-radius: 5px;
	box-shadow:rgb(0 0 0 / 10%) 2px 2px 2px;
}


.separator {
    display: block;
    height: 0;
    border-bottom: 1px solid #CCCCCC;
    border-bottom-style:dashed;

    border-color: #CCCCCC !important;
}
/****************************************************************************
 * 3. 로고
 * 4. 피드백
 * 5. 코멘트
 * 6. 로드맵
 * 7. 지식
 * 10. 투표
 * 11. 공지
 ****************************************************************************/

.tx-12 {font-size:12px;}

.card .card-header {
	flex-flow:nowrap;
}

.header-fixed .header {
	height:70px;
}

@media (max-width:991px) {
	.header-tablet-and-mobile-fixed .header {
		height:60px !important;
	}

	body.header-tablet-and-mobile-fixed {
		padding-top:60px;
	}
}

.menu-item .menu-link .menu-title {
	font-weight:700;
}

.ck-editor__editable_inline {
	height: 150px;
}


/****************************************************************************
 * 3. 로고
 ****************************************************************************/

.logo-wrapper {
    padding: 5px 0;
	width:200px;
	font-weight:900;
	font-size:19px;
}

.logo-wrapper a {
	color:#0057FF;
}

.logo-wrapper .title {
	white-space:nowrap;
}

.logo-wrapper .text-muted {
	font-weight:400;
	font-size:12px;
	color:#ccc;
	white-space:nowrap;
	padding-left:25px;
	line-height:13px;
	margin-top:3px;
}

@media (max-width: 1024px) {
	.logo-wrapper {
		text-align:center;
		color:#fff;
		max-width:150px;
	}
	.logo-wrapper .text-muted {
		text-align:center;
		color:#ddd;
		padding:0px;
	}
	.login-form .logo-wrapper a {
		color:#0057FF;
	}

	.login-form img {
		width:150px;
	}
}

/****************************************************************************
 * 7. 지식
 ****************************************************************************/

.menu-item .menu-link {
	padding: .25rem 1rem;
}

.menu-item .menu-link .menu-bullet {
	width:0.5rem;
	margin-right:0.3rem;
}

.aside {
	overflow:hidden;
	text-overflow:ellipse;
}
.docs-aside-menu {
	width:100%;
}
.docs-aside-menu .menu .menu-item .menu-link, .docs-aside-menu .menu .menu-sub:not([data-popper-placement])>.menu-item>.menu-link {
	padding-left:10px;	
	padding-right:10px;
}

.aside .menu .menu-item>.menu-link>.menu-title {
	display:block;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}


#footer_nav {border:1px solid #ccc;border-radius:10px;}
#footer_nav .prev {width:50%;text-align:left;padding:10px;border-right:1px solid #ccc;}

#footer_nav .next {width:50%;text-align:right;padding:10px;}

/***********************************
 * 11. 공지
 * 짧으면 상관이 없는데
 * 크면 height를 줘 버려야 한다.
 ***********************************/

.notice-body {
	position:relative;
}

.body-overflow {
	height:300px;
	overflow:hidden;
}

.notice-body .btn-more {
	width:100%;
	position:absolute;
	bottom:0px;
	left:0px;
	right:0px;
	background-color:#fff;
	border-radius:0;
	color:#777;
	background: linear-gradient(to top, #fff, rgb(255,255,255,0.7));

}

.notice-body.more {
	height:auto;
	max-height:auto;
}

.notice-body.more .btn-more {
	display:none;
}