:root {--ct-font-sans-serif: "Spq", sans-serif;
  --ct-body-font-family: var(--ct-font-sans-serif);
  --ct-body-font-size: 0.95rem;
  --ct-body-font-weight: 400;
  --ct-body-line-height: 1.5;
  --ct-body-color: #6c757d;
  --ct-body-bg: #fff;
  --ct-tertiary-color: #1d1d1d;
  --ct-link-color-rgb: 54, 136, 252;
}
body {
    background:#F2F4F7;
    font-family: var(--ct-body-font-family);
    /* font-size: var(--ct-body-font-size);
    font-weight: var(--ct-body-font-weight);
    line-height: var(--ct-body-line-height);
    color: var(--ct-body-color);
    text-align: var(--ct-body-text-align);
    -webkit-text-size-adjust: 100%; */
}
#hd_pop, #hd_wrapper, #tnb .inner, #gnb .gnb_wrap, #container_wr, #ft_wr {
    max-width:1080px;
    margin:0 auto;
}
#hd_wrapper {
    height:70px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 1.5rem;
}
#hd_wrapper::after {
    display:none
}
.sample_menu {
    font-size:1rem;
    font-weight:500
}
#container_wr {
    padding:0 1.5rem;
    margin-top: 5rem;
    background:#fff;
    border-radius:12px;
    box-shadow: 0 0 4px 0 rgba(0,0,0,.04);
}
#logo {
    padding:0;
}
#logo a {
    display:block;
    margin-top:6px;
    padding:0 0.75rem
}
#logo img {
    height:26px
}
#hd {
    background-color:#fff;
}
.hd_login a {
    color:#333;
}
#hd_define {
    display:none
}
.hd_sch_wr {
    display:none
}
#gnb .gnb_wrap {
    display:none
}
#container {
    /* max-width:770px */
    width:100%
}
#tnb {
    position:absolute;
    width:100%;
    border:none;
    display:none
}
.hd_login {
    display:none
}


/* reset */
#ft_wr {
    padding:40px 0 0 0
}
#ft_wr .ft_cnt {
    float:none;
    width: 100%;
}
#visit dl {
    display:flex;
    align-items:center;
    justify-content:center;
}
#visit dt {
    width:auto;
    float:none;
    text-align:left;
    color:#888
}
#visit dd {
    float:none;
    width:auto;
    text-align:left;
    margin-right:10px;
}
#visit dt span {
    margin-right:0;
    width:3px;
    height:3px
}
#visit dd strong {
    color:#000;
    background:#daf9f7
}
#ft {
    background:none;
    padding-bottom:40px
}
#ft_copy {
    border:none;
    font-size:16px;
    color:rgba(0 0 0 / 30%)
}




/* board */
#container_title {
    display:none
}
.bo_vc_act {
    border:1px solid #f1f6fb;
    background:#fff;
    text-align:center;
}
.bo_vc_act::before {
    border-color:transparent transparent #f1f6fb transparent
}
.bo_vc_act li {
    border-bottom:1px solid #f1f6fb
}

.more_opt {
    border:1px solid #f1f6fb;
    background:#fff !important;
}
.more_opt li {
    border-bottom:1px solid #f1f6fb
}
.more_opt::before {
    border-color:transparent transparent #f1f6fb transparent
}

.btn_bo_user li {
    background:none
}
.write-btn {
    width:120px;
    height:45px !important;
    line-height:45px !important;
    float:right;
    font-size: 1.183em !important;
    font-weight: 500 !important;
    background: #1dd271 !important;
    border-radius: 3px;
    padding: 0 20px !important;
    color: #fff !important;
    margin-top:30px
}
.write-btn i {
    margin-right: 10px;
}
.btn_submit {
    background: #1dd271 !important;
}
#bo_v_title .bo_v_tit {
    margin:15px 0 25px
}
#bo_v_top {
    background: #fdfaf7;
    padding: 0 20px;
    border-radius: 1rem;
}
#bo_v_info {
    border:none
}
#bo_v_info .profile_info {
    margin:20px 0 20px 20px;
}
#bo_v_top ul {
    background:none
}
.bo_v_com {
    margin:25px 0 0
}
.bo_sch {

}
.bo_sch .sch_bar {
    background:#f5f9fd;
    border:none;
    box-shadow:none
}
.bo_sch .sch_input {
    width:400px;
    text-indent:1rem
}
/* input[type="text"]:focus, input[type="password"]:focus, textarea:focus, select:focus {
    box-shadow:none;
    border:none !important;
} */
.bo_vc_w textarea {
    box-shadow:none;
    border:1px solid #f9feff;
    background:#fafafa;
    font-size:15px
}
.tbl_head01 td {
    font-size:14px;
}

.writer-signature{
    margin-top:40px;
    padding:20px;
    border-radius:16px 16px 0 0;
    background:#fbfbfb;
    font-size:13px;
    font-weight:600;
    line-height:1.8;
    color:rgba(0 0 0 / 50%);
    border:1px solid #f4f4f4;
}
.writer-profile{
    margin-top:0;
    padding:24px;
    border-radius:0 0 16px 16px;
    background:#fbfbfb;
    border:1px solid #f4f4f4;
    border-top:0;
    font-size:12px;
    line-height:1.9;
    color:rgba(0 0 0 / 30%);
    margin-bottom:30px;
}

#bo_w .bo_w_tit .frm_input {
    background:#fafafa;
    border:0
}
#bo_w .bo_w_tit #btn_autosave {
    font-size:11px
}
.tbl_head01 td {
    color:#b3b3b3
}
.sv_member {
    color:#b3b3b3
}
#visit h2 {
    font-size:.82rem;
    text-align: center;
    color:rgba(0 0 0 / 30%);
    margin-bottom:0
}
#bo_list tbody tr:hover {
    border-left:2px solid #0ff279
}
.cmt_btn span.total::after {
    background:#0ff279
}
.cmt_btn span.total {
    color:#0cd86b
}

#bo_v_link a:focus, #bo_v_link li:hover a, #bo_v_link a:active {
    color:#1dd271
}
#bo_v_link li:hover .bo_v_link_cnt {
    color:#1dd271
}
#bo_v_link li:hover i {
    border-color:#88fdbe;
    color:#1dd271
}
#bo_v_link li i {
    font-size: 2em;
    margin-right: 20px;
    margin-top: 7px;
    color:#e7e7e7
}
 .frm_input {
    box-shadow:none;
    border:0;
    background:#fafafa
}
input[type="text"]:focus, 
input[type="password"]:focus, 
textarea:focus, select:focus {
    border:0 !important;
    box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075)
}
a.btn_frmline, button.btn_frmline {
    background:#000
}
.pg_wrap {
    margin-top:30px
}
.pg_current {
    background:#000;
    border-color:#000
}
#bo_w .bo_w_flie .file_wr {
    border-color:#dee7ff
}

/* mobile */
#gnb_open {
    right:10px
}
#bo_list_total {
    background:none
}

/* 읽기 모드 */
#bo_v_con,
#bo_v_con p,
#bo_v_con div,
#bo_v_con span,
#bo_v_con li,
#bo_v_con td,
#bo_v_con th,
#bo_v_con a,
#bo_v_con strong,
#bo_v_con em {
    transition:
        font-size 0.35s ease,
        line-height 0.35s ease,
        letter-spacing 0.35s ease,
        color 0.35s ease;
}
/* body.reading-mode #bo_v_con {
    font-size: 21px;
    line-height: 2;
    letter-spacing: -0.2px;
} */
body.reading-mode #bo_v_con,
body.reading-mode #bo_v_con p,
body.reading-mode #bo_v_con div,
body.reading-mode #bo_v_con span,
body.reading-mode #bo_v_con li,
body.reading-mode #bo_v_con td,
body.reading-mode #bo_v_con th,
body.reading-mode #bo_v_con a,
body.reading-mode #bo_v_con strong,
body.reading-mode #bo_v_con em {
    font-size: 17px;
    line-height: 1.9;
    letter-spacing: -0.2px;
    color:rgba(0 0 0 / 80%)
}

.reader-tools {
  margin: 0 0 20px;
  text-align: right;
}

#readerModeBtn,#normalModeBtn,#darkModeBtn {
  padding: 8px 10px;
  border: 1px solid transparent;
  background: #eff0f2;
  border-radius: 20px;
  cursor: pointer;
  margin-bottom:10px;
  font-size:11px;
  color:#383c47;
  font-weight:600
}
#normalModeBtn {
    margin-right:5px
}

body.reading-mode {
  background: #fff;
}
#readerOptions {
    display:flex
}

body.reading-mode #hd,
body.reading-mode #gnb,
body.reading-mode .sidebar,
body.reading-mode #aside,
body.reading-mode .cmt_btn,
body.reading-mode #bo_vc,
body.reading-mode .bo_vc_w,
body.reading-mode #ft_wr,
body.reading-mode #ft_copy,
body.reading-mode #bo_btn_top,
body.reading-mode .tbl_head01 thead {
  display: none !important;
}

body.reading-mode #bo_list .td_name,
body.reading-mode #bo_list .td_num,
body.reading-mode #bo_list .td_datetime {
    display:none
}

body.reading-mode #ft {}
body.reading-mode .tbl_head01 {
    margin-bottom:150px;
}

body.reading-mode #container_wr {
    max-width:800px;
    padding: 0;
    box-shadow:none;
    margin:0 auto;
}
body.reading-mode #container {
    margin:0;
}
body.reading-mode #bo_v {
  max-width: 100%;
  margin: 0;
  padding: 30px 0;
  /* border-radius: 16px; */
}
body.reading-mode .view-header {
    background:#fff
}
body.reading-mode .view-header h2 {
    /* max-width:75% */
}
body.reading-mode #bo_v_title .bo_v_tit {
    color:#000
}
body.reading-mode #bo_v_top {
    background:#f6f8f9
}
body.reading-mode #bo_v_info .sv_member {
    /* color:#fff */
}
body.reading-mode #bo_v_info strong a,
body.reading-mode #bo_v_info strong  {
    /* color:rgba(255 255 255 / 70%) */
}

body.reading-mode #bo_v_con {
  font-size: 20px;
  line-height: 2;
  color: #eee;
}

body.reading-mode #bo_v_con img {
  max-width: 100%;
  height: auto;
}

body.reading-mode #bo_v_con h2 span {
    color:rgba(0 0 0 / 100%)
}


body.reading-mode.dark-reading,
body.reading-mode.dark-reading .view-header {
    background: #111;
}
body.reading-mode.dark-reading #container_wr, 
body.reading-mode.dark-reading #bo_v {
    background:#111
}
body.reading-mode.dark-reading #bo_v_title .bo_v_tit {
    color:#fff
}

body.reading-mode.dark-reading #normalModeBtn, 
body.reading-mode.dark-reading #darkModeBtn {
    background: #232323;
    border-color: #303030;
    color: #fff;
}
body.reading-mode.dark-reading #bo_v_top {
    background:#272727
}
body.reading-mode.dark-reading #bo_v_info .sv_member {
    color:#fff
}
body.reading-mode.dark-reading #bo_v_info strong a, 
body.reading-mode.dark-reading #bo_v_info strong {
    color:rgba(255 255 255 / 70%);
}
body.reading-mode.dark-reading .btn_b01:hover, 
body.reading-mode.dark-reading a.btn_b01:hover {
    color:#fff
}



body.reading-mode.dark-reading .writer-signature,
body.reading-mode.dark-reading .writer-profile {
    background: #1a1a1a;
    border-color: #272727;
    color:rgba(255 255 255 / 50%);
}
body.reading-mode.dark-reading #bo_v_con p, 
body.reading-mode.dark-reading #bo_v_con div, 
body.reading-mode.dark-reading #bo_v_con span {
    color:#fff !important
}

body.reading-mode.dark-reading #bo_v_con b,
body.reading-mode.dark-reading #bo_v_con strong,
body.reading-mode.dark-reading #bo_v_con b span,
body.reading-mode.dark-reading #bo_v_con strong span {
    color: #3ae57b !important;
}

body.reading-mode.dark-reading .tbl_wrap table {
    background:#111
}
body.reading-mode.dark-reading #bo_list tbody .even td {
    background:#111
}
body.reading-mode.dark-reading .tbl_head01 a {
    color:#fff
}
body.reading-mode.dark-reading .tbl_head01 td {
    border-color:#272727
}

body.reading-mode.dark-reading #bo_v_act .bo_v_good {
    color:#fff
}

body.reading-mode.dark-reading #top_btn {
    background:rgba(255 255 255 / 90%)
}
body.reading-mode.dark-reading #top_btn:hover {
    background:#fff;
    border-color: #fff;
    color: #000;
}

body.reading-mode.dark-reading .bo_current {
    color:#3ae57b;
}

@media (max-width: 768px) {
  input,
  textarea,
  select {
    font-size: 16px !important;
  }
}