/* =====================================================================
   contact.css – 문의 화면 (데모 v2 · 2026.10.12) · 별도 시안 없음, 현재 디자인 규칙으로 구성
   FAQ 아코디언 + 게시판(목록·작성·상세)
   ===================================================================== */
#inquiry-design{font-size:15px;color:#333}
#inquiry-design .sec-h{display:flex;align-items:center;gap:8px;font-size:19px;font-weight:700;letter-spacing:-.4px;color:#1c222b;margin:0 0 14px;padding-bottom:10px;border-bottom:2px solid #1c222b}
#inquiry-design .sec-h .ico{width:22px;height:22px;color:var(--accent);stroke-width:1.8}
#inquiry-design section+section{margin-top:36px}
#inquiry-design .ar-btn.ghost{background:#fff;color:#2b323c;border-color:#cfd6e0}
#inquiry-design .ar-btn.ghost:hover{background:#f5f7fa;border-color:#b9c4d6}
#inquiry-design .ar-btn{height:36px;padding:0 16px}

/* ---------- FAQ 아코디언 ---------- */
.faq-list{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.faq-item+.faq-item{border-top:1px solid #eef1f5}
.faq-q{display:flex;align-items:center;gap:12px;width:100%;border:0;background:#fff;text-align:left;padding:12px 14px;font-size:15px;font-weight:600;color:#1c222b;cursor:pointer;min-height:46px}
.faq-q:hover{background:#fafbfd}
.faq-item.open .faq-q{background:#f7f9fe}
.faq-mark{flex:none;width:24px;height:24px;border-radius:50%;background:var(--accent);color:#fff;font-size:15px;font-weight:700;display:grid;place-items:center;line-height:1}
.faq-mark.a{background:#747fb5}
.faq-text{flex:1;min-width:0;line-height:1.45}
.faq-arrow{width:18px;height:18px;color:#6a7380;transition:transform .18s;flex:none}
.faq-item.open .faq-arrow{transform:rotate(180deg);color:var(--accent)}
.faq-a{display:flex;align-items:flex-start;gap:12px;padding:12px 14px 14px;background:#fff;border-top:1px dashed #e3e7ee}
.faq-a p{margin:0;font-size:15px;line-height:1.7;color:#333;padding-top:2px}

/* ---------- 안내 ---------- */
.qa-notice{display:flex;align-items:flex-start;gap:10px;background:var(--accent-soft,#e9f0fe);border-radius:5px;padding:12px 14px;margin-bottom:16px;color:#2b323c}
.qa-notice .ico{width:18px;height:18px;color:var(--accent);flex:none;margin-top:2px}
.qa-notice p{margin:0;font-size:15px;line-height:1.6}

/* ---------- 목록 ---------- */
.board-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
/* 2026.10.14 수정의견: 검색 UI를 데이터 아카이브(.ar-search)와 통일. 아래 .search-controls는 이전 스타일(미사용) */
.board-search{margin-bottom:14px}.board-search select{width:118px}
.board-count{margin:0;font-size:15px;color:#333}
.board-count b{color:var(--accent)}
.board-count span{color:#6a7380}
.search-controls{display:flex;align-items:center;gap:6px}
.search-controls .sel{position:relative}
.search-controls select{appearance:none;-webkit-appearance:none;height:36px;border:1px solid #d3dae6;border-radius:3px;background:#fff;padding:0 30px 0 12px;font-size:15px;color:#1c222b;cursor:pointer}
.search-controls .sel .ico{position:absolute;right:9px;top:50%;transform:translateY(-50%);width:15px;height:15px;color:#5a626e;pointer-events:none}
.search-controls input{height:36px;width:240px;border:1px solid #d3dae6;border-radius:3px;padding:0 12px;font-size:15px;color:#1c222b;background:#fff}
.search-controls input:focus{outline:0;border-color:var(--accent)}
.board-table{table-layout:fixed}
.board-table .col-number{width:72px}.board-table .col-date{width:130px}.board-table .col-status{width:110px}
.board-table td{color:#333}
.board-table td.title-cell{text-align:left}
.board-table .post-title{border:0;background:none;padding:0;font:inherit;font-size:15px;font-weight:600;color:#1c222b;text-align:left;cursor:pointer;line-height:1.45}
.board-table .post-title:hover{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.board-table .status{display:inline-block;font-size:15px;font-weight:600;color:#6a7380;background:#f3f5f8;border:1px solid #e3e7ee;border-radius:3px;padding:1px 8px;line-height:1.5}
.board-table .status.done{color:var(--accent);background:#f3f7ff;border-color:#c9d8f7}
.board-table .empty{padding:40px 0;color:#6a7380}
.board-bottom{position:relative;margin-top:22px;display:flex;justify-content:center;align-items:center;min-height:36px}
.board-bottom .ar-pager{margin:0}
.board-bottom>.ar-btn{position:absolute;right:0;top:0}

/* ---------- 작성 ---------- */
.write-panel{border:1px solid var(--line);border-top:2px solid #c9d0db}
.write-row{display:grid;grid-template-columns:132px minmax(0,1fr) 132px minmax(0,1fr);align-items:center;border-top:1px solid #e3e7ee}
.write-row:first-child{border-top:0}
.write-row.single{grid-template-columns:132px minmax(0,1fr)}
.write-row.top{align-items:stretch}
.write-row label{display:flex;align-items:center;justify-content:center;gap:3px;align-self:stretch;background:#f3f5f8;font-size:15px;font-weight:600;color:#333;padding:0 10px;min-height:46px;border-right:1px solid #e3e7ee;text-align:center}
.write-row label em{color:#d0433a;font-style:normal}
.write-row>div{padding:6px 10px;min-width:0}
.write-row>div+label{border-left:1px solid #e3e7ee}
.write-row input,.write-row textarea{width:100%;height:34px;border:1px solid #d3dae6;border-radius:3px;padding:0 10px;font-size:15px;color:#1c222b;background:#fff;font-family:inherit}
.write-row textarea{height:auto;min-height:180px;padding:8px 10px;resize:vertical;line-height:1.6}
.write-row input:focus,.write-row textarea:focus{outline:0;border-color:var(--accent)}
.write-row [aria-invalid=true]{border-color:#d0433a}
.captcha-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.captcha-img{display:inline-block;width:132px;height:34px;border:1px solid #b9c4d6;border-radius:3px;background:#f3f6fb;vertical-align:middle}
.text-button{border:1px solid #cfd6e0;background:#fff;border-radius:3px;height:28px;padding:0 10px;font-size:15px;color:#2b323c;cursor:pointer}
.text-button:hover{border-color:var(--accent);color:var(--accent)}
.captcha-controls input{width:160px}
.preview-note{margin:10px 0 0;font-size:15px;color:#6a7380}
.form-message{margin:10px 0 0;font-size:15px;color:#d0433a;background:#fff4f2;border:1px solid #f3d3cf;border-radius:3px;padding:8px 12px}
.write-actions,.detail-actions{display:flex;justify-content:center;gap:6px;margin-top:22px}

/* ---------- 상세 ---------- */
.detail-panel{border:1px solid var(--line);border-top:2px solid #c9d0db}
.detail-head{padding:14px 18px;background:#f7f9fc;border-bottom:1px solid #e3e7ee;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.detail-head h3{margin:0;font-size:16px;font-weight:700;color:#1c222b;letter-spacing:-.3px}
.detail-meta{display:flex;gap:4px 18px;margin:0;font-size:15px;color:#525b68;flex-wrap:wrap}
.detail-meta dt{display:inline-flex;align-items:center;gap:4px;font-weight:600;color:#333}
.detail-meta dt .ico{width:15px;height:15px}
.detail-meta dd{margin:0 0 0 6px;display:inline}
.question-body,.answer-body{display:flex;gap:14px;padding:18px}
.answer-body{border-top:1px dashed #e3e7ee;background:#fafbfd}
.qa-label{flex:none;width:28px;height:28px;border-radius:50%;background:var(--accent);color:#fff;font-size:15px;font-weight:700;display:grid;place-items:center}
.qa-label.answer{background:#747fb5}
.question-body>div,.answer-body>div{flex:1;min-width:0}
.question-body p,.answer-body p{margin:0 0 8px;font-size:15px;line-height:1.7;color:#333}
.question-body p:last-child,.answer-body p:last-child{margin-bottom:0}
.answer-meta{display:flex;gap:10px;align-items:center;margin-bottom:8px;font-size:15px}
.answer-meta strong{color:#1c222b}.answer-meta span{color:#6a7380}
.neighbor-posts{margin-top:16px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.neighbor-posts>div{display:grid;grid-template-columns:120px minmax(0,1fr);align-items:center;min-height:42px;font-size:15px}
.neighbor-posts>div+div{border-top:1px solid #eef1f5}
.neighbor-posts strong{display:inline-flex;align-items:center;gap:6px;color:#333;font-weight:600;padding:0 14px;background:#f3f5f8;align-self:stretch;height:100%}
.neighbor-posts strong .ico{width:15px;height:15px}
.neighbor-posts>div>div{padding:0 14px;color:#6a7380}
.neighbor-posts .post-title{border:0;background:none;padding:0;font:inherit;font-size:15px;color:#1c222b;cursor:pointer;text-align:left}
.neighbor-posts .post-title:hover{color:var(--accent);text-decoration:underline;text-underline-offset:3px}

@media(max-width:860px){.write-row{grid-template-columns:110px minmax(0,1fr)}.write-row>div+label{border-left:0;border-top:1px solid #e3e7ee}.write-row>div+label+div{border-top:1px solid #e3e7ee}.board-bottom{flex-direction:column;gap:12px}.board-bottom>.ar-btn{position:static}.search-controls{flex-wrap:wrap}.search-controls input{width:100%}.board-search .sel{width:calc(50% - 4px)}.board-search select{width:100%}}
