:root{
  --text: #222;
  --muted: #666;
  --line: #eaeaea;   /* 연한 테두리 */
}
#cards, #view, #bln-view { scroll-margin-top: 150px; }
.bln-view-head { position: relative; }
/* ===== 카드 그리드 ===== */
.bln-card-grid{ 
  list-style:none; margin: 0 auto; padding:0 20px; margin-top: 100px; margin-bottom: 150px;
  display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 36px;
  max-width: 1200px;
}
@media (max-width: 1100px){
  .bln-card-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); gap:28px;}
}
@media (max-width: 640px){
  .bln-card-grid{ grid-template-columns: 1fr; gap:22px; margin: 0px auto; margin-bottom: 50px; margin-top: 0px;}
}

/* ===== 카드 (lift + shadow + inner image zoom) ===== */
.bln-card{
  background:#fff;
  /* border:1px solid var(--line); */
  border-radius:0;
  overflow:hidden;
  display:flex; flex-direction:column;
  transform: translateY(0);
  box-shadow: 0 0 0 rgba(0,0,0,0);
  transition:
    transform .28s cubic-bezier(.2,.8,.2,1),
    box-shadow .28s cubic-bezier(.2,.8,.2,1),
    border-color .28s ease;
  will-change: transform, box-shadow;
}
.bln-card:hover,
.bln-card:focus-within{
  transform: translateY(-8px);
  box-shadow: 0 18px 40px rgba(0,0,0,.10);
  border-color: transparent;
}
.bln-card:active{
  transform: translateY(-3px);
  box-shadow: 0 10px 22px rgba(0,0,0,.08);
}

.bln-btn-write {
  display:inline-block;
  background:#222;
  color:#fff;
  padding:6px 16px;
  border-radius:4px;
  font-size:14px;
  line-height:1.4;
  transition:background 0.25s;
}
.bln-btn-write:hover { background:#000; }

/* ===== 썸네일 ===== */
.bln-thumb{
  display:block; position:relative; aspect-ratio: 3 / 2; overflow:hidden;
  background:#f6f6f6;
}
.bln-thumb img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform: scale(1);
  transition: transform .45s cubic-bezier(.2,.8,.2,1);
  will-change: transform;
  backface-visibility: hidden;
}
.bln-card:hover .bln-thumb img,
.bln-card:focus-within .bln-thumb img{
  transform: scale(1.04);
}

/* ===== 본문 ===== */
.bln-body{ padding:22px 20px 24px; text-align:left; }
.bln-title{ font-size:18px; font-weight:600; line-height:1.5; margin:0 0 10px; color:var(--text); }
.bln-title a{ color:inherit; text-decoration:none; }
.bln-title a:hover{ text-decoration:underline; }
.bln-desc{ color:var(--muted); font-size:14px; line-height:1.7; margin:0 0 12px; }

/* ===== 날짜 ===== */
.bln-date{
  font-size:13px;
  color:#aaa;
  margin-top:auto;
}

/* ===== 빈 상태 ===== */
.bln-empty{
  grid-column: 1 / -1;
  text-align:center;
  color:var(--muted);
  padding:60px 0;
  border:1px dashed var(--line);
}

/* ===== 페이지네이션 ===== */
.bln-paging{ margin: 32px 0; display:flex; justify-content:center; }

/* =========================
   View (상세 페이지)
   ========================= */
.bln-view{ max-width: 1080px; margin: 100px auto; padding: 40px 20px 80px; color:#222; }

.bln-view-kicker{
  font-size:14px; letter-spacing:.08em; color:#a7a7a7; margin: 0 0 16px;
}
.bln-view-title{
  font-size: clamp(28px, 6vw, 56px);
  line-height: 1.15;
  font-weight: 800;
  margin: 0 0 20px;
}
.bln-view-date{
  display:block;
  font-size:16px;
  color:#888;
  margin-bottom: 20px;
  margin-top: 50px;
}
.bln-view-divider{
  border:0; height:1px; background:#e6e6e6; margin: 16px 0 28px;
}

/* 본문 타이포 */
.bln-view-content{margin-top: 50px; margin-bottom: 100px;}

.bln-view-content,
.bln-view-content * {
  font-size: clamp(14px, 2vw, 18px) !important;
  line-height: 1.8 !important;
  color: #222 !important;
  font-weight: 300 !important;
}

.bln-view-content p,
.bln-view-content div,
.bln-view-content span {
    word-break: keep-all; /* 단어(어절) 단위로 줄바꿈 */
    overflow-wrap: break-word; /* 필요할 때만 줄바꿈 */}


.bln-view-content p{ margin: 0 0 1.1em; }
.bln-view-content img{
  max-width:100%; height:auto; display:block; margin: 22px auto;
}
.bln-view-content a{ color:#333; text-decoration: underline; }

/* 관련 링크 박스 */
.bln-view-links{
  margin: 34px 0 24px;
  padding: 18px 20px;
  border:1px solid #eee;
  border-radius: 10px;
  background:#fafafa;
}
.bln-view-links h3{
  margin:0 0 10px; font-size:16px; font-weight:700;
}
.bln-view-links ul{ list-style:none; margin:0; padding:0; }
.bln-view-links li{ display:flex; gap:10px; align-items:center; padding:6px 0; color:#666; }
.bln-view-links a{ color:#3a3a3a; text-decoration:underline; overflow-wrap:anywhere; }

/* 하단 네비게이션 */
.bln-view-nav{
  display:grid; grid-template-columns: 1fr auto 1fr;
  align-items:center; gap: 12px; padding-top: 18px;
}
.bln-nav-left{ justify-self:start; }
.bln-nav-center{ justify-self:center; }
.bln-nav-right{ justify-self:end; }

.bln-btn-list{
  display:inline-flex; align-items:center; justify-content:center;
  min-width: 180px; height:48px; padding:0 22px;
  border:1px solid #cdbda9; border-radius:999px;
  background:#d6c7b6; color:#fff; font-weight:700; text-decoration:none;
  transition: filter .2s ease, background .2s ease, color .2s ease;
}
.bln-btn-list:hover{ filter:brightness(.95); }

.bln-btn-prev, .bln-btn-next{
  color:#7a7a7a; text-decoration:none; font-weight:600; border-bottom:1px solid transparent;
}
.bln-btn-prev:hover, .bln-btn-next:hover{ border-bottom-color:#bbb; }

@media (max-width: 640px){
  .bln-btn-list{ min-width: 140px; height:44px; }
  .bln-view{ padding: 28px 16px 60px; margin: 0px auto; }
}

.bln-view-admin .bln-btn{
  display:inline-flex; align-items:center; justify-content:center;
  height:36px; padding:0 12px; border:1px solid #ddd; border-radius:8px;
  background:#fff; color:#333; text-decoration:none;
}
.bln-view-admin .bln-btn:hover{ filter:brightness(.97); }

/* =========================
   Write (글쓰기/수정)
   ========================= */
.bln-write-form{ max-width: 1080px; margin: 0 auto; padding: 30px 20px 60px; }
.bln-field{ margin-bottom: 18px; }
.bln-label{ display:block; font-weight:700; margin-bottom:8px; }
.req{ color:#d14; font-weight:800; }

.bln-input{
  width:100%; padding:12px 14px; font-size:16px;
  border:1px solid #e3e3e3; border-radius:6px; background:#fff;
}
.bln-input:focus{ outline:none; border-color:#bbb; }

.bln-editor{ border:1px solid #e3e3e3; border-radius:6px; overflow:hidden; }

.bln-options{ display:flex; flex-wrap:wrap; gap:14px; margin:16px 0 8px; }
.bln-opt{ display:inline-flex; align-items:center; gap:6px; color:#555; }

.bln-write-actions{ display:flex; gap:10px; margin-top:16px; }
.bln-btn{
  display:inline-flex; align-items:center; justify-content:center;
  height:44px; padding:0 18px; border:1px solid #ddd; border-radius:10px;
  background:#fff; color:#333; text-decoration:none; cursor:pointer;
}
.bln-btn-primary{
  border-color:#cdbda9; background:#d6c7b6; color:#fff; font-weight:700;
}
.bln-btn:hover{ filter:brightness(.97); }

@media (max-width:640px){
  .bln-write-actions{ flex-direction:column; }
  .bln-btn{ width:100%; }
}

/* 사용자의 모션 감소 설정 존중 */
@media (prefers-reduced-motion: reduce){
  .bln-card,
  .bln-thumb img,
  .bln-btn,
  .bln-btn-list{
    transition: none !important;
  }
  .bln-card:hover,
  .bln-card:focus-within{ transform:none; box-shadow:none; }
}



/* admin checkboxes on list */
.bln-chk{position:absolute; top:10px; left:10px; z-index:3; display:inline-flex; align-items:center;}
.bln-chk input{position:absolute; opacity:0;}
.bln-chk span{width:18px; height:18px; border:1px solid #ccc; border-radius:4px; background:#fff;}
.bln-chk input:checked + span{background:#333; border-color:#333; box-shadow: inset 0 0 0 3px #fff;}
.bln-card{ position:relative; } /* 체크박스 위치 기준 */
.bln-admin-actions{display:flex; align-items:center; gap:10px; margin:12px 0 0;}
.bln-chk-all{display:inline-flex; align-items:center; gap:6px; color:#666; font-size:14px;}
.bln-btn-danger{padding:8px 14px; border:1px solid #e66; background:#f66; color:#fff; border-radius:8px; font-weight:700; cursor:pointer;}
.bln-btn-danger:hover{filter:brightness(.95);}



/* 카드는 레이어 기준점 필요 */
.bln-card{ position:relative; }

/* 관리자 체크박스 */
.bln-chk{
  position:absolute; top:10px; left:10px; z-index:20;
  display:inline-flex; align-items:center;
}
.bln-chk input{ position:absolute; opacity:0; pointer-events:none; }
.bln-chk span{
  width:18px; height:18px; border:1px solid #bbb; border-radius:4px; background:#fff;
  box-shadow:0 0 0 1px rgba(0,0,0,.02) inset;
}
.bln-chk input:checked + span{ background:#333; border-color:#333; box-shadow: inset 0 0 0 3px #fff; }

.bln-admin-actions{ display:flex; align-items:center; gap:10px; margin:12px 0 0; }
.bln-chk-all{ display:inline-flex; align-items:center; gap:6px; color:#666; font-size:14px; }
.bln-btn-danger{
  padding:8px 14px; border:1px solid #e66; background:#f66; color:#fff; border-radius:8px; font-weight:700; cursor:pointer;
}
.bln-btn-danger:hover{ filter:brightness(.95); }

.btn_bo_user{display:flex; gap:10px; align-items:center}
.bo_fx{display:flex; justify-content:flex-start; gap:12px; margin:18px 0}
.all_chk{width:48px}