@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,100..900;1,100..900&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap');
@font-face {
    font-family: 'S-CoreDream';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-1Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: 'S-CoreDream';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-3Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'S-CoreDream';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-4Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'S-CoreDream';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-5Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'S-CoreDream';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-6Bold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'S-CoreDream';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-7ExtraBold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'S-CoreDream';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-8Heavy.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}
@font-face {
    font-family: 'S-CoreDream';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-9Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

/* 초기화 */
*, *::before, *::after { margin: 0; padding: 0; font: inherit; color: inherit; outline: none; box-sizing: border-box; }
header, footer, section, article, aside, nav, main, hr, figure, figcaption, details, summary { display: block; }
address, em, i, cite, dfn, var { font-style: normal; }
mark, ins { background: none; color: inherit; }
blockquote, q { quotes: none; }
pre, kbd, samp, code { font: inherit; }
ul, ol { list-style: none; }
table { border-collapse: collapse; width: 100%; }
img { vertical-align: top; }
fieldset { border: none; }
input, textarea, select, button { font: inherit; color: inherit; border: none; background: none; appearance: none; -webkit-appearance: none; -moz-appearance: none; vertical-align: top; }
html { overflow: hidden scroll; }
html.scroll-none { overflow-y: hidden; }
@supports (scrollbar-gutter: stable) {
    html { scrollbar-gutter: stable; }
}
body { font-size: 1rem; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
h1, h2, h3, h4, h5, h6, th, dt { font-weight: inherit; }
strong, b { font-weight: 600; }
small { font-size: 0.875em; }
a { text-decoration: none; color: inherit; }
hr { width: 100%; height: 1px; border: none; }
textarea { resize: vertical; min-height: 160px; }
[type=button], [type=submit], label { cursor: pointer; }

/* ======================================================
   gnuboard
====================================================== */
/* 팝업레이어 */
#hd_pop h2 { clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; width: 1px; height: 1px; margin: -1px; padding: 0; position: absolute; overflow: hidden; }

/* 게시물 선택복사 선택이동 */
.copymove_currentbg { background-color: #f6f6f6; }
.copymove_current { font-size: 0.75rem; background-color: rgba(var(--theme-rgb),0.6); color: #fff; border-radius: 0.3rem; padding: 0.4em 0.6em; margin-left: 1em; }

/* 화면낭독기 사용자용 */
legend, .sound_only, .msg_sound_only, #hd_login_msg { clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; width: 1px; height: 1px; margin: -1px; padding: 0; position: absolute; overflow: hidden; }

/* ie6 이미지 너비 지정 */
.img_fix { width: 100%; height: auto; }

/* 캡챠 자동등록(입력)방지 기본 -pc */

/* 캡챠 자동등록(입력)방지 기본 - mobile */

/* ckeditor 단축키 */
.cke_sc { display: none; }

/* 버튼 */
.btn { display: inline-flex; justify-content: center; align-items: center; line-height: 1; gap: 0.5em; transition: 0.4s; }
.btn_submit, .btn_cancel { border-radius: 0.5rem; }
.btn_submit { border: 1px solid var(--theme); background-color: var(--theme); color: #fff; }
.btn_cancel { border: 1px solid #ccc; color: #666; }
.btn_confirm { height: 3em; display: grid; justify-content: center; margin-top: 3rem; gap: 0.5em; grid-template-columns: repeat(auto-fit, minmax(180px, auto)); }

/* 기본테이블 */
.tbl_wrap { font-size: 0.9375rem; }
.tbl_wrap caption { font-size: 0.875em; text-align: left; padding: 0.625em 0; }
.tbl_wrap table { border-top: 1px solid #ececec; }
.tbl_wrap tr { border-bottom: 1px solid #ececec; }

.tbl_head01 table { text-align: center; }
.tbl_head01 th { padding: 1.125em 0.625em; }
.tbl_head01 td { padding: 1em 0.625em; color: #666; }
.tbl_head01 a:hover { text-decoration: underline; }

/* 폼 테이블 */

/* 기본 리스트 */

/* 폼 리스트 */

/* 자료 없는 목록 */
.empty_list, .empty_table { padding: 6rem 0; text-align: center; width: 100%; color: #888; grid-column: 1 / -1; }

/* 필수입력 */
.required, textarea.required {background-image:url('../img/require.png') !important;background-repeat:no-repeat !important;background-position:right top !important}

/* 테이블 항목별 정의 */
.td_chk { width: 1.875rem; position: relative; text-align: center; }
.td_chk input { appearance: auto; -webkit-appearance: auto; }
.td_board { width: 5rem; }
.td_category { width: 5rem; }
.td_date { width: 3.75rem; }
.td_datetime { width: 6.875rem; }
.td_group { width: 5rem; }
.td_mb_id { width: 6.25rem; }
.td_mng { width: 5rem; }
.td_name { width: 6.25rem; }
.td_nick { width: 6.25rem; }
.td_num { width: 3.125rem; }
.td_num2 { width: 4rem; }
.td_numbig { width: 5rem; }
.td_stat { width: 3.75rem; }
.td_hp { width: 12rem; }
.td_company { width: 10rem; }
.td_subject { text-align: left; line-height: 1.4; }

/* 새창 기본 스타일 */
.new_win #win_title { font-size: 1.125rem; font-weight: 700; padding: 1rem 1.25rem;  box-shadow:0 0.125rem 0.625rem rgba(0,0,0,0.1) }
.new_win .tbl_wrap { margin: 1rem; }
.new_win .win_btn { margin: 1rem; height: 2.8em; display: grid; justify-content: center; gap: 0.5em; grid-template-columns: repeat(2, 1fr); }

/* 검색결과 색상 */

/* 자바스크립트 alert 대안 */

/* 사이드뷰 */

/* 페이징 */
.pg_wrap { margin-top: 3rem; }
.pg_wrap .pg { display: flex; justify-content: center; align-items: center; gap: 0.25rem; }
.pg_page, .pg_current { font-size: 1em; width: 2.5em; height: 2.5em; display: inline-flex; justify-content: center; align-items: center; border-radius: 999px; font-weight: 600; -webkit-transition: 0.3s;-moz-transition: 0.3s;-ms-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s; }
.pg_page { color: #888; }
.pg_start, .pg_prev, .pg_next, .pg_end { color: transparent !important; background: no-repeat center; opacity: 0.3; }
.pg_start { background-image: url(../img/page_start.png); }
.pg_prev { background-image: url(../img/page_prev.png); }
.pg_next { background-image: url(../img/page_next.png); }
.pg_end { background-image: url(../img/page_end.png); }
.pg_page:hover { background-color: #eee; color: #000; opacity: 1; }
.pg_current { background-color: #000; color: #fff; }

/* cheditor 이슈 */

/* Mobile화면으로 */


/* ==============================================
    기본스타일
 ============================================== */
/* 체크박스 */
.selec_chk { clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; width: 1px; height: 1px; margin: -1px; padding: 0; position: absolute; overflow: hidden; }
.chk_box label { font-size: 0.875em; display: inline-flex; align-items: center; gap: 0.25em; cursor: pointer; }
.chk_box label span { display: inline-block; width: 1.375em; height: 1.375em; border: 1px solid #d3d3d3; background-color: #fff; margin-top: 1px; }
.chk_box label:hover { color: var(--theme); }
.chk_box label:hover span { border-color: var(--theme); }
.chk_box [type=radio] + label span { border-radius: 999px; }
.chk_box [type=radio]:checked + label span { border-width: 0.375em; border-color: var(--theme); background: #fff; }
.chk_box [type=checkbox] + label span { border-radius: 0.3em; }
.chk_box [type=checkbox]:checked + label span { background: var(--theme) url('../img/chk.png') no-repeat center; border-color: var(--theme); }

/* 파일 */
[type=file] { font-size: 0.9375em; }
::file-selector-button,
::-webkit-file-upload-button { font-size: 0.875em; border: 1px solid #ccc; color: #666; background-color: #f5f5f5; padding: 0.2em 0.6em; border-radius: 0.3em; vertical-align: middle; }

/* 폼 스타일 */
.field_style, textarea { width: 100%; border: 1px solid #ddd; -webkit-border-radius: 0.5em;-moz-border-radius: 0.5em; border-radius: 0.5em; padding: 0.425em 0.625em; }
.write_field { display: flex; min-height: 2.8em; margin-bottom: 0.625em; }
.write_field input { flex-grow: 1; }
.write_field-option { min-height: auto; flex-wrap: wrap; gap: 0.5em 0.5em; padding: 0.5em 0;}
.write_field-option ul { display: flex; justify-content: flex-start; align-items: center; gap: 0.75em; }
.write_field-content { display: block; }
.write_field-media { gap: 0.5em; }
.write_field-media .chk_box-del { font-size: 0.875em; flex-shrink: 0; align-self: center; }
.write_field_icon { flex-shrink: 0; font-size: 1.25em; color: #bbb; text-align: center; align-self: center; }

/* ==============================================
    board
 ============================================== */
/* 사용자 버튼 */
.btn_bo_user { display: flex; justify-content: flex-start; align-items: center; gap: 0.25em; }
.btn_bo_user > li { position: relative; }
.btn_bo_user .btn { font-size: 1em; width: 2em; height: 2em; color: #bababa; border-radius: 0.4em; }
.btn_bo_user .btn:hover { color: #000; background-color: #f5f5f5; }
.btn_bo_user .btn_admin { color: #d13f4a; }
.btn_bo_user .btn_admin:hover { color: #ff3746; }
.more_opt { position: absolute; right: 0; top: 100%; white-space: nowrap; z-index: 999; border: 1px solid #dedede; border-radius: 0.5rem; overflow: hidden; margin-top: 0.25em; display: none; background-color: #fff; }
.more_opt li { font-size: 0.75em; color: #777; -webkit-transition: 0.3s;-moz-transition: 0.3s;-ms-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s; }
.more_opt li:hover { color: #000; background-color: #f5f5f5; }
.more_opt a, .more_opt button { padding: 0.5em; display: inline-flex; justify-content: center; align-items: center; gap: 0.25em; }

/* 목록 타이틀 */
.bo_title_box { margin-bottom: 3rem; }
.bo_title { font-size: 4.25em; color: #222; font-weight: 600;  }
.bo_title_desc { font-size: 1.125em; line-height: 1.3; color: #666; margin-top: 1rem; }

/* 목록 카테고리 */
.bo_category { margin-bottom: 2rem; }
.bo_category_list { display: flex; justify-content: flex-start; align-items: center; gap: 0.625em; }
.bo_category_item { -webkit-border-radius: 999px;-moz-border-radius: 999px;border-radius: 999px; border: 1px solid #dedede; color: #999; -webkit-transition: 0.3s;-moz-transition: 0.3s;-ms-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;  }
.bo_category_link { font-size: 1em; font-weight: 500; display: inline-flex; line-height: 1; padding: 0.625em 1.125em; }
.bo_category_item:hover { border-color: var(--theme); color: var(--theme); }
.bo_category_item.is-active { border-color: var(--theme); background-color: var(--theme); color: #fff; }

/* 목록 상단 */
.bo_list_top { display: flex; margin-bottom: 1.5rem; align-items: center; justify-content: space-between; }
.bo_list_total { font-size: 0.9375em; }
.bo_list_total b { color: var(--theme); font-size: 1.125em; font-weight: 800; }

/* 목록 링크 */
.bo_link { color: #000; font-weight: 500; }

/* 상세 */
.bo_title_box-view { margin-bottom: 1rem; }
.bo_title-view { font-size: 3em; }

.bo_view_top { display: flex; align-items: center; justify-content: flex-end; }

.bo_view_content { border-top: 1px solid #dedede; padding: 2rem 0; }
.bo_view_content img { max-width: 100%; margin-bottom: 1.5rem; }
.bo_view_ratio { width: 80%; aspect-ratio: 16/9; -webkit-border-radius: 1rem;-moz-border-radius: 1rem;border-radius: 1rem; overflow: hidden; margin: auto; }
.bo_view_ratio iframe { width: 100%; height: 100%; object-fit: cover; }

.bo_view_list { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem 1rem; }
.bo_view_list .full { grid-column: 1 / -1; }
.bo_view_list h5 { font-weight: 600; margin-bottom: 0.875rem; color: #777; }
.bo_view_list div { min-height: 3em; padding: 0.75rem 1rem; background-color: #f7f7f7; border-radius: 0.75rem; line-height: 1.4; }
.bo_view_list li:last-child div { min-height: 10rem; }

.bo_view_contact { text-align: center; margin-top: 3rem; }
.bo_view_contact_btn { font-size: 1.125em; -webkit-border-radius: 999px;-moz-border-radius: 999px;border-radius: 999px; display: inline-flex; gap: 0.5em; font-weight: 500; color: #fff; padding: 0.875em 2em; background-color: var(--theme); }
.bo_view_contact_btn:hover { background-color: #000; }

/* 갤러리형 */
.gallery_allchk { margin-bottom: 1rem; }
.gallery_list { display: grid; grid-template-columns: repeat(3, 1fr); justify-content: start; gap: 3.5rem 2.5rem; }
.gallery_item { position: relative; }
.gallery_item .chk_box { position: absolute; top: 0; right: 0; margin: 0.875em; }
.gallery_link { display: block; }
.gallery_thumb { width: 100%;  aspect-ratio: 16/9; -webkit-border-radius: 1rem;-moz-border-radius: 1rem;border-radius: 1rem; overflow: hidden; }
.gallery_thumb img { transition: transform 0.3s; }
.gallery_thumb img,
.gallery_thumb iframe { width: 100%; height: 100%; object-fit: cover; }
.gallery_thumb:hover img { transform: scale(1.2); }
.gallery_tags { position: absolute; top: 0; left: 0; margin: 0.75rem 0.875rem; gap: 0.5em; display: flex; justify-content: flex-start; align-items: center; }
.gallery_tags span { font-size: 0.8125em; height: 1.8em; line-height: 1; padding: 2px 1em 0; border-radius: 999px; backdrop-filter: blur(0.4em); background-color: rgba(0,0,0,0.3); color: #fff;  font-weight: 500; box-shadow: 0.05em 0.05em 0.3em rgba(0,0,0,0.25); display: inline-flex; justify-content: center; align-items: center; }
.gallery_caption { margin-top: 1.25em; display: flex; align-items: center; justify-content: space-between; gap: 0.5em; }
.gallery_subject { font-size: 1.5em; line-height: 1.3; font-weight: 600; transition: 0.3s; }
.gallery_subject:hover { color: var(--theme); }
.gallery_arrow { flex-shrink: 0; font-size: 1.4em; border: 1px solid #000; display: inline-flex; justify-content: center; align-items: center; -webkit-border-radius: 999px;-moz-border-radius: 999px;border-radius: 999px; width: 1.5em; height: 1.5em; transition: 0.3s; }
.gallery_arrow:hover { background-color: #000; color: #fff; }
.gallery_arrow i { margin-top: -2px; margin-right: -2px; }