@charset "utf-8";

#board label { margin-bottom: 0; }

#board .board_header { border-bottom: 2px solid var(--light-gray); }
@media(max-width:990px){
    #board .board_header { padding-bottom: 1rem; }   
}

/* 목록형 */
#board .board-table { margin: 1rem 0; border-spacing: 0; }
#board .board-table thead th, #board .board-table tbody td { padding: 1.25rem .75rem; }
#board .board-table thead th { background-color: #fff; color: var(--textcolor); font-weight: 600; border-top: 1px solid var(--light-gray); border-bottom: 1px solid var(--light-gray); text-align: center; }
#board .board-table tbody td { color: var(--textcolor); background-color: transparent; border-bottom: 1px solid var(--light-gray); transition: .3s; }
#board .board-table tbody tr:nth-child(2n) td { background-color: #f9f9f9; }
#board .board-table tbody tr:hover td { background-color: #f2f5fc; }
#board .board-table tbody tr.notice td { font-weight: 700; }
#board .board-table tbody tr.notice td, #board .board-table tbody tr.notice td a { color: var(--pointcolor); }
#board .board-table tbody td span.stat { display: inline-block; padding: .5rem 1.25rem; border-radius: 1.5rem; background-color: var(--gray); color: #fff; }
#board .board-table tbody td span.stat.complete { background-color: var(--pointcolor); }
#board .board-table tbody td .fa-lock { color: var(--pointcolor); margin-right: .5rem; }
@media(max-width:990px){
    #board .board-table-container { width: 100%; overflow-x: auto; white-space: nowrap; }
    #board .board-table-container colgroup { display: none; }
    #board .board-table thead th, #board .board-table tbody td { padding: 1.25rem 1rem; }
}

/* 갤러리 */
#board .galleryList { margin: 2rem 0; --y-gap: 3rem; }
#board .galleryList li .img { position: relative; }
#board .galleryList li .gall_chk { position: absolute; top: .75rem; left: .75rem; z-index: 5; }
#board .galleryList li .gall_chk input[type=checkbox] { transform: scale(1.25); accent-color: var(--pointcolor); }
#board .galleryList li .img a { position: relative; display: block; border-radius: .5rem; overflow: hidden; }
#board .galleryList li .img .gallery-label { position: absolute; width: 100%; bottom: 0; left: 0; right: 0; background-color: var(--pointcolor); padding: 1rem 1.25rem; }
#board .galleryList li .img .gallery-label span { opacity: .8; }
#board .galleryList li .img .gallery-label img { max-width: 100px; }
#board .galleryList li .img.productImg { position: relative; width: 100%; height: auto; aspect-ratio: 1/1; }
#board .galleryList li .img.productImg::before { position: absolute; content: ''; width: 100%; height: 50%; bottom: 0; left: 0; background-color: #f0f2fb; border-radius: 0 0 1rem 1rem; }
#board .galleryList li .img.productImg img { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); object-fit: cover; max-height: 50%; }
#board .galleryList li .txt { padding: .75rem 0; }

/* 작성 - 폼 목록 */
#board .formList { --x-gap: 3rem; --y-gap: 3rem; }
#board .formList table { border-spacing: 0; }
#board .formList table th, #board .formList table td { padding: 1rem 0; }
#board .formList table tr th:not(:first-child) { padding: 1rem 0 1rem 2.5rem; }
#board .formList table th { text-align: left; }
#board .formList table th.upper { vertical-align: top; padding-top: 2rem; }
#board .formList .box > label > samp { position: relative; top: -.25rem; left: .25rem; }
#board .formList .file_label { display: inline-block; min-width: fit-content; color: #a9a9a9; padding: .75rem .5rem .75rem 1.5rem; border: 1px solid var(--gray); border-right: 0; border-radius: .5rem; }
#board .formList input[type=text],
#board .formList input[type=tel],
#board .formList input[type=password],
#board .formList input[type=file],
#board .formList select,
#board .formList textarea { padding: .75rem 1.5rem; height: auto; font-size: 1.45rem; background-color: #fff; border: 1px solid var(--gray) !important; box-shadow: none !important; border-radius: .5rem; }
#board .formList .file_label + input[type=file] { padding: .5rem 1.5rem .5rem .5rem; border-radius: 0 .25rem .25rem 0; border-left: 0 !important; }
#board .formList textarea { min-height: 150px; resize: none; }
#board .formList input[type=text]::placeholder,
#board .formList input[type=tel]::placeholder,
#board .formList input[type=password]::placeholder,
#board .formList input[type=file]::placeholder,
#board .formList textarea::placeholder { color: #a9a9a9; }
#board .formList input[type=text]:disabled,
#board .formList input[type=tel]:disabled,
#board .formList input[type=password]:disabled,
#board .formList input[type=file]:disabled,
#board .formList select:disabled,
#board .formList textarea:disabled { background-color: var(--light-gray); cursor: not-allowed; }
#board .formList .input-flex { display: flex; align-items: center; }
#board .formList .input-flex input[type=radio],
#board .formList .input-flex input[type=checkbox] { transform: scale(1.5); accent-color: var(--pointcolor); }
#board .formList .input-flex input[type=radio] + label,
#board .formList .input-flex input[type=checkbox] + label { margin-left: .5rem; }
#board .formList .etcInput { margin-left: 5%; width: 75%; }
#board .formList .emailWrap input[type=text] { width: 35%; }
#board .formList .emailWrap select { width: 25%; }
#board .formList .privacybox { border: 1px solid var(--light-gray); padding: 1.5rem; }
@media (max-width:990px){
    #board .formList table colgroup { display: none; }
    #board .formList table, #board .formList table tbody, #board .formList table tr,
    #board .formList table th, #board .formList table td { display: block; }
    #board .formList table tr th, #board .formList table tr th:not(:first-child) { padding: 1rem 0 0; }
    #board .formList .file_label { padding: 1.25rem 0 1.25rem 1rem; }
    #board .formList input[type=text],
    #board .formList input[type=tel],
    #board .formList input[type=password],
    #board .formList input[type=file],
    #board .formList select,
    #board .formList textarea { padding: 1.5rem 1.25rem; font-size: 1.7rem; }
    #board .formList .file_label + input[type=file] { padding: 1rem 1.25rem 1rem .5rem; border-radius: 0 .25rem .25rem 0; border-left: 0 !important; }
    #board .formList .input-flex input[type=radio] { transform: scale(1); }
    #board .formList .etcInput { width: 50%; }
    #board .formList .emailWrap { width: 100%; flex-wrap: wrap; }
    #board .formList .emailWrap input[type=text], #board .formList .emailWrap select { width: 47.5%; }
    #board .formList .emailWrap input[type=text]:first-child { width: 90%; margin-bottom: .5rem; }
    #board .formList .emailWrap p { width: 10%; text-align: center; }
}

/* 아코디언 박스 */
#board .accordionBox { margin: 3rem 0; }
#board .accordionBox .accordionList { border-top: 1px solid var(--light-gray); }
#board .accordionBox .accordionList li { position: relative; }
#board .accordionBox .accordionList li .chkr { position: absolute; left: 0; top: 50%; transform: translateY(-50%); }
#board .accordionBox .accordionList li .modify { position: absolute; right: 0; top: .25rem; }
#board .accordionBox .accordionList li .Question,
#board .accordionBox .accordionList li .Answer { padding: 1.5rem 2rem; border-bottom: 1px solid var(--light-gray); }
#board .accordionBox .accordionList li .Question { cursor: pointer; }
#board .accordionBox .accordionList li .Question .Q_right svg { transition: .3s; transform: rotate(0); }
#board .accordionBox .accordionList li .Question.active .Q_right svg { transform: rotate(180deg); }
#board .accordionBox .accordionList li .Answer { display: none; background-color: #edf1fd; }
#board .accordionBox .accordionList li .Q_left,
#board .accordionBox .accordionList li .A_left { width: 7.5%; }
#board .accordionBox .accordionList li .Q_right,
#board .accordionBox .accordionList li .A_right { width: 90%; }
@media (max-width:990px){
    #board .accordionBox .accordionList li .Question { align-items: flex-start; }
    #board .accordionBox .accordionList li .Q_left { width: 12.5%; }
    #board .accordionBox .accordionList li .Q_right { width: 85%; }
    #board .accordionBox .accordionList li .Q_right h2 { max-width: 90%; }
    #board .accordionBox .accordionList li .A_left { display: none; }
    #board .accordionBox .accordionList li .A_right { width: 95%; display: block; }
    #board .accordionBox .accordionList li .Q_right samp,
    #board .accordionBox .accordionList li .A_right samp { display: block; width: 100%; margin-bottom: .5rem; font-size: 2rem; line-height: 1; }
    #board .accordionBox .accordionList li .Q_right samp + *,
    #board .accordionBox .accordionList li .A_right samp + * { margin-left: 0; }
}


/* 분류 탭 */
#board #bo_cate_tabs { display: flex; align-items: center; gap: 0 .25rem; }
#board #bo_cate_tabs li a { display: inline-block; padding: 1rem 3rem; color: var(--titlecolor); border-width: 1px 1px 0 1px; border-color: var(--light-gray); border-style: solid; border-radius: .5rem .5rem 0 0; line-height: 1; }
#board #bo_cate_tabs li.on a { background-color: var(--pointcolor); color: #fff; font-weight: 700; }
#board #bo_cate_tabs + #board_search form input[type=search] { padding: .85rem 1.5rem; min-width: 250px; }
@media (max-width:1410px){
    #board #bo_cate_tabs { gap: 0; justify-content: space-between; flex-wrap: wrap; }
    #board #bo_cate_tabs li { width: 32%; }
    #board #bo_cate_tabs li:nth-child(n+3) { margin-top: 1%; }
    #board #bo_cate_tabs li a { display: block; padding: 1.25rem 0; border-width: 1px; border-radius: .5rem; text-align: center; }
    #board #bo_cate_tabs + #board_search form input[type=search] { padding: 1.25rem 1.5rem; min-width: 150px; }
}
@media (max-width:990px){
    #board #bo_cate_tabs li { width: 49%; }
    #board #bo_cate_tabs li:nth-child(n+2) { margin-top: 1%; }
}

/* 캡차 */
#board .catchaWrap #captcha { display: inline-flex; align-items: center; }
#board .catchaWrap #captcha #captcha_mp3,
#board .catchaWrap #captcha #captcha_info { display: none; }
@media (max-width:990px){
    #board .catchaWrap { width: 100%; margin-bottom: .5rem; text-align: center; }
    #board .catchaWrap #captcha { display: block;  }
    #board  #captcha.m_captcha #captcha_img { margin: auto; }
    #board  #captcha.m_captcha audio { display: none; }
}

/* 작성 - 파일 처리 */
#board .bo_w_flie, #board .bo_w_link { position: relative; }
#board .bo_w_flie .file_wr, #board .bo_w_link .link_wr { margin: .5rem 0; padding: .5rem 1rem; border: 1px solid var(--gray); border-radius: .5rem; box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); }
#board .bo_w_flie .file_del { position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); }
#board .bo_w_flie .file_del label { color: var(--gray); }
#board .frm_input { border-color: var(--gray); }
/* 작성 - 버튼 */
#board .btn_confirm button { margin: 0 .5rem; padding: 1rem 1.5rem; font-size: 1.7rem; line-height: 1; font-weight: 600; border-radius: .5rem; color: #fff; }
#board .btn_confirm button.btn_cls { background-color: var(--gray); }
#board .btn_confirm button.btn_smt { background-color: var(--pointcolor); }
#board .viewCtrl a { display: inline-flex; padding: 1rem 2.5rem; border-radius: 3rem; }

/* 게시판 상단 / 검색 */
#board #board_search { display: inline-flex; align-items: center; }
#board #board_search form { position: relative; }
#board #board_search form input[type=search] { padding: 1rem 1.5rem; min-width: 350px; height: auto; background-color: #f6f6f6; border: none !important; box-shadow: none !important; border-radius: .5rem; }
#board #board_search form input[type=search]::placeholder { color: #7b7b7b; }
#board #board_search form button[type=submit] { position: absolute; top: 50%; right: 1rem; transform: translateY(-50%); }
@media(max-width:990px){
    #board .board_header > * { width: 100%; }
    #board #board_search form { width: 100%; display: flex; justify-content: space-between; align-items: center; margin-top: 1rem; font-size: 1.7rem; }
    #board #board_search form input[type=search] { min-width: auto; width: 100%; padding: 1.25rem 1.5rem; }
} 

/* 게시판 상단/하단 */
#board .board_footer > * { width: 33.3%; }
#board .board_footer .pg_wrap { display: inline-flex; justify-content: center; }
#board .board_footer .pg_wrap .pg > * { display: inline-flex; align-items: center; justify-content: center; min-width: 2.5rem; height: auto; aspect-ratio: 1/1; padding: 0 1rem; border-radius: .5rem; line-height: 1; font-size: 1.45rem; border: none; }
#board .board_footer .pg_wrap .pg .pg_current { background-color: transparent; color: var(--pointcolor); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 5px; }
#board .board_footer .pg_wrap .pg .pg_page { background-color: transparent; }
#board .board_footer .board_ctrl { display: flex; align-items: center; justify-content: flex-end; }
@media(max-width:990px){
    #board .board_footer > * { width: 100%; }
    #board .board_footer .board_ctrl > * { margin-left: 1rem; }
    #board .board_footer .pg_wrap .pg > * { font-size: 1.7rem; }
}