@charset "UTF-8";
/* CatBoard default skin
 *
 * 커스터마이즈: 이 파일을 테마의 catboard-skins/{스킨명}/style.css 로
 * 복사하면 플러그인 파일 대신 로드됩니다. @charset "UTF-8" 선언은
 * 한글 주석 깨짐 방지를 위해 첫 줄에 유지하세요.
 *
 * 모든 규칙은 .catboard-wrap 하위로 한정해 테마와의 충돌을 피합니다.
 * 버튼/링크 색상 규칙은 테마의 a { color: ... } 를 이기기 위해
 * 의도적으로 특이도를 높여 두었습니다 — 셀렉터를 단순화하면 테마에
 * 따라 글자색이 덮일 수 있습니다.
 */

html {
  /* 62.5% of 16px browser font size is 10px */
  /* 16px * 0.625 = 10px */
  font-size: 62.5%;
}
body {
  /* 1.6 * 10px = 16px */
  font-size: 1.6rem;
}

/* ------------------------------------------------------------------ */
/* 공통 래퍼 */
/* ------------------------------------------------------------------ */
.catboard-wrap {
	display: flex;
	flex-direction: column;
	gap: 5rem;
}
.catboard-wrap a {
	text-decoration: none;
}
@media screen and (max-width: 767px) {
	.catboard-wrap {
		gap: 3rem;
	}
}

/* ------------------------------------------------------------------ */
/* 입력 요소 공통 */
/* ------------------------------------------------------------------ */
.catboard-wrap input[type="text"],
.catboard-wrap input[type="number"],
.catboard-wrap input[type="password"],
.catboard-wrap input[type="datetime-local"],
.catboard-wrap select,
.catboard-wrap textarea {
	padding: 1rem 2rem;
	border-radius: 0.8rem;
	border: 1px solid #DDD;
	background: #FFF;
	color: #767676;
	font-size: 1.6rem;
	font-weight: 400;
}
.catboard-wrap select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	padding-right: 5rem;
	background-image: url(img/carat-icon.svg);
	background-repeat: no-repeat;
	background-position: right 2rem center;
	background-size: 1.4rem;
}
.catboard-wrap button {
	cursor: pointer;
}
@media screen and (max-width: 767px) {
	.catboard-wrap input[type="text"],
	.catboard-wrap input[type="number"],
	.catboard-wrap input[type="password"],
	.catboard-wrap input[type="datetime-local"],
	.catboard-wrap textarea {
		padding: 1rem;
	}
	.catboard-wrap select {
		padding: 1rem 5rem 1rem 1rem;
	}
}

/* ------------------------------------------------------------------ */
/* 게시판 헤더 (총 건수 + 검색) */
/* ------------------------------------------------------------------ */
.catboard-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1rem;
}
.catboard-header .catboard-total {
	color: #767676;
	font-size: 1.6rem;
	font-weight: 400;
}
.catboard-search-form {
	position: relative;
}
.catboard-search-form input[name="cb_search"],
.catboard-search-form select {
	height: 5.6rem;
	box-sizing: border-box;
}
.catboard-search-form input[name="cb_search"] {
	width: 32rem;
}
.catboard-search-form button {
	position: absolute;
	top: 50%;
	right: 0.8rem;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3.6rem;
	height: 3.6rem;
	padding: 0;
	border: 0;
	border-radius: 99rem;
	background: #2187C8;
	cursor: pointer;
	font-size: 0;
	color: transparent;
}
.catboard-search-form button::before {
	content: "";
	width: 2.2rem;
	height: 2.2rem;
	background: url(img/search-icon.svg) no-repeat center;
	background-size: contain;
}
@media screen and (max-width: 767px) {
	.catboard-header {
		flex-direction: column;
	}
	.catboard-header .catboard-total {
		align-self: start;
	}
	.catboard-search-form {
		align-self: end;
	}
}
@media screen and (max-width: 700px) {
    .catboard-search-form:has(select[name="cb_category"]) {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
        width: 100%;
    }
    .catboard-search-form:has(select[name="cb_category"]) select {
        width: calc(50% - 0.25rem) !important;
    }
    .catboard-search-form:has(select[name="cb_category"]) input[name="cb_search"] {
        width: 100% !important;
    }
    .catboard-search-form:has(select[name="cb_category"]) button {
        top: auto;
        bottom: 1rem;
        transform: unset;
    }
}
@media screen and (max-width: 550px) {
	html[lang="en-US"] .catboard-search-form {
		align-self: end;
		display: flex;
		flex-direction: column;
		gap: 0.5rem;
		width: 100%;
	}
	html[lang="en-US"] .catboard-search-form select {
		width: 18rem;
	}
	html[lang="en-US"] .catboard-search-form input[name="cb_search"] {
		width: 100%;
	}
	html[lang="en-US"] .catboard-search-form button {
		top: 60%;
		transform: unset;
	}
}
@media screen and (max-width: 500px) {
	.catboard-search-form {
		align-self: end;
		display: flex;
		gap: 0.5rem;
		width: 100%;
	}
	.catboard-search-form select {
		width: 13rem;
	}
	.catboard-search-form input[name="cb_search"] {
		width: calc(100% - 13rem);
	}
	.catboard-search-form:not(:has(select[name="cb_category"])) {
        flex-direction: column;
        align-items: start;
    }
    .catboard-search-form:not(:has(select[name="cb_category"])) input[name="cb_search"] {
        width: 100% !important;
    }
    .catboard-search-form:not(:has(select[name="cb_category"])) button {
        top: auto;
        bottom: 1rem;
        transform: unset;
    }
}

/* ------------------------------------------------------------------ */
/* 리스트 목록 */
/* ------------------------------------------------------------------ */
/* 타이틀 */
.catboard-list {
	display: flex;
    flex-direction: column;
    gap: 1rem;
}
.catboard-list-header {
	display: flex;
	align-items: center;
	gap: 3rem;
	padding: 3rem;
	color: #181818;
	text-align: center;
	font-size: 1.8rem;
	font-weight: 600;
}
.catboard-list-header .catboard-list-num,
.catboard-list-item .catboard-list-num {
	width: 7rem;
	flex-shrink: 0;
}
.catboard-list-header .catboard-list-category,
.catboard-list-item .catboard-list-category {
	width: 12rem;
	flex-shrink: 0;
}
.catboard-list-header .catboard-list-title,
.catboard-list-item .catboard-list-title {
	flex: 1;
}
.catboard-list-header .catboard-list-author,
.catboard-list-item .catboard-list-author {
	width: 9.9rem;
	flex-shrink: 0;
}
.catboard-list-header .catboard-list-date,
.catboard-list-item .catboard-list-date {
	width: 8.4rem;
	flex-shrink: 0;
}
.catboard-list-header .catboard-list-views,
.catboard-list-item .catboard-list-views {
	width: 6rem;
	flex-shrink: 0;
}
/* 목록 */
.catboard-list-item {
	display: flex;
	align-items: center;
	gap: 3rem;
	padding: 3rem;
	color: #666 !important;
	text-align: center;
	font-size: 1.4rem;
	font-weight: 400;
	border-radius: 2.4rem;
    border: 1px solid #E7E7E7;
}
.catboard-list-item.is-notice {
	border-radius: 2.4rem;
    border: 1px solid #C4E1F6;
    background: #EDF7FF;
}
.catboard-list-item .catboard-list-num .catboard-notice-badge {
	padding: 0.5rem 1rem;
	border-radius: 0.8rem;
	background: #2187C8;
	color: #FFF;
	font-size: 1.6rem;
	font-weight: 400;
	display: block;
}
.catboard-list-item .catboard-list-category:not(.is-empty) {
	box-sizing: border-box;
	padding: 0.5rem 1rem;
	border-radius: 0.8rem;
	border: 1px solid #E7E7E7;
	background: #FFF;
	color: #767676;
	font-size: 1.6rem;
	font-weight: 400;
	text-overflow: ellipsis;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}
.catboard-list-item.is-notice .catboard-list-category:not(.is-empty) {
    border: 1px solid #C4E1F6;
    background: #FFF;
}
.catboard-list-item .catboard-post-title {
	display: flex;
	align-items: center;
	gap: 1rem;
}
.catboard-list-item .catboard-list-title {
	display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.catboard-list-item .catboard-list-title p {
	text-align: left;
	color: #1D1D1E;
	font-size: 1.8rem;
	font-weight: 600;
	text-overflow: ellipsis;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	margin: 0;
}
.catboard-list-item .catboard-post-content {
    color: #666;
	font-size: 1.6rem;
	font-weight: 400;
	display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
	text-align: left;
}
.catboard-list-item .catboard-post-title .catboard-file-icon,
.catboard-list-item .catboard-post-title .catboard-lock-icon {
    display: flex;
}
.catboard-list-item .catboard-list-title .catboard-comment-count {
	color: #FF2744;
	font-size: 1.6rem;
	font-weight: 400;
}
/* 페이지네이션 */
.catboard-footer {
	display: flex;
	justify-content: end;
	align-items: center;
	gap: 1rem;
}
.catboard-footer .catboard-pagination {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 3rem;
	margin: 0 auto;
	padding: 0;
}
.catboard-footer .catboard-pagination li,
.catboard-footer .catboard-pagination li a {
	list-style: none;
	color: #767676;
	font-size: 1.8rem;
	font-weight: 400;
	transition: 0.3s;
}
.catboard-footer .catboard-pagination li.active,
.catboard-footer .catboard-pagination li.active a {
	color: #2187C8;
	font-size: 1.8rem;
	font-weight: 600;
}
.catboard-footer .catboard-write-btn a {
	display: block;
	border-radius: 0.8rem;
	background: #2187C8;
	padding: 1rem 3rem;
	color: #FFF;
	font-size: 1.6rem;
	font-weight: 400;
}
.catboard-pagination img {
    display: block;
	width: 0.9rem;
	height: 1.5rem;
}
.catboard-pagination li:last-child img {
	transform: rotate(180deg);
}
@media screen and (max-width: 1024px) {
	.catboard-list-header {
		display: none;
	}
	.catboard-list-item {
		padding: 2rem;
		flex-direction: column;
		align-items: start;
		gap: 1rem;
	}
	.catboard-list-header .catboard-list-date,
	.catboard-list-item .catboard-list-date {
		width: auto;
	}
	.catboard-list-item .catboard-list-num,
	.catboard-list-item .catboard-list-author,
	.catboard-list-item .catboard-list-views {
		display: none;
	}
	.catboard-list-item .catboard-list-title a {
		font-size: 1.6rem;
	}
	.catboard-footer .catboard-pagination {
		gap: 2rem;
	}
	.catboard-footer .catboard-pagination li,
	.catboard-footer .catboard-pagination li a {
		font-size: 1.6rem;
	}
	.catboard-footer .catboard-pagination li.active,
	.catboard-footer .catboard-pagination li.active a {
		font-size: 1.6rem;
	}
	.catboard-footer .catboard-write-btn a {
		padding: 1rem 2rem;
	}
}
@media screen and (max-width: 500px) {
	.catboard-footer {
		flex-direction: column;
	}
	.catboard-footer .catboard-pagination {
		gap: 1.5rem;
	}
	.catboard-footer .catboard-write-btn {
		align-self: end;
	}
}

/* ------------------------------------------------------------------ */
/* 상세페이지 */
/* ------------------------------------------------------------------ */
.catboard-post {
	gap: 3rem;
}
.catboard-document-header {
	padding: 5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3rem;
    border-radius: 1.2rem;
    border: 1px solid #E7E7E7;
}
.catboard-document-header .catboard-badge-wrap {
	display: flex;
	flex-wrap: wrap;
    justify-content: center;
	gap: 1rem;
}
.catboard-document-header .catboard-badge-wrap .catboard-notice-badge {
	padding: 0.5rem 1rem;
	border-radius: 0.8rem;
	background: #2187C8;
	color:#FFF;
	font-size: 1.6rem;
	font-weight: 400;
	min-width: 7rem;
	text-align: center;
}
.catboard-document-header .catboard-badge-wrap .catboard-category-badge {
	padding: 0.5rem 1rem;
	border-radius: 0.8rem;
	border: 1px solid #DDD;
	color: #767676;
	font-size: 1.6rem;
	font-weight: 400;
	min-width: 12rem;
	text-align: center;
}
.catboard-document-header .catboard-document-title {
	color: #181818;
	text-align: center;
	font-size: 2.4rem;
	font-weight: 600;
	margin: 0;
}
.catboard-document-header .catboard-document-meta {
	display: flex;
	gap: 3rem;
	align-items: center;
}
.catboard-document-header .catboard-document-meta span {
	position: relative;
    display: flex;
    align-items: center;
    gap: 3rem;
	color: #767676;
	font-size: 1.6rem;
	font-weight: 400;
}
.catboard-document-header .catboard-document-meta span:after {
    position: relative;
    content: '';
    display: block;
    width: 1px;
    height: 1.4rem;
    background-color: #DDD;
    background-size: 100%;
}
.catboard-document-header .catboard-document-meta span:last-of-type {
    gap: 0.5rem;
}
.catboard-document-header .catboard-document-meta span:last-of-type:after {
	width: 0;
}
.catboard-document-header .catboard-document-meta-wrap {
	display: flex;
    justify-content: space-between;
    align-items: center;
	flex-wrap: wrap;
	gap: 1rem;
    width: 100%;
}
.catboard-document-header .catboard-document-meta {
	display: flex;
    align-items: center;
    gap: 3rem;
}
.catboard-document-header .share-buttons {
	display: flex;
    align-items: center;
    gap: 1rem;
}
.catboard-document-content {
	padding: 5rem;
	border-radius: 1.2rem;
	border: 1px solid #E7E7E7;
}
.catboard-document-content table,
.catboard-editor-wrap table {
	border-collapse: collapse;
}
.catboard-document-content table tr,
.catboard-document-content table td,
.catboard-editor-wrap table tr,
.catboard-editor-wrap table td {
	border: 1px solid #DDD;
}
.catboard-document-content hr,
.catboard-editor-wrap hr {
	background-color: #DDD;
}
.catboard-document-content iframe,
.catboard-editor-wrap iframe {
	aspect-ratio: 16 / 9;
	width: 100%;
	max-width: 100%;
	height: 100%;
}
.catboard-attachments {
	padding: 5rem;
	border-radius: 1.2rem;
	background: #F8F8F8;
	display: flex;
	align-items: start;
	gap: 5rem;
}
.catboard-attachments .catboard-attachments-title {
	color:#181818;
	font-size: 1.8rem;
	font-weight: 600;
}
.catboard-attachments .catboard-attachment-wrap {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.catboard-attachments .catboard-attachment-item {
	display: block;
	color: #767676;
	font-size: 1.6rem;
	font-weight: 400;
}
.catboard-comments {
	padding: 5rem;
	border-radius: 1.2rem;
	border: 1px solid #DDD;
	display: flex;
	flex-direction: column;
	gap: 3rem;
}
.catboard-comments .catboard-comments-title {
	color: #444;
	font-size: 1.8rem;
	font-weight: 600;
	margin: 0;
}
.catboard-comments .catboard-comments-title span {
	color: #FF2744;
}
.catboard-comments > *:not(:last-child) {
	padding-bottom: 3rem;
	border-bottom: 1px solid #ddd;
}
.catboard-comment-item {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.catboard-comment-meta {
	display: flex;
	justify-content: space-between;
}
.catboard-comment-info {
	display: flex;
	align-items: center;
	gap: 1rem;
}
.catboard-comment-info .catboard-comment-author {
	color: #444;
    font-size: 1.6rem;
    font-weight: 400;
    position: relative;
    display: flex;
    align-items: center;
    gap: 1rem;
}
.catboard-comment-info .catboard-comment-author:after {
    content: '';
    display: block;
    width: 1px;
    height: 1.4rem;
    background: #DDD;
}
.catboard-comment-info span {
	color: #767676;
	font-size: 1.4rem;
	font-weight: 400;
}
.catboard-comment-content {
	color: #181818;
	font-size: 1.6rem;
	font-weight: 400;
}
.catboard-comment-btn {
    display: flex;
    align-items: center;
	gap: 1rem;
}
.catboard-comment-btn > * {
    display: flex;
    align-items: center;
	gap: 1rem;
}
.catboard-comment-btn > *:not(:last-child)::after {
    content: '';
    width: 1px;
    height: 1.4rem;
    background: #DDD;
}
.catboard-comment-btn button {
	padding: 0;
	border: 0;
	background: unset;
	color: #767676;
	font-size: 1.6rem;
	font-weight: 400;
}
.catboard-comment-form form,
.catboard-comment-reply-form form {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.catboard-comment-reply-form,
.catboard-comment-reply {
	margin-left: 3rem;
	margin-top: -1rem;
}
.catboard-comment-form-meta {
	display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.catboard-comment-text {
    display: flex;
	align-items: stretch;
    gap: 1rem;
}
.catboard-comment-text textarea {
    flex: 1;
    min-width: 0;
	border-radius: 1.2rem;
	background: #F8F8F8;
	height: 10rem;
	box-sizing: border-box;
}
.catboard-comment-text button {
    flex-shrink: 0;
    width: 15rem;
    padding: 3rem;
    border-radius: 1.2rem;
    background: #2187C8;
    color: #FFF;
    font-size: 1.8rem;
    font-weight: 400;
    border: none;
	height: 10rem;
}
.catboard-adjacent {
	position: relative;
	padding: 5rem;
	border: 1px solid #DDD;
	border-radius: 1.2rem;
	display: flex;
	align-items: center;
}
.catboard-adjacent .catboard-adjacent-item {
	position: relative;
	flex: 1 1 50%;
	max-width: 50%;
	min-width: 0;
	display: flex;
	align-items: center;
	gap: 5rem;
}
.catboard-adjacent .catboard-adjacent-item.prev {
	padding-right: 1rem;
}
.catboard-adjacent .catboard-adjacent-item.next {
	padding-left: 1rem;
	margin-left: auto;
}
/* prev만 있을 때 */
.catboard-adjacent .catboard-adjacent-item.prev::after,
/* next만 있을 때 */
.catboard-adjacent .catboard-adjacent-item.next::before {
	content: '';
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 2.7rem;
	background: #DDD;
}
.catboard-adjacent .catboard-adjacent-item.prev::after {
	right: 0;
}
.catboard-adjacent .catboard-adjacent-item.next::before {
	left: 0;
}
/* 둘 다 있을 때는 구분선 하나만 표시 */
.catboard-adjacent .catboard-adjacent-item.prev + .catboard-adjacent-item.next::before {
	display: none;
}
.catboard-adjacent .catboard-adjacent-item.next,
.catboard-adjacent .catboard-adjacent-item.next .catboard-adjacent-label {
	flex-direction: row-reverse;
}
.catboard-adjacent .catboard-adjacent-label {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	gap: 1rem;
	color: #444;
	font-size: 1.8rem;
	font-weight: 400;
}
.catboard-adjacent .catboard-adjacent-item.next .catboard-adjacent-label img {
	transform: rotate(180deg);
}
.catboard-adjacent .catboard-adjacent-title {
	color: #767676;
	font-size: 1.6rem;
	font-weight: 400;
	text-overflow: ellipsis;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}
.catboard-document-actions {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 1rem;
}
.catboard-document-actions .catboard-document-edit {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin: 0 0 0 auto;
}
.catboard-document-actions .catboard-btn {
	padding: 2rem 5rem;
	border-radius: 1.2rem;
	border: 1px solid #DDD;
	background: #F8F8F8;
	color: #767676;
	font-size: 1.8rem;
	font-weight: 400;
}
.catboard-document-actions .catboard-btn-list {
	background: #2187C8;
	color: #FFF;
	border: 0;
}
.catboard-document-actions .catboard-btn-danger {
	background: #F16D8E;
	color: #FFF;
	border: 0;
}
.catboard-list-empty {
	padding: 3rem;
}
.catboard-post .catboard-list-item {
	border-radius: 1.2rem;
}
.catboard-post .catboard-list-item.active {
	background: #F8F8F8;
}
@media screen and (max-width: 1024px) {
	.catboard-document-header .catboard-document-title {
		font-size: 2rem;
	}
	.catboard-attachments {
		gap: 1rem 5rem;
		flex-direction: column;
	}
}
@media screen and (max-width: 767px) {
	.catboard-post {
		gap: 2rem;
	}
	.catboard-document-header {
		padding: 3rem;
		gap: 2rem;
	}
	.catboard-document-header .catboard-document-meta {
		gap: 2rem;
	}
	.catboard-document-header .catboard-document-meta span {
		gap: 2rem;
	}
	.catboard-document-header .share-buttons #print-btn {
		display: none;
	}
	.catboard-document-content {
		padding: 3rem;
	}
	.catboard-attachments {
		padding: 3rem;
		gap: 1rem 3rem;
	}
	.catboard-attachments .catboard-attachments-title {
		font-size: 1.6rem;
	}
	.catboard-comments {
		padding: 3rem;
		gap: 2rem;
	}
	.catboard-comments .catboard-comments-title {
		font-size: 1.6rem;
	}
	.catboard-comments > *:not(:last-child) {
		padding-bottom: 2rem;
	}
	.catboard-comment-text button {
		padding: 2rem;
		font-size: 1.6rem;
	}
	.catboard-adjacent .catboard-adjacent-item {
		padding: 1rem 3rem;
		font-size: 1.6rem;
	}
	.catboard-document-actions .catboard-btn {
		padding: 1rem 3rem;
		font-size: 1.6rem;
	}
	.catboard-document-header .catboard-document-meta-wrap {
		justify-content: center;
		gap: 2rem;
	}
	.catboard-adjacent {
		padding: 3rem;
		flex-direction: column;
		align-items: start;
		gap: 3rem;
	}
	.catboard-adjacent .catboard-adjacent-item {
		padding: 0;
		width: 100%;
		flex: 1 1 100%;
		max-width: 100%;
	}
	.catboard-adjacent .catboard-adjacent-item.prev {
		padding-right: 0;
		padding-bottom: 3rem;
	}
	.catboard-adjacent .catboard-adjacent-item.prev::after {
		top: unset;
		transform: unset;
		bottom: 0;
		width: 100%;
		height: 1px;
	}
	.catboard-adjacent .catboard-adjacent-item.next {
		flex-direction: row;
		margin-left: unset;
	}
	.catboard-comment-text {
		flex-direction: column;
	}
	.catboard-comment-text button {
		padding: 1rem;
		font-size: 1.6rem;
		width: 10rem;
		height: 6rem;
	}
	.catboard-comment-form-footer,
	.catboard-comment-inline-actions {
		align-self: end;
	}
	.catboard-comment-reply-form,
	.catboard-comment-reply {
		margin-top: 0;
	}
}

/* ------------------------------------------------------------------ */
/* 게시글 작성페이지 */
/* ------------------------------------------------------------------ */
.catboard-editor form,
.catboard-editor-wrap {
	display: flex;
	flex-direction: column;
	gap: 5rem;
}
.catboard-editor-section {
	display: flex;
	flex-direction: column;
	gap: 3rem;
}
.catboard-editor-row {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.catboard-editor-label {
	color: #181818;
	font-size: 1.6rem;
	font-weight: 400;
}
.catboard-editor-wrap input[type=file]::file-selector-button {
	padding: 1rem 3rem;
	border-radius: 0.8rem;
	background:#585858;
	color: #FFF;
	font-size: 1.4rem;
	font-weight: 400;
	border: 0;
}
.catboard-editor-row .catboard-file-field-row {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}
.catboard-editor-row button {
	padding: 1rem 3rem;
    border-radius: 0.8rem;
    width: 14rem;
    border: 1px solid #DDD;
    background: #F8F8F8;
    color: #767676;
    font-size: 1.8rem;
    font-weight: 400;
    margin-top: 1rem;
}
.catboard-file-field-label {
	color: #767676;
	font-size: 1.4rem;
	font-weight: 400;
}
.catboard-file-field-section {
	display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}
.catboard-file-field-section label {
	font-size: 1.4rem;
}
.catboard-editor-wrap .catboard-required {
	color: #005AED;
}
.catboard-file-fields {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.catboard-file-field-row,
.catboard-file-list-item {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex-wrap: wrap;
}
.catboard-file-delete-btn,
.catboard-file-add-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 3.6rem;
	padding: 0.8rem 1.4rem;
	border: 1px solid #DDD;
	border-radius: 0.8rem;
	background: #F8F8F8;
	color: #2C2C2C;
	font-size: 1.4rem;
	line-height: 1.2;
}
.catboard-file-delete-btn {
	color: #FF2744;
}
.catboard-file-add-btn:disabled,
.catboard-file-delete-btn:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}
.catboard-wrap .note-modal-footer {
	padding-top: 1.2rem;
	margin-bottom: 2.2rem;
}
.catboard-wrap .note-modal-footer .note-btn {
	margin-bottom: 0;
}
.catboard-wrap .note-link-protocol {
	display: none;
}
.catboard-editor-actions {
	display: flex;
	justify-content: center;
	gap: 1rem;
	margin-top: 5rem;
}
.catboard-editor-actions .catboard-btn {
	padding: 2rem 5rem;
	border-radius: 1.2rem;
	border: 1px solid #DDD;
	background: #F8F8F8;
	color: #767676;
	font-size: 1.8rem;
	font-weight: 400;
}
.catboard-editor-actions button.catboard-btn {
	border: 0;
	background: #2C2C2C;
	color: #FFF;
}
@media screen and (max-width: 767px) {
	.catboard-editor form,
	.catboard-editor-wrap {
		gap: 3rem;
	}
	.catboard-editor-section {
		gap: 2rem;
	}
	.catboard-editor-row .catboard-file-field-row {
		flex-direction: column;
		align-items: start;
	}
	.catboard-editor-wrap input[type=file]::file-selector-button {
		padding: 1rem 2rem;
	}
	.catboard-editor-row button {
		padding: 1rem 2rem;
		font-size: 1.6rem;
	}
	.catboard-editor-actions {
		margin-top: 3rem;
	}
	.catboard-editor-actions .catboard-btn {
		padding: 1rem 3rem;
		font-size: 1.6rem;
	}
}
@media screen and (max-width: 400px) {
	.catboard-wrap input[type="text"],
	.catboard-wrap input[type="number"],
	.catboard-wrap input[type="password"],
	.catboard-wrap input[type="datetime-local"] {
		width: 100%;
	}
}

/* ------------------------------------------------------------------ */
/* 최신글 모아보기 */
/* ------------------------------------------------------------------ */
.catboard-latest-title {
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 8px;
	padding-bottom: 8px;
	border-bottom: 2px solid #333;
}
.catboard-latest-list {
	list-style: none;
	margin: 0;
	padding: 0;
	border-radius: 0.8rem;
	border: 1px solid #E7E7E7;
	overflow: hidden;
}
.catboard-latest-item {
	display: flex;
	align-items: center;
	gap: 1rem;
	border-bottom: 1px solid #E7E7E7;
    padding: 3rem 5rem;
    color: #1D1D1E;
    font-size: 1.8rem;
    font-weight: 600;
    background: #FFF;
    transition: 0.3s;
}
.catboard-latest-item:last-of-type {
	border: 0;
}
.catboard-latest-board {
	flex-shrink: 0;
	padding: 1px 6px;
	background: #f0f3f6;
	color: #456;
	font-size: 11px;
	border-radius: 2px;
}
.catboard-latest-link {
	flex: 1;
	min-width: 0;
}
.catboard-latest-link p {
	margin: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
    color: #181818;
    transition: 0.3s;
}
.catboard-latest-date {
	flex-shrink: 0;
	color: #767676;
	font-size: 1.6rem;
	font-weight: 400;
}
.catboard-latest-empty {
	padding: 24px 0;
	text-align: center;
	color: #aaa;
	font-size: 13px;
}
.catboard-latest-item:hover {
	background: #2C2C2C;
}
.catboard-latest-item:hover p {
	text-decoration: none;
}
.catboard-latest-item:hover p,
.catboard-latest-item:hover .catboard-latest-date {
	color: #FFF;
}
@media screen and (max-width: 767px) {
	.catboard-latest-item {
		flex-direction: column;
		align-items: start;
		padding: 2rem 3rem;
	}
	.elementor .main-news .catboard-latest-item a {
		width: 100%;
	}
}

/* ------------------------------------------------------------------ */
/* 알림/오류 메시지 */
/* ------------------------------------------------------------------ */
.catboard-notice {
	padding: 10px 14px;
	margin-bottom: 12px;
	border-radius: 3px;
	font-size: 13px;
	border-left: 4px solid;
}
.catboard-notice-error   { background: #fde; border-color: #e74c3c; color: #a00; }
.catboard-notice-success { background: #efe; border-color: #27ae60; color: #070; }
.catboard-notice-info    { background: #eef; border-color: #2980b9; color: #025; }
/* ------------------------------------------------------------------ */
/* 비밀글 */
/* ------------------------------------------------------------------ */
.catboard-lock-icon {
	font-size: 12px;
	flex-shrink: 0;
}
.catboard-password-gate {
	border-top: 2px solid #333;
	padding: 48px 16px;
	text-align: center;
}
.catboard-password-gate-icon {
	font-size: 36px;
	margin-bottom: 8px;
}
.catboard-password-gate-msg {
	color: #555;
	font-size: 14px;
	margin: 0 0 16px;
}
.catboard-password-form {
	display: inline-flex;
	gap: 6px;
	margin-bottom: 12px;
}
.catboard-password-form input[type="password"] {
	padding: 7px 10px;
	border: 1px solid #d0d5dd;
	border-radius: 6px;
	font-size: 13px;
	width: 200px;
}
.catboard-password-gate .catboard-btn {
	display: inline-flex;
}

.catboard-like {
	display: flex;
	justify-content: center;
	margin-top: 5rem;
}
.catboard-like-button {
	display: flex;
	flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    padding: 3rem;
    background: #fff;
    color: inherit;
    cursor: pointer;
    border-radius: 1.2rem;
    border: 1px solid #E7E7E7;
}
.catboard-like-button:disabled {
	cursor: wait;
	opacity: 0.65;
}
.catboard-like-wrap {
	display: flex;
    align-items: center;
    gap: 0.5rem;
}
.catboard-like-icon {
	display: block;
	width: 2.1rem;
    height: auto;
}
.catboard-like-label {
	color: #888;
    font-size: 1.8rem;
    font-weight: 600;
}
.catboard-like-count {
	color: #F16D8E;
    font-size: 1.8rem;
    font-weight: 600;
	word-break: break-all;
}
@media screen and (max-width: 767px) {
	.catboard-like-button {
		padding: 2rem;
	}
	.catboard-like-icon {
		width: 1.8rem;
	}
	.catboard-like-label,
	.catboard-like-count {
		font-size: 1.6rem;
	}
}

/* ------------------------------------------------------------------ */
/* 첨부파일 개인정보 수집 동의 팝업                                    */
/* ------------------------------------------------------------------ */
.catboard-consent-modal[hidden] {
	display: none;
}
.catboard-consent-modal {
	position: fixed;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 100000;
}
.catboard-consent-modal .catboard-consent-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.55);
}
.catboard-consent-modal .catboard-consent-dialog {
	--cbc-accent: #E8748C;
    --cbc-accent-weak: #FDEEF0;
    --cbc-required: #4A90D9;
    --cbc-field-bg: #F7F7F7;
    --cbc-field-border: #E5E5E5;
    --cbc-text: #222;
    --cbc-muted: #666;
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    padding: 8rem 5rem 5rem;
    color: var(--cbc-text);
    border-radius: 3.6rem;
    border: 1px solid #E7E7E7;
    background: #FFF;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
    width: min(700px, calc(100% - 32px));
    max-height: calc(100vh - 64px);
	display: flex;
    flex-direction: column;
}
.catboard-consent-modal .catboard-consent-dialog .inner {
	overflow-y: auto;
    padding-right: 2rem;
}
/* 전체 스크롤바의 너비 */
.catboard-consent-modal .catboard-consent-dialog .inner::-webkit-scrollbar {
	width: 4px;
}
/* 스크롤바의 배경색 */
.catboard-consent-modal .catboard-consent-dialog .inner::-webkit-scrollbar-track {
	background: rgba(211, 211, 211, 0.11);
	border-radius: 5rem;
}
/* 스크롤바의 손잡이 부분 */
.catboard-consent-modal .catboard-consent-dialog .inner::-webkit-scrollbar-thumb {
	background: #6D6D6D;
	border-radius: 5rem;
}
.catboard-consent-modal .catboard-consent-dialog input[type="checkbox"] {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	display: block;
	width: 20px;
	height: 20px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	border: none;
	cursor: pointer;
}
.catboard-consent-modal .catboard-consent-dialog input[type="checkbox"] {
	background-image: url(img/check-icon.svg);
}
.catboard-consent-modal .catboard-consent-dialog  input[type="checkbox"]:checked {
	background-image: url(img/checked-icon.svg);
}
.catboard-consent-modal .catboard-consent-close {
	position: absolute;
    top: 2rem;
    right: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--cbc-muted);
    font-size: 32px;
    font-weight: 400;
    line-height: 24px;
    cursor: pointer;
}
.catboard-consent-modal .catboard-consent-title {
	color: #1D1D1E;
    text-align: center;
    font-size: 2.8rem;
    font-weight: 600;
    margin: 0 0 3rem;
}
.catboard-consent-modal .catboard-consent-shortcode {
	margin: 0 0 3rem;
    color: #666;
    font-size: 1.6rem;
    font-weight: 400;
}
.catboard-consent-modal .catboard-consent-notice-lead {
	margin: 0 0 20px;
}
.catboard-consent-modal .catboard-consent-notice-heading {
	margin: 3rem 0 0;
    color: #666;
    font-size: 1.8rem;
    font-weight: 600;
}
.catboard-consent-modal .catboard-consent-notice p {
	margin: 0;
}
.catboard-consent-modal .catboard-consent-notice-list {
	margin: 4px 0 0;
	padding-left: 18px;
	list-style: disc;
}
.catboard-consent-modal .catboard-consent-notice-list li {
	margin: 0;
	list-style: disc;
}
.catboard-consent-modal .catboard-consent-notice strong {
	font-weight: 700;
}
.catboard-consent-modal .catboard-consent-form {
	position: relative;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 5rem;
}
.catboard-consent-modal .catboard-consent-agree {
	display: flex;
    align-items: center;
    gap: 1rem;
    cursor: pointer;
    color: #1D1D1E;
    font-size: 1.8rem;
}
.catboard-consent-modal .catboard-consent-wrap {
	display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.catboard-consent-modal .catboard-consent-field {
	display: grid;
    grid-template-columns: 84px 1fr;
    align-items: center;
    column-gap: 2rem;
}
.catboard-consent-modal .catboard-consent-field > label {
	text-align: left;
    color: #1D1D1E;
    font-size: 1.8rem;
    font-weight: 600;
}
.catboard-consent-modal .catboard-consent-required {
	color: var(--cbc-required);
}
.catboard-consent-modal .catboard-consent-field > input {
	box-sizing: border-box;
    width: 100%;
    height: 8rem;
    padding: 2rem;
    color: #666;
    font-size: 15px;
    border-radius: 1.2rem;
    border: 1px solid #E7E7E7;
    background: #F8F8F8;
}
.catboard-consent-modal .catboard-consent-field > input:focus {
	outline: 1px solid color-mix(in srgb, #666 35%, transparent);
}
.catboard-consent-modal .catboard-consent-error {
	margin: 0;
	color: #d9534f;
	font-size: 1em;
	line-height: 1.4;
}
.catboard-consent-modal .catboard-consent-submit {
	display: block;
    box-sizing: border-box;
    width: 18rem;
    height: 6.9rem;
    margin: 0 auto;
    padding: 0;
    cursor: pointer;
    border-radius: 1.2rem;
    border: 1px solid #FAC4C1;
    background: #FFF3F2;
    color: #F16D8E;
    text-align: center;
    font-size: 1.8rem;
    font-weight: 400;
}
.catboard-consent-modal .catboard-consent-submit:hover {
	border-radius: 1.2rem;
	background: #F16D8E;
	color: #FFF;
}
.catboard-consent-modal .catboard-consent-submit:disabled {
	opacity: 0.6;
	cursor: wait;
}
@media screen and (max-width: 767px) {
	.catboard-attachments {
		box-sizing: border-box;
		flex-direction: column;
		width: 100%;
		max-width: 100%;
	}
	.catboard-attachments .catboard-attachment-wrap,
	.catboard-attachments .catboard-attachment-item {
		width: 100%;
		min-width: 0;
	}
	.catboard-attachments .catboard-attachment-item {
		overflow-wrap: anywhere;
		word-break: break-word;
	}
	.catboard-consent-modal .catboard-consent-title {
		font-size: 2.2rem;
		margin: 0 0 2rem;
	}
	.catboard-consent-modal .catboard-consent-notice-heading {
		margin: 2rem 0 0;
		font-size: 1.6rem;
	}
	.catboard-consent-modal .catboard-consent-shortcode {
		margin: 0 0 2rem;
		font-size: 1.4rem;
	}
	.catboard-consent-modal .catboard-consent-agree,
	.catboard-consent-modal .catboard-consent-field > label,
	.catboard-consent-modal .catboard-consent-submit {
		font-size: 1.6rem;
	}
	.catboard-consent-modal .catboard-consent-form {
		gap: 3rem;
	}
	.catboard-consent-modal .catboard-consent-field > input {
    	height: 6rem;
	}
	.catboard-consent-modal .catboard-consent-dialog {
		width: calc(100% - 32px);
		padding: 2rem;
	}
	.catboard-consent-modal .catboard-consent-dialog .inner {
		padding: 5rem 0;
	}
	.catboard-consent-modal .catboard-consent-field {
		grid-template-columns: 1fr;
		row-gap: 6px;
	}
}