/* ===== inquiry 스킨 전용 스타일 (게시판 공통은 asset/css/board.css) =====
   수정 요령: 목록 = .inq-table / 보기 = .inq-view .inq-info .inq-body / 답변 = .inq-answer* / 글쓰기 = .inq-write (공통 .bo-section .bo-grid) */

/* ===== 목록: 표 ===== */
.inq-table {width: 100%;border-collapse: collapse;border-top: .2rem solid var(--color-ink);background: rgba(255, 255, 255, .86);}
.inq-table caption {position: absolute;width: .1rem;height: .1rem;overflow: hidden;clip: rect(0, 0, 0, 0);}
.inq-table th {padding: 2rem 1.6rem;border-bottom: .1rem solid var(--color-line);font-size: 1.6rem;font-weight: 800;color: var(--color-muted);text-align: center;}
.inq-table td {padding: 2.8rem 1.6rem;border-bottom: .1rem solid var(--color-line);font-size: 1.8rem;text-align: center;}
.inq-table tbody tr {transition: background .3s;}
.inq-table tbody tr:hover {background: var(--color-soft);}
.inq-table .col-check {width: 6rem;}
.inq-table .col-num {width: 9rem;color: var(--color-muted);}
.inq-table .col-type {width: 16rem;}
.inq-table .col-title {text-align: left;}
.inq-table .col-name {width: 14rem;}
.inq-table .col-date {width: 14rem;color: var(--color-muted);}
.inq-table .col-status {width: 14rem;}
.inq-link {display: inline-flex;align-items: center;gap: 1rem;font-size: 2.1rem;font-weight: 700;line-height: 1.4;}
.inq-link:hover {color: var(--color-primary);text-decoration: underline;}
.inq-lock {flex: none;width: 2rem;height: 2rem;background: var(--color-muted);-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center / contain no-repeat;mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center / contain no-repeat;}
.inq-new {display: inline-block;width: 2.2rem;height: 2.2rem;border-radius: 50%;background: var(--color-primary);color: #fff;font-size: 1.2rem;font-style: normal;font-weight: 800;line-height: 2.2rem;text-align: center;}
.inq-empty {padding: 10rem 2rem !important;font-size: 2rem !important;color: var(--color-muted);}

/* ===== 보기 ===== */
.inq-view {width: 100%;}
.inq-head {padding-bottom: 4rem;border-bottom: .2rem solid var(--color-ink);}
.inq-badges {display: flex;flex-wrap: wrap;gap: 1rem;margin-bottom: 2rem;}
.inq-title {font-size: 4.6rem;font-weight: 700;line-height: 1.35;letter-spacing: -.12rem;}
.inq-meta {display: flex;flex-wrap: wrap;gap: 1rem 3.6rem;margin-top: 3rem;font-size: 1.8rem;}
.inq-meta span {margin-right: 1rem;font-weight: 800;color: var(--color-muted);}
.inq-info {display: grid;grid-template-columns: repeat(auto-fit, minmax(24rem, 1fr));gap: 2.4rem;margin-top: 4rem;padding: 3.4rem 4rem;border-radius: var(--radius);background: var(--color-white);border: .1rem solid var(--color-line);}
.inq-info dt {font-size: 1.4rem;font-weight: 800;letter-spacing: .1rem;color: var(--color-muted);}
.inq-info dd {margin-top: .8rem;font-size: 2rem;font-weight: 600;word-break: break-all;}
.inq-info a {text-decoration: underline;color: var(--color-primary);}
.inq-body {min-height: 24rem;padding: 5rem .4rem;font-size: 2rem;line-height: 1.9;}
.inq-body img {max-width: 100%;height: auto;border-radius: 1.6rem;}
.inq-body p {margin-bottom: 1.8rem;}
.inq-image {margin-bottom: 3rem;}

/* ===== 답변 ===== */
.inq-answers {margin-top: 3rem;padding-top: 5rem;border-top: .1rem solid var(--color-line);}
.inq-answers-title {margin-bottom: 3rem;font-size: 3rem;font-weight: 800;}
.inq-answers-title strong {color: var(--color-primary);}
.inq-answer-list {display: grid;gap: 2rem;}
.inq-answer {padding: 3.2rem 3.6rem;border: .1rem solid var(--color-line);border-radius: var(--radius);background: var(--color-white);}
.inq-answer.is-admin {border: .2rem solid var(--color-primary);background: var(--color-soft);}
.inq-answer[data-depth="1"] {margin-left: 3rem;}
.inq-answer[data-depth="2"] {margin-left: 6rem;}
.inq-answer[data-depth="3"] {margin-left: 9rem;}
.inq-answer[data-depth="4"] {margin-left: 12rem;}
.inq-answer-head {display: flex;flex-wrap: wrap;align-items: center;gap: 1rem 1.6rem;margin-bottom: 1.8rem;}
.inq-answer-name {font-size: 2rem;font-weight: 800;}
.inq-answer-date {font-size: 1.5rem;color: var(--color-muted);}
.inq-answer-body {font-size: 1.9rem;line-height: 1.8;}
.inq-answer-btns {display: flex;gap: 1.6rem;margin-top: 2rem;font-size: 1.5rem;font-weight: 700;}
.inq-answer-btns a {color: var(--color-muted);text-decoration: underline;}
.inq-answer-btns a:hover {color: var(--color-primary);}
.inq-answer-empty {padding: 5rem 2rem;border: .2rem dashed var(--color-line);border-radius: var(--radius);text-align: center;font-size: 1.9rem;color: var(--color-muted);}
.inq-answer-form {margin-top: 3rem;padding: 3.4rem;border-radius: var(--radius);background: var(--color-bg);border: .1rem solid var(--color-line);}
.inq-answer-form fieldset {display: grid;gap: 2.4rem;}
.inq-answer-form legend {position: absolute;width: .1rem;height: .1rem;overflow: hidden;clip: rect(0, 0, 0, 0);}
.inq-answer-form .bo-textarea {min-height: 16rem;}
.inq-answer-foot {display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;gap: 1.6rem;}

/* ===== 반응형 ===== */
@media (max-width: 1024px) {
  .inq-title {font-size: 3.8rem;}
  .inq-table .col-type, .inq-table .col-name {display: none;}
}
@media (max-width: 768px) {
  .inq-table, .inq-table tbody, .inq-table tr, .inq-table td {display: block;width: 100%;}
  .inq-table thead {position: absolute;width: .1rem;height: .1rem;overflow: hidden;clip: rect(0, 0, 0, 0);}
  .inq-table tr {position: relative;padding: 2.4rem .4rem;border-bottom: .1rem solid var(--color-line);}
  .inq-table td {padding: .6rem 0;border: 0;text-align: left;}
  .inq-table td::before {content: attr(data-label);display: inline-block;width: 7rem;font-size: 1.4rem;font-weight: 800;color: var(--color-muted);}
  .inq-table .col-title::before {display: none;}
  .inq-table .col-check {width: auto;}
  .inq-table .col-type, .inq-table .col-name {display: block;}
  .inq-table .col-num, .inq-table .col-type, .inq-table .col-name, .inq-table .col-date, .inq-table .col-status {width: 100%;}
  .inq-link {font-size: 2rem;}
  .inq-title {font-size: 3rem;}
  .inq-info {padding: 2.4rem 2rem;}
  .inq-body {padding: 3.4rem 0;font-size: 1.8rem;}
  .inq-answer {padding: 2.4rem 2rem;}
  .inq-answer[data-depth] {margin-left: 1.6rem;}
  .inq-answer-form {padding: 2.4rem 2rem;}
}

/* ===== 글쓰기: 폼(왼쪽) + 안내 사이드(오른쪽, 스크롤 따라옴) ===== */
.inq-layout {display: grid;grid-template-columns: minmax(0, 1fr) 38rem;gap: 4rem;align-items: start;}
.inq-aside {position: sticky;top: calc(var(--header-h) + 3rem);display: grid;gap: 2.4rem;}
.inq-card {padding: 3.4rem;border: .1rem solid var(--color-line);border-radius: var(--radius);background: rgba(255, 255, 255, .86);}
.inq-card-title {display: flex;align-items: center;gap: 1.4rem;margin-bottom: 2.4rem;font-size: 2.2rem;font-weight: 800;}
.inq-check li {display: flex;align-items: center;gap: 1.2rem;font-size: 1.8rem;line-height: 1.5;}
.inq-check li + li {margin-top: 1.4rem;}
.inq-check .bo-ico {width: 2.2rem;height: 2.2rem;color: var(--color-primary);}
.inq-steps {display: grid;gap: 2.2rem;}
.inq-steps li {position: relative;display: flex;align-items: flex-start;gap: 1.6rem;}
.inq-steps li:not(:last-child)::after {content: "";position: absolute;left: 2.1rem;top: 4.8rem;bottom: -2.2rem;width: .2rem;background: var(--color-line);}
.inq-step-ico {display: inline-flex;flex: none;align-items: center;justify-content: center;width: 4.2rem;height: 4.2rem;border-radius: 50%;background: var(--color-ink);color: #fff;}
.inq-step-ico .bo-ico {width: 2rem;height: 2rem;}
.inq-steps strong {display: block;font-size: 1.8rem;font-weight: 800;}
.inq-steps p {margin-top: .4rem;font-size: 1.5rem;line-height: 1.6;color: var(--color-muted);}
.inq-card.is-call {border-color: var(--color-primary);background: var(--color-primary);color: #fff;}
.inq-card.is-call .bo-title-ico {background: rgba(255, 255, 255, .18);color: #fff;}
.inq-tel {display: block;font-size: 3.4rem;font-weight: 800;letter-spacing: -.1rem;color: var(--color-accent);}
.inq-tel:hover {text-decoration: underline;}
.bo-check .bo-ico {width: 2.2rem;height: 2.2rem;color: var(--color-primary);}
@media (max-width: 1280px) {
  .inq-layout {grid-template-columns: minmax(0, 1fr) 32rem;gap: 3rem;}
  .inq-tel {font-size: 2.8rem;}
}
@media (max-width: 1100px) {
  .inq-layout {grid-template-columns: 1fr;}
  .inq-aside {position: static;grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));}
}
@media (max-width: 768px) {
  .inq-card {padding: 2.6rem 2rem;}
  .bo-notice.has-ico {align-items: flex-start;gap: 1.4rem;}
  .bo-input-wrap > .bo-ico {left: 1.8rem;}
  .bo-input-wrap .bo-input, .bo-input-wrap .bo-select {padding-left: 5.6rem;}
  .bo-section.has-wm::after {width: 9rem;height: 9rem;right: 1.6rem;top: 1.6rem;}
}
/* Unified form / answer accents. */
.inq-write .bo-section.is-contact {border-top:.3rem solid var(--color-primary);}
.inq-write .bo-section-title {letter-spacing:-.04rem;}
.inq-write .inq-card:first-child {background:linear-gradient(135deg,#fff,#f1f6ff);}
.inq-answer {position:relative;box-shadow:0 .6rem 2.4rem rgba(28,62,116,.035);}
.inq-answer.is-admin {border:.1rem solid #ccdcff;border-left:.4rem solid var(--color-primary);background:linear-gradient(120deg,#f1f6ff,#fff 75%);}
.inq-answer.is-admin .inq-answer-name {color:var(--color-primary);}
.inq-answer-head {padding-bottom:1.6rem;border-bottom:.1rem solid rgba(130,151,188,.18);}
.inq-answer-date {margin-left:auto;}
.inq-answer-body {overflow-wrap:anywhere;word-break:normal;}
.inq-answer-body img {max-width:100%;height:auto;}
.inq-answer-btns {justify-content:flex-end;gap:.8rem;}
.inq-answer-btns a {display:inline-flex;align-items:center;min-height:4rem;padding:.5rem 1.4rem;border:.1rem solid var(--color-line);border-radius:1rem;background:#fff;text-decoration:none;font-size:1.4rem;}
.inq-answer-btns a:hover {background:var(--color-soft);border-color:var(--color-primary);}
.inq-answer-form {background:#fff;box-shadow:0 .6rem 2.4rem rgba(28,62,116,.035);}
.inq-answer-form fieldset {border:0;margin:0;padding:0;min-width:0;}
.inq-reply-title {font-size:2.2rem;font-weight:800;line-height:1.4;}
.inq-answer-form .bo-help {font-size:1.5rem;}
.inq-answer-form textarea {min-height:18rem;}
.inq-answer .inq-answer-form {padding:2.4rem;margin-top:2.4rem;box-shadow:none;}
.inq-answer-empty {border:.1rem solid var(--color-line);background:rgba(255,255,255,.8);}
.inq-answer-foot .bo-btns-group {margin-left:auto;}
.inq-answer-form .btn {min-height:4.8rem;font-size:1.6rem;}
.inq-body {overflow-wrap:anywhere;}
@media(max-width:768px) {
 .inq-answer-date {width:100%;margin-left:0;font-size:1.3rem;}
 .inq-answer[data-depth="0"] {margin-left:0;}
 .inq-answer[data-depth]:not([data-depth="0"]) {margin-left:1.2rem;}
 .inq-answer .inq-answer-form {padding:1.6rem;}
 .inq-answer-foot {align-items:flex-start;}.inq-answer-foot .bo-btns-group {width:100%;justify-content:flex-end;}
 .inq-answer-form textarea {font-size:1.8rem;padding:1.5rem;}
}

/* ===== 문의 상세 정리: 정보 / 본문 / 외부 링크 ===== */
.inq-write .bo-options[hidden] {display: none !important;}
.inq-view .inq-head {padding: 0 0 2.8rem;border-bottom: .1rem solid var(--color-line);}
.inq-view .inq-title {font-size: clamp(2.8rem, 2.8vw, 4.2rem);line-height: 1.4;overflow-wrap: anywhere;}
.inq-view .inq-meta {gap: 1rem 2.8rem;margin-top: 2.2rem;font-size: 1.6rem;color: var(--color-muted);}
.inq-view .inq-meta span {font-weight: 600;}
.inq-view .inq-info {grid-template-columns: repeat(4, minmax(0, 1fr));gap: 2.8rem 3.2rem;margin: 3.2rem 0 0;padding: 3.2rem;border-radius: 1.8rem;border: .1rem solid var(--color-line);background: var(--color-white);}
.inq-view .inq-info > div {min-width: 0;}
.inq-view .inq-info dt {font-size: 1.35rem;font-weight: 600;letter-spacing: 0;color: var(--color-muted);}
.inq-view .inq-info dd {margin: 1rem 0 0;font-size: 1.8rem;font-weight: 600;line-height: 1.65;word-break: keep-all;overflow-wrap: anywhere;}
.inq-view .inq-info .inq-reference {grid-column: 1 / -1;display: flex;align-items: center;gap: 2rem;padding-top: 2.2rem;border-top: .1rem solid var(--color-line);}
.inq-view .inq-reference dd {margin: 0;}
.inq-view .inq-reference-link {display: inline-flex;align-items: center;justify-content: center;width: 4.4rem;height: 4.4rem;border: .1rem solid var(--color-line);border-radius: 1.2rem;background: var(--color-soft);color: var(--color-primary);text-decoration: none;transition: background .2s, color .2s, border-color .2s;}
.inq-view .inq-reference-link svg {width: 2.1rem;height: 2.1rem;flex: none;}
.inq-view .inq-reference-link:hover {background: var(--color-primary);border-color: var(--color-primary);color: #fff;}
.inq-view .inq-reference-link:focus-visible {outline: .2rem solid var(--color-primary);outline-offset: .4rem;}
.inq-view .inq-body {min-height: 18rem;margin-top: 2.4rem;padding: 3.2rem;border: .1rem solid var(--color-line);border-radius: 1.8rem;background: var(--color-white);font-size: 1.8rem;line-height: 1.9;}
.inq-view .inq-body-title {margin: 0 0 2.2rem;font-size: 1.5rem;font-weight: 700;color: var(--color-muted);}
.inq-view .inq-content {min-width: 0;overflow-wrap: anywhere;}
.inq-view .inq-content > :last-child {margin-bottom: 0;}
.inq-view .inq-content pre {max-width: 100%;overflow-x: auto;}
.inq-view .inq-answers {margin-top: 3.2rem;padding-top: 3.2rem;}
@media (max-width: 1024px) {
  .inq-view .inq-info {grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media (max-width: 560px) {
  .inq-view .inq-head {padding-bottom: 2.2rem;}
  .inq-view .inq-meta {gap: .8rem 1.8rem;font-size: 1.4rem;}
  .inq-view .inq-info {grid-template-columns: minmax(0, 1fr);gap: 2rem;margin-top: 2.4rem;padding: 2.4rem 2rem;}
  .inq-view .inq-info > div {display: grid;grid-template-columns: 8.4rem minmax(0, 1fr);align-items: start;gap: 1.4rem;}
  .inq-view .inq-info dt {padding-top: .3rem;font-size: 1.3rem;}
  .inq-view .inq-info dd {margin: 0;font-size: 1.6rem;}
  .inq-view .inq-info .inq-reference {display: grid;align-items: center;gap: 1.4rem;padding-top: 1.8rem;}
  .inq-view .inq-body {padding: 2.4rem 2rem;font-size: 1.6rem;}
}
@media (prefers-reduced-motion: reduce) {
  .inq-view .inq-reference-link {transition: none;}
}