@charset "utf-8";

/* MA storefront board foundation: shared by basic, gallery and compatible board skins. */
#container #bo_w,
#container #bo_v,
#container #bo_gall {
    width:calc(100% - 40px) !important;
    max-width:1280px;
    margin:30px auto 80px;
    color:#222;
    font-family:'Pretendard Variable','Pretendard',sans-serif;
    font-size:15px;
    line-height:1.6;
    box-sizing:border-box;
}

#container #bo_w *,
#container #bo_v *,
#container #bo_gall *,
#container #bo_w *:before,
#container #bo_v *:before,
#container #bo_gall *:before,
#container #bo_w *:after,
#container #bo_v *:after,
#container #bo_gall *:after {box-sizing:border-box}

#container #bo_w ul,
#container #bo_v ul,
#container #bo_gall ul {margin:0;padding:0;list-style:none}

#container #bo_w a,
#container #bo_v a,
#container #bo_gall a {color:inherit;text-decoration:none}

#container #bo_w button,
#container #bo_w input,
#container #bo_w select,
#container #bo_w textarea,
#container #bo_v button,
#container #bo_v input,
#container #bo_v select,
#container #bo_v textarea,
#container #bo_gall button,
#container #bo_gall input,
#container #bo_gall select,
#container #bo_gall textarea {font:inherit}

/* Shared board controls */
#container #bo_w .frm_input,
#container #bo_w select,
#container #bo_v .frm_input,
#container #bo_v select,
#container #bo_v textarea,
#container #bo_gall select {
    max-width:100%;
    height:44px;
    padding:0 12px;
    border:1px solid #d9dce2;
    border-radius:0;
    background:#fff;
    color:#222;
    outline:0;
}

#container #bo_w .frm_input:focus,
#container #bo_w select:focus,
#container #bo_w textarea:focus,
#container #bo_v .frm_input:focus,
#container #bo_v select:focus,
#container #bo_v textarea:focus,
#container #bo_gall select:focus {border-color:#111}

#container #bo_w .full_input,
#container #bo_w .wr_content,
#container #bo_w .wr_content textarea,
#container #bo_w .wr_content iframe {width:100% !important}

#container #bo_w .half_input {width:calc(50% - 6px)}

#container #bo_w .selec_chk,
#container #bo_v .selec_chk,
#container #bo_gall .selec_chk {position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}

#container #bo_w .chk_box,
#container #bo_v .chk_box,
#container #bo_gall .chk_box {position:relative}

#container #bo_w .chk_box label,
#container #bo_v .chk_box label,
#container #bo_gall .chk_box label {position:relative;display:inline-flex;align-items:center;min-height:24px;padding-left:28px;color:#555;cursor:pointer}

#container #bo_w .chk_box label span,
#container #bo_v .chk_box label span,
#container #bo_gall .chk_box label span {
    position:absolute;
    top:50%;
    left:0;
    width:18px;
    height:18px;
    margin:0;
    border:1px solid #cfd3da;
    border-radius:3px;
    background:#fff;
    transform:translateY(-50%);
}

#container #bo_w .chk_box input:checked + label span,
#container #bo_v .chk_box input:checked + label span,
#container #bo_gall .chk_box input:checked + label span {border-color:#222;background:#222}

#container #bo_w .chk_box input:checked + label span:after,
#container #bo_v .chk_box input:checked + label span:after,
#container #bo_gall .chk_box input:checked + label span:after {
    position:absolute;
    left:5px;
    top:2px;
    width:5px;
    height:9px;
    border:solid #fff;
    border-width:0 2px 2px 0;
    content:"";
    transform:rotate(45deg);
}

#container #bo_w .btn,
#container #bo_v .btn,
#container #bo_gall .btn,
#container #bo_w .btn_submit,
#container #bo_w .btn_cancel,
#container #bo_v .btn_submit,
#container #bo_v .btn_cancel {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:110px;
    height:46px;
    margin:0;
    padding:0 20px;
    border:1px solid #d9dce2;
    border-radius:0;
    background:#fff;
    color:#222;
    font-size:15px;
    font-weight:400;
    line-height:44px;
    cursor:pointer;
}

#container #bo_w .btn_submit,
#container #bo_v .btn_submit {border-color:#222;background:#222;color:#fff}

#container #bo_w .btn:hover,
#container #bo_w .btn:focus,
#container #bo_v .btn:hover,
#container #bo_v .btn:focus,
#container #bo_gall .btn:hover,
#container #bo_gall .btn:focus {border-color:#111;outline:0}

/* Write, edit and reply */
#container #bo_w #fwrite {width:100% !important}
#container #bo_w .write_div {position:relative;margin:0 0 12px}
#container #bo_w .bo_w_info {display:flex;flex-wrap:wrap;gap:12px}
#container #bo_w .bo_w_info .frm_input {float:none;margin:0}
#container #bo_w .bo_v_option {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px 22px;
    min-height:46px;
    padding:10px 14px;
    border:1px solid #e1e1e1;
    background:#fafafa;
}
#container #bo_w .bo_v_option li {float:none;margin:0}
#container #bo_w .bo_w_tit .frm_input {padding-right:165px}
#container #bo_w #btn_autosave {
    position:absolute;
    top:6px;
    right:6px;
    height:32px;
    padding:0 10px;
    border:1px solid #ddd;
    background:#fafafa;
    color:#555;
    cursor:pointer;
}
#container #bo_w .wr_content textarea {
    display:block;
    min-height:360px;
    padding:14px;
    border:1px solid #d9dce2;
    border-radius:0;
    background:#fff;
    color:#222;
    line-height:1.7;
    resize:vertical;
    outline:0;
}
#container #bo_w .wr_content textarea:focus {border-color:#111}
#container #bo_w .wr_content.smarteditor2 iframe {min-height:360px;border:1px solid #d9dce2 !important;background:#fff}
#container #bo_w .bo_w_link label,
#container #bo_w .bo_w_flie .lb_icon {
    position:absolute;
    top:0;
    left:0;
    z-index:1;
    display:flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    color:#777;
}
#container #bo_w .bo_w_link .frm_input {padding-left:44px}
#container #bo_w .bo_w_flie .file_wr {
    display:flex;
    align-items:center;
    min-height:50px;
    margin:0;
    padding:6px 12px 6px 44px;
    border:1px solid #d9dce2;
    background:#fff;
}
#container #bo_w .bo_w_flie .frm_file {width:100%;padding:0;color:#555}
#container #bo_w .bo_w_flie .frm_file::file-selector-button {
    height:34px;
    margin-right:10px;
    padding:0 12px;
    border:1px solid #ccc;
    background:#fafafa;
    color:#333;
    cursor:pointer;
}
#container #bo_w .bo_w_flie .file_del {display:block;margin-top:8px;color:#777;font-size:13px}
#container #bo_w .btn_confirm {display:flex;justify-content:center;gap:8px;margin:28px 0 0;text-align:center}
#container #bo_w #autosave_pop {top:44px;right:0;max-width:calc(100vw - 30px)}

/* View and comments */
#container #bo_v {position:relative;background:#fff}
#container #bo_v > header {padding:0 0 22px;border-bottom:1px solid #222}
#container #bo_v_title {margin:0}
#container #bo_v_title .bo_v_cate {display:inline-flex;align-items:center;height:26px;margin-bottom:10px;padding:0 10px;border:1px solid #ddd;border-radius:0;background:#fff;color:#555;font-size:13px;line-height:24px}
#container #bo_v_title .bo_v_tit {display:block;margin:0;color:#111;font-size:30px;font-weight:500;line-height:1.35;word-break:keep-all}
#container #bo_v_info {position:relative;min-height:88px;margin:0;padding:18px 0;border-bottom:1px solid #e5e5e5;color:#666}
#container #bo_v_info:after {display:block;clear:both;content:""}
#container #bo_v_info .profile_info {display:flex;align-items:center;float:left;margin:0}
#container #bo_v_info .pf_img {flex:0 0 auto;margin-right:12px}
#container #bo_v_info .pf_img img {display:block;width:48px;height:48px;border-radius:50%}
#container #bo_v_info .profile_info_ct {float:none;padding:0;line-height:22px}
#container #bo_v_info strong {margin-right:10px;font-weight:400}
#container #bo_v_info .profile_info_ct > strong:first-of-type {color:#222;font-weight:500}
#container #bo_v_top {float:right}
#container #bo_v .bo_v_com {display:flex;gap:6px;float:none;margin:5px 0 0}
#container #bo_v .bo_v_com > li {float:none;margin:0}
#container #bo_v .bo_v_com .btn {min-width:40px;width:40px;height:40px;padding:0;line-height:38px}
#container #bo_v_atc {min-height:260px;padding:30px 0 10px}
#container #bo_v_share {padding:0 0 20px}
#container #bo_v_con {min-height:240px;margin:0 0 35px;color:#333;font-size:15px;line-height:1.9;word-break:break-word;overflow:hidden}
#container #bo_v_con img {max-width:100%;height:auto}
#container #bo_v_file li,
#container #bo_v_link li {min-height:56px;margin:10px 0;padding:14px;border:1px solid #e1e1e1;border-radius:0;box-shadow:none}
#container #bo_v .bo_v_nb {margin:30px 0}
#container #bo_v .bo_v_nb li {display:flex;align-items:center;min-height:48px;padding:12px 14px;border-top:1px solid #e5e5e5}
#container #bo_v .bo_v_nb li:last-child {border-bottom:1px solid #e5e5e5}
#container #bo_v .bo_v_nb .nb_date {margin-left:auto}
#container #bo_v .cmt_btn {height:52px;margin:20px 0 0;padding:0 0 14px;border:0;border-bottom:1px solid #ddd;background:#fff;font-size:16px}
#container #bo_vc article {margin:0;padding:22px 0;border-bottom:1px solid #eee}
#container #bo_vc_empty {padding:70px 0 !important;color:#888;text-align:center}
#container #bo_v .bo_vc_w {margin:22px 0 0}
#container #bo_v .bo_vc_w textarea {display:block;width:100%;height:130px;padding:12px;border:1px solid #d9dce2;border-radius:0;resize:vertical}
#container #bo_v .bo_vc_w .btn_confirm {display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}
#container #bo_v .bo_vc_w .btn_submit {margin-left:auto}

/* Gallery list */
#container #bo_gall #bo_btn_top {display:flex;align-items:center;justify-content:space-between;min-height:42px;margin:0 0 14px}
#container #bo_gall #bo_btn_top:after {display:none}
#container #bo_gall #bo_list_total {float:none;color:#666;font-size:15px;line-height:22px}
#container #bo_gall .btn_bo_user {display:flex;align-items:center;gap:6px;float:none;margin:0;padding:0}
#container #bo_gall .btn_bo_user li {float:none;width:auto;margin:0;background:transparent}
#container #bo_gall .btn_bo_user > li {position:relative}
#container #bo_gall .btn_bo_user .btn,
#container #bo_gall .btn_more_opt {display:inline-flex;align-items:center;justify-content:center;min-width:0;width:38px;height:38px;padding:0;border:1px solid #ddd;border-radius:0;background:#fff;color:#333;font-size:16px;line-height:36px;cursor:pointer}
#container #bo_gall .fa-spin {animation:none}
#container #bo_gall #gall_allchk {min-height:44px;padding:10px 0;border-bottom:1px solid #ddd}
#container #bo_gall #gall_ul {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:28px 20px;
    width:100%;
    margin:20px 0 0;
    padding:0;
}
#container #bo_gall #gall_ul:after {display:none}
#container #bo_gall #gall_ul .gall_li {float:none;width:auto !important;min-width:0;padding:0}
#container #bo_gall .gall_box {height:100%;margin:0;border:1px solid #e1e1e1;background:#fff}
#container #bo_gall .gall_con {height:100%}
#container #bo_gall .gall_img {display:flex;align-items:center;justify-content:center;width:100%;height:auto !important;aspect-ratio:4 / 3;border-bottom:1px solid #e5e5e5;background:#f7f7f7;overflow:hidden}
#container #bo_gall .gall_img a {display:flex;align-items:center;justify-content:center;width:100%;height:100%}
#container #bo_gall .gall_img img,
#container #bo_gall .gall_img video {width:100%;height:100% !important;object-fit:cover}
#container #bo_gall .gall_img .no_image,
#container #bo_gall .gall_img .is_notice {display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:#f7f7f7;color:#888;font-size:14px;line-height:1 !important}
#container #bo_gall .gall_text_href {margin:0;padding:16px 16px 8px}
#container #bo_gall .bo_tit {display:block;color:#222;font-size:16px;font-weight:500;line-height:1.5;word-break:break-word}
#container #bo_gall .bo_cnt,
#container #bo_gall .gall_info {padding:0 16px 14px;color:#777;font-size:13px;line-height:20px}
#container #bo_gall .gall_info .gall_date,
#container #bo_gall .gall_info .gall_view {margin-left:8px}
#container #bo_gall li.empty_list {grid-column:1 / -1;min-height:220px;padding:95px 0;border-top:1px solid #222;border-bottom:1px solid #ddd;color:#777;text-align:center}
#container #bo_gall .bo_fx {display:none}

/* Search and option layers shared by board skins */
#container .bo_sch_wrap {display:none;position:fixed;inset:0;z-index:9999;width:100%;height:100%}
#container .bo_sch_bg {position:absolute;inset:0;width:100%;height:100%;background:rgba(0,0,0,.3)}
#container .bo_sch {position:absolute;z-index:1;top:50%;left:50%;width:360px;max-width:calc(100% - 30px);margin:0;padding:0;border:1px solid #ddd;border-radius:0;background:#fff;box-shadow:0 12px 35px rgba(0,0,0,.18);transform:translate(-50%,-50%)}
#container .bo_sch h3 {margin:0;padding:18px;border-bottom:1px solid #eee;color:#222;font-size:18px;font-weight:500}
#container .bo_sch form {display:block;padding:18px}
#container .bo_sch select {width:100%;height:42px;padding:0 10px;border:1px solid #d9dce2;border-radius:0;background:#fff}
#container .bo_sch .sch_bar {display:flex;width:100%;height:42px;margin-top:10px;border:1px solid #d9dce2;border-radius:0;background:#fff}
#container .bo_sch .sch_input {flex:1 1 auto;width:auto;height:40px;padding:0 10px;border:0;background:transparent;outline:0}
#container .bo_sch .sch_btn {flex:0 0 42px;width:42px;height:40px;border:0;background:#fff;color:#333;font-size:16px}
#container .bo_sch .bo_sch_cls {position:absolute;top:0;right:0;width:52px;height:55px;padding:0;border:0;background:#fff;color:#777;font-size:17px}
#container .more_opt {display:none;position:absolute;z-index:20;top:44px;right:0;width:120px;margin:0;padding:0;border:1px solid #ddd;background:#fff;list-style:none}
#container .more_opt li {float:none;width:100%;margin:0;padding:0;border-bottom:1px solid #eee;text-align:left}
#container .more_opt li:last-child {border-bottom:0}
#container .more_opt li a,
#container .more_opt li button {display:flex;align-items:center;justify-content:space-between;width:100%;min-height:40px;padding:0 12px;border:0;background:#fff;color:#555;font-size:13px;text-align:left}

@media (max-width:768px) {
    #container #bo_w,
    #container #bo_v,
    #container #bo_gall {width:calc(100% - 30px) !important;margin:20px 15px 55px;font-size:14px}

    #container #bo_w .half_input {width:100%}
    #container #bo_w .bo_w_info {display:grid;grid-template-columns:1fr;gap:8px}
    #container #bo_w .bo_w_tit .frm_input {padding-right:122px}
    #container #bo_w #btn_autosave {font-size:12px}
    #container #bo_w .wr_content textarea,
    #container #bo_w .wr_content.smarteditor2 iframe {min-height:300px}
    #container #bo_w .btn_confirm {display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:22px}
    #container #bo_w .btn_confirm .btn {width:100%;min-width:0;height:46px}

    #container #bo_v > header {padding-bottom:16px}
    #container #bo_v_title .bo_v_tit {font-size:24px;line-height:1.35;word-break:break-word}
    #container #bo_v_info {min-height:0;padding:14px 0 64px}
    #container #bo_v_info .profile_info {width:100%}
    #container #bo_v_info .pf_img img {width:42px;height:42px}
    #container #bo_v_top {position:absolute;right:0;bottom:12px;float:none}
    #container #bo_v_atc {padding-top:24px}
    #container #bo_v_con {min-height:180px;font-size:14px;line-height:1.8}
    #container #bo_v .bo_v_nb li {align-items:flex-start;flex-wrap:wrap}
    #container #bo_v .bo_v_nb .nb_date {width:100%;margin:4px 0 0;padding-left:0;font-size:12px}
    #container #bo_v .bo_vc_w .btn_confirm {align-items:flex-start;flex-wrap:wrap}
    #container #bo_v .bo_vc_w .btn_submit {min-width:100px}

    #container #bo_gall #bo_btn_top {align-items:flex-start;gap:10px}
    #container #bo_gall #bo_list_total {padding-top:7px;font-size:14px}
    #container #bo_gall #gall_ul {grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 10px;margin-top:14px}
    #container #bo_gall .gall_text_href {padding:12px 12px 6px}
    #container #bo_gall .bo_tit {font-size:14px}
    #container #bo_gall .bo_cnt,
    #container #bo_gall .gall_info {padding:0 12px 12px;font-size:12px}
    #container #bo_gall li.empty_list {min-height:170px;padding:70px 0}
}
