/* ===== 1. 기본 초기화 및 레이아웃 ===== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: 'Pretendard', sans-serif;
  background: #fafafa; /* 완전 백색 대신 미세한 연회색 배경으로 카드들을 돋보이게 함 */
  color: #111;
  letter-spacing: -0.04em;
}

.board-page {
  max-width: 1600px; 
  margin: auto;
  padding: 160px 40px 120px; 
}

.board-layout {
  display: grid;
  grid-template-columns: 260px 1fr; /* 사이드바에 조금 더 안정감 부여 */
  gap: 70px; 
  align-items: start; 
}

.board-main {
  width: 100%;
}

/* ===== 2. 상단 헤더 타이틀 영역 (트렌디 감성 보강) ===== */
.board-header {
  text-align: left;
  border-left: 5px solid #111112;
  padding-left: 20px;
  margin-bottom: 45px;
}

.board-header h1 {
  font-size: 46px;
  font-weight: 900;
  color: #111112;
  margin-bottom: 12px;
  letter-spacing: -0.05em;
}

.board-header p {
  font-size: 14px;
  line-height: 1.8;
  color: #66666f;
  max-width: 720px;
  font-weight: 500;
}

/* ===== 3. 왼쪽 사이드바 (글래스모피즘 & 네온 임팩트 효과) ===== */
.board-sidebar {
  background: linear-gradient(145deg, #141416, #1d1d22); /* 뻔한 블랙 대신 깊이감 있는 그라데이션 */
  border: 1px solid rgba(255, 255, 255, 0.05);    
  border-radius: 20px; /* 더 둥글고 트렌디하게 */
  padding: 28px 18px;          
  width: 100%;
  height: auto; /* 무조건 1200px 대신 콘텐츠가 늘어날 수 있도록 자연스럽게 처리 */
  min-height: 520px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15); /* 바닥에 부드러운 그림자 */
}

.board-sidebar .board-tab {
  display: block;
  width: 100%;
  border: none;
  background: none;
  color: #8a8a93;              
  text-align: left;
  padding: 18px 22px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  border-radius: 12px;
  margin-bottom: 10px;
  position: relative;          
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* 마우스 올렸을 때의 힙한 발광 효과 */
.board-sidebar .board-tab:hover {
  background: rgba(255, 255, 255, 0.04);
  color: #fff !important;      
  padding-left: 26px; /* 살짝 오른쪽으로 밀리는 위트 있는 모션 */
}

/* 마우스 올릴 때 슥 늘어나는 하단 노란 밑줄 효과 */
.board-sidebar .board-tab::after {
  content: "";
  position: absolute;
  bottom: 12px;                
  left: 22px;                  
  width: 0;                    
  height: 2px;                 
  background-color: #fff200;   
  transition: width 0.3s ease;
}

.board-sidebar .board-tab:hover::after {
  width: 40px; /* 너무 길지 않고 포인트만 주도록 조율 */
}

/* 활성화 상태 (럭셔리 화이트 반전 카드룩) */
.board-sidebar .board-tab.active {
  background: #ffffff !important; 
  color: #000000 !important;      
  font-weight: 800;
  box-shadow: 0 10px 20px rgba(255, 255, 255, 0.1);
  padding-left: 24px;
}

.board-sidebar .board-tab.active::after,
.board-sidebar .board-tab.active::before {
  display: none !important;
  content: none !important;
}

/* ===== 4. 게시판 리스트 / 테이블 영역 (네오 미니멀리즘 입체 카드룩) ===== */
.board-table {
  border-top: 2px solid #111112;
  background: #fff;
  border-radius: 16px 16px 0 0;
  box-shadow: 0 4px 20px rgba(0,0,0,0.02);
}

/* 헤더 행 */
.board-row.board-head {
  background: #fdfdfd;
  border-bottom: 2px solid #eeeef2;
  min-height: 54px;
}

.board-head div {
  font-size: 13px;
  font-weight: 800;
  color: #888893;
  text-transform: uppercase;
}

/* 일반 게시글 행 */
.board-row {
  display: grid;
  grid-template-columns: 80px 1fr 140px 140px 80px;
  align-items: center;
  min-height: 68px; /* 조금 더 시원하게 늘린 높이 */
  border-bottom: 1px solid #f0f0f5;
  font-size: 14.5px;
  color: #33333a;
  transition: all 0.25s ease;
  background: #fff;
}

/* 🌟 [핵심 변경] 마우스 오버 시 행 전체가 입체적으로 스르륵 떠오르는 고급 효과 */
.board-row:not(.board-head):hover {
  background: #ffffff;
  transform: translateY(-2px); /* 공중으로 띄우기 */
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.06); /* 그림자 뿜기 */
  border-bottom-color: transparent;
  z-index: 2;
  cursor: pointer;
}

.board-row > div {
  padding: 0 16px;
}

/* 번호 정렬 디자인 */
.board-row > div:first-child {
  color: #aaa;
  font-weight: 600;
  font-size: 13px;
}

/* 🌟 제목 영역 트렌디 폰트 두께 및 네이밍 */
.board-title {
  font-weight: 700;
  color: #111112;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  padding-bottom: 2px;
  transition: color 0.2s;
}

.board-row:hover .board-title {
  color: #000; /* 호버 시 글자색 조금 더 딥하게 */
}

/* 공지사항 전용 뱃지 스타일 구현 */
.board-row div:first-child:has(span), 
.board-row div:contains("공지") {
  color: #ff3b30 !important;
  font-weight: 800;
}

/* ===== 5. 하단 원본 유틸리티 바 (예쁜 원래 디자인 골격 유지 + 디테일 깎기) ===== */
.board-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 35px;
  padding: 0 5px;
}

/* 예쁜 연회색 둥근 검색창 (포커스 시 네온 보더 인풋 효과 보강) */
#boardSearch {
  width: 280px;
  padding: 12px 18px;
  border: 1px solid #e5e5ea;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  background-color: #f6f6f9;
  color: #111;
  outline: none;
  transition: all 0.3s ease;
}

#boardSearch:focus {
  border-color: #111112;
  background-color: #fff;
  box-shadow: 0 8px 16px rgba(0,0,0,0.04);
}

/* 시크한 블랙 글쓰기 버튼 (미세하게 커지고 짱짱한 감성 장착) */
.write-btn {
  background-color: #111112;
  color: #fff;
  border: none;
  padding: 13px 32px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transition: all 0.2s ease;
}

.write-btn:hover {
  background-color: #2c2c2e;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}

/* ===== 6. 하단 페이지 숫자 (세련된 선명 누드 디자인 고도화) ===== */
.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;                 
  margin-top: 50px;
}

.pagination button {
  background: none !important; 
  border: none !important;     
  box-shadow: none !important;
  outline: none !important;
  color: #9a9a9f !important;                 
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  padding: 8px 12px;
  border-radius: 8px;
  position: relative;
  transition: all 0.2s ease;
}

.pagination button:hover:not(:disabled) {
  color: #111112 !important;
  background-color: rgba(0, 0, 0, 0.03) !important; /* 가볍게 감싸지는 원형 셰입느낌 */
}

/* 선택된 현재 숫자: 진하게 강조 + 하단 노란 도트 포인트 확실하게 */
.pagination button.active {
  color: #111112 !important;   
  font-weight: 800 !important;   
  background-color: rgba(0, 0, 0, 0.02) !important;
}

.pagination button.active::after {
  content: "";
  position: absolute;
  bottom: 2px; /* 도트 위치 정교화 */
  left: 50%;
  transform: translateX(-50%);
  width: 5px;
  height: 5px;
  background-color: #fff200;   
  border-radius: 50%;
  box-shadow: 0 0 6px #fff200; /* 미세하게 빛나는 야간 효과 */
}

.pagination button.page-arrow {
  font-size: 12px;
  color: #55555a !important;
  font-weight: 800;
}

.pagination button.dummy-page {
  color: #e5e5ea !important;
  cursor: not-allowed;
}

.pagination button:disabled {
  opacity: 0.15 !important;
  cursor: not-allowed;
}


/* ==========================================================================
   🌟 이전에 짜두었던 모바일 폰 스와이프 전용 레이아웃 매끄럽게 결합
   ========================================================================== */
@media (max-width: 768px) {
  .board-layout {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .board-page {
    padding: 110px 20px 100px; 
  }

  .board-header {
    border-left-width: 4px;
    margin-bottom: 25px;
  }

  .board-header h1 {
    font-size: 30px; 
  }

  .board-sidebar {
    flex-direction: row !important;
    overflow-x: auto;
    white-space: nowrap;
    gap: 8px;
    height: auto;
    min-height: auto;
    padding: 10px;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.1);
    -webkit-overflow-scrolling: touch; 
  }

  .board-sidebar::-webkit-scrollbar {
    display: none;
  }

  .board-sidebar .board-tab {
    display: inline-block;
    width: auto; 
    padding: 12px 18px !important;
    margin-bottom: 0 !important; 
    font-size: 13.5px;
    border-radius: 8px;
    flex-shrink: 0; 
  }

  .board-sidebar .board-tab:hover {
    padding-left: 18px; /* 모바일 밀림현상 방어 */
  }

  .board-sidebar .board-tab::after {
    display: none !important;
  }

  .board-row {
    grid-template-columns: 50px 1fr 90px; 
    min-height: 64px;
  }
  
  .board-row > div:nth-child(4),
  .board-row > div:nth-child(5) {
    display: none; 
  }
  
  .board-bottom {
    flex-direction: column; 
    gap: 12px;
    align-items: stretch;
    margin-top: 25px;
  }
  
  #boardSearch {
    width: 100%; 
  }
  
  .write-btn {
    width: 100%; 
    text-align: center;
    padding: 14px;
  }
}

/* ===== community board redesign ===== */
.board-category-bar{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  margin:-8px 0 42px;
  padding:8px;
  border-radius:999px;
  background:#e5f4f0;
}

.board-category-bar[hidden]{
  display:none;
}

.board-category-bar button{
  min-width:96px;
  height:46px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:#087461;
  font-size:14px;
  font-weight:900;
  cursor:pointer;
  transition:background .22s ease, color .22s ease, transform .22s ease;
}

.board-category-bar button.active{
  background:#080808;
  color:#fff;
  box-shadow:0 10px 26px rgba(0,0,0,.12);
}

.board-category-bar button:hover{
  transform:translateY(-1px);
}

.board-page[data-board-mode="official"],
.board-page[data-board-mode="consult"]{
  max-width:1240px;
}

.board-page[data-board-mode="official"] .board-layout,
.board-page[data-board-mode="consult"] .board-layout{
  grid-template-columns:220px 1fr;
  gap:58px;
}

.board-page[data-board-mode="official"] .board-header,
.board-page[data-board-mode="consult"] .board-header{
  max-width:680px;
  margin:0 auto 44px;
  padding-left:0;
  border-left:0;
  text-align:center;
}

.board-page[data-board-mode="official"] .board-header h1,
.board-page[data-board-mode="consult"] .board-header h1{
  font-size:clamp(38px, 5vw, 58px);
  line-height:1.06;
  letter-spacing:-.04em;
}

.board-page[data-board-mode="official"] .board-header p,
.board-page[data-board-mode="consult"] .board-header p{
  max-width:none;
  margin:0 auto;
  color:#151515;
  font-size:17px;
  font-weight:800;
  line-height:1.72;
}

.board-page[data-board-mode="official"] .board-main,
.board-page[data-board-mode="consult"] .board-main{
  text-align:center;
}

.board-page[data-board-mode="official"] .board-table,
.board-page[data-board-mode="consult"] .board-table{
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.board-page[data-board-mode="official"] .board-head,
.board-page[data-board-mode="consult"] .board-head{
  display:none;
}

.board-page[data-board-mode="official"] .board-bottom,
.board-page[data-board-mode="consult"] .board-bottom{
  max-width:760px;
  margin:0 auto 28px;
}

.board-page[data-board-mode="official"] #boardSearch,
.board-page[data-board-mode="consult"] #boardSearch{
  width:min(100%, 420px);
  height:58px;
  border:0;
  border-radius:18px;
  background:#f5f5f7;
  text-align:center;
  box-shadow:0 12px 30px rgba(0,0,0,.04);
}

.board-page[data-board-mode="official"] .write-btn,
.board-page[data-board-mode="consult"] .write-btn{
  height:58px;
  border-radius:18px;
}

.board-empty{
  padding:70px 20px;
  border-top:1px solid #111;
  border-bottom:1px solid #dedede;
  color:#777;
  font-size:15px;
  font-weight:800;
  text-align:center;
}

.official-post-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:34px 28px;
  text-align:left;
}

.official-post-card{
  cursor:pointer;
}

.official-post-thumb{
  position:relative;
  aspect-ratio:1 / .72;
  overflow:hidden;
  border-radius:4px;
  background:#111;
  box-shadow:0 18px 42px rgba(0,0,0,.1);
}

.official-post-thumb img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transition:transform .5s ease;
}

.official-post-card:hover .official-post-thumb img{
  transform:scale(1.045);
}

.official-post-thumb.no-thumb{
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    linear-gradient(135deg, rgba(255,255,255,.08), transparent),
    #101010;
}

.official-post-thumb.no-thumb span{
  color:#fff;
  font-size:30px;
  font-weight:950;
}

.official-post-thumb strong{
  position:absolute;
  left:12px;
  top:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:52px;
  height:28px;
  padding:0 10px;
  border-radius:999px;
  background:#007f6b;
  color:#fff;
  font-size:12px;
  font-weight:950;
}

.official-post-body{
  padding-top:18px;
}

.official-post-kicker{
  display:block;
  margin-bottom:8px;
  color:#007f6b;
  font-size:13px;
  font-weight:950;
}

.official-post-body h2{
  margin:0 0 16px;
  color:#080808;
  font-size:21px;
  font-weight:950;
  line-height:1.36;
  letter-spacing:-.02em;
}

.official-post-body time{
  color:#777;
  font-size:15px;
  font-weight:600;
}

.consult-post-list{
  border-top:1px solid #111;
  text-align:left;
}

.consult-post-card{
  position:relative;
  min-height:118px;
  padding:24px 132px 22px 0;
  border-bottom:1px solid #d7d7d7;
  cursor:pointer;
  transition:background .22s ease, padding-left .22s ease;
}

.consult-post-card:hover{
  padding-left:16px;
  background:#fafafa;
}

.consult-post-meta-top{
  margin-bottom:12px;
  color:#8a8a8a;
  font-size:14px;
  font-weight:800;
}

.consult-post-main{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.consult-post-main h2{
  margin:0;
  color:#080808;
  font-size:21px;
  font-weight:950;
  line-height:1.38;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.consult-status{
  position:absolute;
  right:0;
  top:50%;
  min-width:174px;
  height:34px;
  padding:0 18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#f1f1f1;
  color:#333;
  font-size:13px;
  font-weight:900;
  transform:translateY(-50%);
}

.consult-status.done{
  background:#050505;
  color:#fff;
}

.consult-status:not(.done){
  background:#fff7bd;
  color:#6f6200;
}

.consult-post-meta-bottom{
  display:flex;
  align-items:center;
  gap:22px;
  margin-top:18px;
  color:#8a8a8a;
  font-size:14px;
  font-weight:700;
}

.consult-post-meta-bottom em{
  font-style:normal;
  color:#111;
}

@media(max-width:900px){
  .board-page[data-board-mode="official"] .board-layout,
  .board-page[data-board-mode="consult"] .board-layout{
    display:block;
  }

  .board-category-bar{
    margin:2px auto 42px;
  }

  .official-post-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:30px 18px;
  }
}

@media(max-width:768px){
  .board-page[data-board-mode="official"],
  .board-page[data-board-mode="consult"]{
    padding:98px 20px 92px;
  }

  .board-page[data-board-mode="official"] .board-header,
  .board-page[data-board-mode="consult"] .board-header{
    margin-bottom:34px;
  }

  .board-page[data-board-mode="official"] .board-header h1,
  .board-page[data-board-mode="consult"] .board-header h1{
    font-size:34px;
  }

  .board-page[data-board-mode="official"] .board-header p,
  .board-page[data-board-mode="consult"] .board-header p{
    font-size:14px;
  }

  .board-category-bar{
    width:100%;
    max-width:310px;
  }

  .board-category-bar button{
    min-width:0;
    flex:1;
    height:44px;
    font-size:13px;
  }

  .board-page[data-board-mode="official"] .board-bottom,
  .board-page[data-board-mode="consult"] .board-bottom{
    margin-bottom:18px;
  }

  .official-post-grid{
    display:block;
  }

  .official-post-card{
    display:block;
    margin-bottom:30px;
  }

  .official-post-thumb{
    aspect-ratio:1 / .7;
    border-radius:3px;
  }

  .official-post-body{
    padding-top:16px;
  }

  .official-post-body h2{
    font-size:19px;
  }

  .consult-post-card{
    min-height:112px;
    padding:22px 88px 18px 0;
  }

  .consult-post-main h2{
    font-size:18px;
  }

  .consult-status{
    min-width:72px;
    height:32px;
    font-size:12px;
  }

  .consult-post-meta-bottom{
    gap:16px;
    font-size:13px;
  }
}

/* ===== final board tab layout without left sidebar ===== */
.board-layout,
.board-page[data-board-mode="official"] .board-layout,
.board-page[data-board-mode="consult"] .board-layout{
  display:block !important;
}

.board-sidebar{
  display:none !important;
}

.board-main{
  width:min(100%, 980px);
  margin:0 auto;
}

.board-category-bar{
  max-width:min(100%, 650px);
  margin:0 auto 42px;
  flex-wrap:wrap;
}

.board-page[data-board-mode="official"] .board-category-bar{
  max-width:min(100%, 520px);
}

.board-category-bar button{
  min-width:0;
  padding:0 24px;
}

.board-page[data-board-mode="consult"] .board-category-bar button{
  padding:0 18px;
}

.consult-post-card{
  padding-right:0;
}

.consult-post-card.has-status{
  padding-right:208px;
}

.consult-post-card:not(.has-status) .consult-post-main{
  padding-right:0;
}

@media(max-width:768px){
  .board-page[data-board-mode="official"],
  .board-page[data-board-mode="consult"]{
    padding-left:18px;
    padding-right:18px;
  }

  .board-category-bar{
    width:100%;
    max-width:100%;
    justify-content:flex-start;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  .board-category-bar::-webkit-scrollbar{
    display:none;
  }

  .board-category-bar button{
    flex:0 0 auto;
    min-width:78px;
    padding:0 16px;
    white-space:nowrap;
  }

  .board-page[data-board-mode="consult"] .board-category-bar button{
    min-width:74px;
    padding:0 13px;
  }

  .consult-post-card{
    padding-right:0;
  }

  .consult-post-card.has-status{
    padding-right:0;
    padding-bottom:68px;
  }
}

/* ===== unified board typography ===== */
:root{
  --board-title:42px;
  --board-card-title:20px;
  --board-body:15px;
  --board-meta:13px;
}

.board-page,
.board-page button,
.board-page input,
.board-page select{
  font-family:'Pretendard',Arial,sans-serif;
  letter-spacing:0;
}

.board-header h1,
.board-page[data-board-mode="official"] .board-header h1,
.board-page[data-board-mode="consult"] .board-header h1{
  font-size:var(--board-title) !important;
  font-weight:800 !important;
  line-height:1.14 !important;
  letter-spacing:0 !important;
}

.board-header p,
.board-page[data-board-mode="consult"] .board-header p{
  font-size:16px !important;
  font-weight:600 !important;
  line-height:1.64 !important;
  letter-spacing:0 !important;
  word-break:keep-all;
}

.board-category-bar button,
.write-btn,
.search-box input,
.search-box button{
  font-size:14px !important;
  font-weight:800 !important;
  line-height:1.2 !important;
  letter-spacing:0 !important;
}

.board-title,
.official-post-body h2,
.consult-post-main h2{
  font-size:var(--board-card-title) !important;
  font-weight:800 !important;
  line-height:1.34 !important;
  letter-spacing:0 !important;
  word-break:keep-all;
}

.official-post-body p,
.consult-post-excerpt,
.empty-text,
.board-row,
.board-table{
  font-size:var(--board-body) !important;
  font-weight:600 !important;
  line-height:1.62 !important;
  letter-spacing:0 !important;
}

.board-meta,
.post-meta,
.consult-post-meta-top,
.consult-post-meta-bottom,
.consult-status,
.official-post-meta,
.official-post-tag{
  font-size:var(--board-meta) !important;
  font-weight:700 !important;
  line-height:1.35 !important;
  letter-spacing:0 !important;
}

@media(max-width:768px){
  :root{
    --board-title:30px;
    --board-card-title:18px;
    --board-body:14px;
    --board-meta:12px;
  }

  .board-header{
    margin-bottom:26px;
  }

  .board-header p,
  .board-page[data-board-mode="consult"] .board-header p{
    font-size:14px !important;
    line-height:1.58 !important;
  }

  .board-category-bar{
    margin-bottom:30px;
  }
}

/* ===== yellow board category tabs ===== */
.board-category-bar{
  background:#fff7bd !important;
  max-width:min(100%, 900px);
}

.board-category-bar button{
  color:#6f6200 !important;
}

.board-category-bar button.active{
  background:#080808 !important;
  color:#fff !important;
  box-shadow:0 12px 28px rgba(0,0,0,.14), 0 0 0 1px rgba(255,242,0,.18) !important;
}

.official-post-kicker,
.role-admin{
  color:#8a7900 !important;
}

.official-post-thumb strong,
.official-post-tag{
  background:#fff200 !important;
  color:#111 !important;
}

.board-page[data-board="request"] .consult-post-card{
  padding-right:208px;
}

@media(max-width:768px){
  .board-page[data-board="request"] .consult-post-card{
    padding-right:0;
    padding-bottom:68px;
  }

  .board-page[data-board="request"] .consult-status,
  .consult-post-card.has-status .consult-status{
    right:auto;
    left:0;
    top:auto;
    bottom:18px;
    transform:none;
  }
}

/* ===== unified board tabs and visible search ===== */
.board-category-bar.is-grouped{
  width:min(760px, 100%);
  display:grid !important;
  gap:0;
  margin:0 auto 30px !important;
  padding:0 !important;
  border-radius:0 !important;
  background:#fff !important;
  box-shadow:none !important;
}

.board-category-primary{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  height:58px;
  border-bottom:1px solid #eceff3;
  background:#fff;
}

.board-category-primary button{
  position:relative;
  height:58px;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#111827 !important;
  font-size:18px !important;
  font-weight:950 !important;
  letter-spacing:0 !important;
  box-shadow:none !important;
}

.board-category-primary button.active::after{
  content:"";
  position:absolute;
  left:22px;
  right:22px;
  bottom:-1px;
  height:3px;
  border-radius:999px;
  background:#ffd54a;
}

.board-category-secondary{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  min-height:54px;
  padding:11px 10px;
  overflow-x:auto;
  background:#fafafa;
  -webkit-overflow-scrolling:touch;
}

.board-category-secondary[hidden]{
  display:none !important;
}

.board-category-secondary::-webkit-scrollbar{
  display:none;
}

.board-category-secondary button{
  flex:0 0 auto;
  height:32px;
  padding:0 18px;
  border:0 !important;
  border-radius:999px !important;
  background:transparent !important;
  color:#68707c !important;
  font-size:13px !important;
  font-weight:900 !important;
  letter-spacing:0 !important;
  box-shadow:none !important;
  white-space:nowrap;
}

.board-category-secondary button.active{
  background:#ffecad !important;
  color:#b88612 !important;
}

.board-page[data-board-mode="official"] #boardSearch,
.board-page[data-board-mode="consult"] #boardSearch,
#boardSearch{
  width:min(100%, 460px) !important;
  height:54px !important;
  border:2px solid #111 !important;
  border-radius:14px !important;
  background:#fff !important;
  color:#111 !important;
  text-align:left !important;
  padding:0 18px 0 46px !important;
  box-shadow:0 10px 26px rgba(0,0,0,.08) !important;
  background-image:linear-gradient(transparent, transparent), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:16px center !important;
}

#boardSearch::placeholder{
  color:#555 !important;
  opacity:1;
}

@media(max-width:768px){
  .board-category-bar.is-grouped{
    width:100%;
  }

  .board-category-primary{
    height:46px;
  }

  .board-category-primary button{
    height:46px;
    font-size:16px !important;
  }

  .board-category-secondary{
    min-height:48px;
    gap:8px;
    padding:10px 6px;
  }

  .board-category-secondary button{
    height:28px;
    padding:0 14px;
    font-size:12px !important;
  }
}


/* ===== pinned notice posts ===== */
.notice-title-prefix{
  color:#9a6700;
  font-weight:1000;
}

.board-row.is-notice{
  border-bottom-color:#ead68b;
  background:#fff9df;
}

.board-row.is-notice:hover{
  background:#fff5c2;
}

.board-row.is-notice > div:first-child{
  color:#9a6700 !important;
  font-weight:950 !important;
}

.board-row.is-notice .board-title{
  color:#050505;
  font-weight:1000;
}

.official-post-card.is-notice,
.consult-post-card.is-notice{
  border-radius:10px;
  background:#fff9df;
}

.official-post-card.is-notice{
  padding:10px;
  box-shadow:0 14px 34px rgba(128,91,0,.12);
}

.official-post-card.is-notice .official-post-body h2,
.consult-post-card.is-notice .consult-post-main h2{
  color:#050505;
  font-weight:1000;
}

.consult-post-card.is-notice{
  padding-left:18px;
  padding-right:18px;
  border-bottom:2px solid #d8b84b;
}

.consult-post-card.is-notice:hover{
  padding-left:24px;
  background:#fff5c2;
}

/* ===== compact board list spacing ===== */
.board-table{
  border-radius:0;
}

.board-row{
  min-height:56px;
}

.board-row.board-head{
  min-height:48px;
}

.board-row > div{
  padding-left:14px;
  padding-right:14px;
}

.board-row:not(.board-head):hover{
  transform:none;
  box-shadow:none;
  background:#fafafa;
  border-bottom-color:#e5e7eb;
}

.consult-post-card{
  min-height:82px;
  padding-top:14px;
  padding-bottom:14px;
}

.consult-post-card.has-status,
.board-page[data-board="request"] .consult-post-card{
  padding-right:178px;
}

.consult-post-card:hover{
  padding-left:10px;
}

.consult-post-meta-top{
  margin-bottom:6px;
  font-size:12px !important;
}

.consult-post-main h2{
  font-size:18px !important;
  line-height:1.32 !important;
}

.consult-status{
  min-width:146px;
  height:30px;
  padding:0 14px;
  font-size:12px !important;
}

.consult-post-meta-bottom{
  gap:16px;
  margin-top:8px;
  font-size:12px !important;
}

.consult-post-card.is-notice{
  padding-top:14px;
  padding-bottom:14px;
  padding-left:14px;
}

.consult-post-card.is-notice:hover{
  padding-left:18px;
}

.board-bottom{
  margin-top:24px;
}

.pagination{
  margin-top:32px;
}

@media(max-width:768px){
  .board-row{
    min-height:54px;
  }

  .consult-post-card,
  .consult-post-card.has-status,
  .board-page[data-board="request"] .consult-post-card{
    min-height:0;
    padding-top:13px;
    padding-bottom:13px;
  }

  .consult-post-card.has-status,
  .board-page[data-board="request"] .consult-post-card{
    padding-bottom:54px;
  }

  .board-page[data-board="request"] .consult-status,
  .consult-post-card.has-status .consult-status{
    bottom:12px;
  }
}

/* ===== reference-style compact board table ===== */
.board-table{
  overflow:visible;
  border-top:1px solid #171717;
  border-radius:0;
  background:#fff;
  box-shadow:none;
}

.board-row{
  min-height:46px;
  border-bottom:1px solid #e8e8e8;
  color:#555;
  font-size:13px !important;
}

.board-row.board-head{
  min-height:44px;
  border-bottom:1px solid #dedede;
  background:#fff;
}

.board-head div{
  color:#333;
  font-size:12px;
  font-weight:700;
  text-transform:none;
}

.board-row > div{
  padding:0 12px;
}

.board-row .board-title{
  color:#333;
  font-size:14px !important;
  font-weight:600 !important;
  line-height:1.3 !important;
}

.board-row.is-notice .board-title{
  color:#111;
  font-weight:900 !important;
}

.board-row:not(.board-head):hover{
  background:#fafafa;
}

.board-bottom,
.board-page[data-board-mode="official"] .board-bottom,
.board-page[data-board-mode="consult"] .board-bottom{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:12px;
  max-width:none;
  margin:0 0 18px;
  padding:0;
}

#boardSearch,
.board-page[data-board-mode="official"] #boardSearch,
.board-page[data-board-mode="consult"] #boardSearch{
  width:310px !important;
  height:42px !important;
  padding:0 38px 0 10px !important;
  border:0 !important;
  border-bottom:1px solid #cfcfcf !important;
  border-radius:0 !important;
  background-color:#fff !important;
  background-position:right 8px center !important;
  color:#222 !important;
  font-size:13px !important;
  font-weight:500 !important;
  box-shadow:none !important;
}

#boardSearch:focus{
  border-bottom-color:#111 !important;
  box-shadow:none !important;
}

#boardSearch::placeholder{
  color:#aaa !important;
  font-weight:400 !important;
}

.write-btn{
  height:38px;
  padding:0 20px;
  border-radius:2px;
  font-size:13px !important;
  box-shadow:none;
}

.consult-post-list{
  border-top:1px solid #171717;
}

.consult-post-card{
  min-height:66px;
  padding-top:9px;
  padding-bottom:9px;
  border-bottom:1px solid #e8e8e8;
}

.consult-post-card.has-status,
.board-page[data-board="request"] .consult-post-card{
  padding-right:154px;
}

.consult-post-card:hover{
  padding-left:8px;
  background:#fafafa;
}

.consult-post-meta-top{
  margin-bottom:3px;
  color:#999;
  font-size:11px !important;
}

.consult-post-main h2{
  color:#333;
  font-size:15px !important;
  font-weight:650 !important;
  line-height:1.3 !important;
}

.consult-post-card.is-notice .consult-post-main h2{
  color:#111;
  font-weight:950 !important;
}

.consult-status{
  min-width:126px;
  height:27px;
  padding:0 10px;
  border-radius:2px;
  font-size:11px !important;
}

.consult-post-meta-bottom{
  gap:13px;
  margin-top:4px;
  color:#999;
  font-size:11px !important;
}

.consult-post-card.is-notice{
  padding-top:9px;
  padding-bottom:9px;
  padding-left:10px;
}

.consult-post-card.is-notice:hover{
  padding-left:14px;
}

.pagination{
  gap:7px;
  margin-top:24px;
}

.pagination button{
  padding:5px 8px;
  border-radius:0;
  font-size:12px;
}

@media(max-width:768px){
  .board-row{
    min-height:44px;
  }

  .consult-post-card,
  .consult-post-card.has-status,
  .board-page[data-board="request"] .consult-post-card{
    padding-top:10px;
    padding-bottom:10px;
  }

  .consult-post-card.has-status,
  .board-page[data-board="request"] .consult-post-card{
    padding-bottom:48px;
  }

  .board-page[data-board="request"] .consult-status,
  .consult-post-card.has-status .consult-status{
    bottom:10px;
  }
}

/* ===== ISSOFT-inspired board redesign ===== */
:root{
  --board-accent:#ffb82e;
  --board-line:#e7e7e7;
  --board-ink:#171717;
  --board-muted:#747474;
}

body{
  background:#fff;
}

.board-main{
  width:min(100%, 1080px);
}

.board-table{
  border-top:2px solid var(--board-ink);
  border-bottom:1px solid #cfcfcf;
  background:#fff;
}

.board-row{
  grid-template-columns:72px minmax(0, 1fr) 120px 140px 72px;
  min-height:56px;
  border-bottom:1px solid var(--board-line);
  background:#fff;
  color:var(--board-muted);
}

.board-row.board-head{
  min-height:54px;
  background:#fff;
  border-bottom:1px solid #d8d8d8;
}

.board-head div{
  color:var(--board-ink);
  font-size:13px;
  font-weight:800;
  text-align:center;
}

.board-row > div{
  padding:0 14px;
  text-align:center;
}

.board-row > div:nth-child(2){
  text-align:left;
}

.board-row .board-title{
  color:#252525;
  font-size:15px !important;
  font-weight:650 !important;
}

.board-row:not(.board-head):hover{
  background:#fffaf0;
}

.board-row.is-notice{
  background:#fff;
  border-bottom-color:var(--board-line);
}

.board-row.is-notice:hover{
  background:#fffaf0;
}

.board-row.is-notice > div:first-child{
  justify-self:center;
  width:58px;
  height:28px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:5px;
  background:var(--board-accent);
  color:#fff !important;
  font-size:11px;
  font-weight:900 !important;
  text-transform:lowercase;
}

.notice-title-prefix,
.mobile-notice-prefix{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  margin-right:7px;
  padding:0 8px;
  border-radius:4px;
  background:var(--board-accent);
  color:#fff !important;
  font-size:11px;
  font-weight:900;
  vertical-align:2px;
}

.board-category-bar.is-grouped{
  margin-bottom:42px !important;
  border-top:1px solid #ececec;
  border-bottom:1px solid #ececec;
}

.board-category-primary button.active::after{
  height:4px;
  background:var(--board-accent);
}

.board-category-secondary button.active{
  background:#fff1cf !important;
  color:#a66500 !important;
}

.pagination{
  gap:4px;
  margin-top:30px;
}

.pagination button{
  min-width:30px;
  height:30px;
  padding:0 7px;
  border-radius:5px;
  color:#777 !important;
}

.pagination button.active{
  background:var(--board-accent) !important;
  color:#fff !important;
}

.pagination button.active::after{
  display:none;
}

.board-bottom,
.board-page[data-board-mode="official"] .board-bottom,
.board-page[data-board-mode="consult"] .board-bottom{
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
  max-width:none;
  min-height:50px;
  margin:22px auto 0;
  padding:0;
}

#boardSearch,
.board-page[data-board-mode="official"] #boardSearch,
.board-page[data-board-mode="consult"] #boardSearch{
  width:min(100%, 460px) !important;
  height:50px !important;
  padding:0 56px 0 18px !important;
  border:0 !important;
  border-radius:9px !important;
  background-color:#f2f2f2 !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Crect width='40' height='40' rx='7' fill='%23ffb82e'/%3E%3Ccircle cx='18' cy='18' r='6.5' fill='none' stroke='white' stroke-width='2.2'/%3E%3Cpath d='m23 23 5 5' stroke='white' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:right 5px center !important;
  background-size:40px 40px !important;
  color:#222 !important;
  font-size:14px !important;
  font-weight:500 !important;
  box-shadow:none !important;
}

#boardSearch:focus{
  outline:2px solid rgba(255,184,46,.4);
  outline-offset:2px;
}

#boardSearch::placeholder{
  color:#888 !important;
}

.write-btn{
  position:absolute;
  right:0;
  height:40px;
  padding:0 22px;
  border-radius:5px;
  background:#171717;
  box-shadow:none;
}

.consult-post-list{
  border-top:2px solid var(--board-ink);
  border-bottom:1px solid #cfcfcf;
}

.consult-post-card{
  min-height:64px;
  padding:10px 0;
  border-bottom:1px solid var(--board-line);
  background:#fff;
}

.consult-post-card:hover{
  padding-left:10px;
  background:#fffaf0;
}

.consult-post-card.is-notice,
.consult-post-card.is-notice:hover{
  background:#fff;
  border-bottom:1px solid var(--board-line);
}

.consult-post-card.is-notice:hover{
  background:#fffaf0;
}

.consult-post-main h2{
  color:#252525;
  font-size:15px !important;
  font-weight:650 !important;
}

.consult-post-card.is-notice .consult-post-main h2{
  font-weight:850 !important;
}

.consult-status{
  min-width:116px;
  height:28px;
  border-radius:5px;
  background:#fff1cf;
  color:#9a6500;
}

.consult-status.done{
  background:#60636a;
  color:#fff;
}

@media(max-width:768px){
  .board-row{
    min-height:50px;
  }

  .board-bottom,
  .board-page[data-board-mode="official"] .board-bottom,
  .board-page[data-board-mode="consult"] .board-bottom{
    display:none;
  }
}

/* ===== board operation hero ===== */
.board-operation-hero{
  position:relative;
  min-height:560px;
  margin-bottom:74px;
  padding:66px 62px 54px;
  overflow:hidden;
  border-radius:8px;
  background:
    radial-gradient(circle at 78% 18%, rgba(255,184,46,.18), transparent 24%),
    linear-gradient(120deg, rgba(5,8,12,.98) 0%, rgba(13,24,33,.94) 52%, rgba(23,34,43,.9) 100%);
  color:#fff;
  isolation:isolate;
}

.board-operation-hero::before{
  content:"";
  position:absolute;
  inset:-12% -8% -20% 42%;
  z-index:-2;
  opacity:.72;
  background:
    linear-gradient(145deg, transparent 0 20%, rgba(255,255,255,.08) 20.3% 20.8%, transparent 21.1% 44%, rgba(255,255,255,.07) 44.3% 44.8%, transparent 45.1%),
    linear-gradient(35deg, transparent 0 28%, rgba(255,255,255,.07) 28.3% 28.8%, transparent 29.1% 56%, rgba(255,255,255,.06) 56.3% 56.8%, transparent 57.1%),
    conic-gradient(from 24deg at 56% 52%, #263641, #121d25 18%, #334550 18.5% 31%, #15222b 31.5% 45%, #2a3944 45.5% 63%, #101a21 63.5% 78%, #263640 78.5%);
  clip-path:polygon(10% 5%, 100% 0, 94% 88%, 42% 100%, 0 58%);
  transform:rotate(-5deg);
}

.board-operation-hero::after{
  content:"";
  position:absolute;
  left:-8%;
  right:-8%;
  bottom:-36%;
  height:54%;
  z-index:-1;
  border-radius:50%;
  background:#050709;
  box-shadow:0 -22px 70px rgba(0,0,0,.55);
}

.board-operation-geometry{
  position:absolute;
  right:8%;
  bottom:18%;
  width:220px;
  height:220px;
  border:1px solid rgba(255,184,46,.24);
  transform:rotate(36deg);
  opacity:.55;
}

.board-operation-geometry::before,
.board-operation-geometry::after{
  content:"";
  position:absolute;
  inset:26px;
  border:1px solid rgba(255,255,255,.13);
}

.board-operation-geometry::after{
  inset:58px;
  background:rgba(255,184,46,.08);
}

.board-operation-content{
  position:relative;
  z-index:2;
  max-width:760px;
}

.board-operation-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:18px;
  color:#ffbf3e;
  font-size:13px;
  font-weight:900;
  letter-spacing:.18em;
}

.board-operation-eyebrow::before{
  content:"";
  width:34px;
  height:3px;
  border-radius:99px;
  background:#ffb82e;
}

.board-operation-hero h2{
  margin:0 0 24px;
  color:#fff;
  font-size:clamp(58px, 7vw, 92px);
  font-weight:950;
  line-height:.88;
  letter-spacing:-.055em;
}

.board-operation-hero strong{
  display:block;
  margin-bottom:22px;
  color:#fff;
  font-size:23px;
  font-weight:850;
  line-height:1.4;
  word-break:keep-all;
}

.board-operation-copy{
  color:rgba(255,255,255,.78);
  font-size:15px;
  font-weight:550;
  line-height:1.75;
  word-break:keep-all;
}

.board-operation-copy p{
  margin:0 0 3px;
}

.board-operation-rules{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:0;
  max-width:720px;
  margin:30px 0 34px;
  padding:22px 0 0;
  border-top:1px solid rgba(255,255,255,.18);
  list-style:none;
  counter-reset:board-rule;
}

.board-operation-rules li{
  min-width:0;
  padding:0 18px;
  border-left:1px solid rgba(255,255,255,.12);
  counter-increment:board-rule;
}

.board-operation-rules li:first-child{
  padding-left:0;
  border-left:0;
}

.board-operation-rules li::before{
  content:"0" counter(board-rule);
  display:block;
  margin-bottom:8px;
  color:#ffb82e;
  font-size:12px;
  font-weight:900;
  letter-spacing:.12em;
}

.board-operation-rules b,
.board-operation-rules span{
  display:block;
}

.board-operation-rules b{
  margin-bottom:5px;
  color:#fff;
  font-size:14px;
  font-weight:850;
}

.board-operation-rules span{
  color:rgba(255,255,255,.58);
  font-size:12px;
  font-weight:550;
  line-height:1.5;
  word-break:keep-all;
}

.board-operation-scroll{
  display:inline-flex;
  align-items:center;
  gap:12px;
  color:#fff;
  font-size:14px;
  font-weight:850;
  text-decoration:none;
}

.board-operation-scroll i{
  width:36px;
  height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.4);
  border-radius:50%;
  color:#ffbf3e;
  font-style:normal;
  transition:background .2s ease, transform .2s ease;
}

.board-operation-scroll:hover i{
  background:rgba(255,184,46,.16);
  transform:translateY(3px);
}

#boardContent{
  scroll-margin-top:110px;
}

@media(max-width:768px){
  .board-operation-hero{
    min-height:0;
    margin:0 -4px 50px;
    padding:46px 24px 40px;
    border-radius:4px;
  }

  .board-operation-hero::before{
    inset:8% -48% 5% 28%;
    opacity:.48;
  }

  .board-operation-hero::after{
    bottom:-24%;
  }

  .board-operation-hero h2{
    margin-bottom:20px;
    font-size:48px;
    line-height:.92;
  }

  .board-operation-hero strong{
    margin-bottom:18px;
    font-size:19px;
  }

  .board-operation-copy{
    font-size:13px;
    line-height:1.7;
  }

  .board-operation-rules{
    display:block;
    margin:24px 0 28px;
    padding-top:14px;
  }

  .board-operation-rules li{
    padding:12px 0;
    border-left:0;
    border-bottom:1px solid rgba(255,255,255,.1);
  }

  .board-operation-rules li::before{
    display:inline-block;
    width:30px;
    margin:0;
    vertical-align:top;
  }

  .board-operation-rules b{
    display:inline-block;
    margin:0;
    font-size:13px;
  }

  .board-operation-rules span{
    margin:5px 0 0 30px;
    font-size:11px;
  }
}

/* ===== full-screen history-style board hero ===== */
.board-operation-hero{
  width:100vw;
  min-height:clamp(680px, 100vh, 860px);
  margin:-160px 0 112px calc(50% - 50vw);
  padding:clamp(150px, 17vh, 190px) clamp(34px, 7vw, 108px) 90px;
  display:flex;
  align-items:center;
  overflow:hidden;
  border-radius:0;
  background:
    linear-gradient(90deg, rgba(5,9,12,.98) 0%, rgba(9,17,22,.92) 44%, rgba(13,25,31,.7) 100%),
    radial-gradient(circle at 82% 18%, rgba(255,184,46,.16), transparent 26%),
    #0b1217;
}

.board-operation-hero::before{
  inset:-18% -7% -25% 34%;
  opacity:.92;
  background:
    linear-gradient(150deg, transparent 0 21%, rgba(255,255,255,.14) 21.2% 21.45%, transparent 21.7% 43%, rgba(0,0,0,.5) 43.2% 43.7%, transparent 44%),
    linear-gradient(32deg, transparent 0 26%, rgba(255,255,255,.1) 26.2% 26.45%, transparent 26.7% 54%, rgba(0,0,0,.55) 54.2% 54.7%, transparent 55%),
    conic-gradient(from 20deg at 58% 52%, #263943 0 11%, #111d24 11.5% 23%, #344953 23.5% 34%, #14232b 34.5% 47%, #2b3e47 47.5% 61%, #0d181f 61.5% 74%, #30434d 74.5% 88%, #15232b 88.5%);
  clip-path:polygon(8% 3%, 100% 0, 96% 88%, 47% 100%, 0 61%);
  transform:rotate(-4deg) scale(1.06);
}

.board-operation-hero::after{
  left:-10%;
  right:-10%;
  bottom:-39%;
  height:58%;
  background:#030506;
  box-shadow:0 -24px 80px rgba(0,0,0,.65);
}

.board-operation-geometry{
  right:4%;
  bottom:10%;
  width:42vw;
  height:42vw;
  max-width:620px;
  max-height:620px;
  border-color:rgba(255,255,255,.1);
  transform:rotate(34deg);
  opacity:.42;
}

.board-operation-geometry::before{ inset:12%; border-color:rgba(255,255,255,.12); }
.board-operation-geometry::after{ inset:27%; border:1px solid rgba(255,184,46,.2); background:rgba(255,184,46,.04); }

.board-operation-content{
  position:relative;
  width:100%;
  max-width:920px;
  margin:0 auto 0 max(0px, calc((100vw - 1320px) / 2));
}

.board-operation-eyebrow,
.board-operation-rules{ display:none; }

.board-operation-hero h2{
  margin:0 0 30px;
  color:#fff;
  font-size:clamp(68px, 8vw, 116px);
  font-weight:950;
  line-height:.9;
  letter-spacing:-.055em;
  white-space:nowrap;
}

.board-operation-hero strong{
  margin-bottom:25px;
  color:#fff;
  font-size:clamp(21px, 2vw, 27px);
  font-weight:850;
}

.board-operation-copy{
  max-width:760px;
  color:rgba(255,255,255,.88);
  font-size:16px;
  font-weight:570;
  line-height:1.9;
}

.board-operation-copy p{ margin:0; }

.board-operation-label{
  display:flex;
  align-items:center;
  gap:5px;
  margin-top:30px;
  color:#fff;
  font-size:16px;
  font-weight:850;
}

.board-operation-label i{
  color:rgba(255,255,255,.32);
  font-size:18px;
  font-style:normal;
  line-height:1;
}

.board-operation-label i + i{
  margin-left:-10px;
  transform:translateY(6px);
}

.board-operation-scroll{
  position:absolute;
  left:50%;
  bottom:30px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  color:rgba(255,255,255,.48);
  font-size:12px;
  font-weight:500;
  transform:translateX(-50%);
}

.board-operation-scroll > i{
  width:58px;
  height:58px;
  border:1px solid rgba(255,255,255,.7);
  outline:1px dashed rgba(255,255,255,.5);
  outline-offset:6px;
  background:rgba(0,0,0,.44);
  color:#fff;
  font-size:20px;
  box-shadow:0 0 0 5px rgba(0,0,0,.28);
}

.board-operation-scroll:hover > i{
  background:rgba(255,184,46,.18);
  transform:translateY(3px);
}

@media(max-width:768px){
  .board-operation-hero{
    width:100vw;
    min-height:720px;
    margin:-98px 0 64px calc(50% - 50vw);
    padding:130px 24px 96px;
    align-items:center;
  }

  .board-operation-hero::before{
    inset:2% -72% 5% 20%;
    opacity:.55;
  }

  .board-operation-hero::after{
    bottom:-20%;
    height:36%;
  }

  .board-operation-content{ margin:0; }

  .board-operation-hero h2{
    margin-bottom:24px;
    font-size:clamp(48px, 15vw, 68px);
    white-space:normal;
  }

  .board-operation-hero strong{
    margin-bottom:18px;
    font-size:20px;
  }

  .board-operation-copy{
    font-size:13px;
    line-height:1.78;
  }

  .board-operation-copy p{ margin-bottom:5px; }

  .board-operation-label{
    margin-top:24px;
    font-size:14px;
  }

  .board-operation-scroll{ bottom:28px; }

  .board-operation-scroll > i{
    width:48px;
    height:48px;
  }
}

/* ===== home review-proof matching board hero ===== */
.board-operation-hero.board-review-proof{
  min-height:calc(100vh - 80px);
  min-height:calc(100svh - 80px);
  padding:120px 34px 98px;
  align-items:center;
  justify-content:center;
  background:
    linear-gradient(180deg, rgba(0,0,0,.34) 0%, rgba(0,0,0,.58) 54%, rgba(0,0,0,.8) 100%),
    url('센터전체사진1.jpg') center / cover no-repeat;
  text-align:center;
  isolation:isolate;
}

.board-operation-hero.board-review-proof::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  clip-path:none;
  transform:none;
  background:
    radial-gradient(circle at 50% 42%, rgba(0,0,0,.04), rgba(0,0,0,.42) 72%);
  opacity:1;
}

.board-operation-hero.board-review-proof::after{
  display:none;
}

.board-review-proof .board-operation-content{
  width:min(1120px, 94vw);
  max-width:1120px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  align-items:center;
}

.board-proof-eyebrow{
  display:block;
  margin-bottom:24px;
  color:rgba(255,255,255,.68);
  font-size:12px;
  font-weight:850;
  letter-spacing:.18em;
}

.board-operation-hero.board-review-proof .board-proof-heading{
  width:100%;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  color:#fff;
  font-size:clamp(38px, 4.4vw, 68px);
  font-weight:900;
  line-height:1.12;
  letter-spacing:0;
  white-space:nowrap;
  text-shadow:0 22px 58px rgba(0,0,0,.46);
}

.board-proof-heading > span{
  display:inline-block;
}

.board-proof-heading > i{
  display:block;
  flex:0 1 136px;
  width:136px;
  height:2px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  box-shadow:0 0 24px rgba(255,255,255,.28);
}

.board-review-proof .board-operation-copy{
  max-width:780px;
  margin-top:38px;
  color:rgba(255,255,255,.78);
  font-size:15px;
  font-weight:600;
  line-height:1.85;
  text-align:center;
  text-shadow:0 8px 30px rgba(0,0,0,.5);
}

.board-review-proof .board-operation-label{
  margin-top:28px;
  justify-content:center;
  color:#fff;
  font-size:14px;
}

.board-review-proof .board-operation-scroll{
  left:50%;
  bottom:32px;
}

.board-review-proof .board-operation-scroll > i{
  background:rgba(0,0,0,.46);
  backdrop-filter:blur(8px);
}

@media(max-width:768px){
  .board-operation-hero.board-review-proof{
    min-height:calc(100svh - 76px);
    margin-top:-98px;
    padding:118px 20px 88px;
  }

  .board-review-proof .board-operation-content{
    width:min(520px, calc(100vw - 34px));
  }

  .board-operation-hero.board-review-proof .board-proof-heading{
    flex-direction:column;
    gap:10px;
    font-size:clamp(31px, 8.5vw, 42px);
    line-height:1.08;
    white-space:normal;
  }

  .board-proof-heading > span{
    display:block;
    width:100%;
  }

  .board-proof-heading > i{
    flex:0 0 auto;
    width:46px;
    height:2px;
  }

  .board-review-proof .board-operation-copy{
    margin-top:28px;
    font-size:13px;
    line-height:1.7;
  }

  .board-review-proof .board-operation-label{
    margin-top:22px;
    font-size:13px;
  }
}

/* ===== solid black hero and overlay navigation ===== */
.board-operation-hero.board-review-proof{
  background:#000 !important;
}

.board-operation-hero.board-review-proof::before,
.board-operation-hero.board-review-proof::after{
  display:none !important;
}

body header{
  transition:background .25s ease, border-color .25s ease, box-shadow .25s ease;
}

body .logo a,
body .menu a,
body #loginLink,
body #logoutBtn,
body .download-btn,
body .mobile-menu-btn{
  transition:color .25s ease, border-color .25s ease, background .25s ease;
}

body.board-header-over-hero header{
  background:transparent !important;
  border-bottom-color:rgba(255,255,255,.12) !important;
  box-shadow:none !important;
}

body.board-header-over-hero .logo a,
body.board-header-over-hero .menu a,
body.board-header-over-hero #loginLink,
body.board-header-over-hero #logoutBtn{
  color:#fff !important;
}

body.board-header-over-hero .menu a::after{
  background:#fff200 !important;
}

body.board-header-over-hero .download-btn{
  border-color:rgba(255,255,255,.8) !important;
  background:transparent !important;
  color:#fff !important;
}

body.board-header-over-hero .download-btn:hover{
  border-color:#fff !important;
  background:#fff !important;
  color:#000 !important;
}

body.board-header-over-hero .mobile-menu-btn{
  border-color:rgba(255,255,255,.46) !important;
  background:rgba(0,0,0,.22) !important;
  color:#fff !important;
}

body.board-header-over-hero .mobile-menu-btn::before,
body.board-header-over-hero .mobile-menu-btn::after,
body.board-header-over-hero .mobile-menu-btn span{
  background:#fff !important;
  color:#fff !important;
}

@media(max-width:768px){
  body.board-header-over-hero header{
    background:transparent !important;
  }
}

/* ===== final black navigation and premium hero typography ===== */
body header,
body.board-header-over-hero header{
  background:#050505 !important;
  border-bottom:1px solid rgba(255,255,255,.12) !important;
  box-shadow:none !important;
}

body.board-header-over-hero header{
  background:transparent !important;
}

body header .logo a,
body header #logo-text,
body header .menu a,
body header #loginLink,
body header #logoutBtn{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

body header #logoutBtn{
  border:0 !important;
  background:transparent !important;
}

body header .menu a::after{
  background:#fff200 !important;
}

body header .download-btn{
  border-color:rgba(255,255,255,.76) !important;
  background:transparent !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

body header .download-btn:hover{
  border-color:#fff !important;
  background:#fff !important;
  color:#050505 !important;
  -webkit-text-fill-color:#050505 !important;
}

.board-proof-eyebrow{
  display:inline-flex;
  min-height:30px;
  margin-bottom:30px;
  padding:0 14px;
  align-items:center;
  border:1px solid rgba(255,242,0,.48);
  border-radius:999px;
  background:rgba(255,242,0,.08);
  color:#fff200;
  font-size:11px;
  font-weight:950;
  letter-spacing:.22em;
  box-shadow:0 0 32px rgba(255,242,0,.08);
}

.board-operation-hero.board-review-proof .board-proof-heading{
  gap:22px;
  font-size:clamp(42px, 4.8vw, 72px);
  font-weight:950;
  letter-spacing:-.045em;
}

.board-proof-heading > span:first-child{
  color:transparent;
  -webkit-text-fill-color:transparent;
  -webkit-text-stroke:1.5px rgba(255,255,255,.9);
  text-shadow:none;
}

.board-proof-heading > span:last-child{
  color:#fff;
  -webkit-text-fill-color:#fff;
  text-shadow:0 20px 55px rgba(0,0,0,.5);
}

.board-proof-heading > i{
  flex-basis:110px;
  width:110px;
  background:linear-gradient(90deg, rgba(255,255,255,.35), #fff200, rgba(255,255,255,.35));
  box-shadow:0 0 25px rgba(255,242,0,.3);
}

.board-review-proof .board-operation-copy{
  max-width:820px;
  margin-top:42px;
}

.board-review-proof .board-operation-copy p:first-child{
  margin-bottom:9px;
  color:#fff;
  font-size:17px;
  font-weight:850;
}

.board-review-proof .board-operation-copy p:not(:first-child){
  color:rgba(255,255,255,.62);
  font-size:14px;
}

.board-review-proof .board-operation-label{
  min-height:42px;
  margin-top:30px;
  padding:0 18px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  background:rgba(255,255,255,.05);
  backdrop-filter:blur(8px);
}

@media(max-width:768px){
  body header,
  body.board-header-over-hero header{
    background:#050505 !important;
  }

  body.board-header-over-hero header{
    background:transparent !important;
  }

  body header .logo a,
  body header #logo-text{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
  }

  body header .mobile-menu-btn{
    border-color:rgba(255,255,255,.48) !important;
    background:rgba(0,0,0,.32) !important;
    color:#fff !important;
  }

  body header .mobile-menu-btn::before,
  body header .mobile-menu-btn::after,
  body header .mobile-menu-btn span{
    background:#fff !important;
    color:#fff !important;
  }

  .board-operation-hero.board-review-proof .board-proof-heading{
    gap:12px;
    font-size:clamp(32px, 9vw, 44px);
    letter-spacing:-.035em;
  }

  .board-proof-heading > i{
    width:42px;
  }

  .board-review-proof .board-operation-copy{
    margin-top:30px;
  }

  .board-review-proof .board-operation-copy p:first-child{
    font-size:15px;
  }

  .board-review-proof .board-operation-copy p:not(:first-child){
    font-size:12px;
  }
}


/* ===== footprint-inspired board intro ===== */
.board-operation-hero.board-footprint-hero{
  position:relative;
  display:flex;
  min-height:calc(100svh - 80px);
  margin-top:-80px;
  padding:clamp(150px, 19vh, 205px) 0 132px;
  overflow:hidden;
  align-items:center;
  background:#000 !important;
  color:#fff;
}

.board-operation-hero.board-footprint-hero::before,
.board-operation-hero.board-footprint-hero::after{
  display:none !important;
}

.board-footprint-hero .board-operation-content{
  position:relative;
  z-index:1;
  display:block;
  width:min(1320px, calc(100% - 72px));
  margin:0 auto;
  text-align:left;
}

.board-footprint-hero #boardOperationTitle{
  margin:0;
  color:#fff;
  -webkit-text-fill-color:#fff;
  font-family:Arial, Helvetica, sans-serif;
  font-size:clamp(72px, 8.2vw, 126px);
  font-weight:900;
  line-height:.82;
  letter-spacing:-.065em;
  text-shadow:none;
}

.board-footprint-hero .board-operation-lead{
  display:block;
  margin-top:44px;
  color:#fff;
  font-size:clamp(21px, 1.8vw, 28px);
  font-weight:900;
  line-height:1.35;
  letter-spacing:-.035em;
}

.board-footprint-hero .board-operation-copy{
  max-width:820px;
  margin-top:24px;
  color:rgba(255,255,255,.82);
  font-size:15px;
  font-weight:600;
  line-height:1.95;
  text-align:left;
  text-shadow:none;
}

.board-footprint-hero .board-operation-copy p{
  margin:0;
  color:inherit;
  font-size:inherit;
  font-weight:inherit;
}

.board-footprint-hero .board-operation-label{
  display:flex;
  min-height:0;
  margin-top:25px;
  padding:0;
  align-items:center;
  justify-content:flex-start;
  gap:7px;
  border:0;
  border-radius:0;
  background:transparent;
  color:#fff;
  font-size:15px;
  font-weight:900;
  backdrop-filter:none;
}

.board-footprint-hero .board-operation-label i{
  position:relative;
  top:-2px;
  margin-left:4px;
  color:rgba(255,255,255,.42);
  font-size:13px;
  font-style:normal;
  line-height:1;
}

.board-footprint-hero .board-operation-label i + i{
  margin-left:-14px;
  top:5px;
}

.board-footprint-hero > .board-operation-scroll{
  position:absolute;
  z-index:2;
  left:50%;
  bottom:30px;
  display:flex;
  width:70px;
  margin:0;
  align-items:center;
  flex-direction:column;
  transform:translateX(-50%);
  color:rgba(255,255,255,.58);
  font-size:12px;
  text-decoration:none;
}

.board-footprint-hero > .board-operation-scroll > i{
  display:flex;
  width:54px;
  height:54px;
  margin-bottom:8px;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.78);
  border-radius:50%;
  background:#050505;
  color:#fff;
  font-size:17px;
  font-style:normal;
  line-height:1;
  box-shadow:0 0 0 7px rgba(255,255,255,.08);
  transition:transform .25s ease, background .25s ease;
}

.board-footprint-hero > .board-operation-scroll:hover > i{
  transform:translateY(4px);
  background:#181818;
}

@media(max-width:768px){
  .board-operation-hero.board-footprint-hero{
    min-height:calc(100svh - 76px);
    margin-top:-76px;
    padding:132px 22px 112px;
    align-items:center;
  }

  .board-footprint-hero .board-operation-content{
    width:100%;
  }

  .board-footprint-hero #boardOperationTitle{
    font-size:clamp(48px, 15vw, 68px);
    line-height:.9;
    letter-spacing:-.06em;
  }

  .board-footprint-hero .board-operation-lead{
    margin-top:32px;
    font-size:20px;
    line-height:1.4;
  }

  .board-footprint-hero .board-operation-copy{
    margin-top:20px;
    font-size:13px;
    line-height:1.75;
    word-break:keep-all;
  }

  .board-footprint-hero .board-operation-copy p + p{
    margin-top:4px;
  }

  .board-footprint-hero .board-operation-label{
    margin-top:22px;
    font-size:14px;
  }

  .board-footprint-hero > .board-operation-scroll{
    bottom:24px;
  }

  .board-footprint-hero > .board-operation-scroll > i{
    width:48px;
    height:48px;
  }
}


/* ===== motion editorial board redesign ===== */
:root{
  --board-ink:#0a0a0a;
  --board-paper:#f5f4ef;
  --board-line:#d9d8d2;
  --board-accent:#fff200;
}

html{scroll-behavior:smooth}

body{
  background:var(--board-paper) !important;
}

body header,
body.board-header-over-hero header{
  background:transparent !important;
  border-bottom:1px solid rgba(255,255,255,.16) !important;
}

body header .logo a,
body header .menu a,
body header #loginLink,
body header #logoutBtn,
body header .download-btn{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

body:not(.board-header-over-hero) header{
  background:#0a0a0a !important;
}

.board-page{
  width:100% !important;
  max-width:none !important;
  padding-bottom:110px !important;
  background:var(--board-paper);
}

.board-layout,
.board-main{
  width:100% !important;
  max-width:none !important;
}

.board-operation-hero.board-motion-hero{
  position:relative;
  width:100vw;
  min-height:100svh;
  margin:-160px 0 0 calc(50% - 50vw);
  padding:clamp(180px, 24vh, 240px) max(40px, calc((100vw - 1320px) / 2)) 150px;
  display:flex;
  align-items:center;
  overflow:hidden;
  border:0;
  border-radius:0;
  background:#000 !important;
  color:#fff;
  isolation:isolate;
}

.board-motion-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  display:block !important;
  background:
    radial-gradient(circle at 72% 34%, rgba(255,242,0,.08), transparent 25%),
    linear-gradient(115deg, transparent 0 62%, rgba(255,255,255,.035) 62.1% 62.25%, transparent 62.35%);
}

.board-motion-hero::after{
  content:"";
  position:absolute;
  top:0;
  right:7vw;
  bottom:0;
  width:1px;
  display:block !important;
  background:rgba(255,255,255,.12);
}

.board-motion-hero .board-operation-content{
  position:relative;
  z-index:2;
  width:min(1060px, 100%);
  max-width:none;
  margin:0;
  display:block;
  text-align:left;
}

.board-operation-kicker{
  display:flex;
  align-items:center;
  gap:13px;
  margin:0 0 28px;
  color:rgba(255,255,255,.58);
  font:800 11px/1 Arial,sans-serif;
  letter-spacing:.2em;
  opacity:0;
  animation:boardFadeUp .7s .08s cubic-bezier(.2,.8,.2,1) forwards;
}

.board-operation-kicker i{
  width:34px;
  height:1px;
  background:var(--board-accent);
}

.board-motion-hero #boardOperationTitle{
  display:flex;
  margin:0;
  overflow:hidden;
  color:#fff;
  -webkit-text-fill-color:#fff;
  font-family:Arial,Helvetica,sans-serif;
  font-size:clamp(76px, 10.2vw, 156px);
  font-weight:950;
  line-height:.78;
  letter-spacing:-.075em;
  white-space:nowrap;
}

.board-motion-hero #boardOperationTitle > span{
  display:block;
  opacity:0;
  transform:translateY(115%) rotate(5deg);
  animation:boardLetterIn .85s cubic-bezier(.16,1,.3,1) forwards;
  animation-delay:calc(.16s + var(--letter) * 55ms);
}

.board-motion-hero .board-operation-lead{
  display:block;
  margin:52px 0 0;
  color:#fff;
  font-size:clamp(24px,2.2vw,34px);
  font-weight:900;
  line-height:1.3;
  letter-spacing:-.045em;
}

.board-motion-hero .board-operation-lead span{
  display:inline-block;
  opacity:0;
  transform:translateY(24px);
  animation:boardFadeUp .75s .78s cubic-bezier(.2,.8,.2,1) forwards;
}

.board-motion-hero .board-operation-lead span + span{
  animation-delay:.9s;
}

.board-motion-hero .board-operation-copy{
  max-width:780px;
  margin-top:25px;
  color:rgba(255,255,255,.7);
  font-size:15px;
  font-weight:570;
  line-height:1.9;
  text-align:left;
}

.board-motion-hero .board-operation-copy p{
  margin:0;
  opacity:0;
  transform:translateY(18px);
  animation:boardFadeUp .7s 1.02s ease forwards;
}

.board-motion-hero .board-operation-copy p + p{
  animation-delay:1.12s;
}

.board-motion-hero .board-operation-label{
  display:flex;
  min-height:0;
  margin-top:34px;
  padding:0;
  align-items:center;
  justify-content:flex-start;
  gap:11px;
  border:0;
  background:none;
  color:#fff;
  font:850 12px/1 Arial,sans-serif;
  letter-spacing:.15em;
  opacity:0;
  animation:boardFadeUp .7s 1.22s ease forwards;
}

.board-motion-hero .board-operation-label i{
  color:var(--board-accent);
  font-size:16px;
  font-style:normal;
  transition:transform .25s ease;
}

.board-motion-hero .board-operation-label:hover i{transform:translate(4px,4px)}

.board-hero-ghost{
  position:absolute;
  z-index:0;
  top:45%;
  left:0;
  display:flex;
  width:max-content;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.075);
  font:950 clamp(110px,15vw,230px)/1 Arial,sans-serif;
  letter-spacing:-.06em;
  white-space:nowrap;
  pointer-events:none;
  transform:translateY(-50%);
  animation:boardMarquee 30s linear infinite;
}

.board-hero-ghost span{padding-right:.22em}

.board-motion-hero > .board-operation-scroll{
  position:absolute;
  z-index:3;
  left:50%;
  bottom:34px;
  width:auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:9px;
  color:rgba(255,255,255,.52);
  font:750 10px/1 Arial,sans-serif;
  letter-spacing:.18em;
  text-decoration:none;
  transform:translateX(-50%);
}

.board-motion-hero > .board-operation-scroll > i{
  width:54px;
  height:54px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.65);
  border-radius:50%;
  background:#000;
  color:#fff;
  font-size:18px;
  font-style:normal;
  box-shadow:0 0 0 7px rgba(255,255,255,.06);
  animation:boardArrowFloat 1.8s ease-in-out infinite;
}

.board-content-shell{
  width:min(1180px,calc(100% - 64px));
  margin:0 auto;
  padding:122px 0 40px;
}

.board-content-shell .board-header{
  min-height:0;
  margin:0 0 68px;
  padding:0 0 44px;
  display:grid;
  grid-template-columns:230px 1fr;
  align-items:start;
  border-bottom:2px solid var(--board-ink);
  background:transparent;
  text-align:left;
}

.board-section-index{
  padding-top:13px;
  color:#8c8a83;
  font:800 11px/1 Arial,sans-serif;
  letter-spacing:.15em;
}

.board-header-copy h1{
  margin:0;
  color:var(--board-ink);
  font-size:clamp(44px,5vw,72px);
  font-weight:950;
  line-height:.96;
  letter-spacing:-.06em;
}

.board-header-copy p{
  max-width:620px;
  margin:25px 0 0;
  color:#696761;
  font-size:15px;
  font-weight:600;
  line-height:1.75;
  word-break:keep-all;
}

.board-toolbar{
  display:flex;
  margin-bottom:22px;
  align-items:flex-end;
  justify-content:space-between;
  gap:28px;
}

.board-content-shell .board-category-bar{
  display:flex;
  margin:0;
  gap:0;
  align-items:center;
  border-bottom:1px solid #bbb9b2;
  background:transparent;
}

.board-content-shell .board-category-bar button{
  position:relative;
  min-width:auto;
  height:48px;
  padding:0 19px;
  border:0;
  border-radius:0;
  background:transparent;
  color:#8b8982;
  font-size:14px;
  font-weight:800;
  transition:color .2s ease;
}

.board-content-shell .board-category-bar button::after{
  content:"";
  position:absolute;
  left:50%;
  right:50%;
  bottom:-1px;
  height:3px;
  background:var(--board-ink);
  transition:left .3s ease,right .3s ease;
}

.board-content-shell .board-category-bar button:hover,
.board-content-shell .board-category-bar button.active{
  background:transparent;
  color:var(--board-ink);
}

.board-content-shell .board-category-bar button.active::after{
  left:0;
  right:0;
}

.board-content-shell .board-bottom{
  display:flex;
  margin:0;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}

.board-search-field{
  position:relative;
  display:block;
  width:260px;
}

.board-search-field input{
  width:100%;
  height:46px;
  padding:0 46px 0 16px;
  border:1px solid #c7c5be;
  border-radius:0;
  outline:0;
  background:transparent;
  color:var(--board-ink);
  font-size:13px;
  font-weight:650;
  transition:border-color .2s ease,background .2s ease;
}

.board-search-field input:focus{
  border-color:var(--board-ink);
  background:#fff;
}

.board-search-field i{
  position:absolute;
  top:50%;
  right:18px;
  width:14px;
  height:14px;
  border:2px solid var(--board-ink);
  border-radius:50%;
  transform:translateY(-60%);
  pointer-events:none;
}

.board-search-field i::after{
  content:"";
  position:absolute;
  right:-5px;
  bottom:-3px;
  width:6px;
  height:2px;
  background:var(--board-ink);
  transform:rotate(45deg);
}

.board-content-shell .write-btn{
  height:46px;
  padding:0 17px 0 20px;
  display:flex;
  align-items:center;
  gap:18px;
  border:1px solid var(--board-ink);
  border-radius:0;
  background:var(--board-ink);
  color:#fff;
  font-size:13px;
  font-weight:900;
  transition:background .2s ease,color .2s ease;
}

.board-content-shell .write-btn i{
  color:var(--board-accent);
  font-size:18px;
  font-style:normal;
}

.board-content-shell .write-btn:hover{
  background:var(--board-accent);
  color:var(--board-ink);
}

.board-content-shell .write-btn:hover i{color:var(--board-ink)}

.board-content-shell .board-table{
  border-top:2px solid var(--board-ink);
  background:transparent;
}

.board-content-shell .board-row{
  min-height:66px;
  padding:0;
  display:grid;
  grid-template-columns:90px minmax(0,1fr) 150px 145px 80px;
  align-items:center;
  border-bottom:1px solid var(--board-line);
  background:transparent;
  color:#595750;
  transition:background .25s ease,transform .25s ease;
}

.board-content-shell .board-row > div{
  padding:18px 12px;
  font-size:13px;
  font-weight:600;
  text-align:center;
}

.board-content-shell .board-row.board-head{
  min-height:58px;
  color:#24231f;
}

.board-content-shell .board-row.board-head > div{
  font-size:12px;
  font-weight:900;
  letter-spacing:.02em;
}

.board-content-shell .board-row.board-post{
  position:relative;
  cursor:pointer;
}

.board-content-shell .board-row.board-post::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:0;
  background:var(--board-accent);
  transition:width .25s ease;
}

.board-content-shell .board-row.board-post:hover{
  background:#fff;
  transform:translateX(5px);
}

.board-content-shell .board-row.board-post:hover::before{width:4px}

.board-content-shell .board-row .board-title{
  overflow:hidden;
  color:#1b1a17;
  font-size:15px;
  font-weight:780;
  text-align:left;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.board-content-shell .board-row.is-notice{
  background:#111;
  color:rgba(255,255,255,.65);
}

.board-content-shell .board-row.is-notice .board-title{
  color:#fff;
  font-weight:950;
}

.board-content-shell .board-row.is-notice > div:first-child,
.board-content-shell .notice-title-prefix{
  color:var(--board-accent);
  font-weight:950;
}

.board-content-shell .board-row.is-notice:hover{background:#202020}

.board-content-shell .pagination{
  min-height:44px;
  margin:40px 0 0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
}

.board-content-shell .pagination button{
  width:36px;
  height:36px;
  border:0;
  border-radius:0;
  background:transparent;
  color:#8b8982;
  font-size:12px;
  font-weight:800;
}

.board-content-shell .pagination button:hover,
.board-content-shell .pagination button.active{
  background:var(--board-ink);
  color:#fff;
}

.board-content-shell .pagination button.dummy-page{opacity:.26}

.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

@keyframes boardLetterIn{
  to{opacity:1;transform:translateY(0) rotate(0)}
}

@keyframes boardFadeUp{
  to{opacity:1;transform:translateY(0)}
}

@keyframes boardMarquee{
  to{transform:translate(-50%,-50%)}
}

@keyframes boardArrowFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(7px)}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .board-motion-hero *,
  .board-motion-hero *::before,
  .board-motion-hero *::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    animation-delay:0s!important;
  }
}


/* ===== final specificity pass: editorial list ===== */
.board-page[data-board-mode="consult"] .board-content-shell .board-header,
.board-page[data-board-mode="official"] .board-content-shell .board-header{
  max-width:none !important;
  min-height:0 !important;
  margin:0 0 68px !important;
  padding:0 0 44px !important;
  display:grid !important;
  grid-template-columns:230px minmax(0,1fr) !important;
  border:0 !important;
  border-bottom:2px solid var(--board-ink) !important;
  text-align:left !important;
}

.board-page[data-board-mode="consult"] .board-header-copy h1,
.board-page[data-board-mode="official"] .board-header-copy h1{
  margin:0 !important;
  font-size:clamp(50px,5vw,72px) !important;
  font-weight:950 !important;
  line-height:.96 !important;
  letter-spacing:-.06em !important;
  text-align:left !important;
}

.board-page[data-board-mode="consult"] .board-header-copy #boardDesc,
.board-page[data-board-mode="official"] .board-header-copy #boardDesc{
  max-width:620px !important;
  margin:25px 0 0 !important;
  color:#696761 !important;
  font-size:15px !important;
  font-weight:600 !important;
  line-height:1.75 !important;
  text-align:left !important;
}

.board-page[data-board-mode="consult"] .board-toolbar,
.board-page[data-board-mode="official"] .board-toolbar{
  display:flex !important;
  margin:0 0 22px !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  gap:24px !important;
}

.board-page[data-board-mode="consult"] .board-content-shell .board-category-bar,
.board-page[data-board-mode="official"] .board-content-shell .board-category-bar{
  width:auto !important;
  max-width:none !important;
  min-height:48px !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  flex-wrap:nowrap !important;
  gap:0 !important;
  justify-content:flex-start !important;
  border:0 !important;
  border-bottom:1px solid #bbb9b2 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

.board-page[data-board-mode="consult"] .board-content-shell .board-category-bar button,
.board-page[data-board-mode="official"] .board-content-shell .board-category-bar button{
  position:relative !important;
  min-width:0 !important;
  height:48px !important;
  padding:0 15px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#8b8982 !important;
  font-size:13px !important;
  font-weight:800 !important;
  box-shadow:none !important;
  transform:none !important;
  white-space:nowrap !important;
}

.board-page[data-board-mode="consult"] .board-content-shell .board-category-bar button::after,
.board-page[data-board-mode="official"] .board-content-shell .board-category-bar button::after{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  right:50% !important;
  bottom:-1px !important;
  height:3px !important;
  border:0 !important;
  border-radius:0 !important;
  background:var(--board-ink) !important;
  transition:left .25s ease,right .25s ease !important;
}

.board-page[data-board-mode="consult"] .board-content-shell .board-category-bar button.active,
.board-page[data-board-mode="official"] .board-content-shell .board-category-bar button.active{
  color:var(--board-ink) !important;
  background:transparent !important;
}

.board-page[data-board-mode="consult"] .board-content-shell .board-category-bar button.active::after,
.board-page[data-board-mode="official"] .board-content-shell .board-category-bar button.active::after{
  left:0 !important;
  right:0 !important;
}

.board-page[data-board-mode="consult"] .board-content-shell .board-bottom,
.board-page[data-board-mode="official"] .board-content-shell .board-bottom{
  position:static !important;
  width:auto !important;
  min-width:370px !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  justify-content:flex-end !important;
  gap:10px !important;
}

.board-page[data-board-mode="consult"] .board-search-field,
.board-page[data-board-mode="official"] .board-search-field{
  width:270px !important;
}

.board-page[data-board-mode="consult"] .board-search-field #boardSearch,
.board-page[data-board-mode="official"] .board-search-field #boardSearch{
  width:100% !important;
  height:46px !important;
  padding:0 46px 0 14px !important;
  border:1px solid #c7c5be !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--board-ink) !important;
  box-shadow:none !important;
}

.board-page[data-board-mode="consult"] .board-search-field #boardSearch:focus,
.board-page[data-board-mode="official"] .board-search-field #boardSearch:focus{
  border-color:var(--board-ink) !important;
  background:#fff !important;
}

.board-page[data-board-mode="consult"] .board-content-shell #writeBtn,
.board-page[data-board-mode="official"] .board-content-shell #writeBtn{
  position:static !important;
  width:auto !important;
  min-width:94px !important;
  height:46px !important;
  padding:0 17px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
  border:1px solid var(--board-ink) !important;
  border-radius:0 !important;
  background:var(--board-ink) !important;
  color:#fff !important;
  box-shadow:none !important;
  transform:none !important;
}

.board-content-shell #writeBtn::after{
  content:"＋";
  color:var(--board-accent);
  font-size:17px;
  font-weight:500;
}

.board-content-shell #writeBtn:hover{
  background:var(--board-accent) !important;
  color:var(--board-ink) !important;
}

.board-content-shell #writeBtn:hover::after{color:var(--board-ink)}

.board-page[data-board-mode="consult"] .board-content-shell .board-table{
  border-top:2px solid var(--board-ink) !important;
  border-bottom:1px solid var(--board-line) !important;
  background:transparent !important;
}

.board-content-shell .consult-post-list{
  border:0 !important;
  background:transparent !important;
}

.board-content-shell .consult-post-card{
  position:relative !important;
  min-height:72px !important;
  margin:0 !important;
  padding:0 18px !important;
  display:grid !important;
  grid-template-columns:130px minmax(0,1fr) 190px !important;
  align-items:center !important;
  column-gap:20px !important;
  border:0 !important;
  border-bottom:1px solid var(--board-line) !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  transition:background .22s ease,transform .22s ease !important;
}

.board-content-shell .consult-post-card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:0;
  background:var(--board-accent);
  transition:width .22s ease;
}

.board-content-shell .consult-post-card:hover{
  padding-left:18px !important;
  background:#fff !important;
  transform:translateX(5px) !important;
}

.board-content-shell .consult-post-card:hover::before{width:4px}

.board-content-shell .consult-post-meta-top{
  margin:0 !important;
  color:#8b8982 !important;
  font-size:11px !important;
  font-weight:800 !important;
}

.board-content-shell .consult-post-main{
  min-width:0 !important;
  display:block !important;
}

.board-content-shell .consult-post-main h2{
  margin:0 !important;
  overflow:hidden !important;
  color:#1b1a17 !important;
  font-size:15px !important;
  font-weight:760 !important;
  line-height:1.4 !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

.board-content-shell .consult-post-meta-bottom{
  margin:0 !important;
  display:flex !important;
  justify-content:flex-end !important;
  gap:17px !important;
  color:#8b8982 !important;
  font-size:11px !important;
}

.board-content-shell .consult-post-card.is-notice,
.board-content-shell .consult-post-card.is-notice:hover{
  padding:0 18px !important;
  border-bottom-color:#333 !important;
  background:#111 !important;
  color:#fff !important;
}

.board-content-shell .consult-post-card.is-notice::before{
  width:4px !important;
  background:var(--board-accent) !important;
}

.board-content-shell .consult-post-card.is-notice .consult-post-meta-top,
.board-content-shell .consult-post-card.is-notice .consult-post-meta-bottom{
  color:rgba(255,255,255,.56) !important;
}

.board-content-shell .consult-post-card.is-notice .consult-post-main h2{
  color:#fff !important;
  font-weight:950 !important;
}

.board-content-shell .consult-post-card.is-notice .notice-title-prefix{
  color:var(--board-accent) !important;
}

@media(max-width:980px) and (min-width:769px){
  .board-page[data-board-mode="consult"] .board-toolbar{
    display:block !important;
  }

  .board-page[data-board-mode="consult"] .board-content-shell .board-bottom{
    margin-top:14px !important;
  }
}

@media(max-width:768px){
  .board-page[data-board-mode="consult"] .board-content-shell .board-header,
  .board-page[data-board-mode="official"] .board-content-shell .board-header{
    margin-bottom:34px !important;
    padding-bottom:28px !important;
    display:block !important;
  }

  .board-page[data-board-mode="consult"] .board-header-copy h1,
  .board-page[data-board-mode="official"] .board-header-copy h1{
    font-size:42px !important;
  }

  .board-page[data-board-mode="consult"] .board-header-copy #boardDesc,
  .board-page[data-board-mode="official"] .board-header-copy #boardDesc{
    margin-top:17px !important;
    font-size:13px !important;
  }
}