@charset "UTF-8";

/* ==================================================================
   CHERRY HOLIC — 서브 페이지(게시판 등)
   파스텔 라이트 테마. 메인(cherry.css)과 겹치지 않음.
   ================================================================== */
:root{
  --pk:#e8609a;          /* 메인 핑크 (파스텔) */
  --pk-deep:#d1477f;     /* 눌림/강조 */
  --pk-soft:#fbe4ee;     /* 연한 핑크 면 */
  --ink:#4a3945;         /* 본문 글자 */
  --ink-mute:#9585901a;  /* (미사용 예약) */
  --muted:#96808e;       /* 보조 글자 */
  --line:#f0dbe6;        /* 경계선 */
  --card:#ffffff;
}

html,body{margin:0; padding:0; min-height:100%;}
body{
  background:#fdf3f8;
  color:var(--ink);
  font-family:'Noto Sans KR',sans-serif;
  font-size:14px;
  line-height:1.6;
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed; inset:0;
  background:linear-gradient(180deg,#fce3ef 0%,#f7eef8 45%,#f3f2fa 100%);
  z-index:-10; pointer-events:none;
}

/* 폭 통일 : 이 값 하나로 상단·본문·하단이 같이 움직임 */
#ch-shell{
  width:100%;
  max-width:880px;
  margin:0 auto;
  padding:0 18px 70px;
  box-sizing:border-box;
}
#ch-shell *{box-sizing:border-box;}
#ch-shell img{max-width:100%; height:auto;}

a{color:var(--pk-deep); text-decoration:none; -webkit-tap-highlight-color:transparent;}
a:hover{color:var(--pk);}

/* ==================================================================
   상단 바
   ================================================================== */
#ch-top{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px;
  padding:18px 2px 14px;
  border-bottom:1px solid var(--line);
  margin-bottom:26px;
}
.ch-home,.ch-user a{
  font-family:'HeirofLightRegular','Noto Sans KR',sans-serif;
  font-size:.74rem; letter-spacing:2.5px;
  color:var(--muted);
  white-space:nowrap;
  transition:color .2s;
}
.ch-home:hover,.ch-user a:hover{color:var(--pk);}
.ch-home-arrow{margin-right:3px;}
.ch-brand{
  font-family:'HeirofLightRegular','Noto Sans KR',sans-serif;
  font-size:.88rem; letter-spacing:4px;
  color:var(--pk-deep);
}
.ch-user{display:flex; align-items:center; gap:14px;}
.ch-user .ch-adm{color:var(--pk);}

/* ==================================================================
   그누보드 default.css / 스킨 CSS 무력화
   default.css 는 #container 에 float:left, width:930px, min-height:500px 를
   박아두기 때문에 이걸 풀지 않으면 레이아웃이 통째로 틀어진다.
   ================================================================== */
#wrapper,#container_wr,#container,
#bo_w,#bo_v,#bo_list,#bo_gall,#bo_sch{
  float:none !important;
  width:100% !important;
  max-width:100% !important;
  min-height:0 !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
#container{
  margin-top:0 !important;
  margin-bottom:0 !important;
  padding:0 !important;
}
#ch-shell{display:flow-root;}          /* 내부 float 정리 */
#ch-shell::after{content:""; display:block; clear:both;}

/* 고정 높이 때문에 글자가 삐져나오는 문제 방지 */
#ch-shell input,
#ch-shell select,
#ch-shell button,
#ch-shell .btn,
#ch-shell .btn_b01,
#ch-shell .btn_b02,
#ch-shell .btn_b03,
#ch-shell .btn_submit,
#ch-shell .btn_cancel,
#ch-shell .btn_close,
#ch-shell .frm_input{
  height:auto !important;
  line-height:1.3 !important;
  min-width:0 !important;
  vertical-align:middle;
}

/* ==================================================================
   본문 틀
   ================================================================== */
#wrapper,#container_wr{width:100%; max-width:100%;}
#container{
  width:100%; max-width:100%;
  background:none; border:none; padding:0;
  color:var(--ink);
}
#container_title{
  margin:0 0 22px;
  font-family:'HeirofLightRegular','Noto Sans KR',sans-serif;
  font-size:1.4rem; font-weight:500; letter-spacing:3px;
  color:var(--ink);
  text-align:center;
  border:none; background:none; padding:0;
}
#container_title span{border:none;}
#aside{display:none;}
hr{display:none;}

/* ==================================================================
   카드 패널 (글쓰기 / 읽기)
   ================================================================== */
#bo_w,#bo_v{
  width:100% !important;
  max-width:100%;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:18px;
  padding:26px 24px;
  box-shadow:0 8px 26px rgba(210,140,175,.14);
  overflow:hidden;              /* 에디터가 밖으로 삐져나가지 않게 */
}
#bo_w h2,#bo_v h2{
  font-size:1rem; letter-spacing:1px; color:var(--ink);
}

/* ==================================================================
   글쓰기 폼 : 세로 한 줄씩 정렬
   ================================================================== */
#bo_w .write_div{
  margin:0 0 14px;
  position:relative;
}
#bo_w .write_div:last-of-type{margin-bottom:0;}

/* 입력 공통 */
#ch-shell input[type=text],
#ch-shell input[type=password],
#ch-shell input[type=email],
#ch-shell input[type=tel],
#ch-shell input[type=number],
#ch-shell input[type=url],
#ch-shell input[type=search],
#ch-shell textarea,
#ch-shell select,
#ch-shell .frm_input{
  width:100% !important;
  max-width:100%;
  background:#fffafc;
  border:1px solid var(--line);
  border-radius:11px;
  color:var(--ink);
  padding:12px 14px !important;
  font-family:'Noto Sans KR',sans-serif;
  font-size:.92rem;
  outline:none;
  transition:border-color .2s, box-shadow .2s, background .2s;
}
/* 체크박스·라디오·파일은 위 규칙에서 제외 */
#ch-shell input[type=checkbox],
#ch-shell input[type=radio],
#ch-shell input[type=file]{width:auto !important;}
#ch-shell select{padding:11px 12px;}
#ch-shell input:focus,
#ch-shell textarea:focus,
#ch-shell select:focus{
  background:#fff;
  border-color:var(--pk);
  box-shadow:0 0 0 3px rgba(232,96,154,.16);
}
#ch-shell ::placeholder{color:#c3aeba;}
#ch-shell label{color:var(--ink); font-size:.88rem;}

/* 제목줄 (제목 + 임시저장 버튼) */
#bo_w .write_div:has(#wr_subject){display:block;}
#bo_w #wr_subject{padding-right:14px;}
#autosave_wrapper{
  display:flex; justify-content:flex-end;
  margin-top:8px;
}
#autosave_pop{color:var(--ink);}

/* 단축키 안내는 숨김 (필요하면 이 줄만 지우세요) */
#bo_w .btn_help,
#bo_w a[href*="help"]{display:none;}

/* 체크박스 줄 */
#bo_w .chk_box,
#bo_w .wr_content_chk,
#bo_w .write_div .chk_box{
  display:flex; align-items:center; gap:7px;
  margin-bottom:12px;
}
#ch-shell input[type=checkbox],
#ch-shell input[type=radio]{
  width:16px; height:16px;
  accent-color:var(--pk);
  margin:0;
  vertical-align:middle;
}

/* 링크 입력줄 : 아이콘 + 입력칸 나란히 */
#bo_w .write_div:has(input[name^="wr_link"]),
#bo_w .frm_file{
  display:flex; align-items:center; gap:10px;
}
#bo_w .write_div label,
#bo_w .frm_file label{
  flex:0 0 auto;
  color:var(--muted);
  margin:0;
}

/* 파일 첨부 : 기본 컨트롤을 그대로 두고 줄만 맞춤 */
#ch-shell input[type=file]{
  flex:1 1 auto;
  min-width:0;
  width:auto !important;
  background:none;
  border:none;
  border-radius:0;
  padding:0 !important;
  color:var(--muted);
  font-size:.85rem;
  box-shadow:none;
}
#ch-shell input[type=file]:focus{box-shadow:none; background:none;}
#ch-shell input[type=file]::file-selector-button{
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--pk-soft);
  color:var(--pk-deep);
  padding:8px 14px;
  margin-right:10px;
  cursor:pointer;
  font-family:'Noto Sans KR',sans-serif;
  font-size:.82rem;
  transition:background .2s;
}
#ch-shell input[type=file]::file-selector-button:hover{background:#f7d3e3;}

/* 에디터가 폭을 넘지 않도록 */
#bo_w .smarteditor2,
#bo_w #smart_editor2,
#bo_w .se2_inputarea,
#bo_w textarea,
#bo_w iframe{
  width:100% !important;
  max-width:100% !important;
}
#bo_w iframe{border-radius:10px;}

/* ==================================================================
   버튼
   ================================================================== */
#ch-shell .btn_confirm{
  display:flex; align-items:center; justify-content:center;
  gap:10px;
  margin-top:24px;
  padding-top:20px;
  border-top:1px solid var(--line);
  float:none !important;
  width:100%;
  text-align:center;
}
#ch-shell .btn_confirm *{float:none !important; margin:0;}

#ch-shell .btn_submit,
#ch-shell input[type=submit]{
  display:inline-flex;
  align-items:center; justify-content:center;
  background:var(--pk);
  border:none;
  border-radius:24px;
  color:#fff;
  font-weight:700;
  font-size:.92rem;
  letter-spacing:1.5px;
  padding:0 32px !important;
  height:46px !important;          /* 고정 높이 + flex 정렬로 글자 중앙 */
  cursor:pointer;
  box-shadow:0 6px 16px rgba(232,96,154,.3);
  transition:transform .18s, box-shadow .25s, background .2s;
}
#ch-shell .btn_submit:hover{background:var(--pk-deep); box-shadow:0 8px 22px rgba(232,96,154,.42);}
#ch-shell .btn_submit:active{transform:scale(.97);}

#ch-shell .btn_cancel,
#ch-shell .btn_close,
#ch-shell a.btn_cancel{
  display:inline-flex;
  align-items:center; justify-content:center;
  background:#fff;
  border:1px solid var(--line);
  border-radius:24px;
  color:var(--muted);
  font-size:.92rem;
  letter-spacing:1.5px;
  padding:0 28px !important;
  height:46px !important;
  cursor:pointer;
  transition:border-color .2s, color .2s;
}
#ch-shell .btn_cancel:hover{border-color:var(--pk); color:var(--pk);}

#ch-shell .btn,
#ch-shell .btn_b01,
#ch-shell .btn_b02,
#ch-shell .btn_b03,
#ch-shell .btn_admin{
  display:inline-flex;
  align-items:center; justify-content:center;
  background:var(--pk-soft);
  border:1px solid var(--line);
  border-radius:20px;
  color:var(--pk-deep);
  padding:0 15px !important;
  height:36px !important;
  font-size:.82rem;
  transition:background .2s, color .2s, border-color .2s;
}
#ch-shell .btn:hover,
#ch-shell .btn_b01:hover,
#ch-shell .btn_b02:hover,
#ch-shell .btn_b03:hover{
  background:var(--pk); border-color:var(--pk); color:#fff;
}

/* ==================================================================
   표 (목록 / 읽기)
   ================================================================== */
#ch-shell table{
  width:100%; max-width:100%;
  border-collapse:collapse;
  background:none;
  color:var(--ink);
}
#ch-shell th{
  background:var(--pk-soft);
  color:var(--pk-deep);
  border:none;
  border-bottom:1px solid var(--line);
  padding:12px 10px;
  font-weight:500;
  letter-spacing:.5px;
  text-align:left;
}
#ch-shell td{
  border:none;
  border-bottom:1px solid var(--line);
  padding:12px 10px;
}
#ch-shell tbody tr:hover td{background:#fffafc;}
.tbl_head01,.tbl_frm01{background:none;}
.tbl_frm01 th{width:110px; white-space:nowrap;}

#bo_v_title,#bo_v_tit{color:var(--ink);}
#bo_v_con{color:var(--ink); line-height:1.9; font-size:.92rem;}
#bo_v_con img{max-width:100% !important; height:auto !important; border-radius:10px;}

/* 페이지 번호 */
.pg_wrap{margin:24px 0; text-align:center;}
.pg_page,.pg_current{
  display:inline-block;
  min-width:34px; height:34px; line-height:32px;
  border-radius:10px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--muted);
  margin:0 3px;
  text-align:center;
}
.pg_current{background:var(--pk); border-color:var(--pk); color:#fff;}

.empty_list,.empty_table{color:var(--muted); padding:44px 0; text-align:center;}

/* ==================================================================
   하단
   ================================================================== */
#ch-foot{
  margin-top:54px;
  padding-top:26px;
  border-top:1px solid var(--line);
  text-align:center;
}
.ch-foot-logo img{width:44px; opacity:.32;}
.ch-foot-copy{
  margin:10px 0 0;
  font-family:'HeirofLightRegular','Noto Sans KR',sans-serif;
  font-size:.62rem; letter-spacing:2.5px;
  color:#c3aeba;
}

#top_btn{
  position:fixed; right:20px; bottom:20px;
  width:44px; height:44px;
  display:flex; align-items:center; justify-content:center;
  border:1px solid var(--line);
  border-radius:50%;
  background:#fff;
  color:var(--pk);
  cursor:pointer;
  opacity:0; visibility:hidden;
  box-shadow:0 6px 18px rgba(210,140,175,.28);
  transition:opacity .3s, visibility .3s, background .2s, color .2s;
  z-index:9999;
}
#top_btn.on{opacity:1; visibility:visible;}
#top_btn:hover{background:var(--pk); color:#fff;}
#top_btn svg{width:19px; height:19px;}

/* ==================================================================
   좁은 화면
   ================================================================== */
@media (max-width:640px){
  #ch-shell{padding:0 13px 54px;}
  #ch-top{gap:8px; padding:14px 0 11px; margin-bottom:18px;}
  .ch-brand{font-size:.72rem; letter-spacing:2px;}
  .ch-home,.ch-user a{font-size:.64rem; letter-spacing:1.2px;}
  .ch-user{gap:10px;}
  #container_title{font-size:1.12rem; letter-spacing:2px;}
  #bo_w,#bo_v{padding:18px 14px; border-radius:14px;}
  #ch-shell .btn_confirm{flex-direction:column-reverse; gap:8px;}
  #ch-shell .btn_submit,
  #ch-shell .btn_cancel{width:100% !important;}
  #ch-shell th,#ch-shell td{padding:10px 7px; font-size:.86rem;}
  .tbl_frm01 th{width:auto;}
}