@charset "utf-8";

/* 카테고리 */
.list-category { margin-bottom:20px; }
.list-category .active a, .list-category .selected a { color:crimson; font-weight:bold !important; }

/* 목록 */
.knowledge-list-head { margin:0 0 28px; padding:30px 32px; border:1px solid #e4e9ef; border-radius:18px; background:linear-gradient(135deg,#f7fafc 0%,#eef5f8 100%); }
.knowledge-list-head .knowledge-eyebrow { margin:0 0 7px; color:#1f6b73; font-size:12px; font-weight:700; letter-spacing:.12em; }
.knowledge-list-head h1 { margin:0 0 10px; color:#182b3a; font-size:30px; line-height:1.3; font-weight:700; }
.knowledge-list-head > p:last-child { margin:0; color:#556575; font-size:15px; line-height:1.7; }
.list-item .label-tack { padding-left:10px; }
.knowledge-card { overflow:hidden; border:1px solid #e4e9ef; border-radius:14px; background:#fff; box-shadow:0 8px 24px rgba(24,43,58,.07); transition:transform .2s ease, box-shadow .2s ease; }
.knowledge-card:hover { transform:translateY(-3px); box-shadow:0 14px 32px rgba(24,43,58,.12); }
.knowledge-card .imgframe, .knowledge-card .list-img { margin:0; }
.knowledge-card .knowledge-card-body { display:flex; min-height:210px; padding:18px 18px 17px; flex-direction:column; }
.knowledge-card .knowledge-card-category { margin:0 0 7px; color:#1f6b73; font-size:12px; font-weight:700; }
.knowledge-card h2 { display:block; min-height:52px; margin:0 0 9px; font-size:18px; line-height:1.45; font-weight:700; text-align:left; }
.knowledge-card h2 a { color:#182b3a; }
.knowledge-card-summary { display:-webkit-box; min-height:66px; margin:0 0 17px; overflow:hidden; color:#5b6875; font-size:14px; line-height:1.6; -webkit-line-clamp:3; -webkit-box-orient:vertical; }
.knowledge-card .knowledge-card-footer { display:flex; min-height:40px; margin-top:auto; padding:13px 0 0; border-top:1px solid #e8eef1; align-items:center; justify-content:space-between; gap:10px; }
.knowledge-card-date { display:inline-flex; color:#7a8992; font-size:11px; line-height:1; align-items:center; gap:6px; white-space:nowrap; }
.knowledge-card-date i { color:#8aa1aa; font-size:12px; }
.knowledge-more { display:inline-flex; min-height:30px; padding:7px 11px 7px 13px; border:1px solid #cfe0e3; border-radius:999px; background:#f3f8f9; color:#1f6b73; font-size:12px; font-weight:700; line-height:1; align-items:center; gap:7px; white-space:nowrap; transition:background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease; }
.knowledge-more i { font-size:14px; }
.knowledge-more:hover, .knowledge-more:focus { border-color:#1f6b73; background:#1f6b73; color:#fff; text-decoration:none; transform:translateX(2px); }
.list-item .list-img { position:relative; overflow:hidden; }
.list-item .list-img img { width:100%; height:auto; }
.list-item .list-details { padding:0 3%; }
.list-item .list-details .member, .list-item .list-details .guest { color:#787878 !important; }

/* Responsive */
@media all and (max-width:767px) {
	.responsive .list-row { width:50% !important }
}
@media all and (max-width:420px) {
	.responsive .list-row { width:100% !important }
}

/* 아이콘 */
.list-wrap .wr-icon { display:inline-block; padding:0px; margin:0px; overflow:hidden; vertical-align:middle; background-repeat: no-repeat; background-position: left top; }
.list-wrap .wr-new { width:12px; height:12px; background-image: url('./img/icon_new.gif'); }
.list-wrap .wr-secret { width:12px; height:12px; background-image: url('./img/icon_secret.gif'); }
.list-wrap .wr-hot { width:12px; height:12px; background-image: url('./img/icon_hot.gif'); }

/* 목록 공통 */
.list-notice .wr-notice { display:inline-block; padding:0px; margin:0px; overflow:hidden; vertical-align:middle; background-repeat: no-repeat; background-position: left top; width:37px; height:19px; background-image: url('./img/icon_notice.gif'); }
.list-wrap { width:100%; }
.list-btn-box { margin-bottom: 15px; }
.list-btn-box a span { margin-left: 4px; }
.list-btn-box .sort a { color:crimson !important; font-weight:bold !important; }
.list-btn-box .dropdown-menu { font-size: 12px; }
.list-none { margin:0px 0px 15px; padding:80px 0px; }
.list-page { margin-bottom:15px; }
.list-page .pagination { margin:0; }

/* 내용 공통 */
.view-wrap { width:100%; overflow:hidden; }
.knowledge-article { max-width:860px; margin:0 auto; }
.knowledge-article-head { padding:18px 0 22px; border-bottom:1px solid #e4e9ef; }
.knowledge-article-head .knowledge-article-category { margin:0 0 9px; color:#1f6b73; font-size:13px; font-weight:700; }
.knowledge-article-head h1 { height:auto; margin:0; padding:0; overflow:visible; color:#182b3a; font-size:34px; line-height:1.35; letter-spacing:-.04em; white-space:normal; text-overflow:clip; }
.knowledge-lead { margin:16px 0 0; color:#415466; font-size:18px; line-height:1.75; }
.knowledge-source { display:flex; flex-wrap:wrap; gap:7px 18px; align-items:center; margin:20px 0; padding:14px 18px; border-left:4px solid #1f6b73; background:#f4f8f9; color:#536474; font-size:13px; }
.knowledge-source strong { color:#183b43; }
.knowledge-source a { margin-left:auto; color:#1f6b73; font-weight:700; }
.knowledge-toc { margin:24px 15px; padding:20px 24px; border:1px solid #dfe7eb; border-radius:10px; background:#f8fafb; }
.knowledge-toc strong { display:block; margin-bottom:10px; color:#183b43; font-size:16px; }
.knowledge-toc ol { margin:0; padding-left:22px; }
.knowledge-toc li { padding:4px 0; line-height:1.5; }
.knowledge-toc li.depth-2 { margin-left:18px; font-size:13px; }
.knowledge-toc a { color:#385367; }
.view-wrap .img-photo i { background: rgb(245, 245, 245); padding: 16px; border-radius: 50%; width: 80px; height: 80px; text-align: center; color: rgb(143, 143, 143); font-size: 40px; display: inline-block; }
.view-wrap .img-photo img { border-radius: 50%; width: 80px !important; height: 80px !important; display:inline-block; }
.view-wrap .img-resize img { max-width:100%; height:auto; }
.view-wrap h1 { font-size: 22px; font-weight:bold; margin:0px; line-height:50px; display:block; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden; margin:0px; padding:0px 10px; color: rgb(59, 62, 67); letter-spacing:-1px; }
.view-wrap h1 .photo { border-radius: 50%; width: 50px; height: 50px; margin-bottom:10px; margin-right:10px; }
.view-wrap .no-attach { border-bottom:0px; }

.view-btn { margin:0px 0px 30px; }
.view-btn i { margin-right:2px; }

.view-head { border-left:0px; border-right:0px; }
.view-head .sp { display:inline-block; width:20px; text-align:center; font-size:11px; color:#888; }
.view-head .list-group-item { padding:5px 15px; border-style:dotted; }
.view-tag { margin:10px 0px; padding:0px; color:#888; }
.view-tag a { color:#888; }
.view-tag a:hover { color:crimson; }
.view-cnt { margin-top:4px; }
.view-img img { display:block; max-width:100%; margin:0 auto 15px; border:0; height:auto; }
.view-content { padding:10px 15px 30px; color:#293846; font-size:16px; line-height:1.85; }
.view-mobile .view-content { padding:0px 0px 20px; }
.view-content img { width:auto; height:auto; max-width:100%; }
.view-content p { padding:0; margin:0 0 16px; line-height:1.85; }
.view-content h2 { margin:42px 0 16px; color:#183b43; font-size:25px; line-height:1.4; }
.view-content h3 { margin:30px 0 12px; color:#294f5b; font-size:20px; line-height:1.45; }
.view-content blockquote { margin:24px 0; padding:16px 20px; border-left:4px solid #6d9ba1; background:#f5f8f9; color:#405463; }
.view-content table { display:block; max-width:100%; overflow-x:auto; }
.view-good-box { text-align:center; }
.view-good-box span { margin:15px 6px; width:80px; height:80px; display:inline-block; }
.view-good-box a { background: rgb(245, 245, 245); padding-top:14px; border-radius: 50%; width: 80px; height: 80px; text-align: center; color: rgb(51, 51, 51); font-size: 22px; line-height:26px; display: inline-block; }
.view-good-box .view-good a:hover { background: rgb(223, 17, 25); color: rgb(255, 255, 255); }
.view-good-box .view-nogood a:hover { background: rgb(0, 0, 0); color: rgb(255, 255, 255); }
.view-author .auth-photo { width:160px; padding-right:15px; }
.view-comment { color: rgb(51, 51, 51); font-family: "Roboto", sans-serif; margin: 0px 0px 10px; padding: 0px 0px 5px; text-transform: capitalize; overflow: hidden; font-size: 20px; font-weight: 500; border-bottom-color: rgb(51, 51, 51); border-bottom-width: 1px; border-bottom-style: solid; display: inline-block; position: relative; }

#bo_v_sns {margin:4px 0 15px;padding:0;list-style:none;zoom:1}
#bo_v_sns:after {display:block;visibility:hidden;clear:both;content:""}
#bo_v_sns li {float:left;margin:0 5px 0 0}

/* 댓글 */
.comment-media { }
.comment-media .photo i { background: rgb(245, 245, 245); padding: 15px; border-radius: 50%; width: 64px; height: 64px; text-align: center; color: rgb(143, 143, 143); font-size: 30px; display: inline-block; }
.comment-media .photo img { border-radius: 50%; width: 64px !important; height: 64px !important; display:inline-block; }
.view-mobile .comment-media .photo i { padding: 10px; width: 54px; height: 54px; }
.view-mobile .comment-media .photo img { width: 54px !important; height: 54px !important; }

.comment-media .media { border-top:1px solid #eee; margin:7px 0px; padding:7px 0px 0px; }
.comment-media :first-child.media { border-top:0px; margin-top:0px; padding-top:0px; }
.comment-media h5 { margin:2px 0px; line-height: 22px; }
.comment-media .media .media-body { padding-left:0px; }
.comment-media .media .media-info { margin-left:10px; }
.comment-media .media .media-content {	margin-top:8px; }
.comment-media .media .media-btn {	margin-left:4px; }
.comment-media .cmt-good-btn { text-align:right; padding-right:1px; }
.comment-media .cmt-good, .comment-media .cmt-nogood { display:inline-block; width:74px; height:20px; margin-top:10px; padding-right:10px; margin-right:-1px; font:bold 11px verdana; text-align:right; letter-spacing:-1px; line-height:19px; cursor:pointer; }
.comment-media .cmt-good { background: url('./img/cmt_good.gif') no-repeat left center; color:#f4695b; }
.comment-media .cmt-nogood { background: url('./img/cmt_nogood.gif') no-repeat left center; color:#888; }

#bo_vc_opt ol {	margin:0;padding:0;list-style:none;zoom:1; }
#bo_vc_opt ol:after { display:block;visibility:hidden;clear:both;content:""; }
#bo_vc_opt ol li { float:left;margin:0; }
#bo_vc_send_sns ul { margin:0;padding:0;list-style:none;zoom:1; }
#bo_vc_send_sns ul:after { display:block;visibility:hidden;clear:both;content:""; }
#bo_vc_send_sns ul li {	float:left;margin:0 0 0 20px; }
#bo_vc_send_sns input {	margin:0 0 0 5px; }

/* 쓰기 공통 */
.write-wrap { width:100%; max-width:1160px; margin:24px auto 54px; overflow:visible; color:#263746; }
.write-wrap > .well { position:relative; display:flex; align-items:center; justify-content:space-between; margin:0; padding:25px 30px; border:0; border-radius:16px 16px 0 0; background:linear-gradient(135deg,#183b43 0%,#275d66 100%); box-shadow:0 12px 28px rgba(24,59,67,.14); }
.write-wrap > .well h2 { margin:0; padding:0; color:#fff; font-size:23px; line-height:1.4; font-weight:700; letter-spacing:-.03em; }
.knowledge-tip-btn { flex:0 0 auto; margin-left:20px; padding:9px 15px; border:1px solid rgba(255,255,255,.42); border-radius:999px; background:rgba(255,255,255,.12); color:#fff; font-size:13px; font-weight:700; line-height:1.3; transition:background .18s ease, color .18s ease, transform .18s ease; }
.knowledge-tip-btn:hover, .knowledge-tip-btn:focus { outline:0; background:#fff; color:#1d5961; transform:translateY(-1px); }
.knowledge-tip-btn i { margin-right:5px; color:#ffd66b; }
.knowledge-tip-btn:hover i, .knowledge-tip-btn:focus i { color:#b77700; }
.write-wrap > form { padding:30px 34px 34px; border:1px solid #dfe7eb; border-top:0; border-radius:0 0 16px 16px; background:#fff; box-shadow:0 12px 28px rgba(32,55,70,.08); }
.write-wrap .form-group { margin-right:-10px; margin-bottom:22px; margin-left:-10px; }
.write-wrap .form-group > [class*="col-"] { padding-right:10px; padding-left:10px; }
.write-wrap .control-label { padding-top:10px; color:#294653; font-size:13px; line-height:1.45; font-weight:700; text-align:left; }
.write-wrap .control-label .sound_only + * { margin-left:2px; }
.write-wrap .form-control { height:44px; padding:9px 13px; border:1px solid #cfd9df; border-radius:7px; background:#fff; color:#263746; font-size:14px; box-shadow:none; transition:border-color .18s ease, box-shadow .18s ease; }
.write-wrap textarea.form-control { height:auto; min-height:92px; line-height:1.65; resize:vertical; }
.write-wrap .form-control:focus { border-color:#3b7b84; box-shadow:0 0 0 3px rgba(59,123,132,.12); }
.write-wrap .form-control::placeholder { color:#98a6af; }
.write-wrap .input-group-btn .btn { height:44px; padding:10px 13px; border-color:#273640; }
.write-wrap .help-block { margin:7px 2px 0; color:#788994; font-size:12px; line-height:1.55; }
.knowledge-write-guide { position:relative; margin:4px 0 28px; padding:20px 22px 19px 56px; border:1px solid #d8e5e8; border-radius:11px; background:#f3f8f9; color:#425b67; }
.knowledge-write-guide:before { position:absolute; top:20px; left:20px; width:25px; height:25px; border-radius:50%; background:#1f6b73; color:#fff; content:"✓"; font-size:15px; font-weight:700; line-height:25px; text-align:center; }
.knowledge-write-guide strong { display:block; margin-bottom:8px; color:#183b43; font-size:15px; }
.knowledge-write-guide ol { margin:0; padding-left:20px; }
.knowledge-write-guide li { margin:5px 0; line-height:1.6; }
.write-wrap #wr_1 { min-height:96px; padding:13px 15px; background:#fbfdfd; font-size:15px; }
.write-wrap input[type="date"] { color:#536774; }
.write-wrap #wr_content { min-height:480px; }
.write-wrap iframe { max-width:100%; }
.write-wrap .write-content { height:480px; }
.write-wrap .write-file { border:0; box-shadow:none; }
.write-wrap #variableFiles { padding:12px; border-radius:8px; background:#f8fafb; }
.write-wrap .write-btn { margin:32px 0 4px; padding-top:26px; border-top:1px solid #e7ecef; text-align:center; }
.write-wrap .write-btn .btn { min-width:112px; padding:11px 20px; border-radius:7px; font-size:14px; }
.write-wrap .write-btn .btn-color { border-color:#1f6b73; background:#1f6b73; }
.write-wrap .write-btn .btn-color:hover { border-color:#174f56; background:#174f56; }
.write-wrap .delete-file { margin:0px; padding:0px 10px; font-weight:normal; }
.write-wrap .delete-file label { font-weight: normal; }
.write-wrap .sp-label { font-weight:normal; margin-right:10px; }
.write-wrap .sp-label input[type="checkbox"], .write-wrap .sp-label input[type="radio"] { margin-top:0px; }

/* 글쓰기 TIP 레이어 */
.knowledge-tip-modal { color:#263746; }
.knowledge-tip-modal .modal-dialog { margin-top:6vh; }
.knowledge-tip-modal .modal-content { overflow:hidden; border:0; border-radius:16px; box-shadow:0 24px 70px rgba(12,32,42,.28); }
.knowledge-tip-modal .modal-header { position:relative; padding:27px 32px 24px; border-bottom:0; background:linear-gradient(135deg,#183b43 0%,#2e6b74 100%); color:#fff; }
.knowledge-tip-modal .modal-header .close { position:absolute; top:14px; right:18px; width:36px; height:36px; border-radius:50%; color:#fff; font-size:30px; font-weight:300; line-height:31px; text-shadow:none; opacity:.85; }
.knowledge-tip-modal .modal-header .close:hover, .knowledge-tip-modal .modal-header .close:focus { background:rgba(255,255,255,.14); opacity:1; }
.knowledge-tip-modal .tip-kicker { margin:0 0 5px; color:#b9e0e4; font-size:11px; font-weight:700; letter-spacing:.14em; }
.knowledge-tip-modal .modal-title { margin:0; color:#fff; font-size:25px; line-height:1.4; font-weight:700; }
.knowledge-tip-modal .tip-intro { max-width:680px; margin:8px 0 0; color:#deedf0; font-size:14px; line-height:1.65; }
.knowledge-tip-modal .modal-body { max-height:68vh; padding:28px 32px 24px; overflow-y:auto; background:#fff; }
.knowledge-tip-modal .tip-section + .tip-section { margin-top:31px; padding-top:27px; border-top:1px solid #e6ecef; }
.knowledge-tip-modal .tip-section h4 { margin:0 0 17px; color:#183b43; font-size:18px; line-height:1.4; font-weight:700; }
.knowledge-tip-modal .tip-section h4 span { display:inline-block; margin-right:8px; padding:4px 7px; border-radius:5px; background:#dcecef; color:#1f6b73; font-size:11px; vertical-align:2px; }
.knowledge-tip-modal .tip-steps { margin:0; padding:0; list-style:none; counter-reset:tip-step; }
.knowledge-tip-modal .tip-steps li { position:relative; min-height:42px; margin:0 0 13px; padding:0 0 0 47px; counter-increment:tip-step; }
.knowledge-tip-modal .tip-steps li:before { position:absolute; top:1px; left:0; width:32px; height:32px; border:1px solid #c8dade; border-radius:50%; background:#f4f9fa; color:#1f6b73; content:counter(tip-step); font-size:13px; font-weight:700; line-height:30px; text-align:center; }
.knowledge-tip-modal .tip-steps strong { display:block; margin-bottom:2px; color:#263f4b; font-size:14px; }
.knowledge-tip-modal .tip-steps p { margin:0; color:#61737e; font-size:13px; line-height:1.55; }
.knowledge-tip-modal .tip-result-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
.knowledge-tip-modal .tip-result-card { min-height:142px; padding:19px; border:1px solid #dfe8eb; border-radius:10px; background:#f8fbfc; }
.knowledge-tip-modal .tip-result-card > i { display:inline-block; width:31px; height:31px; margin-bottom:11px; border-radius:8px; background:#dcecef; color:#1f6b73; font-size:15px; line-height:31px; text-align:center; }
.knowledge-tip-modal .tip-result-card strong { display:block; margin-bottom:5px; color:#203e49; font-size:14px; }
.knowledge-tip-modal .tip-result-card p { margin:0; color:#637681; font-size:13px; line-height:1.6; }
.knowledge-tip-modal .tip-note { display:flex; gap:13px; align-items:flex-start; margin-top:26px; padding:16px 18px; border:1px solid #eadba8; border-radius:9px; background:#fff9e8; }
.knowledge-tip-modal .tip-note > i { margin-top:2px; color:#a77700; font-size:20px; }
.knowledge-tip-modal .tip-note strong { display:block; margin-bottom:3px; color:#684f11; font-size:14px; }
.knowledge-tip-modal .tip-note p { margin:0; color:#796938; font-size:13px; line-height:1.55; }
.knowledge-tip-modal .modal-footer { padding:16px 32px; border-top:1px solid #e6ecef; background:#f8fafb; text-align:center; }
.knowledge-tip-modal .knowledge-tip-close { min-width:120px; padding:10px 20px; border:1px solid #1f6b73; border-radius:7px; background:#1f6b73; color:#fff; font-weight:700; }
.knowledge-tip-modal .knowledge-tip-close:hover, .knowledge-tip-modal .knowledge-tip-close:focus { border-color:#174f56; background:#174f56; color:#fff; }

@media all and (max-width:767px) {
	.write-wrap { margin:12px auto 36px; }
	.write-wrap > .well { padding:20px; border-radius:12px 12px 0 0; }
	.write-wrap > .well h2 { font-size:20px; }
	.knowledge-tip-btn { margin-left:12px; padding:8px 11px; font-size:12px; }
	.write-wrap > form { padding:22px 18px 26px; border-radius:0 0 12px 12px; }
	.write-wrap .form-group { margin-right:-7px; margin-bottom:18px; margin-left:-7px; }
	.write-wrap .form-group > [class*="col-"] { padding-right:7px; padding-left:7px; }
	.write-wrap .control-label { padding-top:0; padding-bottom:7px; font-size:13px; }
	.knowledge-write-guide { padding:18px 18px 17px 49px; }
	.knowledge-write-guide:before { top:18px; left:16px; }
	.write-wrap #wr_content, .write-wrap .write-content { min-height:380px; height:380px; }
	.knowledge-tip-modal .modal-dialog { margin:10px; }
	.knowledge-tip-modal .modal-header { padding:24px 22px 21px; }
	.knowledge-tip-modal .modal-title { padding-right:28px; font-size:21px; }
	.knowledge-tip-modal .modal-body { max-height:70vh; padding:23px 20px 20px; }
	.knowledge-tip-modal .tip-result-grid { grid-template-columns:1fr; }
	.knowledge-tip-modal .tip-result-card { min-height:0; }
	.knowledge-tip-modal .modal-footer { padding:14px 20px; }
}

#autosave_pop div { text-align:right; }
#autosave_pop button { margin:0; margin-left:10px; padding:0; border:0; background:transparent; color:#888; }
#autosave_pop ul { margin:0; padding:0; padding-left:15px; list-style:disc; }
#autosave_pop li { padding:2px 5px;  }
#autosave_pop li:after { display:block; visibility:hidden; clear:both; content:""; }
#autosave_pop a { display:block; float:left; }
#autosave_pop span { display:block;; float:right; }

/* 반응형 공통 */
@media all and (max-width:460px) {
	.knowledge-list-head { padding:22px 20px; border-radius:12px; }
	.knowledge-list-head h1 { font-size:25px; }
	.knowledge-card h2, .knowledge-card-summary { min-height:0; }
	.knowledge-card .knowledge-card-body { min-height:0; }
	.knowledge-card .knowledge-card-footer { margin-top:4px; }
	.knowledge-article-head h1 { font-size:26px; line-height:1.4; }
	.knowledge-lead { font-size:16px; }
	.knowledge-source { display:block; }
	.knowledge-source span, .knowledge-source a { display:block; margin:6px 0 0; }
	.knowledge-toc { margin:20px 0; padding:17px 18px; }
	.responsive .list-btn { text-align:center; margin:0px auto; }
	.responsive .pull-right.list-btn { float:none !important; margin-bottom:14px; }
	.responsive .view-wrap h1 { text-overflow:clip; overflow:none; white-space:normal; line-height: 24px; font-size: 18px; margin-bottom:10px; }
	.responsive .view-wrap h1 .photo { display:none; }
	.responsive .view-btn i { margin-right:0px; }
	.responsive .view-author .auth-photo { float:none; width:100%; padding-right:0px; }
	.responsive .comment-btn { text-align:center; }
	.responsive .comment-btn .pull-right { float:none !important; }
}