#community-app{
  width:min(1180px,calc(100% - 40px));
  margin:0 auto;
  padding:54px 0 90px;
  color:#263d32;
  font-family:Arial,"Noto Sans KR",sans-serif;
}


.cb-board-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:30px;
  margin-bottom:32px;
}


.cb-board-title small{
  display:block;
  margin-bottom:8px;
  color:#94734f;
  font:700 10px Georgia,serif;
  letter-spacing:.16em;
}


.cb-board-title h2{
  margin:0;
  color:#334f3e;
  font-size:32px;
}


.cb-board-title p{
  margin:9px 0 0;
  color:#7f877f;
  font-size:13px;
}


.cb-account{
  padding:8px 12px;
  border:1px solid #d8ddd6;
  border-radius:999px;
  background:#fff;
  color:#68746c;
  font-size:11px;
}


.cb-category-tabs{
  display:flex;
  gap:2px;
  border-bottom:1px solid #d9ddd6;
}


.cb-category-tabs button{
  margin:0;
  padding:13px 18px;
  border:0;
  border-bottom:2px solid transparent;
  background:transparent;
  color:#748078;
  cursor:pointer;
  font-weight:700;
}


.cb-category-tabs button[aria-pressed="true"]{
  border-bottom-color:#3f644b;
  color:#31543d;
}


.cb-board-tools{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:18px 0;
}


.cb-search{
  display:flex;
  width:min(430px,100%);
}


.cb-search input{
  min-width:0;
  flex:1;
  height:40px;
  padding:0 13px;
  border:1px solid #ccd4cc;
  border-right:0;
  border-radius:5px 0 0 5px;
  background:#fff;
  font:inherit;
}


.cb-search button{
  height:40px;
  padding:0 18px;
  border:0;
  border-radius:0 5px 5px 0;
  background:#516c59;
  color:#fff;
  cursor:pointer;
}


.cb-order{
  display:flex;
  align-items:center;
  gap:7px;
}


.cb-order button{
  padding:9px 13px;
  border:1px solid #d1d8d1;
  border-radius:5px;
  background:#fff;
  color:#5f6c63;
  cursor:pointer;
}


.cb-order button[aria-pressed="true"]{
  border-color:#54725d;
  background:#edf3ee;
  color:#33543e;
}


.cb-order .cb-write-button{
  margin-left:6px;
  border-color:#3f644b;
  background:#3f644b;
  color:#fff;
}


.cb-status{
  min-height:20px;
  margin:0;
  color:#98643b;
  font-size:12px;
}


.cb-board-section{
  margin-top:28px;
  border-top:2px solid #455f4e;
  background:#fff;
}


.cb-board-section.hot{
  border-top-color:#b98948;
}


.cb-board-section.notices{
  border-top-color:#42694c;
}


.cb-section-head{
  display:flex;
  align-items:center;
  height:50px;
  border-bottom:1px solid #e2e5e0;
}


.cb-section-head h3{
  margin:0;
  padding:0 16px;
  color:#334c3c;
  font-size:16px;
}


.cb-list-header,
.cb-board-row{
  display:grid;
  grid-template-columns:
    95px
    minmax(0,1fr)
    120px
    125px
    65px
    65px;
  align-items:center;
}


.cb-list-header{
  min-height:42px;
  border-bottom:1px solid #dfe3dd;
  background:#f7f8f5;
  color:#7b827c;
  text-align:center;
  font-size:11px;
  font-weight:700;
}


.cb-board-row{
  width:100%;
  min-height:58px;
  padding:0;
  border:0;
  border-bottom:1px solid #edf0eb;
  border-radius:0;
  background:#fff;
  color:#3f4d43;
  text-align:center;
  cursor:pointer;
}


.cb-board-row:hover{
  background:#fbfcf9;
}


.cb-board-row.hot{
  background:#fffdf8;
}


.cb-board-row.notices{
  background:#f5f9f4;
}


.cb-board-category{
  padding:0 8px;
  color:#7d847e;
  font-size:11px;
}


.cb-board-subject{
  min-width:0;
  padding:0 16px;
  overflow:hidden;
  color:#283e31;
  text-align:left;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:14px;
  font-weight:600;
}


.cb-title-text{
  vertical-align:middle;
}


.cb-comment-number{
  color:#ba6947;
  font-size:12px;
  font-weight:700;
}


.cb-board-author,
.cb-board-date,
.cb-board-vote,
.cb-board-comments{
  color:#7a837c;
  font-size:11px;
}


.cb-member{
  display:inline-grid;
  place-items:center;
  min-width:18px;
  height:18px;
  margin-right:6px;
  padding:0 4px;
  border-radius:4px;
  background:#3e684c;
  color:#fff;
  font:bold 10px Arial;
  vertical-align:middle;
}


.cb-member.mini{
  min-width:15px;
  height:15px;
  margin-right:4px;
  font-size:8px;
}


.cb-hot-badge{
  display:inline-block;
  margin-right:8px;
  padding:3px 6px;
  border-radius:4px;
  background:#b47b3e;
  color:#fff;
  font-size:9px;
  vertical-align:middle;
}


.cb-empty{
  margin:0;
  padding:36px 20px;
  border-bottom:1px solid #e8ebe6;
  color:#959c96;
  text-align:center;
  font-size:13px;
}


.cb-pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin-top:32px;
}


.cb-pagination button{
  padding:8px 13px;
  border:1px solid #d4dad3;
  border-radius:5px;
  background:#fff;
  color:#58685d;
  cursor:pointer;
}


.cb-pagination button:disabled{
  opacity:.35;
  cursor:default;
}


.cb-pagination span{
  color:#68736b;
  font-size:12px;
}


/* =========================================================
   DIALOG
========================================================= */

.cb-dialog{
  box-sizing:border-box;
  width:min(780px,94vw);
  max-height:90vh;
  padding:30px;
  overflow:auto;
  border:1px solid #cfd6ce;
  border-radius:10px;
  background:#fffdf9;
  color:#293e32;
  font:14px/1.7 Arial,"Noto Sans KR",sans-serif;
}


.cb-dialog::backdrop{
  background:rgba(18,27,21,.58);
}


.cb-detail-top,
.cb-editor-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}


.cb-detail-category{
  color:#9a7650;
  font-size:11px;
  font-weight:700;
}


.cb-close{
  width:34px;
  height:34px;
  padding:0;
  border:0;
  background:transparent;
  color:#637067;
  font-size:24px;
  cursor:pointer;
}


.cb-detail h2,
.cb-editor h2{
  margin:18px 0 10px;
  color:#2e4838;
  font-size:25px;
  line-height:1.4;
  overflow-wrap:anywhere;
}


.cb-detail-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px 15px;
  padding-bottom:18px;
  border-bottom:1px solid #e0e4de;
  color:#858c86;
  font-size:11px;
}


.cb-detail-meta strong{
  color:#536359;
}


.cb-content{
  min-height:140px;
  padding:28px 4px 35px;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  font-size:14px;
  line-height:1.9;
}


.cb-detail-actions{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  padding:15px 0 24px;
  border-top:1px solid #e6e8e3;
}


.cb-detail-actions button,
.cb-editor-actions button{
  padding:9px 14px;
  border:1px solid #d2d8d1;
  border-radius:5px;
  background:#fff;
  color:#506157;
  cursor:pointer;
}


.cb-detail-actions .cb-vote-button{
  border-color:#456b50;
  background:#456b50;
  color:#fff;
}


.cb-detail-actions .cb-delete-button{
  color:#a65245;
}


/* =========================================================
   COMMENTS
========================================================= */

.cb-comments-section{
  margin-top:10px;
  padding-top:26px;
  border-top:2px solid #526b59;
}


.cb-comments-section h3{
  margin:0 0 16px;
  color:#354d3c;
  font-size:17px;
}


.cb-comment-item{
  padding:16px 3px;
  border-top:1px solid #e5e8e2;
}


.cb-comment-head{
  display:flex;
  align-items:center;
  gap:10px;
}


.cb-comment-head strong{
  color:#45574a;
  font-size:12px;
}


.cb-comment-head time{
  color:#979d98;
  font-size:10px;
}


.cb-comment-delete{
  margin-left:auto;
  padding:2px 4px;
  border:0;
  background:transparent;
  color:#a36a5e;
  font-size:10px;
  cursor:pointer;
}


.cb-comment-content{
  margin:9px 0 0;
  color:#465148;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  font-size:13px;
  line-height:1.75;
}


.cb-comment-form{
  margin-top:18px;
  padding:15px;
  border:1px solid #d7ddd6;
  border-radius:6px;
  background:#fafbf8;
}


.cb-comment-form textarea{
  box-sizing:border-box;
  width:100%;
  padding:10px;
  resize:vertical;
  border:0;
  outline:0;
  background:transparent;
  color:#39473d;
  font:inherit;
}


.cb-comment-form-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  padding-top:10px;
  border-top:1px solid #e0e4de;
}


.cb-comment-form-bottom span{
  color:#999f9a;
  font-size:10px;
}


.cb-comment-form-bottom button{
  padding:8px 14px;
  border:0;
  border-radius:4px;
  background:#42644c;
  color:#fff;
  cursor:pointer;
}


.cb-login-guide{
  padding:16px;
  border-radius:5px;
  background:#f5f6f3;
  color:#858c86;
  text-align:center;
  font-size:12px;
}


/* =========================================================
   EDITOR
========================================================= */

.cb-editor label{
  display:block;
  margin:18px 0;
  color:#55645a;
  font-size:12px;
  font-weight:700;
}


.cb-editor input,
.cb-editor textarea,
.cb-editor select{
  box-sizing:border-box;
  display:block;
  width:100%;
  margin-top:7px;
  padding:11px;
  border:1px solid #cdd5cc;
  border-radius:5px;
  background:#fff;
  color:#334039;
  font:inherit;
}


.cb-editor textarea{
  resize:vertical;
  line-height:1.7;
}


.cb-editor-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin-top:22px;
}


.cb-editor-actions button:last-child{
  border-color:#42644c;
  background:#42644c;
  color:#fff;
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:760px){

  #community-app{
    width:calc(100% - 24px);
    padding:34px 0 65px;
  }


  .cb-board-head{
    align-items:flex-start;
    flex-direction:column;
    gap:12px;
  }


  .cb-board-title h2{
    font-size:26px;
  }


  .cb-category-tabs{
    overflow-x:auto;
  }


  .cb-category-tabs button{
    flex:0 0 auto;
    padding:12px 13px;
  }


  .cb-board-tools{
    align-items:stretch;
    flex-direction:column;
  }


  .cb-search{
    width:100%;
  }


  .cb-order{
    justify-content:flex-end;
  }


  .cb-list-header{
    display:none;
  }


  .cb-board-row{
    grid-template-columns:
      62px minmax(0,1fr) 46px;

    grid-template-rows:
      auto auto;

    min-height:72px;

    padding:10px 0;
  }


  .cb-board-category{
    grid-column:1;
    grid-row:1 / 3;
  }


  .cb-board-subject{
    grid-column:2;
    grid-row:1;
    padding:0 8px;
    white-space:normal;
  }


  .cb-board-author{
    grid-column:2;
    grid-row:2;
    padding:4px 8px 0;
    text-align:left;
  }


  .cb-board-comments{
    grid-column:3;
    grid-row:1 / 3;
    align-self:center;
  }


  .cb-board-comments::before{
    content:"댓글 ";
    display:block;
    margin-bottom:2px;
    color:#a1a6a2;
    font-size:8px;
  }


  .cb-board-date,
  .cb-board-vote{
    display:none;
  }


  .cb-dialog{
    width:96vw;
    padding:20px;
  }


  .cb-detail h2,
  .cb-editor h2{
    font-size:21px;
  }

}


/* =========================================================
   COMMUNITY V3 - NOTICE / PHOTO / VOD
========================================================= */

.cb-attach-icon,
.cb-vod-icon{
  display:inline-block;
  margin-right:6px;
  color:#916b43;
  font-size:11px;
  vertical-align:middle;
}


.cb-vod-icon{
  color:#b75244;
}


.cb-post-media{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:10px;
  margin:0 0 26px;
}


.cb-post-image-link{
  display:block;
  overflow:hidden;
  border:1px solid #e0e4de;
  border-radius:7px;
  background:#f6f7f4;
}


.cb-post-image-link img{
  display:block;
  width:100%;
  max-height:520px;
  object-fit:contain;
  background:#f5f5f2;
}


.cb-vod-link{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 18px;
  border:1px solid #d0d8d0;
  border-radius:6px;
  background:#f5f8f5;
  color:#3f624b;
  font-weight:700;
  text-decoration:none;
}


.cb-vod-link:hover{
  background:#edf4ee;
}


.cb-upload-help{
  display:block;
  margin:5px 0 8px;
  color:#90978f;
  font-size:10px;
  font-weight:400;
}


.cb-upload-status{
  min-height:18px;
  margin-top:7px;
  color:#657568;
  font-size:10px;
}


.cb-upload-preview{
  display:grid;
  grid-template-columns:
    repeat(5,minmax(0,1fr));
  gap:8px;
  margin-top:10px;
}


.cb-upload-item{
  position:relative;
  overflow:hidden;
  aspect-ratio:1/1;
  border:1px solid #d8ddd6;
  border-radius:6px;
  background:#f5f5f2;
}


.cb-upload-item img{
  width:100%;
  height:100%;
  object-fit:cover;
}


.cb-upload-remove{
  position:absolute;
  top:4px;
  right:4px;
  width:25px;
  height:25px;
  padding:0 !important;
  border:0 !important;
  border-radius:50% !important;
  background:rgba(20,20,20,.72) !important;
  color:#fff !important;
  line-height:25px;
}


.cb-notice-check{
  display:flex !important;
  align-items:center;
  gap:5px;
  margin-top:16px !important;
  padding:12px 14px;
  border:1px solid #d9dfd8;
  border-radius:5px;
  background:#f5f8f4;
}


.cb-notice-check input{
  display:inline-block !important;
  width:auto !important;
  margin:0 !important;
}


@media(max-width:760px){

  .cb-post-media{
    grid-template-columns:1fr;
  }


  .cb-upload-preview{
    grid-template-columns:
      repeat(3,minmax(0,1fr));
  }

}


/* =========================================================
   COMMUNITY POST PAGE V4
========================================================= */

.community-post-page{
  min-height:calc(100vh - 70px);
  background:#fbfaf6;
}


.community-post-wrap{
  width:min(1000px,calc(100% - 40px));
  margin:0 auto;
  padding:50px 0 100px;
  color:#304438;
}


.cp-loading,
.cp-error{
  padding:80px 20px;
  text-align:center;
  color:#808a82;
}


.cp-page-top{
  display:flex;
  align-items:center;
  margin-bottom:18px;
}


.cp-back{
  color:#647269;
  font-size:12px;
  font-weight:700;
  text-decoration:none;
}


.cp-back:hover{
  color:#35543f;
}


.cp-article{
  border-top:2px solid #45624d;
  border-bottom:1px solid #dce2db;
}


.cp-article-head{
  padding:28px 12px 24px;
  border-bottom:1px solid #dfe4de;
}


.cp-category{
  display:block;
  margin-bottom:10px;
  color:#92704e;
  font-size:11px;
  font-weight:700;
}


.cp-article-head h1{
  margin:0;
  color:#263e31;
  font-size:30px;
  line-height:1.45;
  overflow-wrap:anywhere;
}


.cp-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 18px;
  margin-top:17px;
  color:#89918a;
  font-size:11px;
}


.cp-meta strong{
  color:#53645a;
}


.cp-member{
  display:inline-grid;
  place-items:center;
  min-width:18px;
  height:18px;
  margin-right:5px;
  padding:0 4px;
  border-radius:4px;
  background:#3e684c;
  color:#fff;
  font:bold 9px Arial;
}


.cp-content{
  min-height:180px;
  padding:38px 14px;
  color:#39473e;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  font-size:15px;
  line-height:1.95;
}


/* PHOTOS */

.cp-gallery{
  display:flex;
  flex-direction:column;
  gap:16px;
  padding:0 14px 34px;
}


.cp-gallery img{
  display:block;
  max-width:100%;
  height:auto;
  margin:0 auto;
  border-radius:6px;
}


/* VIDEO */

.cp-video-section{
  padding:0 14px 38px;
}


.cp-media-label{
  margin-bottom:8px;
  color:#758078;
  font-size:9px;
  font-weight:800;
  letter-spacing:.12em;
}


.cp-video-frame{
  position:relative;
  width:100%;
  overflow:hidden;
  aspect-ratio:16/9;
  border-radius:8px;
  background:#000;
}


.cp-video-frame iframe,
.cp-video-frame video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}


.cp-video-frame video{
  object-fit:contain;
}


/* ACTIONS */

.cp-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding:20px 12px;
  border-top:1px solid #e2e6e1;
}


.cp-actions button,
.cp-action-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  box-sizing:border-box;
  padding:0 16px;
  border:1px solid #d0d7d0;
  border-radius:5px;
  background:#fff;
  color:#56665b;
  font:700 12px Arial,"Noto Sans KR",sans-serif;
  text-decoration:none;
  cursor:pointer;
}


.cp-actions .cp-vote{
  border-color:#42664d;
  background:#42664d;
  color:#fff;
}


.cp-actions .cp-delete{
  color:#aa574a;
}


/* COMMENTS */

.cp-comments{
  margin-top:45px;
  border-top:2px solid #4c6955;
}


.cp-comments > h3{
  margin:0;
  padding:24px 10px 16px;
  color:#344d3c;
  font-size:18px;
}


.cp-comment{
  padding:18px 10px;
  border-top:1px solid #e2e6e0;
}


.cp-comment-head{
  display:flex;
  align-items:center;
  gap:10px;
}


.cp-comment-head strong{
  color:#46594c;
  font-size:12px;
}


.cp-comment-head time{
  color:#9ba19c;
  font-size:10px;
}


.cp-comment-delete{
  margin-left:auto;
  padding:0;
  border:0;
  background:transparent;
  color:#a56659;
  font-size:10px;
  cursor:pointer;
}


.cp-comment-body{
  margin-top:10px;
  color:#49554c;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  font-size:13px;
  line-height:1.8;
}


.cp-empty{
  margin:0;
  padding:40px 15px;
  border-top:1px solid #e2e6e0;
  color:#9ba19b;
  text-align:center;
  font-size:12px;
}


.cp-comment-form{
  margin-top:16px;
  padding:15px;
  border:1px solid #d7ddd6;
  border-radius:6px;
  background:#fff;
}


.cp-comment-form textarea{
  display:block;
  width:100%;
  min-height:100px;
  box-sizing:border-box;
  padding:10px;
  resize:vertical;
  border:0;
  outline:0;
  color:#3f4d43;
  background:transparent;
  font:13px/1.7 Arial,"Noto Sans KR",sans-serif;
}


.cp-comment-form-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-top:10px;
  border-top:1px solid #e1e5df;
}


.cp-comment-form-bottom span{
  color:#a0a6a1;
  font-size:10px;
}


.cp-comment-form-bottom button{
  padding:9px 16px;
  border:0;
  border-radius:4px;
  background:#42644c;
  color:#fff;
  cursor:pointer;
}


.cp-login-message{
  padding:20px;
  border-top:1px solid #e2e6e0;
  color:#858e87;
  text-align:center;
  font-size:12px;
}


/* =========================================================
   BOARD - V4
========================================================= */

.cb-board-row{
  text-decoration:none;
}


/* 기존 dialog 상세보기는 사용하지 않는다 */
.cb-detail{
  display:none !important;
}


@media(max-width:700px){

  .community-post-wrap{
    width:calc(100% - 24px);
    padding-top:28px;
  }


  .cp-article-head{
    padding:22px 5px 20px;
  }


  .cp-article-head h1{
    font-size:23px;
  }


  .cp-content{
    padding:28px 5px;
    font-size:14px;
  }


  .cp-gallery,
  .cp-video-section{
    padding-left:0;
    padding-right:0;
  }


  .cp-video-frame{
    border-radius:4px;
  }


  .cp-actions{
    padding-left:5px;
    padding-right:5px;
  }

}


/* =========================================================
   COMMUNITY VOTE CONTROL V6
========================================================= */

.cp-actions .cp-vote-segment{
  display:inline-flex;
  align-items:stretch;

  min-height:44px;

  padding:0;

  overflow:hidden;

  border:
    1px solid #cbd6ce;

  border-radius:7px;

  background:#fff;

  color:#496052;

  cursor:pointer;
}


.cp-vote-action{
  display:flex;
  align-items:center;

  gap:7px;

  padding:
    0 15px;

  font-size:12px;

  font-weight:800;
}


.cp-vote-icon{
  display:inline-flex;

  align-items:center;

  justify-content:center;

  font-size:16px;

  line-height:1;
}


.cp-vote-label{
  white-space:nowrap;
}


.cp-vote-count{
  min-width:42px;

  display:flex;

  align-items:center;

  justify-content:center;

  padding:
    0 12px;

  border-left:
    1px solid #d8dfd9;

  background:#f8faf7;

  color:#455b4d;

  font-size:14px;

  font-weight:900;
}


/* 추천된 상태 */

.cp-actions
.cp-vote-segment[aria-pressed="true"]{
  border-color:#3f674d;

  background:#fff;
}


.cp-actions
.cp-vote-segment[aria-pressed="true"]
.cp-vote-action{
  background:#42684f;

  color:#fff;
}


.cp-actions
.cp-vote-segment[aria-pressed="true"]
.cp-vote-count{
  border-left-color:#d1dad3;

  background:#fff;

  color:#355842;
}


.cp-actions
.cp-vote-segment:hover{
  border-color:#6d8875;
}


.cp-actions
.cp-vote-segment:focus-visible{
  outline:
    3px solid rgba(66,104,79,.18);

  outline-offset:2px;
}


@media(max-width:700px){

  .cp-actions
  .cp-vote-segment{
    min-height:42px;
  }


  .cp-vote-action{
    padding:
      0 13px;
  }


  .cp-vote-count{
    min-width:38px;

    padding:
      0 10px;
  }

}


/* =========================================================
   HOT BADGE V7
========================================================= */

.cb-hot-badge{
  display:inline-flex !important;

  align-items:center;

  gap:4px;

  margin-right:8px;

  padding:3px 7px;

  border-radius:5px;

  background:#fff0e4 !important;

  color:#c15327 !important;

  font-size:9px !important;

  font-weight:900 !important;

  line-height:1.2;

  vertical-align:middle;

  white-space:nowrap;
}


/* 게시글 상세페이지 상단은
   실제 사이트 헤더 구조를 그대로 사용 */
.community-post-page{
  border-top:0;
}

/* =========================================================
   COMMUNITY WRITE MODAL SIZE FIX
   2026-09-29
========================================================= */

/*
 * 글쓰기/수정 editor dialog만 축소.
 * 상세보기 dialog에는 영향 최소화.
 */
.cb-dialog.cb-editor{
  width:min(800px,92vw) !important;
  max-width:800px !important;

  max-height:82vh !important;

  padding:22px 26px !important;

  overflow-y:auto !important;
  overflow-x:hidden !important;
}


/*
 * 제목 영역도 조금 컴팩트하게.
 */
.cb-dialog.cb-editor h2{
  margin:
    0 0 16px !important;

  font-size:21px !important;
  line-height:1.25 !important;
}


/*
 * 각 입력 영역 간격 축소.
 */
.cb-dialog.cb-editor label{
  margin:
    11px 0 !important;
}


/*
 * 본문 입력창이 화면을 과하게 차지하지 않도록.
 */
.cb-dialog.cb-editor textarea{
  min-height:260px !important;
  height:280px !important;
  max-height:320px !important;

  resize:vertical !important;
}


/*
 * 일반 input/select 높이도 살짝 정리.
 */
.cb-dialog.cb-editor input,
.cb-dialog.cb-editor select{
  min-height:42px !important;
}


/*
 * 작은 화면 대응.
 */
@media(max-width:720px){

  .cb-dialog.cb-editor{
    width:calc(100vw - 24px) !important;
    max-width:none !important;

    max-height:90vh !important;

    padding:18px !important;
  }


  .cb-dialog.cb-editor textarea{
    min-height:220px !important;
    height:240px !important;
    max-height:320px !important;
  }
}

/* /COMMUNITY WRITE MODAL SIZE FIX */

/* =========================================================
   COMMUNITY EDITOR RESPONSIVE SIZE V2
   viewport 기반 반응형 글쓰기 팝업
========================================================= */

/*
 * 데스크톱:
 * 브라우저 크기에 따라 폭/높이를 자동 조절한다.
 */
.cb-dialog.cb-editor{
  width:
    min(
      760px,
      calc(100vw - 48px)
    ) !important;

  max-width:none !important;

  max-height:
    calc(100dvh - 40px) !important;

  box-sizing:border-box !important;

  margin:auto !important;

  padding:
    clamp(16px,2.2vh,24px)
    clamp(18px,2vw,28px)
    !important;

  overflow-y:auto !important;
  overflow-x:hidden !important;
}


/*
 * 제목도 화면 높이에 맞춰 과도하게 커지지 않도록.
 */
.cb-dialog.cb-editor h2{
  margin:
    0 0
    clamp(10px,1.5vh,16px)
    !important;

  font-size:
    clamp(19px,1.6vw,22px)
    !important;

  line-height:1.2 !important;
}


/*
 * 각 항목 사이 간격도 세로 해상도에 대응.
 */
.cb-dialog.cb-editor label{
  margin:
    clamp(7px,1.15vh,12px)
    0 !important;
}


/*
 * 핵심:
 * 본문 textarea 높이를 viewport에 맞춰 자동 변경.
 */
.cb-dialog.cb-editor textarea{
  height:
    clamp(
      170px,
      30dvh,
      300px
    ) !important;

  min-height:150px !important;
  max-height:34dvh !important;

  resize:vertical !important;
}


/*
 * select / input도 세로가 낮은 화면에서는
 * 자동으로 조금 더 컴팩트하게.
 */
.cb-dialog.cb-editor input,
.cb-dialog.cb-editor select{
  min-height:
    clamp(
      36px,
      5vh,
      44px
    ) !important;
}


/*
 * 첨부/공지 등의 영역도 불필요하게
 * 세로 공간을 과도하게 먹지 않도록.
 */
.cb-dialog.cb-editor .cb-editor-actions,
.cb-dialog.cb-editor .cb-editor-footer{
  margin-top:
    clamp(8px,1.4vh,14px)
    !important;
}


/* 세로가 짧은 노트북 / 작은 브라우저 */
@media(max-height:800px){

  .cb-dialog.cb-editor{
    max-height:
      calc(100dvh - 24px) !important;

    padding:
      14px 22px !important;
  }


  .cb-dialog.cb-editor textarea{
    height:24dvh !important;
    min-height:150px !important;
    max-height:220px !important;
  }


  .cb-dialog.cb-editor label{
    margin:7px 0 !important;
  }
}


/* 아주 낮은 세로 화면 */
@media(max-height:650px){

  .cb-dialog.cb-editor textarea{
    height:20dvh !important;
    min-height:120px !important;
    max-height:170px !important;
  }
}


/* 모바일 */
@media(max-width:720px){

  .cb-dialog.cb-editor{
    width:
      calc(100vw - 20px) !important;

    max-height:
      calc(100dvh - 20px) !important;

    padding:
      16px !important;
  }


  .cb-dialog.cb-editor textarea{
    height:
      clamp(
        180px,
        30dvh,
        260px
      ) !important;

    max-height:34dvh !important;
  }
}

/* /COMMUNITY EDITOR RESPONSIVE SIZE V2 */

/* =========================================================
   COMMUNITY EDITOR VIEWPORT LAYOUT V3
   브라우저 화면 안에 글쓰기 폼 전체를 맞춤
========================================================= */

.cb-dialog.cb-editor{
  width:
    min(
      760px,
      calc(100vw - 40px)
    ) !important;

  /*
   * max-height가 아니라 실제 dialog 높이를 viewport 기준으로 제한.
   */
  height:
    min(
      78dvh,
      760px
    ) !important;

  max-height:
    calc(100dvh - 32px) !important;

  box-sizing:border-box !important;

  padding:
    clamp(14px,1.8vh,22px)
    24px !important;

  overflow-y:auto !important;
  overflow-x:hidden !important;
}


/*
 * 입력항목 전체 간격 축소
 */
.cb-dialog.cb-editor label{
  margin:
    clamp(5px,.8vh,9px)
    0 !important;
}


/*
 * 제목
 */
.cb-dialog.cb-editor h2{
  margin:
    0 0
    clamp(7px,1vh,12px)
    !important;

  font-size:20px !important;
}


/*
 * select / 일반 input 높이
 */
.cb-dialog.cb-editor input:not([type="file"]),
.cb-dialog.cb-editor select{
  min-height:36px !important;
  height:clamp(36px,4.5vh,42px) !important;
}


/*
 * 본문:
 * 브라우저 세로크기에 따라 자동 변화.
 */
.cb-dialog.cb-editor textarea{
  height:
    clamp(
      140px,
      20dvh,
      230px
    ) !important;

  min-height:120px !important;
  max-height:230px !important;

  resize:vertical !important;
}


/*
 * 세로 900px 이하
 */
@media(max-height:900px){

  .cb-dialog.cb-editor{
    height:
      calc(100dvh - 50px) !important;

    max-height:
      calc(100dvh - 50px) !important;
  }


  .cb-dialog.cb-editor textarea{
    height:18dvh !important;
    min-height:130px !important;
    max-height:190px !important;
  }
}


/*
 * 세로 750px 이하 노트북
 */
@media(max-height:750px){

  .cb-dialog.cb-editor{
    height:
      calc(100dvh - 30px) !important;

    padding:
      12px 20px !important;
  }


  .cb-dialog.cb-editor label{
    margin:4px 0 !important;
  }


  .cb-dialog.cb-editor textarea{
    height:16dvh !important;
    min-height:105px !important;
    max-height:150px !important;
  }
}


/*
 * 모바일
 */
@media(max-width:720px){

  .cb-dialog.cb-editor{
    width:
      calc(100vw - 16px) !important;

    height:
      calc(100dvh - 16px) !important;

    max-height:
      calc(100dvh - 16px) !important;

    padding:14px !important;
  }


  .cb-dialog.cb-editor textarea{
    height:
      clamp(
        130px,
        22dvh,
        200px
      ) !important;
  }
}

/* /COMMUNITY EDITOR VIEWPORT LAYOUT V3 */

/* =========================================================
   COMMUNITY EDITOR NO DIALOG SCROLL V4
   dialog은 스크롤하지 않고 본문만 스크롤
========================================================= */

.cb-dialog.cb-editor{
  width:
    min(
      760px,
      calc(100vw - 32px)
    ) !important;

  /*
   * 내용에 맞춰 높이는 자동.
   * 단, viewport 밖으로 넘어가지 않는다.
   */
  height:auto !important;

  max-height:
    calc(100dvh - 20px) !important;

  box-sizing:border-box !important;

  padding:
    clamp(12px,1.5vh,20px)
    22px !important;

  /*
   * 핵심:
   * dialog 자체 스크롤 제거.
   */
  overflow:hidden !important;
}


/* 제목 */
.cb-dialog.cb-editor h2{
  margin:
    0 0
    clamp(6px,.8vh,10px)
    !important;

  font-size:20px !important;
  line-height:1.2 !important;
}


/* 폼 간격 */
.cb-dialog.cb-editor label{
  margin:
    clamp(4px,.65vh,8px)
    0 !important;
}


/* 일반 입력창 */
.cb-dialog.cb-editor input:not([type="file"]),
.cb-dialog.cb-editor select{
  height:
    clamp(
      34px,
      4.2vh,
      40px
    ) !important;

  min-height:34px !important;
}


/*
 * 핵심:
 * viewport에서 나머지 폼이 차지하는 영역을 제외한 만큼
 * 본문 높이를 자동 계산.
 */
.cb-dialog.cb-editor textarea{
  height:
    clamp(
      110px,
      calc(100dvh - 565px),
      260px
    ) !important;

  min-height:110px !important;
  max-height:260px !important;

  /*
   * 글이 길어질 때만 textarea 내부 스크롤.
   */
  overflow-y:auto !important;
  overflow-x:hidden !important;

  resize:none !important;
}


/*
 * 파일첨부 / 공지영역 등의 불필요한 여백 축소
 */
.cb-dialog.cb-editor .cb-editor-actions,
.cb-dialog.cb-editor .cb-editor-footer{
  margin-top:8px !important;
}


/* 세로가 낮은 브라우저 */
@media(max-height:800px){

  .cb-dialog.cb-editor{
    padding:
      10px 20px !important;
  }


  .cb-dialog.cb-editor label{
    margin:3px 0 !important;
  }


  .cb-dialog.cb-editor textarea{
    height:
      clamp(
        100px,
        calc(100dvh - 520px),
        180px
      ) !important;

    min-height:100px !important;
    max-height:180px !important;
  }
}


/* 매우 낮은 화면 */
@media(max-height:650px){

  .cb-dialog.cb-editor textarea{
    height:
      clamp(
        80px,
        calc(100dvh - 490px),
        130px
      ) !important;

    min-height:80px !important;
    max-height:130px !important;
  }
}


/* 모바일 */
@media(max-width:720px){

  .cb-dialog.cb-editor{
    width:
      calc(100vw - 12px) !important;

    max-height:
      calc(100dvh - 12px) !important;

    padding:
      12px !important;
  }


  .cb-dialog.cb-editor textarea{
    height:
      clamp(
        100px,
        calc(100dvh - 520px),
        220px
      ) !important;

    max-height:220px !important;
  }
}

/* /COMMUNITY EDITOR NO DIALOG SCROLL V4 */
